Divi: Nejlepší WordPress téma všech dob!

více Stahování 901.000, Divi je nejoblíbenější téma WordPress na světě. Je kompletní, snadno použitelný a je dodáván s více než šablonami 62 zdarma.

Kontaktní formulář 7 je plugin WordPress neuvěřitelně populární pro vytváření kontaktních formulářů. To vám umožní vytvářet formuláře bez kódování HTML. tito formuláře může nabídnout funkce jako CAPTCHA, stahování souborů, průzkumová pole atd ...

Přestože výchozí styl kontaktního formuláře 7 je dostačující pro většinu základních kontaktních formulářů, musíte jej často změnit.

Tím se změní výchozí struktura formuláře, aby byla přístupnější. Přidá také zkrácený [responzivní] nad formulářem, takže pokud dojde k chybě při odesílání formuláře, je to na formuláři uvedeno.

Pokud jste nikdy nevytvořili web WordPress, zjistěte to Jak nainstalovat blog WordPress s FTP klientem

Pro standardní formulář je kód vygenerovaný pluginem následující:

[odpověď] Vaše jméno (vyžadováno) [text * vaše jméno-jméno: vaše-jméno] Váš e-mail (povinné) [e-mail * vaše-e-mail ID: váš-e-mail] Váš předmět [text vaše-předmět ID: váš-předmět] Vaše zpráva [textarea your-message id: your-message] [odeslat "Odeslat"]

Některé pluginy přizpůsobte Kontaktní formulář 7

1. Kontaktní formulář 7 Style

plugin Kontaktní formulář 7 Style má na výběr několik stylů.

Seznam stylů kontaktů 6Pro uživatele tématu Dvacet patnáct je k dispozici také kompatibilní styl.

Chcete-li použít styl, přejděte na „ Styly kontaktů> Rychlé úpravy Zkontrolujte formulář, ve kterém chcete styl použít, a klikněte na „ Aktualizovat ".

Příklad kontaktního formuláře wordpress2. Kontaktní formulář Skiny 7

Používat skiny Kontaktní formulář 7, vytvořte nový kontaktní formulář a přejděte dolů do sekce Skiny. Můžete si vybrat šablonu a styl pro svůj formulář.

Najdete modely věnované formámEVENEMENTS, registrace a oznámení.

Šablona stránky wordpress kontaktního formuláře

Takto vypadá formulář průzkumu se stylem Topaz pomocí motivu Dvacet patnáct.

Příklad kontaktního formuláře 7 poptávkový formulář

3. Materiálové provedení pro kontaktní formulář

Tyto styly jsou založeny na stylu Materiálové provedení.

Vytvořte si snadno svůj web pomocí Elementoru

Elementor vám umožní tvořit Snadno a zdarma jakýkoli design webových stránek nebo blogu s profesionálním vzhledem. Přestaňte platit hodně za web, který si můžete udělat sami.

Tento plugin navrhuje, abyste odstranili výchozí formulář a použili jeho krátké kódy.

Zde je příklad s tématem Hestia. Při přesunutí ukazatele do pole ve formuláři si všimněte plovoucího štítku.

Příklad materiálového designu, kontaktní formulář 7Test kontaktního formuláře 7 u některých témat WordPress

Kontaktní formulář s tématem ColorMag WordPress

Kontaktní formulář 7 většinou zdědí styl vašeho motivu WordPress. Toto je případ tématu Tmavý korál.

Korálový tmavý kontaktní formulář

Kontaktní formulář s tématem WordPress ColorMag

Zde je formulář bez vlastního stylu. Zdědí barvu modrého tlačítka ColorMag WordPress téma.

Kontaktní formulář s tématem colormagZačal jsem nahráním fotografie, která se má použít jako obrázek na pozadí formuláře, a změnou kódu štítků formuláře ze šedé na bílou s modrým stínem na textu.

Následující změny měly zvýšit okraje mezi popisky formuláře a poli formuláře, změnit tlačítko Odečíst a přidat ohraničení, když ukazatel zadá pole ve formuláři.

Mělo by se také změnit zobrazení chybových / úspěšných zpráv při odeslání formuláře, aby se zobrazovaly správně.

GIF rotující při odeslání formuláře se nezobrazil správně, našel jsem alternativu k Loading.io a odkazoval na něj pomocí CSS.

Chcete prodávat své produkty na internetu?

Stáhněte si zdarma WooCommerce, nejlepší pluginy pro e-commerce pro prodej vašich fyzických a digitálních produktů na WordPress a snadné vytvoření vašeho online obchodu. Ideální pro začátečníky.

Zde je výsledná podoba:

Výsledek přizpůsobení kontaktního formuláře 7Zde je kód:

div.wpcf7 {okraj: 0; polstrování: 1.5em; pozadí: url ('your_background_image_url_here'); -webkit-border-radius: 3px; -moz-okraj-poloměr: 3px; okraj poloměru: 3px; } .wpcf7 label, .wpcf7-submit {barva: bílá; textový stín: 1px 1px 0px rgba (40, 157, 204, 1); } .wpcf7 .wpcf7-form-control {10px 0 20px 0; } .wpcf7 .wpcf7-submit: přejet {background: #186d8e; } .wpcf7-form-control: zaostření {okraj: 2px solid #289dcc; } div.wpcf7-odezva-výstup {pozadí: #F8F8F8; text-align: centrum; šířka: 92.5%; okraj: 1em 0em 1em 0em; -webkit-border-radius: 3px; -moz-okraj-poloměr: 3px; okraj poloměru: 3px; } span.wpcf7-neplatný tip {pozadí: # F8F8F8; zobrazení: inline-block; šířka: auto; polstrování: 1%; -webkit-border-radius: 3px; -moz-okraj-poloměr: 3px; okraj poloměru: 3px; } div.wpcf7 .ajax-loader {pozadí-obrázek: url ('your_loading_image_url_here'); šířka: 50px; výška: 50px; }

Pokud kód nepotřebujete čmárat, doporučujeme podívat se na náš Doplňky 10 WordPress k vytvoření kontaktního formuláře na vašem blogu

Objevte také prémiové alternativy 3, které vám pomohou vytvořit kontaktní formuláře. 

1. Kontaktní formulář W8

Kontaktní formulář W8 je jedním z nejpopulárnějších pluginů kontaktních formulářů na WordPress. Nabízí spoustu funkcí, jako je odeslání více příjemcům, podpora animací, neomezené vytváření formulářů, různé styly a široká škála dalších možností přizpůsobení.

W8 kontaktní formulář plugin pro kontaktní formulář wordpress

Navíc poskytuje vašemu webu nebo blogu profesionální systém, který usnadňuje kontakt s vašimi zákazníky. Budete moci přizpůsobit všechny své formuláře podle svých potřeb a vkusu.

Stáhnout | Demo | Web hosting

2. Kontaktujte nás

Contact Us Form je responzivní WordPress plugin a jednoduchý nástroj, ale bohatý na možnosti přizpůsobení, který vám umožní zobrazit jasný a povzbudivý formulář, ve kterém vás mohou návštěvníci kontaktovat zanecháním své zprávy.

Kontaktujte nás prostřednictvím pluginu WordPress

Budete moci definovat potřebná pole, vybrat nejlepší rozložení polí a úplně je přizpůsobit, abyste povzbudili své zákazníky nebo návštěvníky, aby zanechali své návrhy nebo zprávy.

Stačí nastavit e-mailovou adresu, na kterou chcete přijímat zprávy, a použít ji k růstu vašeho podnikání nejziskovějším směrem.

Stáhnout | Demo | Web hosting

3. Slick Popup Pro

Slick Popup Pro je poměrně jednoduchý a lehký plugin WordPress, který převádí jakoukoli formu vytvořenou tímto pluginem Kontaktní formulář 7 v popupu. Používá formulář a převede jej do krásného a dokonale reagujícího okna.Vyskakovací plugin Wordpress slick popup pro

Vyskakovací formulář může mít několik použití, včetně: formuláře pro shromažďování informací, kontaktního formuláře, registračního formuláře, formuláře nabídky, formuláře pro návrh / stížnost a dalších.

Stáhnout | Demo | Web hosting

Doporučené zdroje

Podívejte se na další doporučené zdroje, které vám pomohou lépe vytvářet a spravovat kontaktní formuláře na vašem webu nebo blogu. 

závěr

Voila! To je vše pro tento tutoriál, doufám, že budete mít více nápadů, jak přizpůsobit svůj kontaktní formulář. Neváhej sdílet se svými přáteli na svých oblíbených sociálních sítích

Budete však také moci konzultovat naše ressources, pokud potřebujete více prvků k realizaci vašich projektů vytváření internetových stránek, nahlédněte do našeho průvodce na internetu Vytvoření blogu WordPress.

Ale mezitím nám pověz o svém commentaires a návrhy ve vyhrazené sekci.

...  

106 akcie
podíl4
tweet
Zadat102