Har du någonsin undrat om du kunde tillåta användare att välja en bild på ditt WordPress-formulär istället för bara text? Med WPForms kan du enkelt lägga till en bild bredvid alternativknappar på WordPress-formulär, så att användare snabbt kan välja rätt alternativ de vill ha.
I den här artikeln visar vi dig hur du lägger till en bild bredvid alternativknappar på WordPress-formulär.
Om du föredrar skriftliga instruktioner, fortsätt att läsa nedan.
Steg 1: Skapa ett enkelt WordPress-formulär
Det första du behöver göra är att installera och aktivera WPForms plugin. För mer information, kolla in den här steg-för-steg-guiden om hur du installerar ett plugin i WordPress.
Därefter måste du skapa ett formulär. För hjälp med detta steg, kolla in vår handledning om hur du skapar ett enkelt kontaktformulär som ett exempel för att komma igång.
Steg 2 – Anpassa ditt WordPress-formulär
Det enkla kontaktformuläret kommer med följande standardformulärfält:
- namn
- E-post
- Kommentera eller meddelande
Du kan lägga till ytterligare fält i formuläret genom att dra dem från den vänstra panelen till den högra panelen.
Klicka sedan på fältet för att göra ändringar. Du kan också klicka och dra ett formulärfält för att ändra ordningen på ditt kontaktformulär.
Du kan lägga till bilder bredvid Flera val och Olika föremål formulärfält, som är radioknappar, samt Kryssrutor formulärfält.
Skillnaden mellan en alternativknapp och en kryssruta är att alternativknappar endast tillåter webbplatsbesökare att välja ett alternativ, medan webbplatsbesökare kan välja mer än ett alternativ från en lista med kryssrutor.
I vårt exempel kommer vi att lägga till a Flera val formulärfältet till vårt enkla kontaktformulär och ändra etiketten och alternativen.
Nu är det dags att lägga till bilderna bredvid varje alternativknapp.
Steg 3: Lägg till en bild till radioknappar
För att lägga till en bild till alternativknapparna på ditt formulär, börja med att klicka på Använd bildalternativ kryssrutan i formulärredigeraren.
När du klickar på den rutan ser du en Ladda upp bild En knapp visas för varje alternativknapp i ditt formulär.
Det kommer också att finnas en Positionsmarkör i förhandsgranskningspanelen där varje bild kommer att visas när den har laddats upp.
För att lägga till en bild, klicka på Ladda upp bild knapp. Detta öppnar ditt WordPress-mediebibliotek så att du kan välja vilken bild du vill visa.
Notera: Bilder kommer inte att beskäras eller storleksändras när du lägger till dem i ditt formulär. För bästa resultat rekommenderar vi att alla bildalternativ har samma storlek och 250 × 250 pixlar eller mindre.
Så här kommer våra bildalternativ att se ut:
Steg 4 – Anpassa dina bildalternativ
WPForms gör det mycket enkelt att anpassa dina bildalternativ tack vare inbyggda anpassningsalternativ.
Klicka på för att se dessa alternativ Avancerade alternativ.
Två anpassningsalternativ läggs till i avsnittet Avancerade alternativ när du aktiverar bildalternativ på dina WordPress-formulär:
- Bildvalsstil: välj mellan Modern, Classic eller None. Modern visar de valda bilderna i en skuggad ruta och lägger till en grön bock i mitten. Classic visar valda bilder med en tjock grå ram. Alternativet Ingen kommer inte att lägga till någon speciell stil; Istället ser du traditionella alternativknappar bredvid varje bild så att webbplatsbesökare kan välja.
- Valfri design: Välj hur många kolumner som används för att visa dina bildalternativ. Du kan välja mellan en, två eller tre kolumner. Du har också möjlighet att välja Inline, vilket placerar så många alternativ som möjligt på varje rad innan du lägger till ytterligare ett. Inline är standardlayouten för alla WordPress-formulär som visar bildalternativ.
Du kan också välja Slumpmässiga val kryssrutan om du vill slumpvisa ordningen på bildalternativ varje gång en ny användare besöker din webbplats.
Steg 5: Aktivera undersökningsrapporter
Om du vill se hur många som väljer varje bildalternativ du erbjuder kan du aktivera undersökningsrapportering för dina formulär genom att installera och aktivera plugin-programmet Surveys & Polls.
För att göra detta, gå till WPForms » Lägg till och hitta märkningen Enkäter och undersökningar kompletterar.
Klick Installera plugin och då Aktivera.
WPForms låter dig samla in enkätresultat för följande formulärfält:
För att möjliggöra undersökningsrapportering för alla formulär på din webbplatsska inställningar » Undersökningar och undersökningar och välj Aktivera undersökningsrapporter låda.
Om du bara vill samla in data på just detta formulär, gå till formulärredigeraren, scrolla ner till Avancerade inställningar avsnitt och klicka Aktivera undersökningsrapporter.
När folk börjar fylla i ditt formulär, med bilder bredvid alternativknapparna, kan du generera enkätrapporter i WordPress-instrumentpanelen för att se resultaten.
För att generera en undersökningsrapport, gå till WPForms » alla former och håll muspekaren över formuläret för att visa alternativen. Klicka sedan Resultat av testet.
När du klickar på det kommer du att se resultatet av ditt formulär:
Sammanfattningsvis
Och där har du det! Nu vet du hur du lägger till en bild bredvid radioknappar på WordPress-formulär.
Om du är intresserad av att tjäna pengar online kan du kolla in vår handledning om hur du skapar ett enkelt beställningsformulär i WordPress och lägger till bilder bredvid varje vara du har till salu.
Så vad väntar du på? Kom igång idag med det mest kraftfulla WordPress-formulärpluginet.
Och glöm inte att om du gillar den här artikeln, följ oss på Facebook och Twitter.
