5 témat WordPress Divi navržených s originální a kreativní vizí

5 témat WordPress Divi navržených s originální a kreativní vizí

5 témat WordPress Divi navržených s originální a kreativní vizí

Divi je jedním z nejznámějších témat WordPress s více než 2 miliony uživatelů. Velká sbírka témat WordPress Divi a jejich chytré funkce získávají velkou pozornost. Nejen, že Divi Builder nabízí větší kapacitu a všestrannost než standardní editor Gutenberg.

Navíc je také propracovanější než běžné tvůrce stránek. Obecně řečeno, umožňuje vám přizpůsobit celý váš web. Jedná se spíše o záhlaví, zápatí a postranní panely než jen o části obsahu. Máte tedy možnost vytvořit skutečně jedinečný web.

Dnes si můžete stáhnout Divi WordPress Témata na TemplateMonster. Integrují všechny funkce a styl Divi Theme (nezapomeňte jej zakoupit samostatně). Pokud chcete změnit funkčnost, estetiku a vzhled vašeho motivu Divi, podívejte se na to. Jste připraveni se naučit, jak vytvořit web s WordPress a Divi? V tom případě začněme přezkoumávat vaše potenciální společníky v této záležitosti.

Divi WordPress Témata: Vylepšete svůj online obrázek a získejte optimální zážitek z budování

NFT – podřízené téma Divi WordPress pro web související s kryptoměnami

Potřebujete výjimečně kvalitní témata Divi WordPress přizpůsobená potřebám lidí, kteří se zabývají kryptoměnami? V tom případě vám tato moderní volba poskytne ty nejlepší možnosti v jednom článku. Nepochybně zaujme svým dobře strukturovaným a propracovaným designem. Můžete si vybrat ze tří jedinečných ukázek, které můžete upravovat společně s nástrojem drag-and-drop.

To znamená, že před spuštěním projektu online se nemusíte učit expertní kódovací dovednosti. Vyznačuje se také plně responzivním designem, který zajišťuje, že vaše stránky zapůsobí na publikum bez ohledu na to, jaké zařízení používají. Můžete také přidat výkonný blog a sdílet další informace související s vaším tématem a poskytnout profesionálnější image.

Sféry: NFT trhy a kryptoměny.

Hlavní funkce:

  • různá rozložení portfolia;
  • stylové variace záhlaví a zápatí;
  • Písma Google;
  • paralaxový efekt;
  • rolovací nabídka.

Acheter údržba | Demo | Stáhněte si zdarma v MonsterONE

Curex – Medical WordPress Woocommerce Divi Child Theme

Curex je skvělé hotové řešení, které vám umožní zažít používání WordPressu s Divi. Má širokou škálu pokročilých funkcí a vizuálně atraktivní design. Můžete si vybrat z pěti úžasných ukázek, které vyčnívají z davu. Poté si můžete upravit web podle svých představ a sledovat změny v reálném čase pomocí nástroje pro přetahování.

Online projekt ozdobí několik stylových záhlaví a zápatí. Kromě toho podporuje WooCommerce, což znamená, že je možné začít generovat potenciální zákazníky a získávat prodeje. Nezapomeňte na různé rozvržení portfolia, které pomáhá organizovat váš vizuální obsah tím nejlepším způsobem.

Oblasti: lékařské pracoviště, nemocnice, zubař a zdravotní péče.

Hlavní rysy:

  • plně responzivní design;
  • četné rozložení blogů;
  • video na pozadí;
  • Google mapy;
  • Písma Google.

Acheter údržba | Demo | Stáhněte si zdarma v MonsterONE

Artist – Divi Tattoo Parlor WordPress Téma

Pokud chcete rozšířit svůj dosah jako tetování, toto hodné téma WordPress s Divi se stane vaším asistentem. Má super jedinečný a minimalisticky vypadající design, který jednotlivcům poskytne hladký uživatelský zážitek. Nemusíte přemýšlet o tom, jak se témata WordPress instalují, protože si užijete ukázkový import jedním kliknutím.

Existuje spousta možností, jak zvýšit zapojení a zvýšit nadšení lidí pro web. Jedná se například o nabídku se speciálními efekty, oblast posuvníku přes celou obrazovku a kolotoč blogu. Můžete také využít 3D cenové oblasti, která přitáhne více pozornosti k vašim službám. S kontaktním formulářem a odběrem newsletteru bude snazší rozšířit vaši zákaznickou základnu.

Oblasti: tetovací služby.

Hlavní rysy:

  • speciální struktura blogu;
  • kolotočové komentáře;
  • oblast členů týmu;
  • možnost změny pozadí;
  • 80 úžasných animačních efektů.

Acheter údržba | Demo | Stáhněte si zdarma v MonsterONE

Duoroofers – střešní služby – WordPress Divi Child Theme

Pomocí tohoto vynikajícího tématu Divi WordPress budete moci nastartovat své podnikání v oblasti střech. Balíček obsahuje širokou škálu funkcí, které vám pomohou uspět ve vašem podnikání. Na výběr je pět pozoruhodných ukázek. Aby byly poutavější, můžete použít krásný efekt Parallax.

Stejně jako mnoho jiných témat WordPress nabízí tento snadno použitelný výběr ukázkový import jedním kliknutím. Můžete získat více příležitostí k růstu svého podnikání pomocí mnoha rozložení blogů a portfolií. Mimochodem, jejich působivý vzhled zůstane nezměněn na všech moderních zařízeních, a to díky plně responzivnímu designu.

Oblasti: pokrývačské, stavební a kutilské služby.

Hlavní rysy:

  • skvělé variace záhlaví a zápatí;
  • Písma Google;
  • Paralaxový efekt;
  • rozbalovací nabídka;
  • Členové týmu.

Acheter údržba | Demo | Stáhněte si zdarma v MonsterONE

Sociální péče – charitativní nezisková Divi téma WordPress

Sníte o bezvadné popularitě vaší neziskové organizace? Nemusíte přemýšlet o tom, jak vytvořit web s WordPress, protože vše potřebné je zde. Balíček je dodáván se čtyřmi variantami domovské stránky, které tvoří solidní a seriózní online platformu.

Chcete-li maximalizovat šance, že si vás někdo všimne, nezapomeňte použít odběr newsletteru a integrovaný blog. Tím pádem získáte velké množství lidí, kteří se o stránky pravidelně zajímají. Existují také dvě verze důležitých stránek, jako je galerie a kontakty. Budete také moci prezentovat své nadcházející akce v tom nejlepším možném světle.

Oblasti: Charita, nevládní organizace, darovací, církevní a fundraisingové stránky.

Hlavní rysy:

  • funkčnost portfolia;
  • plně responzivní design;
  • rozbalovací nabídka;
  • import ukázky jedním kliknutím;
  • dvě varianty stránky „O nás“.

Acheter údržba | Demo | Stáhněte si zdarma v MonsterONE

Na závěr pár slov

Zákazníci neustále prozkoumávají stránky, kde se mohou dozvědět o rostoucím počtu různých podniků. To je důvod, proč potřebujete mít renomovaný online zdroj, který rozšíří vaši obchodní přítomnost po celém světě.

Témata Divi WordPress vám mohou pomoci vytvořit atraktivní a produktivní web. Rozšiřují také vaše internetové připojení a posilují identitu vaší značky. Snadno se instalují. Nejlepší je, že se vždy můžete obrátit na témata WordPress ke stažení zdarma. Možná poskytují pouze základní možnosti, ale stojí za to se na to podívat. bezplatná témata WordPress ke stažení.

Doufáme, že se vám v této malé sbírce podařilo najít něco podle vašeho vkusu a preferencí. Děkuji za přečtení !

Divi: Jak vytvořit karty s efektem hoveru z čar

Divi: Jak vytvořit karty s efektem hoveru z čar

Chcete vytvořit karty s efektem hover z čar pomocí Divi?

Karty jsou rozhodně užitečné pro zpřístupnění důležitých informací ve stručné oblasti vašeho webu. To snižuje potřebu pro uživatele procházet obsahem dlouhé stránky. Modul Divi's tabs se snadno používá a je skvělý pro procházení jednoduchého obsahu jediným kliknutím.

Ale v tomto tutoriálu vám ukážeme, jak převést celé řádky Divi na karty, které se zobrazí po najetí myší. 

Ukážeme vám také, jak vytvořit vodorovné a svislé karty. Tím se odemkne síla Divi pro vytváření úplných rozvržení s více moduly pro každou oblast obsahu karty. 

Nejsou potřeba žádné pluginy!

Začněme.

přehled

Zde je přehled karet, které v tomto tutoriálu společně vytvoříme.

Stáhnout DIVI hned!!!

Vytvořte novou stránku pomocí Divi Builder

Z řídicího panelu WordPress přejděte na Stránky> Přidat nové vytvořit novou stránku.

Divi čáry převedené na tabulátory

Dejte tomu název, který vám dává smysl, a klikněte Použijte Divi Builder

poté klikněte na tlačítko Začněte stavět (Sestavte od nuly)

Divi čáry převedené na tabulátory

Poté budete mít prázdné plátno, abyste mohli začít navrhovat v Divi.

Vytváření vodorovných záložek s přechodem pomocí „řádků Divi“

V přítomné výchozí sekci přidejte řádek se dvěma sloupci.

Linka pozadí, pole výplň a stín

Než přidáme naše moduly, nejprve si trochu přizpůsobíme nastavení řádků. Otevřete Nastavení linky a aktualizujte následující:

  • Barva levého přechodu: #284f91
  • Barva pravého přechodu: #4646c4
  • Výplň: 50 pixelů (nahoře a dole), 50 pixelů (vlevo a vpravo)
  • Box Shadow: viz snímek obrazovky
  • Barva stínu krabice: rgba (70,70,196,0.66)

Přidejte obsah do řádku

Nyní do našeho řádku přidáme zástupný obsah. Do sloupce 1 přidejte obrázek podle svého výběru pomocí modulu Obrázek. Zde jsme použili obrázek z balíčku rozložení « Designový balíček rozvržení konference« .

V pravém sloupci přidejte modul Výzva k akci a aktualizujte následující:

  • Adresa URL odkazu tlačítka: # (prozatím jen pro zobrazení tlačítka)
  • Použít barvu pozadí: NE
  • Zarovnání textu: vlevo
  • Písmo názvu : Lato
  • Velikost textu nadpisu: 60px (počítač), 50px (telefon)

Vytvoření záložky

Chcete-li vytvořit skutečnou kartu, na kterou uživatelé umístí ukazatel myši, aby se zobrazil obsah daného řádku, musíme vytvořit modul Text a umístit jej vpravo nahoře pomocí nějakého vlastního CSS.

Pokračujte a přidejte nový textový modul pod obrázek ve sloupci 1 a aktualizujte následující:

  • Text: "Tab 1"
  • Pozadí: #284f91 (to by mělo odpovídat barvě levého přechodu čáry)
  • Zarovnání textu: na střed
  • Barva textu: #ffffff
  • Šířka: 100px
  • Výška: 50px
  • Okraj: -100px (nahoře), -50px (vlevo)
  • Výplň: 14px (nahoře)

Nakonec přidejte následující vlastní css do hlavního prvku, abyste mu dali absolutní pozici v horní části řádku.

position: absolute !important;
top: 0;

Výška a rozteč sekce

Prozatím otevřete nastavení sekce a aktualizujte následující:

  • Minimální výška: 500 pixelů (počítač), 900 pixelů (tablet), 750 pixelů (telefon)
  • Okraj: 100 pixelů (nahoře a dole)
  • Odsazení: 0px (nahoře a dole)

Vytvoření druhého řádku

Chcete-li vytvořit druhý řádek, duplikujte řádek, který jste vytvořili dříve. Přesuňte textový modul do sloupce 1 a obrázek do sloupce 2. Poté aktualizujte obrázek novým. To vám pomůže získat představu o tom, jak vypadá různý obsah na každé kartě.

Poté otevřete nastavení modulu Text použitý k vytvoření záložky ve sloupci 1 a přesuňte záložku doprava tak, že tam, kde tento řádek překrývá řádek výše, uvidíte záložku přímo napravo od záložky prvního řádku.

  • Okraj: 50 pixelů (vlevo)

Přidán efekt hoveru

Otevřete nastavení řádku a přidejte následující filtr:

  • Neprůhlednost: 70 % (výchozí), 100 % (nájezd)

Poté přidejte dobu trvání přechodu a křivku rychlosti pro efekt přechodu filtru krytí.

  • Doba přechodu: 500 ms
  • Křivka rychlosti přechodu: Lineární

Vytvoření třetí záložky

Nyní můžeme přidat naši poslední kartu. Chcete-li to provést, zkopírujte druhý řádek, který jste právě vytvořili. Potom přesuňte textový modul do sloupce 1 a obrázek do sloupce 2. A aktualizujte modul obrázku novým obrázkem.

Aktualizujte nastavení čáry novým gradientem pozadí.

  • Barva přechodu vlevo na pozadí: #333333
  • Barva přechodu pravého pozadí: #4646c4

Poté otevřete nastavení modulu Text použité k vytvoření karty ve sloupci 1 a aktualizujte barvu a okraj.

  • Pozadí: #333333
  • Okraj: 150 pixelů (vlevo)

Zde je návod, jak by vaše stránka měla vypadat, než umístíme naše řádky tak, aby se překrývaly.

Překrývající se linie s absolutním umístěním

Abychom překryli naše linie, musíme použít absolutní umístění. Nejprve aktualizujte výšku všech tří řádků na 100 %.

  • Výška: 100 %

Poté přidejte následující vlastní CSS do hlavního prvku všech tří řádků:

position: absolute !important;
left: 0;
right: 0;
margin: auto;

Takto aktuálně vypadají naše karty.

Změna pořadí řádků při umístění kurzoru pomocí Z indexu

V tuto chvíli jste si možná všimli, že třetí řádek/záložka je v popředí. Potřebujeme tedy přeskupit řádky pomocí Z Index tak, aby se první karta zobrazovala jako první, dokud nenajedete na jinou kartu.

Čtěte také: Jak vytvořit vlastní překryvné obrázky v Divi

Chcete-li to provést, otevřete nastavení prvního řádku a aktualizujte z-index následovně:

Z-index: 10

Poté umístěte kurzor na Z index dalších dvou řádků.

Z-Index: 11 (přejetí myší)

Hotovo ! Pojďme se podívat na konečný výsledek.

Konečný výsledek

Stáhnout DIVI hned!!!

Vytváření vertikálních záložek

Pokud chcete do řádků přidat svislé tabulátory, postupujte takto.

Pokračujte a duplikujte sekci obsahující karty s přechodem, které jsme právě vytvořili, abyste měli nový design, se kterým můžete pracovat.

Poté otevřete nastavení sekce a aktualizujte následující:

  • Polstrování: 10 % (vlevo a vpravo)

Aktualizujte následující parametry pro všechny tři řádky duplicitní sekce následujícím způsobem:

  • Šířka: 70 % (počítač), 70 % (tablet), 80 % (telefon)
  • Maximální šířka: 980 pixelů

Dále aktualizujte směr přechodu na 90 stupňů pro všechny tři čáry.

  • Směr gradientu: 90 stupňů

Nyní je čas umístit naše karty modulu Text nalevo od našich řádků, abyste získali požadované vertikální karty.

Viz také: Jak vytvořit nabídku rotujícího kola na Hover v Divi

Otevřete nastavení karty textového modulu na prvním řádku a aktualizujte následující:

  • Okraj (počítač): -50 pixelů (nahoře), -150 pixelů (vlevo)

Dále otevřete kartu Nastavení modulu Text řádku 2 a aktualizujte následující:

  • Okraj (počítač): 0 pixelů (nahoře), -150 pixelů (vlevo)

A pro poslední kartu ve třetím řádku aktualizujte následující:

  • Okraj (počítač): 50 pixelů nahoře, -150 pixelů vlevo
divi

Konečný výsledek

Nyní se podívejme na konečný výsledek.

Stáhnout DIVI hned!!!

závěr

S trochou kreativity a sílou Divi můžete vytvořit pěkné vlastní karty pomocí Divi linek. Existují určitá omezení toho, co můžete zobrazit. 

Například s touto konfigurací musí mít všechny řádky stejnou výšku jako sekce. Ale abyste nemuseli používat plugin, je to skvělé řešení. 

Doufáme, že vás tento tutoriál inspiruje pro vaše další Divi projekty. Pokud máte nějaké obavy nebo návrhy, najděte nás v sekci komentářů diskutovat o tom.

Můžete se také poradit naše zdroje, 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 nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Mezitím sdílejte tento článek na různých sociálních sítích.

...

Jak přizpůsobit WordPress pro zvýšení počtu konverzí

Jak přizpůsobit WordPress pro zvýšení počtu konverzí

Jak přizpůsobit WordPress pro zvýšení počtu konverzí?

Studie ukazují, že víc 68% kupujících začít zkoumat produkty online. Když zadají název vaší firmy nebo produkt, který hledají na Googlu, a přistanou na vašem webu, je nesmírně důležité, abyste jim poskytli relevantní informace, které hledají.

Trvá méně než sekundu, než se uživatelé rozhodnou o vašem webu, který určí, zda zůstanou nebo odejdou. 

přizpůsobte WordPress a zvyšte počet konverzí

Pokud si vaši potenciální zákazníci najdou cestu na váš web jen proto, aby se vrátili zpět, ani o sekundu později, ztrácíte prodej.

Skvělý způsob bojovat proti této míře okamžitého opuštění extrémně rychlé je poskytnout vašim potenciálním zákazníkům relevantní osobní informace a obsah.

Pravda za personalizací

Přizpůsobte si svůj web WordPress Nejenže se sníží vaše míra okamžitého opuštění, ale nakonec se zvýší vaše konverze.

Díky tisícům možností na výběr a tisícům firem, které mohou utrácet peníze za digitální marketing, jeden web obecný nedostatečný výkon se nepřevede do konverzí a prodeje.

Když potenciální zákazníci najdou přesně ty informace, které hledají, je větší pravděpodobnost, že zůstanou, komunikují a nakonec nakupují.

Objevte naše 4 triky snížit míru opuštění na svém blogu WordPress

Studie ukazují, že zákazníci s větší pravděpodobností nakupují od společnosti, která nabízí přizpůsobené uživatelské prostředí, a že přizpůsobený obsah může zvýšit efektivitu vašich marketingových výdajů o 10 až 30 procent.

S takovými čísly si nemůžete dovolit nepřizpůsobit si svůj web.

Obsah, který potřebujete přizpůsobit

Trávíte spoustu času budováním a zdokonalováním svého webu WordPress, takže může být ohromující, když se snažíte rozhodnout, které části obsahu přizpůsobit.

Fotografie na vašem webu jsou mimořádně silné a mohou mít obrovský dopad na vaše míry převodu. Ať už vaše snímky dodávají vaší značce lidský prvek, zobrazují podrobnosti nebo navádějí spotřebitele tam, kam chcete, aby hledali, přizpůsobení této části vašeho webu umožní vašim návštěvníkům vztah k vašemu podnikání.

Kontaktní informace - Zatímco snímky vám umožňují navázat emocionální spojení s vašimi návštěvníky, poskytnutí správných kontaktních údajů je snadný způsob přizpůsobení vašeho webu. Ať už máte jednorázové obchodní zástupce pro různá místa nebo konkrétní linku nápovědy přes noc, zobrazování návštěvníků vašeho webu správnými kontaktními údaji jim okamžitě umožňuje kontaktovat vás a usnadnit nakupování. 

Recenze a posudky zákazníků - zákazníci si před nákupem přečtou recenze. Z tohoto důvodu je stále důležitější mít na svých webových stránkách komentáře. Přizpůsobení těchto komentářů je může ještě zvýšit. Můžete to udělat tak, že ukážete recenze relevantních produktů někomu, kdo si koupil dříve, nebo zobrazíte recenze od někoho v určité oblasti země někomu jinému v této oblasti.

Informace o produktu - Pokud prodáváte produkt nebo službu, které nejsou k dispozici v určitých regionech nebo pro určité věkové skupiny, může být dokonalým způsobem, jak se s těmito informacemi seznámit, personalizace popisů produktů. Tato technika vám umožňuje poskytovat relevantní informace relevantním zákazníkům bez přeplnění webové stránky pro lidi, kteří ji nepotřebují.

Objevte kliknutím na tento odkaz Proč je vaše míra okamžitého opuštění tak vysoká?

Výzvy k akci - V závislosti na zařízení, které návštěvník webu používá, kde se nachází a co ho zajímá, a tlačítko výzvy k akci není vždy relevantní nebo lákavá. Přizpůsobení textu výzvy k akci a odkazu, na který pošle vašeho zákazníka, může být efektivnější než univerzální možnost.

Články na přední stránce blog a další obsah - V tomto šíleném světě WordPress SEO, příspěvky na blogu, které píšete, a další obsah, který na svém webu vytvoříte, by měly být pro uživatele relevantní a poutavé. Zobrazování obsahu návštěvníkům webových stránek a blogovým příspěvkům, které jsou pro ně zajímavé a relevantní, poskytuje návštěvníkům nejen hodnotu, ale také zvyšuje úroveň zapojení vašich blogových příspěvků.

Chcete-li získat na svém webu popularitu, může být velmi důležité zaujmout diváky, kteří se již zajímají o to, co píšete, což je praktičtější využití vašeho času.

Jak přizpůsobit svůj web

V závislosti na vašem produktu nebo službě existuje mnoho způsobů, jak přizpůsobit web WordPress, aby se zvýšil počet konverzí. Tady je několik nápadů, jak rozproudit vaši kreativitu při přizpůsobování webu:

Geografické cílení

Přizpůsobení obsahu na základě polohy návštěvníků je skvělý způsob, jak přizpůsobit svůj web. Můžete změnit snímky tak, aby odrážely obrázky relevantní pro návštěvníka, změnit telefonní čísla a prodejní informace tak, aby zobrazovaly správné kontaktní údaje podle toho, kde nakupují, a mnohem více.

Viz také Jak zvýšit míru konverze pomocí zásuvného modulu OptinLinks Email Capture

Jedna velikost nemusí vyhovovat všem, pokud jde o váš web a informace, které návštěvníci vašeho webu z různých míst hledají.

přizpůsobte WordPress a zvyšte počet konverzí

Na tomto obrázku vidíte, jak mohla univerzita v Montaně pomocí geotargetingu přizpůsobit své webové stránky na základě umístění studenta, který má zájem navštívit web. Místo obecné zprávy „ Další informace o tom, proč je UM pro vás to pravé„Návštěvníci Bostonu by zprávu viděli“ Montana navštíví Boston A měli by možnost domluvit si schůzku se zástupcem kampusu, když jsou v regionu. Míra prokliku personalizovaného obsahu je téměř dvojnásobná ve srovnání s obecným příspěvkem.

GeoFli

GeoFli je skvělý nástroj WordPress pro geografické cílení a geo-personalizace. Jejich plugin WordPress vám umožní snadno přizpůsobit vaše webové stránky na základě polohy návštěvníka. S GeoFli si můžete vybrat místo, na které cílíte, pomocí PSČ, státu, země nebo dokonce nakreslit svůj vlastní geo-plot.

Geofli bezplatný wp plugin

Umožňuje také geo-redirect návštěvníky z určitých míst na různé adresy URL. Chcete-li použít GeoFli, stačí vybrat obsah, který chcete upravit, vybrat oblast, na kterou chcete cílit, a upravit kopii nebo obsah tak, aby poskytoval hodnotu cílovému publiku.

Přizpůsobení typu zařízení

Zobrazování relevantního obsahu uživatelům na základě zařízení, které používají k vyhledávání na webu, je skvělý způsob, jak snížit míru okamžitého opuštění, zvýšit počet konverzí a poskytnout návštěvníkům vašeho webu informace. že potřebují.

Čtěte také: Jak zvýšit počet konverzí: zvýšit omezené nabídky

Pochopení zvyků vašich zákazníků vám může pomoci s touto formou personalizace. Například u spotřebitelů je pravděpodobnější, že nakoupí ze stolního počítače než ze smartphonu. Toto by vás mohlo povzbudit k tomu, abyste zobrazovali informace o nákupu produktu na počítači, přičemž zdůrazníte své obchodní hodnoty a výhody produktů na mobilních zařízeních.

Logický hop

Logický hop wp plugin zdarma

Logic Hop vám umožňuje přizpůsobit obsah webových stránek podle toho, jak se návštěvník na web dostal a jaký obsah si prohlížel. Jejich WordPress Plugin je mocný způsob, jak návštěvníkům vašeho webu doručovat přizpůsobený obsah.

Chcete-li použít Logic Hop, vše, co musíte udělat, je vytvořit podmíněnou logiku v určitých částech vašeho webu a váš web tyto části zobrazí, když budou splněny podmínky.

Přizpůsobení času

Zobrazování jedinečných výzev k akci a obsahu na základě denní doby, týdne nebo roku, kdy se návštěvník na vašem webu nachází, vám umožní používat uživatelské modely k zvýšit počet konverzí.

Přečtěte si také našeho průvodce Jak používat FOMO na WordPress pro lepší konverze

Pokud víte, že se určitý produkt nebo služba v určitém okamžiku prodává lépe, můžete svůj web přizpůsobit tak, aby jej během této doby představoval.

Pokročilé přizpůsobení od FlowCraft

Pokročilé přizpůsobení od FlowCraft umožňuje přizpůsobit obsah webových stránek na základě času, počtu návštěv a dalších. Jejich plugin WordPress umožňuje snadno kombinovat sekce a přizpůsobit je ještě konkrétnějším skupinám lidí.

Personalizace personalizace Adv wp zdarma

Podobné Pokud anoChcete-li použít pokročilé přizpůsobení Flow Craft, stačí vytvořit podmínku a určit, co se zobrazí, pokud je podmínka splněna nebo ne.

Personalizace interakce s webem

Způsob, jakým spotřebitel interaguje s vaším webem, je také skvělou příležitostí ukázat mu přizpůsobený obsah. Pokud jsou připojeni a provedli precedentů nákupy, můžete navrhnout podobné položky, pokud jsou to první návštěvníci, můžete jim ukázat nejoblíbenější položky a pokud našli váš web kvůli konkrétní reklamě, můžete zobrazit informace, které jsou relevantní k této reklamě.

Pokud ano

If-So vám umožňuje přizpůsobit obsah webových stránek na základě profilu vašeho návštěvníka nebo interakce s webem. Tento plugin WordPress umožňuje zobrazit jedinečný obsah na základě data, uživatelského profilu a dalších.

Ifso wp bezplatný plugin

Chcete-li použít If-So, vše, co musíte udělat, je vybrat podmínku, na kterou chcete cílit, a poté definovat obsah, který chcete zobrazit, zda je podmínka splněna.

Když potenciální zákazníci přijdou na váš web, máte jen zlomek sekundy na to, abyste upoutali jejich pozornost a zaujali je. Přizpůsobení obsahu na vašem webu WordPress je proto skvělý způsob, jak poskytnout návštěvníkům informace, které hledají, a v konečném důsledku zvýšit počet konverzí.

Objevte také Jak sledovat konverze na WordPress: Průvodce krok za krokem

Ať už se jedná o přizpůsobení kontaktních údajů podle umístění návštěvníků nebo přizpůsobení obrázků podle ročního období, hodnotný obsah je klíčem ke konverzi vysoce kvalitních zákazníků.

Doporučené zdroje

Zjistěte další doporučené zdroje, které vám pomohou vytvořit a spravovat váš web.

závěr

Tady je ! Tím končí náš průvodce, jak přizpůsobit WordPress pro zvýšení počtu konverzí. Pokud nějaké máte commentaires nebo návrhy, neváhejte nám to sdělit v sekci vyhrazené pro tyto.

Můžete však také konzultovat naše zdroje, pokud potřebujete více prvků k realizaci projektů vytváření internetových stránek, nahlédněte do našeho průvodce Vytvoření blogu WordPress nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

 Ale především sdílejte tento článek na různých sociálních sítích.

... 

Jak nainstalovat pluginy WordPress

Jak nainstalovat pluginy WordPress

V tomto článku vám ukážeme, jak nainstalovat pluginy WordPress

Jako jeden z nejpopulárnějších systémů pro správu obsahu (CMS) nabízí WordPress velkou flexibilitu a spoustu možností přizpůsobení. Nabízí širokou škálu WordPress pluginů, které vám umožní upravit funkčnost vašeho webu.

WordPress má svůj vlastní adresář, který je dodáván s bezplatnými a prémiovými pluginy. Tyto pluginy vám umožňují přidávat různé funkce, od kontaktních formulářů a personalizovaných zpravodajů až po ukládání webových stránek do mezipaměti a zabezpečení WordPress.

Některé pluginy mohou také upravit váš web WordPress na funkční internetový obchod s a WooCommerce plugin nebo e-learningová platforma s LMS pluginy. Ve skutečnosti můžete dokonce vytvořte si vlastní WordPress plugin.

V tomto tutoriálu vám ukážeme krok za krokem proces instalace pluginů WordPress pomocí tří různých metod.

Na konci tohoto článku také zahrneme několik tipů, kterými se můžete řídit při hledání nových pluginů WordPress pro vylepšení vašeho webu.

Než ale začneme, zjistěte to, pokud jste WordPress nikdy nenainstalovali Jak nainstalovat 7 kroků WordPress blogu et Jak najít, nainstalovat a aktivovat WordPress téma na svém blogu 

Pak zpět k tomu, proč jsme tady.

Jak nainstalovat pluginy WordPress z oficiálního adresáře pluginů

Nejjednodušší způsob, jak nainstalovat pluginy WordPress, je vstoupit do oficiálního adresáře pluginů prostřednictvím vaší administrátorské oblasti WordPress. Tento adresář pluginů WordPress je však omezen pouze na bezplatné možnosti pluginu.

Přihlaste se ke svému panelu WordPress a přejděte na Rozšíření->Přidat. Pokračujte hledáním pluginu v vyhledávací lišta. Můžete také procházet doporučené, oblíbené nebo doporučené pluginy kliknutím na karty vlevo.

jak nainstalovat pluginy wordpress

Například pokud hledáte plugin MonsterInsights, uvidíte, že se objeví jako první výsledek. Klikněte na tlačítko Instalační nyní začněte instalovat plugin.

Počkejte na dokončení procesu a klikněte na tlačítko aktivovat začít používat tento plugin WordPress.

Jakmile plugin aktivujete, zkontrolujte a nakonfigurujte nastavení pluginu tím, že přejdete na Rozšíření -> Nainstalované pluginy. 

Jak ručně nainstalovat pluginy WordPress

Dalším způsobem, jak nainstalovat pluginy WordPress, je ruční nahrání souborů pluginů prostřednictvím řídicího panelu WordPress.

Tato metoda vám umožňuje nainstalovat plugin, který nemusí být v oficiálním adresáři WordPress, ale je dostupný z tržišť třetích stran, např. CodeCanyon et Kodér.

Před zahájením procesu instalace pluginu musíte nejprve stáhnout soubor ZIP pluginu ze zdroje dle vašeho výběru.

Dále přejděte do oblasti správy WordPress a klikněte Rozšíření -> Přidat. Další, lokalizovat T-tlačítkozvýšit prodloužení v levé horní části stránky.

jak nainstalovat pluginy wordpress

Vyberte soubor v počítači ZIP plugin, který chcete stáhnout, a poté klikněte nainstalovat nyní.

jak nainstalovat pluginy wordpress

Počkejte na dokončení instalace pluginu a klepněte na Povolit rozšíření.

jak nainstalovat pluginy wordpress

Použití FTP klienta k instalaci pluginů WordPress

Existuje několik prémiových a vlastních pluginů WordPress, které vyžadují, abyste je instalovali ručně pomocí a FTP klient. Pro začátečníka může být proces o něco složitější, protože se nejprve budete muset naučit, jak nastavit FTP klienta.

Nebojte se, následující průvodce vás provede krok za krokem. Jediné, co musíte udělat, je postupovat podle pokynů.

Za prvé, výpis soubor ZIP pluginu a uložte jej do složky v počítači. Mějte na paměti, že extrahovaná složka souboru pluginu bude ta, kterou budete muset nahrát prostřednictvím FTP klienta.

Poté připojte svůj web k serveru FTP. Chcete-li to provést, vyhledejte podrobnosti o FTP svého poskytovatele hostingu.

Po přihlášení přejděte do svého FTP klienta – pro tento příklad používáme FileZilla. Zde zadejte své přihlašovací údaje a stiskněte tlačítko Rychlé připojení. Poté přejděte na panel vzdálené místo a hledání složku wp-content / plugins /.

V panelu místní webové stránky, nahrajte extrahovanou složku pluginu z vašeho počítače do složku wp-content/plugins/ z vašeho serveru.

jak nainstalovat pluginy wordpress

Po dokončení přenosu se na váš web nainstaluje plugin WordPress.

Chcete-li plugin aktivovat, musíte mít přístup k ovládacímu panelu WordPress. Přejděte do sekce Rozšíření-> Pluginy nainstalovány, vyhledejte plugin a klikněte na aktivovat.

Na co pamatovat při výběru pluginu WordPress?

V adresáři pluginů WordPress je mnoho pluginů a ještě více dostupných na webech třetích stran. Tento počet možností se může zdát ohromující, zvláště pro začátečníky, kteří se snaží zjistit, co je pro jejich web to pravé.

Následující části vám ukážou některé zásadní věci, které je třeba zvážit při výběru pluginu pro váš web.

Pravidelné aktualizace.

WordPress vydává pravidelné aktualizace, aby byl jeho systém stále aktuální. Takto zlepšují výkon, udržují zabezpečení, opravují problémy s chybami a přidávají nové funkce.

Před instalací jakéhokoli pluginu tedy zvažte tyto body:

Ujistěte se, že je pro tu práci vhodný

  • Poslední aktualizace. Výběr pluginu WordPress, který je často aktualizován, vám může zabránit narušení bezpečnosti. Ukazuje také, že vývojáři plugin stále aktivně udržují a vylepšují.
  • Počet instalací. Toto číslo ukazuje, jak populární je zmíněný plugin WordPress. Obecně platí, že čím aktivnější instalace pluginu má, tím lepší je jeho kvalita.
  • Publikum. Uživatelské recenze a komentáře vám mohou pomoci zvážit klady a zápory konkrétního pluginu. Díky tomu získáte přehled o tom, jak plugin funguje v situacích v reálném čase.
  • Kompatibilita. Plugin, který dostává pravidelné aktualizace od svých vývojářů, je obvykle kompatibilní s nejnovější verzí WordPressu. Vždy se podívejte na záložku s popisem, abyste viděli, která verze WordPressu je potřeba ke spuštění pluginu.

Před stažením a instalací jakéhokoli pluginu na váš web WordPress si nezapomeňte zkontrolovat tvrzení vývojářů. Přečtěte si dokumentaci k pluginu, podívejte se na fóra podpory pluginu a přečtěte si recenze.

Prohledávání blogových příspěvků je také dobrým zvykem, protože mnoho webů poskytuje recenze pluginů.

Na BlogPasCher, také kontrolujeme a testujeme pluginy WordPress s různými funkcemi, včetně pluginy menuZásuvné moduly Google Analytics et recenzní pluginy.

...

Nainstalujte jeden plugin najednou

Při testování pluginu ve WordPressu nezapomeňte nainstalovat a otestovat každý plugin samostatně. Tímto způsobem rychle zjistíte, zda to vašemu webu nezpůsobuje nějaké problémy a zda je můžete opravit.

Pokud se rozhodnete otestovat několik různých pluginů na WordPressu, nezapomeňte deaktivovat předchozí plugin, než vyzkoušíte jiný.

Také, když máte několik neaktivních pluginů, je nejlepší je odstranit, protože příliš mnoho instalací může přetížit váš web WordPress a ovlivnit jeho výkon.

Pro každou funkci použijte pouze jeden plugin

Přestože pluginy WordPress přidávají nové funkce a zlepšují funkčnost vašeho webu, příliš mnoho z nich může zpomalit váš web.

Pokaždé, když nainstalujete pluginy WordPress, přidáte na svůj web nový kód. Při nadměrném používání budou pluginy odesílat příliš mnoho požadavků HTTP na načtení svých zdrojů, jako jsou šablony stylů CSS, soubory JavaScript a obrázky, což zpomalí rychlost načítání vašeho webu.

Navíc instalace pluginů WordPress, které provádějí podobnou funkci, může způsobit konflikty a potenciálně poškodit jeden nebo oba pluginy. Nejlepším postupem je tedy nainstalovat plugin WordPress pro každou funkci.

Například, Yoast SEO et AISEO mít podobné sady funkcí – stačí vybrat jednu, abyste předešli konfliktům pluginů.

Doufáme, že vám tento tutoriál pomohl naučit se nainstalovat pluginy WordPress na váš blog nebo web. Nyní máte možnost zlepšit funkčnost svých webových stránek, i když nemáte žádné předchozí technické znalosti nebo dovednosti.

Pokud si nejste jisti, se kterým pluginem začít, zvažte, co vašemu aktuálnímu webu chybí. Dále zkontrolujte dostupné pluginy a porovnejte důležité faktory, jako je kompatibilita, recenze a nejnovější aktualizace.

Zde jsou některé z našich doporučených základních pluginů WordPress, které vám pomohou začít:

  • Yoast SEOTento plugin pomáhá zlepšit váš blogový příspěvek na WordPressu a SEO stránky pomocí optimalizace klíčových slov a meta popisů
  • Elementor ou Beaver Builder. Pomáhá vám vytvořit váš web tím, že poskytuje snadno použitelné rozhraní přetahování.
  • W3 Celkem Cache ou WP Super CacheZvyšuje výkon vašeho webu a zkracuje dobu načítání díky ukládání do mezipaměti a integraci s CDN.
  • Google XML Sitemaps. Automaticky generuje XML sitemapy pro lepší optimalizaci pro vyhledávače.
  • AkismetTento plugin detekuje a filtruje spam ve vašich komentářích a odeslaných kontaktních formulářích, aby zabránil jakýmkoli škodlivým útokům.

Další doporučené zdroje

Zveme vás také, abyste si prostudovali níže uvedené zdroje, abyste se dostali dále do sevření a kontroly nad svým webem a blogem.

závěr

To je vše pro tuto příručku, která vám ukáže, jak nainstalovat pluginy WordPress. Máte-li jakékoli obavy nebo návrhy, dejte nám vědět commentaires.

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 nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Mezitím sdílejte tento článek na různých sociálních sítích.   

...  

Divi: Jak přidat obrázky do Mega Menu

Divi: Jak přidat obrázky do Mega Menu

Chtěli byste mít Mega Menu Divi s obrázky pro ilustraci obsahu menu? Postupujte podle našeho návodu, jak přidat obrázky do Mega Menu?

Milujeme interakci s obrázky online. S ohledem na to má smysl přidat obrázek na svůj web, kdykoli je to možné. 

Přidání obrázků do velkého menu je navíc další skvělou příležitostí, jak poskytnout uživatelům interakci, kterou potřebují.

Obrázky také vylepšují nabídku tím, že přitahují jejich pozornost a dále zjednodušují proces navigace.

přehled

Než se vrhneme na tento tutoriál, podívejme se na výsledek, kterého chceme dosáhnout.

Mega Menu Divi s obrázky

Vytvoření mega menu

Abychom mohli začít, musíme nejprve vytvořit menu. 

Pro tento příklad vytvoříme hlavní nadřazenou položku nabídky s názvem “Mega Menu” se čtyřmi položkami podnabídky níže. Každá ze čtyř položek podřízené nabídky má tři položky podřízené nabídky.

Přejděte na hlavní panel WordPress a klikněte na Vystoupení> Nabídky

Mega Menu Divi s obrázky

Klepněte na tlačítko 'Vytvořit nové menu', pojmenujte jej a klikněte na 'Vytvořit menu'.

Nezapomeňte povolit vlastnost nabídky Třídy CSS kliknutím na kartu možnosti v pravém horním rohu obrazovky Menu a zaškrtněte CSS třídy.

Nyní můžete přidat položky nabídky do nově vytvořené nabídky.

Nejprve vytvořte položku nabídky, která bude rodičem všech ostatních položek nabídky. Toto je odkaz, který zobrazí vaši mega nabídku při najetí myší.

Chcete-li vytvořit tuto položku nabídky, vytvořte vlastní odkaz s následujícími parametry:

  • URL: http://#
  • Název navigace: Mega Menu
  • CSS třídy: mega-menu

Nyní uspořádejte/přetáhněte čtyři položky nabídky (každá se třemi vlastními podpoložkami), aby se staly podpoložkami hlavního nadřazeného odkazu Mega Menu.

Po přidání odkazů do nabídky přejděte dolů na „Nastavení menu' ve spodní části obrazovky nabídky a vyberte 'Hlavní menu' pro umístění zobrazení. Nakonec klikněte na 'Uložit menu'

Naše mega menu zatím vypadá takto:

Mega Menu Divi s obrázky

Přidávání obrázků do mega menu

Nyní, když je nabídka hotová, je čas přidat obrázky.

Čtěte také: Jak převedu blogové příspěvky v DIVI?

Získejte obrázky

Začněte tím, že získáte čtyři obrázky. Tyto obrázky by se měly týkat čtyř položek podnabídky (O nás, poskytování služeb, naše práce a kontaktujte nás).

Pomocí editoru fotografií zmenšete a ořízněte každý obrázek tak, aby byl 500 pixelů široký a 300 pixelů vysoký.

Přidejte tyto obrázky do knihovny WordPress. Klikněte na Média > Přidat.

jak přidat obrázky do Mega Menu

Přetáhněte obrázky na stránku a přidejte je nebo klikněte na 'Vyberte soubory"

jak přidat obrázky do Mega Menu

Vložte obrázky do Mega Menu

Vraťte se na stránku nabídek na hlavním panelu WordPress.

V tomto příkladu je odkaz v horní části prvního sloupce " O "

Klikněte na šipku napravo od položky " O ". Do pole Navigační štítek přidejte požadovaný obrázek pomocí značky html img přímo před textem " O ". Značka obrázku by měla vypadat takto:

<img src=”Insert Image URL” alt=”Alternate Text” width=”100%” />
jak přidat obrázky do Mega Menu

Chcete-li najít adresu URL obrázku, přejděte na Média > Knihovna médií, klikněte na obrázek, který chcete přidat. 

Na vyskakovací obrazovce Podrobnosti přílohy, najděte adresu URL v pravé části a klikněte 'Kopírovat URL do schránky'

jak přidat obrázky do Mega Menu

Nyní se vraťte do konfigurace položky nabídky " O " na stránce nabídky a nahraďte text "Vložit URL obrázku" vložením adresy URL obrázku pomocí ctrl + v.

jak přidat obrázky do Mega Menu

Před opuštěním možností konfigurace pro položku nabídky " O ", najděte textové pole Třídy CSS a zadejte třídu „mega-link“.

To nám umožní později přidat vlastní styl.

Opakujte tento postup pro přidání následujících tří obrázků do každé položky podnabídky s třídou "mega-link". (V tomto příkladu jsou zbývající tři prvky "Dodávka služeb", "Naše práce" et " Kontaktujte nás ".)

Výsledek

Přejděte na svůj web a najeďte myší na odkaz mega menu. Nyní by vaše mega menu mělo vypadat takto:

Mega Menu Divi s obrázky

Všimněte si, že když najedete myší na každý z obrázků, obrázky se zesílí pomocí položky podnabídky přímo pod ním. Je to proto, že obrázek je součástí tohoto odkazu, takže kliknutím na něj se dostanete na přidruženou adresu URL.

Poslední úpravy

Pro tento poslední krok přidejte do nabídky vlastní css, aby bylo písmo textu větší a vycentrované. Také dejte kolem obrázku poloměr okraje, aby vypadal čistěji.

Na hlavním panelu WordPress přejděte na Divi> Možnosti motivu . 

Přejděte dolů do pole Vlastní CSS, níže zadejte CSS a klikněte 'Uložit změny' :

.mega-link > a {
    text-align: center;
    font-size: 20px !important;
    text-transform: uppercase;
    font-weight: 400 !important;
    letter-spacing: 3px;
}
 
.mega-link > a img {
    margin-bottom: 8px; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
 
}

Konečný výsledek

Skončili jste!

Pokud jste postupovali podle všech kroků v tomto tutoriálu, zde je výsledek, který byste měli dostat.

Mega Menu Divi s obrázky

Stáhnout DIVI hned!!!

závěr

Máte k dispozici Divi mega menu s obrázky, aniž byste museli používat plugin. Tento typ nabídky funguje zvláště dobře pro webové stránky elektronického obchodu, které mají hodně obsahu a vyžadují obrázky produktů. Doufáme, že tento tutoriál bude užitečný pro vaše další projekty Divi.

Pokud potřebujete více prvků k dokončení svých projektů tvorby webových stránek, prohlédněte si také našeho průvodce na webu Vytvoření blogu WordPress nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Pokud máte nějaké obavy nebo návrhy, najděte nás v sekci komentářů diskutovat o tom.

Ale mezitímsdílejte tento článek na různých sociálních sítích.

...

Jak přidat vlastní písma na web WordPress

Jak přidat vlastní písma na web WordPress

Chtěli byste se naučit, jak přidat vlastní písma na web WordPress?

Proč dělat váš blog nudným používáním standardních písem? Nechte svůj blog mluvit o vaší živé osobnosti a tématech, která pokrýváte, pomocí široké škály vlastních písem. Vlastní písma jsou skvělou funkcí, díky které bude váš blog vypadat lépe než ostatní.

Přiznejme si to; všichni milujeme blogy a webové stránky se správnými fonty. Nejen, že zdobí web, ale také pomáhají přilákat uživatele k vašemu obsahu. Výběr standardních písem WordPress je však omezený a závisí na motivu, který používáte. Dobrou zprávou je, že je můžete přidat ručně nebo pomocí specializovaných pluginů WordPress.

A zde vyvstávají dvě otázky: kde získat vlastní písma pro WordPress a jak nainstalovat vlastní písma na vašem webu.

Pojďme zjistit.

Proč bych měl používat vlastní písma?

Pryč jsou časy, kdy byly Times New Roman a Georgia považovány za jediné typy písma pro text na webových stránkách. Za posledních pár let se písmový prostor zcela změnil s příchodem písem jako např Google Fonts a další.

Dnes jsou na internetu k dispozici stovky bezplatných písem, informačních a školicích pomůcek a návrhářských zdrojů. Na rozdíl od Adobe Illustratoru, Photoshopu a dalších klasických aplikací vám WordPress nedává plnou kontrolu nad výchozími fonty. Pouze některá témata WordPress se rozhodnou podporovat a používat vlastní písma.

V tomto článku se proto dozvíte, jak najít vhodná vlastní písma a použít je na svém webu WordPress.

Důležitost používání vlastních písem

Ptáte se, proč měnit písma, odsazení slov, řádkování, mezery mezi písmeny nebo sytost písma? Některé studie to však ukazují typografie zlepšuje čtení s porozuměním.

Hodně záleží na konstrukci fontů. Na vědomé i podvědomé úrovni – každý hodnotí obsah webové stránky podle návrhu.

Design písma ovlivňuje čtenáře, i když mu nevěnují pozornost. Vzdát se designu písem znamená vzdát se samotného vývoje! Na tom závisí nálada čtenáře. Písmo usnadňuje čtení nebo nutí uživatele opustit stránku.

Všechny webové prohlížeče obsahují sadu výchozích písem. To znamená, že pokud není font specifikován v CSS stránky, použije se standardní verze. Stále můžete používat výchozí písma, ale uživatelům to znesnadňují. Proto je nezbytné používat vlastní písmo. Pokud vám vaše téma WordPress nedává možnosti změnit písmo, existuje spousta webů a nástrojů, které vám mohou pomoci.

Alternativy písem Google

přidat vlastní písma

Mnoho z vás zná Písma Google. Existuje mnohem více webových stránek, kde najdete krásná písma. Některé z nich jsou zdarma pro osobní použití. Pokud potřebujete komerční využití, budete potřebovat licenci. Písma Google a písma Adobe Edge jsou zdarma. To je důvod, proč nejsou tak jedinečné.

Zde jsou některé další zdroje pro hledání písem pro bezplatné a komerční použití:

  1. TemplateMonster — Na webu TemplateMonster najdete vše, co potřebujete pro webdesign. Existuje také mnoho písem a balíčků písem pro osobní použití za nízkou cenu. Kromě toho, Abychom vám pomohli vybrat, všechna písma prezentovaná na brožurách nebo rámech. Každé písmo je také prezentováno s komerční licencí.
  2. MyFonts — MyFonts aktuálně nabízí největší výběr písem na světě. Ceny se zde však pohybují i ​​ve vyšším segmentu. Takže pokud máte omezený rozpočet, nemusí to být pro vás.
  3. FontSpring — Fontspring prodává nová písma pro komerční použití. Ale téměř v každé rodině lze pro osobní účely použít 1-2 bezplatná písma. K dispozici je také samostatná sekce s bezplatnými fonty. Kolekce je živá. Před stažením si však budete muset pečlivě prostudovat licenční informace pro konkrétní písmo.
  4. Cufonfonts — Je to také obrovská sbírka různých písem. Vyberte libovolný a zobrazí se stránka s podrobnými informacemi o něm. Volných písem je dostatek a jsou rozděleny do jednotlivých sekcí. Systém třídění na CufonFonts je poměrně flexibilní a pohodlný. Součástí je také podpora Webfontu.
  5. Dafont — Další přístupná sbírka 3 bezplatných písem. Většina z nich je určena pouze pro osobní použití. Skvělou funkcí DaFont je systém kategorií. Můžete si vybrat písma ve stylu komiksů, videoher, vintage atd….

Výběr písem je velmi lákavý, protože všechny jsou krásné. Ale neměli byste si moc vybírat. Na webu nepoužívejte více než dvě písma web. Pak bude vzhled vašeho webu konzistentní. Jakmile si vyberete písma, nezapomeňte nahrát soubory pro každý styl, který budete používat (běžné, tučné, kurzíva atd.).

Nyní, když jste vybrali vhodné písmo pro svůj web, pojďme zjistit, jak jej přidat.

Jak přidat vlastní písma do WordPress

Existuje několik způsobů, jak přidat písma na web WordPress:

  1. pluginy : v tomto případě se k usnadnění procesu používají různé pluginy WordPress.
  2. ruční : při použití této metody potřebujete písmo stažené z webu a upravit soubor CSS.
  3. Témata: Mnoho oblíbených motivů má vestavěné možnosti přizpůsobení vašich písem (poznámka – touto možností se nebudeme zabývat, protože proces se bude lišit v závislosti na motivu, který používáte.

Možnost 1 – Změňte písma WordPress pomocí pluginů

Pokud nás nezajímají globální změny, můžeme nainstalovat WordPress pluginy, které změní písma na vašem webu.

Vlastnosti vlastních pluginů písem

Open source software má výhodu pro zájem komunity a WordPress má tuto výhodu také. Několik pluginů WordPress vám umožňuje přidávat vlastní písma. Jak vybrat vhodný plugin, když je jich tolik? Jaké jsou funkce pluginů WordPress s vlastním písmem?

Zde je několik bodů, které je třeba zvážit:

  • Schopnost používat vlastní písmo
  • Schopnost používat více písem
  • Záhlaví a cílové komponenty
  • Bonus: možnost změnit nastavení písma z vizuálního editoru

To je vše. První charakteristika v seznamu je velmi důležitá. Písma můžete stále stahovat z webů jako DaFont, Font Squirrel atd., ale musíte je mít možnost nahrát na WordPress.

Podívejme se na některé pluginy pro WordPress, které umožňují nahrávat vlastní písma.

1. Lepší úžasné písmo

Tento plugin WordPress umožní svým uživatelům automaticky kombinovat nejnovější verzi písem Lepší písmo Awesome s CSS, krátké kódy a další. Kromě toho je tento plugin WordPress automaticky aktualizován.

Úžasné lepší písmo – nejlepší pluginy pro typografii WordPress

Najdete zde funkce: pravidelné aktualizace, generátor zkrácených kódů, kompatibilitu s dalšími pluginy WordPress atd ...

Stáhnout | Demo | Web hosting

2. Google Fonts pro WordPress

Tento plugin WordPress se skládá ze speciálních písem 877, která vám umožní používat všechna písma na vašich webových stránkách WordPress. Díky náhledu v reálném čase vám umožní zjistit, jak bude váš web vypadat, jakmile bude použito písmo. 

Písma Google – nejlepší typografické pluginy WordPress

Kromě toho ji budete moci uložit a upravit na frontendu, když najdete kombinaci, která se vám bude líbit.

Mezi jeho vlastnosti patří: náhled v reálném čase, docela pokročilý SEO, vícejazyčná podpora, podpora dalších 870 + Google Fonts, snadné aktualizace a další.

Stáhnout | Demo | Web hosting

3.Fonts Plugin

Fonts Plugin je bezplatný plugin WordPress, který uživatelům umožňuje přístup ke knihovnám Google Fonts a Adobe Fonts. S tímto pluginem WordPress si můžete vybrat z více než 1000 písem Google a Adobe, používat na svém webu více písem a testovat různé možnosti pomocí funkce náhledu pluginu v reálném čase v přizpůsobení WordPress.

nejlepší pluginy pro typografii wordpress

Chcete-li získat další způsoby přizpůsobení typografie webu, jako je velikost písma, mezery mezi písmeny a výška řádků, můžete upgradovat na prémiovou verzi, Fonts Plugin Pro.Stáhnout | Demo | Web hosting

4. Snadné fonty Google

Easy Google Fonts je jedním z nejlepších pluginů WordPress pro přizpůsobení typografie vašeho webu. Stejně jako plugin Fonts vám umožňuje vybrat si ze stovek písem Google a zobrazit si jejich náhled v nástroji Customizer, než je přidáte na svůj web.

10 WordPress typografických pluginů pro váš blog

Přestože poskytuje přístup k menšímu počtu Google Fonts, je unikátní tím, že umožňuje vytvářet vlastní ovládací prvky a pravidla písem v oblasti pro správu, která se okamžitě objeví v přizpůsobení WordPressu.

Stáhnout | Demo | Web hosting

Možnost 2 – Nainstalujte vlastní písma WordPress ručně

Pomocí direktivy @font-face můžete ke svému webu připojit jedno nebo více písem. Tato metoda má ale svá pro a proti.

výhody:

  • Díky CSS můžete připojit fonty libovolného formátu: ttf, otf, woff, svg.
  • Soubory písem budou umístěny na vašem serveru – nebudete závislí na službách třetích stran.

nevýhody :

  • Pro správné připojení písma pro každý styl musíte zaregistrovat samostatný kód.
  • Bez znalosti CSS se můžete snadno splést.

Ale není to skutečný problém, pokud můžete stačí zkopírovat hotový kód a kde musíte zadat své hodnoty.

Poznámka : Než začnete, ujistěte se vytvořit dětské téma pro váš web. Tímto způsobem můžete provést všechny změny v podřízeném motivu a ponechat hlavní motiv, abyste jej mohli v případě potřeby v budoucnu snadno aktualizovat.

Krok 1: Vytvořte složku „fonts“.

Ve svém dětském motivu vytvořte novou složku „fonts“ pod: wp-content/themes/your-child-theme/fonts

Krok 2. Nahrajte stažené soubory písem na svůj web

To lze provést prostřednictvím ovládacího panelu vašeho hostingu nebo pomocí FTP.

Přidejte všechny soubory písem do nově přidané složky písem: wp-content/themes/ Ve svém dětském motivu vytvořte novou složku „fonts“ pod: wp-content/themes/your-child-theme/fonts které jste vytvořili.

Krok 3. Importujte písma prostřednictvím šablony stylů podřízeného motivu

Otevřít soubor style.css vašeho podřízeného motivu a přidejte následující kód na začátek souboru CSS (za komentář podřízeného motivu):

@font-face{
font-family: 'MyWebFont';
src: url('fonts/WebFont.eot');
src: url('fonts/WebFont.eot?#iefix') format('embedded-opentype'),
url('fonts/WebFont.woff') format('woff'),
url('fonts/WebFont.ttf') format('truetype'),
url('fonts/WebFont.svg#svgwebfont') format('svg');
font-weight: normal;
font-style: normal;
}

kde MyWebFont je název písma a hodnota vlastnosti src (údaje v závorkách v uvozovkách) je jejich umístění (relativní odkazy). Musíme specifikovat každý styl zvlášť.

Protože nejprve připojujeme normální styl, nastavíme vlastnosti font-weight a font-style na normální.

Krok 4. Při přidávání kurzíva, napište následující:

@font-face{
font-family: 'MyWebFont';
src: url('fonts/WebFont-Italic.eot');
src: url('fonts/WebFont-Italic.eot?#iefix') format('embedded-opentype'),
url('fonts/WebFont-Italic.woff') format('woff'),
url('fonts/WebFont-Italic.ttf') format('truetype'),
url('fonts/WebFont-Italic.svg#svgwebfont') format('svg');
font-weight: normal;
font-style: italic;
}

Když je vše při starém, jako jediní připojíme vlastnost font style na kurzívu.

Krok 5. Chcete-li přidat tučné písmo, přidejte následující kód:

@font-face{
font-family: 'MyWebFont';
src: url('fonts/WebFont-Bold.eot');
src: url('fonts/WebFont-Bold.eot?#iefix') format('embedded-opentype'),
url('fonts/WebFont-Bold.woff') format('woff'),
url('fonts/WebFont-Bold.ttf') format('truetype'),
url('fonts/WebFont-Bold.svg#svgwebfont') format('svg');
font-weight: bold;
font-style: normal;
}

Kde nastavíme vlastnost font-weight na tučné.

Nezapomeňte zadat správné umístění souborů písem pro každý styl.

Krok 6. Chcete-li připojit tučnou kurzívu, zadejte následující:

@font-face{
font-family: 'MyWebFont';
src: url('fonts/WebFont-Italic-Bold.eot');
src: url('fonts/WebFont-Italic-Bold.eot?#iefix') format('embedded-opentype'),
url('fonts/WebFont-Italic-Bold.woff') format('woff'),
url('fonts/WebFont-Italic-Bold.ttf') format('truetype'),
url('fonts/WebFont-Italic-Bold.svg#svgwebfont') format('svg');
font-weight: bold;
font-style: italic;
}

No, to je vše. Nyní, když jste ke svému webu připojili čtyři styly písem.

Ale je tu jedna poznámka: toto připojení písem se v Internet Exploreru 8 nezobrazí správně. Útěchou je, že IE8 stále používá jen velmi málo lidí.

Další doporučené zdroje

Zveme vás také, abyste si prostudovali níže uvedené zdroje, abyste se dostali dále do sevření a kontroly nad svým webem a blogem.

závěr

Čeho si uživatelé všimnou jako první, když navštíví váš web? Správně, jeho design! Většina designu spoléhá na správné použití krásných písem. Takže se musíte postarat o design písma vašeho webu. Přidejte kód nebo použijte jeden z výše uvedených pluginů pro vložení nového stylu písma. Jak si to vyberete, je jen na vás.

Ujistěte se, že na stejném webu nepoužíváte více než dvě písma. Protože čím více vlastních písem na web přidáte, tím více se sníží rychlost webu.

To je vše pro tento článek, který vám ukáže, jak přidat vlastní písma na web WordPress. Zveme vás k vyzkoušení. Máte-li jakékoli obavy nebo návrhy, dejte nám vědět commentaires.

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 nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Mezitím sdílejte tento článek na různých sociálních sítích.   

...