Nedávno se nás jeden z našich čtenářů zeptal, jak přidat efekt paralaxy k jakémukoli tématu WordPress?
Efekt Paralaxy je v dnešní době oblíbeným trendem na webu, kde se obrázek na pozadí posouvá pomaleji než obsah v popředí.
V tomto tutoriálu vám ukážeme, jak snadno přidat efekt paralaxy na jakékoli téma WordPress.
Ale pokud jste nikdy nenainstalovali WordPress, objevte to Jak nainstalovat 7 kroků WordPress blogu et Jak najít, nainstalovat a aktivovat WordPress téma na svém blogu
Ale zpět k tomu, proč jsme tady.
Co je paralaxový efekt?
Efekt Paralaxy je moderní technika webového designu, kde se prvek pozadí posouvá pomaleji než obsah popředí. Tento efekt dodává obrázkům na pozadí hloubku a činí je interaktivními.
Objevte naše Témata 25 WordPress s parallaxem vytvářejí webové stránky
Efekt Paralaxy lze použít na Vstupní stránky, prodejní stránky nebo domovská stránka firemního webu. Je to skvělý způsob, jak zvýraznit různé sekce na dlouhé stránce.
Mnoho prémiová témata WordPress mít na své domovské stránce zabudovaný paralaxní efekt. U většiny pluginů můžete také použít efekt paralaxy WordPress vizuální tvorba stránek.
Nicméně, všichni Témata WordPress nenabízí vestavěný efekt paralaxy a možná nebudete chtít používat vizuální tvůrce stránek pouze pro efekt paralaxy.
Pojďme se podívat na to, jak snadno přidat efekt paralaxy na jakékoli téma WordPress.
Metoda 1: Přidejte efekt paralaxy k libovolnému tématu WordPress pomocí pluginu
Tato metoda nevyžaduje přidání žádného kódu do motivu WordPress. Je to jednodušší a doporučené pro většinu uživatelů.
První věc, kterou musíte udělat, je nainstalovat a aktivovat plugin Pokročilé pozadí WordPress, Pro více informací, podívejte se na našeho průvodce krok za krokem, jak nainstalovat plugin WordPress.
Po aktivaci pluginu musíte upravit stránku, na kterou chcete přidat efekt paralaxy. Všimnete si nového tlačítka "Pokročilé pozadí WordPress»Na panelu nástrojů vizuálního editoru.
Kliknutím na něj se zobrazí vyskakovací okno, kde můžete změnit různá nastavení pozadí, která chcete přidat.
Nejprve musíte vybrat obrázek jako pozadí a poté zaškrtnout možnost „ Stretch".
Pak musíte kliknout na tlačítko Vyberte obrázek Chcete-li stáhnout nebo vybrat obrázek, který chcete použít. Ujistěte se, že používáte velký obrázek, jinak se bude jevit jako pixelovaný.
Poté musíte efekt aktivovat Parallax Výběrem typu efektu paralaxy. Existuje řada stylů, se kterými můžete experimentovat. Nejběžnějším použitým paralaxovým efektem je rolování.
Kliknutím na tlačítko Vložit pokračovat.
Plugin přidá zkrácený na tvé vydavatel, Vypadá to takto:
[Nk_awb awb_type = "image" awb_stretch = "true" awb_image = "22" awb_image_size = "full" awb_parallax = "scroll" awb_parallax_speed = "0.5" awb_mouse_parallax = "true" awb_mouse_parallax_size = "30" awb_mouse_parallax_speed = "10000"] Váš obsah zde [/ nk_awb]
Nahradit “ tento obsah Podle vlastního obsahu pak stránku uložte.
Můžete navštívit svůj web a vidět je v akci.
Metoda 2: Přidejte efekt „Parallax“ k libovolnému tématu WordPress pomocí CSS
Tato metoda vyžaduje, abyste měli určité znalosti o „HTML / CSS“ a také o tom, jak fungují motivy a pluginy WordPress.
Nejprve je třeba nahrát do své mediální knihovny WordPress obrázek, který chcete použít pro efekt paralaxy, návštěvou „ média> Přidat nové ".
Jděte dále objevováním Jak uspořádat média na svém blogu WordPress
Po nahrání obrázku musíte zkopírovat adresu URL obrázku úpravou obrázku v mediální knihovně WordPress.
Poté musíte přidat následující kód HTML na stránku, kde chcete zobrazit paralaxový efekt. Tento HTML kód můžete také přidat do svého WordPress téma nebo vaše dítě téma.
div class = "paralaxa"> Váš obsah zde ...
Poté je třeba do motivu WordPress přidat následující vlastní kód CSS.
.parallax {pozadí-obrázek: url ("http://example.com/wp-content/uploads/2017/08/my-background-image.jpg"); výška: 100%; příloha na pozadí: opraveno; pozici pozadí: střed; opakování pozadí: neopakovat; velikost pozadí: obálka; margin-vlevo: -410px; margin-right: -410px; } .parallax-content {šířka: 50%; okraj: 0 auto; Barva: #fff; padding-top: 50px; }
Nezapomeňte nahradit adresu URL obrázku na pozadí vlastním obrázkem.
Nyní můžete uložit změny a navštívit svůj web.
Tady je ! Nyní můžete na svůj web WordPress přidat efekt paralaxy.
Objevte také některá témata a prémiové doplňky WordPress
Můžete použít jiné WordPress pluginy poskytnout moderní vzhled a optimalizovat práci s vaším blogem nebo webem.
Nabízíme vám zde prémiové doplňky WordPress, které vám to pomohou.
1. Dárcovství WooCommerce
Prostřednictvím tohoto rozšíření přijměte dary na svém webu WooCommerce v částkách specifikovaných zákazníky. Mohou pak dát tolik, kolik chtějí. Každý dar může být prezentován jako jakýkoli obvyklý produkt WooCommerce.
Pokud zákazník přeskočí stránku košíku nebo přejde přímo k pokladně bez poskytnutí daru, zobrazí se nad stránkou pokladny odkaz, aby mohl darovat.
Každý krok používání daru WooCommerce je vysvětlen v dokumentaci se snímky obrazovky. Stačí aktivovat plugin a v košíku najdete pole „Přidat dar“.
Stáhnout | Demo | Web hosting
2. LinkedIn Více
LinkedIn Plus je a WordPress Plugin který vám umožní prezentovat váš LinkedIn profil na vašem blogu. Funguje také pro blogy s více autory. Do vašich příspěvků, stránek nebo widgetů WordPress přidává tlačítka Sledovat a Sdílet.
Je to skvělý způsob, jak do svého blogu přidat všechny funkce LinkedIn a ověřit svou značku u spotřebitelů. Dává vám možnost přizpůsobit jeho vzhled, konfigurovat nastavení a aktivovat další pokročilé možnosti propagace vašeho profilu pro potenciální náboráře nebo zaměstnavatele.
Stáhnout | Demo | Web hosting
3. YouTuber
YouTubeR je a WordPress Plugin unikátní platforma, která vám umožňuje nahrávat videa na YouTube z vašeho webu a snadno vkládat videa, seznamy videí a kanály YouTube na váš web.
Pomocí tohoto pluginu máte na svém webu možnost vytvořit výjimečné videogalerie.
Jeho další vlastnosti jsou: možnost snadno nahrajte videa na YouTube z vašeho webu WordPress, integrace snadná videa, seznamy skladeb a kanály YouTube na váš web, podpora pro Visual Composer, The nekonečné posouvání v seznamech skladeb, vynikající ukládání do mezipaměti, pohotové rozložení, podrobná dokumentace a další.
Stáhnout | Demo | Web hosting
Doporučené zdroje
Zjistěte další doporučené zdroje, které vám pomohou vytvořit a spravovat váš web.
- Jak opravit chybu „Nelze zapisovat na disk“ na WordPress
- Jak se stát úspěšným bloggerem a vydělávat peníze pomocí WordPress
- Jak publikovat své články e-mailem na WordPress
- Jak se stát úspěšným bloggerem a vydělávat peníze pomocí WordPress
Proč investovat do čističky vzduchu?
To je vše! Doufáme, že to velmi pomohlo. 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.
A pokud máte nějaké návrhy nebo připomínky, nechte je v naší sekci commentaires.
...