Hur man skapar och visar popup med posttagg i WordPress

Vill du skapa och visa en popup per inläggstagg i WordPress? Så fortsätt att läsa den här artikeln.

Vi är säkra på att du redan är bekant med det lilla fönstret som visas när du surfar på en webbplats. Tja, det kallas en popup eller popup. Popup-fönster kan visas i olika storlekar och på skärmen på en webbplats.

I WordPress finns det många plugins för att skapa popup-fönster, som Elementor Pro, JetPopup, Brizy Pro och mer.

L’élément important à retenir est que les fenêtres contextuelles ne doivent pas être ennuyeuses pour les visiteurs de votre site web. Par conséquent, créez un popup aussi simple et attrayante que possible.

Innehållsförteckning

Vissa WordPress-plugins för att skapa popup-fönster

Elementor Pro

Elementor Pro est une extension d’Elementor avec des centaines de fonctionnalités premium. Il vous offre de puissants outils professionnels qui accélèrent votre flux de travail et votre conception. Elementor Pro ger dig full kontroll över layouten och designen av din webbplats. I det här fallet kan du fritt anpassa designen på din popup.

utiliser Elementor Pro att skapa en popup med post-tagg är mycket enkelt och lätt att använda. Du kan enkelt definiera visningsvillkoren för din popup på ett mycket exakt sätt.

Crocoblocks JetPopup är en förlängning för Elementor. Du kan köpa det som ett fristående plugin eller köpa det i ett paket med andra Crocoblock-plugins. Fördelen med att använda JetPopup för att skapa ett popup-fönster är att det kommer med många coola funktioner.

Du kan leka med popup-fönstrets triggers.
Du kan skapa animationer för popup-fönstret.
Ett stort antal popup-mallar finns tillgängliga.

Läs också: 22 bästa premiumtillägg för Elementor

Brizy Pro

Popup-byggaren av Brizy Pro erbjuder dig två alternativ. Den första är den klickaktiverade popupen, och den andra är de automatiska triggerna och villkoren.

Öppnas vid klick: Din popup kan utlösas helt enkelt genom att klicka på elementen på din sida.
Automatiska utlösare och villkor: Du kan konfigurera besökarnas åtgärder som avgör när popup-fönster visas.

Som nämnts tidigare har du flera alternativ för att skapa en popup i WordPress. I den här handledningen kommer vi att visa dig hur du skapar och visar en popup per inläggstagg med hjälp av versionen Elementor Pro, assurez-vous donc d’en avoir déjà une.

Det första du ska göra är att skapa en ny popup-mall. För att skapa en ny popup-mall, gå till Mallar > Popup-fönster på din WordPress-instrumentpanel och klicka på knappen Lägg till ny.

Lägg sedan till namnet på din popup och klicka på knappen SKAPA EN MODELL.

Du kommer att hänvisas till mallbiblioteket, du kan välja en mall från biblioteksfönstret eller designa din egen Popup-mall. För att använda en mall från biblioteket, klicka bara på knappen infoga.

Men i den här handledningen kommer vi att skapa Popup-mallen från grunden. Klicka på ikonen X för att stänga mallbiblioteket.

Vi måste göra några justeringar i Popup-inställningarna innan vi börjar skapa en Popup-mall. Du kan hitta de bästa inställningarna för din webbplats. I den här handledningen kommer vi att visa dig de popup-inställningar du väljer.

Klicka på kugghjulsikonen i det nedre vänstra hörnet. I popup-inställningarna ändrar du Bredd i 90 % av vyns bredd (VW) ET Placera en Mitt-botten.

Designa sedan din popup-mall. Lägg till ett nytt avsnitt och välj strukturen med 5 kolumner. I avsnittet inställningar, ställ in Bredd på 950. Du kan spela med dina inställningar.

Du kan till exempel gå till fliken Stil för att ställa in bakgrunden, gå till fliken advanced för att anpassa marginalen och många fler.

Nu tillbaka till dina kolumner. I den vänstra kolumnen ställer du in bredden till 33 % och för de andra fyra till 16 %.

I den vänstra kolumnen lägger vi till en titelwidget med lite text. Du kan lägga till text som bjuder in dina webbplatsbesökare att se annat innehåll som är relevant för det aktuella innehållet, eller vilken annan text du väljer.

Till höger lägger vi till en bildwidget. Du kan lägga till bilder från miniatyrer/utvalda bilder av inlägg eller ladda upp dem manuellt.

Nu är strukturen klar. Gå tillbaka till Popup-inställningar för att anpassa ingångs-, utgångs- och marginalanimationer. I den här handledningen ställer vi in ingången till Tona ner och utgången på Tona upp. Gå sedan till fliken advanced och ställ in marginalen till 30 (gemensamt värde för länkar).

Nu när designen är klar, klicka på knappen PUBLICERA för att ställa in visningsvillkor och triggers. För att definiera visningsvillkoret, klicka på knappen LÄGG TILL ETT VILLKOR och välj ditt alternativ från rullgardinsmenyn.

Eftersom du vill visa Popup by post-taggen kan du ställa in följande visningsvillkor (se animering).

Klicka på Nästa. I fliken triggers, ställ in avtryckaren på På Scroll vrider strömbrytaren till Ja. Definiera Riktning sur Bas och Bredd över 95 %. Eftersom vi vill att popup-fönstret ska visas när besökare når slutet av vår artikel.

I den här handledningen kommer vi inte att definiera Avancerade regler. Så klicka vidare SPARA OCH STÄNG. Nåväl, nu är vi klara.

Låt oss se hur det ser ut.

Här har du precis avslutat din popup. Se även våra relaterade artiklar:

Ladda ner Elementor Pro

Dela den här artikeln:

Mikhos Gartner

Mikhos Gartner är en expert på digitala verktyg som köper, testar och granskar SAAS-verktyg för småföretag. Han bygger på många års erfarenhet inom teknikområdet och ger insiktsfulla recensioner. Dess innehåll konsumeras flitigt och betjänar miljontals användare varje månad.