Ako vytvoriť kontextové okno kontaktného formulára vo WordPress – krok za krokom

ako vytvoriť kontextové okno kontaktného formulára v


Chcete otvoriť kontaktný formulár, keď používateľ klikne na tlačidlo kontaktu alebo odkaz?

Výhodou je, že zakaždým, keď používateľ klikne na tlačidlo kontaktu alebo na odkaz, namiesto toho, aby šiel na novú stránku, otvorí sa kontaktný formulár vo forme vyskakovacieho okna, čo by zvýšilo počet odoslaných formulárov. V tomto článku vám ukážeme, ako si môžete vytvoriť rozbaľovacie okno kontaktného formulára na svojom webe WordPress bez toho, aby ste krok za krokom ovplyvnili dojem používateľa..

Vytvorenie kontextového okna kontaktného formulára v aplikácii WordPress

S programom WordPress je vytváranie kontextového okna kontaktného formulára jednoduché. Ak chcete začať, stačí mať 2 veci:

  1. výkonný vyskakovací doplnok
  2. robustný doplnok na tvorbu formulárov

Na dosiahnutie najlepších výsledkov vám odporúčame používať WPForms na vytvorenie kontaktného formulára. Jedná sa o výkonný doplnok na tvorbu formulárov, ktorý vám umožní vytvoriť takmer ľubovoľnú formu za menej ako 5 minút. Viac informácií o WPForms nájdete tu.

WPForms, registrácia užívateľa, plugin, plugin prihlásenia používateľa

Pokiaľ ide o kontextové doplnky, myslíme si, že neexistuje žiadna iná možnosť, ktorá je lepšia ako OptionMonster. Je to jeden z najpopulárnejších a najvýkonnejších doplnkov olovenej generácie, ktorý vám umožní upútať pozornosť vášho návštevníka a povzbudiť ho, aby na svojom webe podnikol kroky pomocou ohromujúcich optinov. Prostredníctvom tohto doplnku môžete zvýšiť zapojenie používateľov a zvýšiť počet konverzií a predaja.

optinmonster-vyskakovacie okná

Ak sa chcete dozvedieť viac o OptinMonster, prečítajte si našu podrobnú recenziu OptinMonster.

Krok 1: Nainštalujte doplnky WPForms a OptinMonster

add-WordPress-plugins

Začnite stiahnutím WPForms zapojiť. Potom ho nainštalujte a aktivujte. Nie ste si istí ako? Žiaden problém. Môžete prejsť k nášmu sprievodcovi o tom, ako nainštalovať doplnok WordPress, aby sa všetko vyriešilo. Počkáme.

Všetko nachystané? perfektný.

Rovnakým postupom aktivujte doplnok OptinMonster. Nestačí však nainštalovať iba doplnok. Budete musieť vytvoriť účet s aplikáciou OptinMonster. Doplnok slúži iba ako médium na prepojenie vášho webu WordPress s aplikáciou OptinMonster. Aby to fungovalo správne, musíte si nainštalovať doplnok a tiež si vytvoriť účet s aplikáciou.

Krok 2: Vytvorte kontaktný formulár pomocou kontextového okna WPForms

Najprv pomocou doplnku WPForms vytvoríme kontaktný formulár. Ak ste však používali WPForms a už ste s ním vytvorili kontaktný formulár, môžete tento krok preskočiť.

Ak nemáte kontaktný formulár, prejdite na informačný panel a kliknite na ikonu WPForms »Pridať nový.

wpforms-dashboard

Týmto sa dostanete na ďalšiu stránku, kde môžete vybrať šablónu formulára a do formulára pridať názov. Vyberte ikonu Jednoduchý kontaktný formulár šablóny a pomenujte svoj formulár.

Šablóny WPForms Lite

Po dokončení procesu sa spustí nástroj na tvorbu formulárov, ktorý uľahčuje navrhovanie formulárov. Súbory môžete ľahko pridať alebo odstrániť pomocou nástroja na vytváranie myšou.

Môžete pridať všetky polia, ktoré považujete za potrebné pre svoj formulár. Po dokončení všetkých zmien uložte zmeny kliknutím na tlačidlo Uložiť. Váš kontaktný formulár je teraz pripravený na zverejnenie.

Teraz naraz vložiť vedľa tlačidla Uložiť a skopírujte skrátený kód.

Krok 3: Vytvorenie kontextového okna WordPress pomocou OptinMonster

Ďalším krokom je vytvorenie kontextového okna na vašom webe. Vytvoríme modálne kontextové okno pomocou OptinMonster. Prejdite na informačný panel WordPress a kliknite na ikonu OptinMonster »Vytvorenie novej kampane.

Tým sa otvorí nová obrazovka, kde môžete vybrať typ kampane, po ktorej nasleduje šablóna vášho prihlásenia. Pre typ kampane vyberieme možnosť rozbaľovacej ponuky.

Pokiaľ ide o šablónu, poďme na to Plátno. Toto je prázdne plátno, ktoré podporuje všetky formy krátkych kódov. Môžete sem teda vložiť akékoľvek kódy HTML, CSS, JavaScript alebo dokonca WordPress.

Po výbere šablóny budete presmerovaní na novú obrazovku, kde môžete pomenovať svoju kampaň.

Potom kliknite na ikonu Začať s budovaním tab. Teraz budete presmerovaní na tvorcu drag and drop. Všimnite si, že plátno je z hľadiska dizajnu prázdne. Pomocou tohto plátna môžete vytvoriť ľubovoľné kontextové okno a navrhnúť ich od nuly. Môžete to urobiť pomocou možností pod dizajn pútko.

Po dokončení kliknite na ikonu Pridať bloky na karte Dizajn. Prejdite nadol a vyhľadajte ikonu Bloky prvkov možnosti. Pod týmto sa zobrazí blok HTML. Presuňte ju myšou do navrhovanej oblasti.

Tu môžete zadať skrátený kód kontaktného formulára spolu s akýmkoľvek iným vlastným HTML, ktorý chcete pridať. Pridajme teda náš krátky kód, ktorý je nasledujúci:

Máte nejaké otázky?

Chcete sa opýtať na našu službu? Stačí vyplniť formulár a my sa k vám čo najskôr vrátime.

Tu je ukážka, ako to môžete urobiť.

Všimnite si, že skrátený kód formulára, ktorý sme vytvorili predtým, bol tiež vložený do kódu. Tento krátky kód môžete nahradiť vaším. Teraz uložte zmeny. Potom prejdite na stránku Pravidlá zobrazenia a nastavte načasovanie na nulu, ako je to zobrazené na snímke obrazovky.

Prejdite ďalej touto obrazovkou a nájdete ďalšie možnosti. Môžete ich použiť, ak chcete tento formulár zobraziť na konkrétnej stránke alebo príspevku. Zasiahnite Uložiť po dokončení.

Krok 4: Publikovanie vášho vyskakovacieho formulára

Po dokončení zmien kliknite na ikonu Áno nie v hornej časti a kliknite na ikonu Aktivovať pútko.

Nakoniec choďte na publikovať kartu a prepnúť stav na žiť.

optinmonster, uvítacia brána, uvítacia brána wp, budova zoznamu

Po dokončení sa vráťte na hlavný panel WordPress a prejdite na stránku OptinMonster »Kampane. Tu uvidíte svoju kampaň. Pod týmto kliknutím kliknite na Upravte nastavenia výstupu link. Rozbalí sa a zobrazí sa niekoľko možností. Začiarknite políčko vedľa položky Povoľte kampaň na webe voľba.

Nakoniec kliknite na Uložiť nastavenia možnosť na konci stránky.

Krok 5: Pridanie odkazu na spustenie kontextového formulára kontaktu

Prvá kópia správy OptinMonster. Nájdete ho hneď vedľa názvu svojej kampane.

Teraz vytvorte novú stránku vo WordPress alebo upravte príspevok alebo stránku, na ktorú chcete pridať kontextový odkaz alebo tlačidlo kontaktného formulára. Vytvoríme tu nový. Prejdite do textového editora a pridajte nasledujúci kód. Nezabudnite nahradiť slimáka vlastným slimákom.

Kontaktuj nás

Po dokončení stlačte publikovať na pravej strane. Váš formulár je teraz v činnosti. Navštívte svoje stránky z klientskeho rozhrania a uvidíte ich.

Dúfame, že vám tento článok pomohol. Ak sa chcete dozvedieť viac o vytvorení kontaktného formulára s WPForms, tu je podrobný sprievodca.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map