Vill du skapa en interaktiv bild för din Wordpress blogg

Med en interaktiv bild kan du markera, länka och animera vissa delar av bilden. 

I den här tutorialen visar vi dig hur du skapar interaktiva bilder på WordPress.

Men tidigare, om du aldrig har installerat WordPress-upptäckt Hur man installerar en Wordpress blogg i fyra steg et Hur man hittar, installera och aktivera en Wordpress tema på din blogg 

Tillbaka till varför vi är här.

Hur man skapar interaktiva bilder på wordpress e1567777631422

Vad är en interaktiv bild?

En interaktiv bild innehåller områden med åtkomstpunkter, höjdpunkter, länkar, färger etc.

Gör din blogg smidigare och effektivare genom att prova dessa 6 WordPress bildkomprimeringspluggar för din blogg

Det skiljer sig från en enkel bild som du laddar upp till WordPress. De interaktiva bilderna är iögonfallande och fångar användarnas uppmärksamhet. Du kan lägga till beskrivning till olika delar av en bild, lägga till länkar till sidor, markera avsnitt med mera.

demodynamisk interaktiv bild på WordPress.jpg

I den här bilden kan du se beskrivningen av frukterna bredvid musen ovanför de olika staplarna. Du kan använda dessa interaktiva bilder för att öka användarnas engagemang och webbplatsens tid.

Upptäck Så här använder du FOMO på WordPress för bättre omvandlingar

Låt oss ta en titt på hur du kan fånga dina besökares uppmärksamhet med interaktiva bilder.

Så här skapar du interaktiva bilder på WordPress

Det första du ska göra är att installera och aktivera plugin Rita uppmärksamhet. Mer information finns i vår steg-för-steg-guide till sätt att installera ett WordPress-plugin.

Efter aktivering ser du en ny anpassad inläggstyp på din WordPress-instrumentpanel. Du måste gå till Rita uppmärksamhet »Lägg till nytt för att skapa en interaktiv bild.

uppmärksamma WordPress.png

Börja med att lägga till en titel för den här nya interaktiva bilden så att du enkelt kommer ihåg den. På den här sidan kan du skapa en interaktiv design på nya eller redan uppladdade bilder. Du kan lägga till en ny bild genom att klicka på ikonen för uppladdningsbild eller så kan du välja en bild från ditt WordPress-mediebibliotek.

Gå längre genom att upptäcka dessa 9 premium WordPress-plugins för att optimera ditt mediebibliotek

släpp en bild för att starta.png

Sedan måste du klicka på knappen offentliggöra .

Efter inlägget tillåter pluginet dig att redigera bilden och markera specifika områden, lägga till färger, länkar, rita hotspotområden och mer. Du kan bläddra till avsnittet Hotspotzoner och expandera det klickbara området för att förhandsgranska bilden.

Rör bara med musen och rita klickbara områden på bilden. Du kan enkelt välja åtkomstpunktsområden och utöka dem för att skapa ett urval.

för att skapa zoner på WordPress.gif

När du har ritat hotspotområdet måste du rulla ner i rullgardinsmenyn Handling och välj en åtgärd för det valda området på bilden. Om du väljer Visa mer infokan du bara lägga till en beskrivning för att förklara åtkomstpunktsområdet på bilden. Du kan också lägga till en länk i det valda området med alternativet " Gå till webbadress".

Lär Hur säkerhetskopiera och återställa din blogg med Snapshot Pro

spara bild hotspot.jpeg

Du kan också hantera allmänna inställningar och markera stil för åtgärdslänk, åtgärdstext, bakgrund och mer. Dessa inställningar kan hjälpa dig att göra din bild mer interaktiv.

allmänna inställningar

Sedan måste du klicka på knappen uppdatering och kopiera kortkod för att lägga till det i ditt WordPress-inlägg eller -sida.

kopiera shortcode.jpg

Med plugin-programmet kan du skapa så många interaktiva bilder som du vill med dina tidigare uppladdade eller nya bilder.

klicka på en interaktiv bild.jpeg

Importera och exportera interaktiva bilder

Om du arbetar på flera webbplatser och vill importera / exportera interaktiva bilder, måste plugin-programmet Draw Caution vara installerat på båda webbplatserna.

På den första webbplatsen måste du besöka Uppmärksamhet »Importera / exportera och kontrollera de bilder du vill exportera. Klicka sedan på knappen Skapa exportkoden och kopiera koden.

exportera en hotspot.png-kod

Därefter måste du gå till den andra webbplatsen och se till att du har aktiverat plugin-programmet Draw Caution. Då måste du gå till Uppmärksamhet »Importera / exportera på instrumentpanelen och klistra in koden i importfältet.

att importera en kod hotspot.jpg

Fortsätt och klicka på knappen import och dina bilder kommer att importeras.

Upptäck också några premium WordPress-plugins  

Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.

Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.

1. Opt-In Content Locker

Opt-In Content Locker är en Wordpress plugin, vilket gör att du kan låsa viktigt innehåll på din blogg och bara visa det för prenumeranter. 

Välj innehållsskåp wordpress plugins låser webbplatsinnehåll

Allt du behöver göra är att rama in det låsta innehållet med [optinlocker] ... [/ optinlocker] kortkoder. Om folk vill se detta innehåll måste de skicka sitt namn / e-postmeddelande. Efter inlämning blir allt låst innehåll synligt.

Dess huvudsakliga funktioner är: ett verktyg msäkert och säkert, vblockerar viktigt innehåll,upport av MailChimp, AWeber, GetResponse, iContact, Kampanjövervakning, Mad Mimi, Benchmark, Sendy och MyMail, stöd för kortkoder, export av data i CSV-format, möjligheten att översättas till flera språk, flätt att installera, en eutmärkt kundsupport, et andra.

Ladda ner | demo | webbhotell   

2. Klicka på WhatsApp Chat

Le Wordpress plugin Click to WhatsApp Chat gör det enkelt för WordPress-kunder att få kontakt med webbplatsägaren eller kundsupport med hjälp av deras WhatsApp-konto.  

Klicka för att whatsapp chatt för wordpress

Klicka bara på WhatsApp-kontot så kommer det att dirigeras direkt till det mobila WhatsApp-kontot med ett standardmeddelande. Och om klienten är på stationär eller bärbar dator kommer han att omdirigeras till WhatsApp Web.

Detta plugin kräver WhatsApp-nummer och tid och dag, som webbplatsägaren eller supportteamet kommer att använda för att diskutera. Chattknappen kan läggas till på WooCommerce-produktdetaljsidan, som är direkt relaterad till den produkten.

Ladda ner | demo | webbhotell

3. Var detta användbart

Var detta till hjälp är en Wordpress plugin används för att marknadsföra dina läsares kommentarer. Det bör noteras att om en positiv kommentar motiverar dig att göra bättre, hjälper en negativ kommentar dig å andra sidan att hitta luckor och förbättra din blogg; gör det mer användbart för andra besökare.

Var detta hjälpsamma wordpress-plugin

Det här pluginet är unikt eftersom det ber besökarna att svara på frågan varför de inte hittar ett inlägg användbart när de klickar på alternativet "NEJ". På samma sätt frågar det besökarna vad de gillar mest när de klickar på alternativet "JA".

Dessutom kan du gå till sidan / artikellistan där du kommer att se ett Ja / Nej-avsnitt, vilket gör att du snabbt kan se statistiken och slutligen få en fullständig översikt över kvaliteten på dina artiklar och dina sidor.

Ladda ner | demo | webbhotell

Rekommenderade resurser

Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.

Slutsats

Här! Det är det för den här självstudien, jag hoppas att du kan skapa interaktiva bilder. Tveka inte att dela med dina vänner på dina favorit sociala nätverk

Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.

Och om du har några förslag eller kommentarer, lämna dem i vårt avsnitt commentaires.