Ako vytvoriť vlastné tlačidlá vo WordPress (bez kódovania)

Tlačidlá sú jedným z najúčinnejších spôsobov, ako upútať pozornosť používateľa. Premýšľali ste niekedy nad otázkou: „Ako vytvoriť tieto skvelé a elegantné tlačidlá jednoducho, bez absolútneho zadávania kódu?

V tomto návode vám ukážem, ako vytvoriť tlačidlá výzvy na akciu s vysokou mierou prekliknutia, ktoré môžete použiť na:-

Je dokázané, že tlačidlá majú vysokú mieru prekliknutia. Ak ste niekedy navštívili konverziu optimalizovanú Vstupná stránka, Možno ste už videli tlačidlá ako tieto:

Príklad tlačidiel na blogu wordpress

 

Tieto tlačidlá používam na niektorých z mojich najvyšších prevádzka generovanie blogových príspevkov a stránok s cieľom zabezpečiť, aby každý návštevník dostal príležitosť konvertovať a vidieť to najlepšie z môjho obsahu. Aj mne to pomáha zarobiť viac peňazí cez moje pridružené odkazy.

Ako používam interaktívne tlačidlá na zvýšenie návštevnosti stránok môjho konverzného blogu a ako vytvoriť tie vaše bez kódovania

Keď sa pozriete na obrázok, označené oranžové tlačidlo je príkladom tlačidla vytvoreného pomocou pluginu MAXbuttons. Tu v tomto návode prejdete rovnakým postupom krok za krokom, ktorý vám pomôže vytvoriť tlačidlá, ktoré sa zobrazia kdekoľvek na vašom WordPress blog.

Ukážem vám najjednoduchší spôsob, ako to urobiť, čo si vyžaduje nulové kódovanie a prispôsobenie CSS.

V tomto návode budeme používať doplnok MAXButtons. Tu je niekoľko dôvodov, prečo by ste mali použiť tento:

  • Samostatný doplnok, ktorý podporuje medzipamäte pre vyššia rýchlosť načítania.
  • Vysoko prispôsobiteľné, bezplatné použitie
  • Jednoduché použitie a zároveň výkonný
  • Dodáva sa s vopred pripravenými zdrojmi na optimalizáciu odkazov
  • Podporuje rôzne témy
  • Podporuje skratku a skratku vnútri editora

Tento plugin používam tu na BforBloggers. Žiadna iná zapojiť je rovnako výkonný a ľahko použiteľný ako MAXButtons.

Ako bolo povedané, začnime.

Krok 1: Nainštalujte doplnok MAXButtons WordPress

Maxbuttons je výkonný doplnok, ktorý používajú začiatočníci až profesionálni používatelia. Môžete si vytvoriť pôsobivé, vysoko prispôsobiteľné a neobmedzené množstvo tlačidiel a prezentácií ako kdekoľvek inde WordPress blog pomocou jednoduchých krátkych kódov. Takže prvá vec, ktorú musíte urobiť, je nainštalovať a aktivovať tento doplnok.

Stiahnite si MAXbuttons

Krok 2: Vytvorenie tlačidla od začiatku

Prejdite do ponuky MAXButtons z bočného panela hlavného panela WordPress. Kliknite na možnosť Pridať nové tlačidlo. Otvorí sa nová obrazovka editora, kde musíte vytvoriť a upraviť svoje tlačidlo. Ukážem vám, ako sa to robí.

MaxButtons Buttons krok 1 – vytvorenie a úprava tlačidla od začiatku

1 – Zadajte názov tlačidla. Aj keď to nie je potrebné, odporúčam vám pomenovať každé z vašich nových tlačidiel, aby ste ich mohli rozlíšiť a ľahko nájsť viacero tlačidiel, ak ich náhodou vytvoríte viac ako 10. Toto je na vnútorné použitie. Používatelia to na živej stránke neuvidia.

[Pozrite sa na plávajúcu ukážku. Zmení sa, keď začnete upravovať tlačidlo. To vám dá predstavu o tom, ako to presne bude vyzerať na živej stránke.]

2 – Do ďalšieho poľa pod názvom tlačidla zadajte adresu URL, na ktorú chcete používateľa poslať, keď naň klikne. Toto môže byť affiliate link na propagáciu, inováciu obsahu, formulár na prihlásenie do zoznamu e-mailov alebo akúkoľvek stránku atď. Môžete si vybrať, či chcete pridať značka atribútu nofollow na vaše tlačidlo odkaz a ak ho chcete otvoriť v novom okne. Interný a externý, možno použiť oba odkazy.

3 – Do tretieho poľa môžete pridať popis tlačidla. Popis sa zobrazí, keď používateľ podrží kurzor nad tlačidlom. Takže môže byť dobrý nápad to urobiť, pretože to prinesie väčšiu hodnotu. Zadajte krátky popis toho, čo používateľ uvidí, len čo na to klikne.

4 – V texte by sa mal zadať slogan vášho tlačidla. Ako môžete vidieť na obrázku vyššie, text, ktorý sa zobrazí na živej stránke, by mal byť krátky a čo najbližšie k pointe. Ak je to možné, držte ho do 3 slov. Niečo ako kliknutie tu je lepšie ako kliknúť na toto tlačidlo.

5 – Ďalšie možnosti zahŕňajú rodinu písma textu, veľkosť a formát. Môžete si vybrať z dostupných možností a na obrázku som použil Georgia s veľkosťou 18 px s tučným štýlom. Môžete tiež zmeniť farbu pri umiestnení kurzora myši na tlačidlo, aby ste pridali efekt animácie. Farba kurzora sa aktivuje hneď, ako sa kurzor dostane nad tlačidlo. Ak chcete, môžete text aj zarovnať.

úprava okraja tlačidla a farby okraja tak, aby zodpovedali téme wordpress

6 – Po rolovaní v prvej časti uvidíte možnosť prispôsobenia okrajov. V tejto časti zmeníte orámovanie tlačidla. Existujú dve možnosti ohraničenia, jedna je pre normálnu hranicu a druhá je pre vznášanie sa. Tlačidlo prechodu by sa malo líšiť od ideálnej farby okraja.

K dispozícii je tiež ponuka štýlu okrajov, kde si môžete vybrať z rôznych štýlov okrajov. Napríklad som použil dvojitý štýl na obrázku vyššie. Predvolený štýl je pevný a nevyzerá cool, takže je lepšie to zmeniť.

nastavenia pozadia a prispôsobenie pre novovytvorené tlačidlo

7 – V ďalšej časti si môžete prispôsobiť farbu pozadia alebo základnú farbu tlačidla. Túto farbu by ste mali zmeniť na niečo, s čím sa môžu diváci stotožniť, napríklad s vašou WordPress témuštandardná farba. Páči sa mi oranžová farba, tak ju musím zmeniť na oranžovú. Môžete si ľahko vybrať akúkoľvek farbu z vyskakovacieho okna palety farieb.

Pod tým je tiež farba pozadia. Zmeňte ho, ak chcete svojim používateľom zobraziť inú farbu, keď presunú kurzor na tlačidlo.

To je všetko. Nastavenia v spodnej časti sú pre pokročilých používateľov, ktorí sa radi hrajú s vlastným CSS. Predpokladám, že ste začiatočník, takže sa prosím nedotýkajte týchto nastavení. Nechajte ich tak, ako sú.

Krok 3: Uložiť a zobraziť ukážku

Posledný krok: uloženie tlačidla a jeho náhľadu

Teraz, jediná vec, ktorú potrebujete na spustenie tlačidla, je:

  1. Kliknite na tlačidlo Uložiť.
  2. Skopírujte skrátený kód zobrazený na obrazovke.
  3. Prilepte kdekoľvek na svoje stránky.

Skrátený kód je potrebné vložiť do vizuálneho editora a nie do textu. Nižšie je rovnaké demo tlačidlo, ktoré som ukázal v tomto návode a na obrázkoch.

[maxbutton id = ”8 ″]

Vyzerá celkom dobre a je optimalizovaný pre vysoké CTR. Skrátený kód môžete použiť na zobrazenie ľubovoľného tlačidla v sekcii miniaplikácií a tiež v sekcii päty. Použite na to textový widget.

všetky vytvorené tlačidlá a ich krátke kódy

Upozorňujeme tiež, že po vytvorení a úspešnom uložení tlačidla sa v časti „tlačidlá“ v ponuke zásuvného modulu MAXButtons okamžite začne zobrazovať ukážka tlačidla spolu s priradeným krátkym kódom.

Dúfam, že vám tento návod pomohol. Zdieľajte tento príspevok na Facebooku a Twitteri.

Zdieľaj:

Nechaj odpoveď

Vaša e-mailová adresa nebude zverejnená. Povinné položky sú označené *