Jak vložit posuvník pod hlavičku WordPressu. Jak vytvořit svůj vlastní posuvník obrázků ve WordPressu. Nainstalujte a nakonfigurujte posuvný plugin a prezentaci TheThe Image Slider WordPress

Najít dobrý slider pro WordPress není snadný úkol. Nejnovější data říkají, že pro WordPress existuje 690 slider pluginů. Kdo má tolik času naučit se každý plugin?

Abychom vám pomohli oddělit zrno od plev, zde je přehled a hodnocení 10 nejoblíbenějších bezplatných pluginů pro prezentace vybraných z tohoto seznamu. Tyto posuvníky obrázků byly aktualizovány poměrně nedávno a všechny obdržely zpětnou vazbu od uživatelů WordPress.

Jaký slideshow plugin používáte? Řekněte nám to v komentářích níže.

Meta Slider - posuvník pro WordPress

Meta Slider je zdaleka nejpopulárnějším posuvníkem WordPress s více než 2 miliony stažení.
Má čtyři posuvníky jQuery – Nivo Slider (responzivní, 16 přechodových efektů, čtyři motivy), Coin Slider (čtyři přechodové efekty), Flex Slider 2 (responzivní, dva přechodové efekty, režim kolotoče), Responzivní snímky (responzivní, pouze efekt blednutí) .
Vytvoření nové prezentace je snadné – přidejte obrázek, vyberte posuvník, který chcete použít, a plugin vyplivne krátký kód, který můžete přidat kamkoli na svůj web.
K dispozici je také profesionální verze tohoto pluginu, pokud chcete platit peníze za další funkce.

Posuvník uvolnění

S téměř 650 000 staženími Ulehčení Slider Lite– druhý nejoblíbenější slider plugin.

Tento odlehčený plugin vám umožňuje nastavit velikost a dobu trvání posuvníku a zahrnuje možnost vytvořit interaktivní prezentaci. Má dva přechodové efekty, efekt vyblednutí. Stejně jako u mnoha jiných posuvníků musíte pro přidání posuvníku do příspěvku nebo stránky použít krátký kód.
Pomocí tohoto pluginu můžete vytvořit pouze jednu prezentaci, takže pokud jich chcete mít na svém webu více, budete se muset poohlédnout jinde.

Hladký posuvník

Hladký posuvník Vytváří prezentace obsahu a obrázků s vlastním pozadím a mezerami mezi snímky, které lze umístit kamkoli na váš web.
Mezi funkce pluginu patří responzivní design a šest přechodových efektů. Podporuje také vlastní posuvník, kategorii a posuvníky nejnovějších příspěvků, obsahuje značky šablon, krátký kód a widget.
Nejnovější verze tohoto pluginu nefunguje vždy správně, když je nakonfigurována, může narušit provoz webu. Soudě podle stránky podpory Smooth Slider, mnoho uživatelů mělo s tímto pluginem problémy.

Posuvník WOW

Páni posuvník Je neobvyklé, že k vytvoření prezentace je třeba stáhnout samostatný program, průvodce WOWSlider. Jakmile vyberete obrázky pro prezentaci, můžete je nahrát do pluginu. Chcete-li přidat posuvník kamkoli na svůj web, budete muset zkopírovat a vložit krátký kód.
Webová stránka pluginu obsahuje poměrně komplexní dokumentaci, která vám pomůže, pokud narazíte na nějaké problémy.

vSlider Multi Image Slider pro WordPress

vSlider umožňuje zobrazit neomezený počet jezdců obrázků na vašem webu, i když kolik jezdců je „příliš mnoho“?
Posuvníky můžete na svůj web vložit pomocí krátkého kódu, vlastního widgetu nebo jej použít jako funkci ve vašem motivu.
Plugin obsahuje užitečné často kladené otázky a video tutoriál, který vám vysvětlí, jak nastavit svůj první posuvník. Pokud máte nějaké problémy, pak je pro vás k dispozici také fórum.

SlideDeck 2 Lite responzivní posuvník obsahu

SlideDeck je populární a všestranný plugin, který má ve srovnání s předchozími pluginy pokročilé funkce.
Tato verze Lite nezahrnuje úplnou sadu 14 zdrojů obsahu, jako je Facebook, NexGEN a Gallery, které jsou dostupné ve verzi Premium.
Verze Lite vám však umožní rychle vytvářet prezentace z jakéhokoli obsahu, jako jsou obrázky, nahrávky a videa.

EasyRotator pro WordPress – Slider Plugin

EasyRotator slibuje, že uživatelé získají „krásné, interaktivní rotátory a posuvníky pro svůj web WordPress během několika sekund“, ale ve skutečnosti to vyžaduje určité nastavení. Nejprve budete muset nainstalovat software Flash, abyste mohli vytvářet snímky - nebo rotátory - na vašem PC, což může být nepříjemné. Poté můžete vytvořit nový rotátor v editoru stránek nebo příspěvků. Zkrácený kód můžete také použít k vložení rotátoru na svůj web nebo přidání rotátoru do motivu pomocí příslušné funkce.
Po všech potížích s instalací softwaru Flash můžete zjistit, že to nebude fungovat, když se pokusíte nastavit hlavní posuvník z editoru příspěvků. Malý průzkum ukázal, že tento plugin nefunguje se Safari/Chrome.

Responzivní posuvník WordPress – Soliloquy Lite

Monolog je jedním z nejznámějších sliderů a to z dobrého důvodu – jeho instalace je snadná, nepotřebujete si stahovat Flash program, abyste mohli vytvářet a načítat posuvníky nebo se potýkat s nastavením. Prostě to funguje.
Po přidání obrázků zvolte velikost posuvníku, rychlost a klikněte na Publikovat. Poté musíte zkopírovat výsledný krátký kód na jakoukoli stránku nebo příspěvek, kam chcete nainstalovat posuvník.
Přestože se jedná o verzi Lite, stále má dostatek funkcí, abyste to mohli vyzkoušet.

Cyklonový posuvník 2

Cyklonový posuvník 2 vrátí posuvníky zpět k základům. Nabízí snadnou instalaci, zobrazuje jednoduchý posuvník obrázků a obsahuje funkce, jako jsou zpoždění, velikosti a pauza při najetí.
Plugin podporuje obrázky, YouTube, Vimeo, vlastní HTML a doporučené posuvníky. Přetažením snímků můžete změnit jejich pořadí, posuvníky jsou interaktivní.
Tento plugin má také profesionální verzi.

Responzivní posuvník

Responzivní posuvník je velmi jednoduchý plugin pro prezentace, který vyžaduje určitou konfiguraci, ale díky tomu je jeho použití snadné.
Přidávání nových snímků je snadné a můžete je umístit kamkoli na svůj web pomocí krátkého kódu nebo do motivu pomocí příslušné funkce.
Nastavení umožňuje změnit šířku a výšku posuvníku, přidat přechodový efekt, zpoždění, trvání animace a automatický start.
Tento plugin je určen pouze pro jeden posuvník, takže pokud chcete na svůj web nainstalovat více posuvníků, budete muset použít jiný plugin.

Chytrý posuvník 3

Smart Slider 3 je možná nejlepší posuvník pro WordPress. Velmi výkonný plugin, který má obrovskou sadu nástrojů pro vytváření prezentací, které můžete použít podle svého uvážení, v závislosti na situaci. K dispozici je velká databáze připravených posuvníků, krásných přechodových efektů. Můžete vytvořit celé vstupní stránky pouze pomocí posuvníků, ale to je již ve verzi Smart Slider 3 Pro. Ale když se s tímto pluginem setkáte poprvé, s největší pravděpodobností budete mít potíže s ním pracovat. Vzhledem k tomu, že je velmi snadné se zmást ve velkém počtu karet s nastavením.

Nejoblíbenější a nejlepší posuvník
A vítězové jsou dva: Meta Slider A Chytrý posuvník 3.

Meta Slider je nejen nejstahovanějším slider pluginem, ale také získal nejvyšší hodnocení od uživatelů.
Snadno se používá, má dobrou rovnováhu funkcí a funkcí – a to vše zdarma.

vSlider Posuvník pro více obrázků,SlideDeck 2 Lite A Soliloquy Lite– také skvělé pluginy pro posuvníky, pokud je váš web přetížen obrázky a chcete vytvořit mnoho posuvníků. Tato tři témata jsou zaměřena na profesionály, aby přilákali zákazníky – měli větší prodeje – pomocí bezplatných produktů.

Pokud chcete jen velmi jednoduchý slider bez všech zvonků a píšťalek, pak je Cyclone Slider 2 určitě pro vás skvělým sliderem, který se snadno přizpůsobuje a není zatížen nespočtem nastavení a možností.

Pokud však později budete potřebovat posuvník s větší funkčností a schopností umístit několik posuvníků na vaše stránky, nemůžete přejít přes Meta Slider.

Vážení návštěvníci, vítám vás na stránkách mého blogu, start-luck. Dnes vám řeknu, jak snadné je, a co je nejdůležitější, přidat na svůj web zdarma krásný posuvník. Bude atraktivním designovým prvkem pro jakýkoli článek nebo vynikající alternativou k reklamní jednotce, ze které můžete mít zisk.

Od roku 2013 různé studie předpovídaly, že slidery brzy zmizí z internetu, ale jejich obliba stále nepolevuje. Ať řeknete cokoli, portál „oživí“ a upozorní na informace. Stačí na ně kliknout. Samozřejmě, pokud je posuvník krásný a dobře navržený, ale k tomu se vrátíme později.

Budu mluvit o posuvníku WordPress. Jak přidat na svůj web něco atraktivního a zajímavého rychle, zdarma a bez jakýchkoliv speciálních znalostí. Pojďme diskutovat o tom, zda stojí za to dělat to sami. Dostanete také několik užitečných tipů na plnění.

No, můžeme začít?

Meta Slider

Nejprve bych vám rád řekl o nejlepším pluginu pro web WordPress. Je to vzácný případ, kdy se vám podaří najít něco cenného a zároveň bezplatného.

Pokud si o tom přečtete můj článek, pak si vzpomenete, jak mě některé návrhy pobouřily. Užitečnost z této publikace také stála peníze.

Dovolte mi, abych vám ukázal, jak s programem pracovat.

Instalace

Na mém blogu si tedy můžete přečíst podrobný článek o používání WordPressu. Zopakujme si krátce, co dělat v konkrétní situaci. Přejděte do sekce pluginů a ze seznamu vyberte možnost „Přidat nový“ ve vyhledávací liště v pravém horním rohu, zadejte: „Meta Slider“ a Enter. Jakmile se otevře stránka s požadovanou aplikací, klikněte na „Instalovat“.

Nezapomeňte aktivovat Meta Slider přes záložku "Installed" nebo v okně, které se otevře po instalaci.

V důsledku toho by se v ovládacím panelu napravo měla objevit nová kategorie. Verzi Pro si můžete koupit za 19 dolarů nebo použít tu bezplatnou, její funkce jsou podle mě zcela dostačující, takže nákup není vůbec nutný.

Možnosti

Nyní pojďme zjistit, jak vytvořit a vložit karusel, někdy se tomu také říká posuvník. Přejděte do aplikace pomocí odkazu vpravo (v administračním panelu WordPress) a klikněte na znaménko plus vedle fráze „Přidat nový“.

Můžete nahrát tolik fotek, kolik chcete, ale nedoporučuji to přehánět. Nikdo se nebude příliš dívat. Optimální počet se pohybuje od tří do osmi.

Vpravo od nahraných obrázků je pole, kam můžete zadat adresu stránky, na kterou se člověk po kliknutí na fotku dostane. K obrázkům můžete také přidat popis, oříznout a alt.

Máte také 4 možnosti designu. Ve videu níže vám ukážu, jak každý z nich vypadá.

Verze Pro obsahuje všechny možnosti efektů, tedy jak jeden snímek nahradí jiný, pro každý způsob zobrazení. Bezplatná verze má omezené funkce. Ale je jich stále dost. Najdete dobrou možnost.

Kromě 4 hlavních designových variant si můžete vybrat z jednoho ze čtyř barevných schémat.

K tomu všemu je tu ještě dodatečné nastavení. Pokud chcete dát čtenáři možnost ovládat přetáčení, musíte zaškrtnout políčko vedle slova „Šipky“. Navigace je možná i pomocí bodů. Ujistěte se, že předejte čtečce kontrolu, zejména pokud se jedná o reklamní jednotku.

Pokud jde o velikosti, můžete je dodat. Plugin však není hloupý, vidí maximální omezení a je automaticky integrován do designu. Pokud jej nainstalujete do postranních panelů hlavní stránky, o něco později ukážu, jak to udělat, proporce se automaticky změní.

Následuje „Pokročilá nastavení“. Zde můžete zvýšit nebo snížit dobu trvání snímků a rychlost animace. Neměli by se pohybovat příliš rychle, jinak váš web opustí. Pokud je fotek hodně, je lepší povolit zobrazení obrázků samostatně.

Při změně obrázku lze obrázek rozdělit na několik částí. Nedoporučuji uvádět malé množství. Jinak vám to bude oslňovat oči. No a místo šipek pro přetáčení doporučuji přidat vlastní text.

Na snímku obrazovky níže můžete vidět posuvník, který jsem vytvořil. Pro usnadnění doporučuji použít možnost náhledu. Nabídka vytvoření má vpravo nahoře dvě užitečná tlačítka: Zobrazit pro zobrazení změn a Uložit.

Úplně dole na pravém panelu je shortcode pro vkládání do příspěvků a pro . Pokročilí vývojáři to potřebují a pro začátečníky ukážu, jak dosáhnout stylového efektu pomocí jednoduchých metod. Ale o tom později.

Nejprve se podívejte, jak posuvník vypadá v akci. Vše je samozřejmě potřeba otestovat na vašem vlastním webu, hodně jsem toho promeškal a v tomto videu jsem to neukázal, ale už si můžete udělat přibližnou představu o programu.

Integrace blogu

Vložení vytvořeného kolotoče není složité. K tomu nemusíte nic speciálního kopírovat. Jediné, co jsem v předchozím odstavci zapomněl zmínit, je správné pojmenování vašich posuvníků, abyste se nepletli.

Otevřete příspěvek, ke kterému chcete přidat nový posuvník, nebo vytvořte nový. Dále umístěte kurzor na zamýšlené místo, kde bude umístěn karusel. Nyní klikněte na „Přidat posuvník“, tlačítko se nachází v horní části pracovního pole.

Vyberte požadovaný titul ze seznamu a klikněte na „Vložit prezentaci“.

Připraven. V mém případě to bude na webu vypadat takto.

Chcete-li umístit blok na hlavní stránku, přejděte do kategorie „Vzhled“ - „Widgety“. V horní části uvidíte "Meta Slider".

Přesuňte tuto desku na požadované místo, kde bude umístěn posuvník. Pokud jej chcete vložit ihned po vyhledávání, pak by měl být zde v tomto seznamu. Vyberte posuvník ze seznamu vytvořených a uložte změny.

Na mém testovacím webu vypadá blok vpravo takto.

Design tohoto webu zahrnuje umístění v oblasti obsahu a zápatí, spodní části webu. Pokud sem chci přidat blok, jen přesunu blok na správné místo.

Zobrazení na webu se okamžitě změní.

Na závěr bych vám chtěl dát několik doporučení. Pokud chcete na reklamě vydělat slušné peníze, důrazně doporučuji nešetřit na designu samotných obrázků. Jednomu člověku zabere spoustu času, než pochopí všechny spletitosti marketingu, přečte spoustu knih o vizuální reklamě a zdokonalí své designérské dovednosti.

Dokud se v této oblasti nebudete moci rozvíjet, doporučuji vám uchýlit se k pomoci nezávislých pracovníků. To lze provést na webových stránkách WebLancer.net A FL.ru . První je trochu jednodušší, ale na druhém se můžete setkat se skutečnými profesionály.

Cena závisí na vašem rozpočtu, ale myslím, že obrázek vás bude stát maximálně 500 rublů. Za tuto částku si můžete koupit tři, ale v tomto případě bude méně lidí ochotných objednávku splnit, což znamená, že získáte horší výsledek.

Přeji vám úspěch a pokud se vám tento článek líbil, přihlaste se k odběru novinek. Do příště.

Posuvníky jsou právě teď v módě, a to z dobrého důvodu! Na svůj web můžete přidávat fotografie, obsah, videa a další, které upoutají pozornost návštěvníků. V této lekci se podíváme, jak na to vytvořte si sami krásný slider s obrázky založenými na .

A přestože existuje mnoho pluginů pro posuvníky (mým současným oblíbeným je), neexistuje žádný plugin pro FlexSlider, posuvník, který klávesové zkratky a který funguje s nasunutím dotykové obrazovky.

Stáhněte si zdroje

Nejprve si stáhněte zdroje s kódem, který budeme brzy potřebovat.

Takto bude vypadat samotný posuvník:

Krok 1. Příprava

První věc, kterou musíme udělat, je nainstalovat plugin. Vytvořte složku /envato-flex-slider/ a v něm je soubor s názvem „ envato-flex-slider.php'. Zde přidáme všechny potřebné informace a kód pro náš plugin, počínaje blokem deklarace pluginu:

Také chci nainstalovat několik konstanty pro informaci, který budu v pluginu často používat. Pod deklarací bloku, ale před uzavírací značkou php, přidávám následující informace:

Define("EFS_PATH", WP_PLUGIN_URL . "/" . plugin_basename(dirname(__FILE__)) . "/"); define("EFS_NAME", "Envato FlexSlider"); define("EFS_VERSION", "1.0");

Vytvořil jsem tři konstanty: cesta k pluginu, název pluginu A verze pluginu, který je nezbytný pro aktualizace a pro upozornění Adresáře pluginů WordPress v případě potřeby o změnách.

Vezměte prosím na vědomí, že všechny své konstanty začínám " EFS". Totéž udělám s názvy funkcí, abych nevytvářel konflikty s jinými pluginy nebo jádrem WordPressu.

Nyní, když jsme s přípravou hotovi, přidejte soubory a kód FlexSlider.

Krok 2. Přidejte

Nyní je čas přidat důležitou část: javascript A CSS pro FlexSlider. To provedeme pomocí wp_enqueue_script A wp_enqueue_style WordPress sám, aby se předešlo konfliktům. Můžete si stáhnout FlexSlider Tady. Budeme potřebovat 2 soubory: jquery.flexslider-min.js, a , ve složce /téma/.

Wp_enqueue_script("flexslider", EFS_PATH."jquery.flexslider-min.js", array("jquery")); wp_enqueue_style("flexslider_css", EFS_PATH."flexslider.css");

Na obou řádcích dáme každému skriptu název a poté propojíme soubory .js a .css. Vezměte prosím na vědomí, že používáme naši konstantu ESF_PATH. Musíme použít úplnou cestu, jinak se soubory nebudou správně propojovat.

Můžete si také všimnout, že máme třetí parametr wp_enqueue_script. Toto je řada dalších skriptů, na kterých závisí náš skript. V tomto případě existuje pouze jeden takový skript - tento JQuery. Tady je úplný seznam skripty, které jsou součástí WordPressu. Můžete použít kteroukoli z nich pomocí zadaného pole závislostí.

Další věc, kterou chceme udělat, je povolit skutečný JavaScript, díky kterému bude skript fungovat. Uděláme to pomocí vlastní funkce a Akce-funkce WordPress.

Funkce efs_script() ( print " "; ) add_action("wp_head", "efs_script");

Důležitá linie je zde add_action("wp_head", "efs_script"); který spustí naši funkci efs_script() když se volá wp_head. Naše funkce jednoduše vydává Javascript potřebný k tomu, aby FlexSlide dělal svou práci.

Můžete si všimnout, že používám ‘ JQuery"místo tradičního" $ ', který se běžně používá ve skriptech JQuery. Dělám to proto, aby náš skript nebyl v konfliktu s jinými knihovnami JavaScriptu, např. Spisovný.

Nakonec stačí zkopírovat složku /téma/ do vaší složky /envato-flex-slider/.

Krok 3: Shortcode a Template Tag

Dále vytvoříme naše krátký kód(krátký kód, krátký kód) a značku šablony. Zkrácený kód umožní uživatelům vložit posuvník do jakékoli stránky nebo příspěvku. Pro úvodní průvodce krátkými kódy se můžete podívat Tady.

Značka šablony umožní vývojářům motivů vložit posuvník přímo do jejich motivů. Jako vývojář motivu považuji za nesmírně důležité vytvořit obojí a snadno je zpřístupnit v dokumentaci. Nikdy nevíte, kdo váš plugin použije.

Funkce efs_get_slider())( //Toto doplníme později. ) /**přidejte krátký kód pro posuvník- pro použití v editoru**/ funkce efs_insert_slider($atts, $content=null)( $slider= efs_get_slider ( ); return $posuvník ) add_shortcode("ef_slider", "efs_insert_slider" /**přidat značku šablony- pro použití v tématech**/ funkce efs_slider() ( print efs_get_slider(); )

Nyní tento kód vypadá docela jednoduše. Pro krátký kód nazýváme naši obecnou funkci efs_get_slider() a vrátit výsledek. Pro značku šablony vypíšeme výsledek. Záměrně mi chyběla realizace efs_get_slider(), protože jsme ještě nezjistili, odkud obrázky získáme.

Aby bylo přidávání libovolného počtu obrázků do posuvníku uživatelsky přívětivé, vytvoříme samostatný typ příspěvku.

Krok 4: Vlastní posuvník Typ příspěvku obrázku

První věc, kterou uděláme, je vytvořit nový soubor s názvem „ slider-img-type.php', kde bude veškerý náš kód pro vlastní typ příspěvku. Nejprve uděláme nějakou přípravu jako u pluginu.

Jak můžete vidět, vše, co jsem zatím udělal, je vytvořit několik konstanty(což bude velmi užitečné pro složitější typy vlastních příspěvků) a přidána podpora miniatur pro náš nový typ.

Jediná další věc, kterou zde uděláme, je registrace nový vlastní typ příspěvku. Více o vlastních typech příspěvků najdete v praktickou tvorbu skvělé portfolio. Těsně před uzavřením php tag, přidáme následující kód:

Funkce efs_register() ( $args = array("label" => __(CPT_NAME), "singular_label" => __(CPT_SINGLE), "public" => true, "show_ui" => true, "capability_type" => " post", "hierarchical" => false, "rewrite" => true, "supports" => array("title", "editor", "thumbnail")); register_post_type(CPT_TYPE , $args); ) add_action(" init", "efs_register");

Vytvořili jsme funkci pro registraci vlastního typu příspěvku, který používá bloky nadpisů, úprav a miniatur. Dále jsme přidali Akční WordPress zavolat tuto funkci ihned po inicializaci WordPressu.

Všechno! Poslední věc, kterou musíme udělat, je zahrnout náš nový soubor přidáním require_once("slider-img-type.php"); PROTI envato-flex-slider.php. Přidal jsem to přímo nad volání do našich skriptů.

Nyní, když víme, jak vložit obrázky do posuvníku, vraťme se a vyplňte naši obecnou funkci posuvníku.

Krok 5. Generování posuvníku

Zpět na inzerát efs_get_slider() a nahradit //Toto doplníme později na následující:

"; $efs_query= "post_type=slider-image"; query_posts($efs_query); if (have_posts()) : while (have_posts()) : the_post(); $img= get_the_post_thumbnail($post->ID, "large "); $slider.="
• ".$img."
"; endwhile; endif; wp_reset_query(); $slider.= "

"; vrátit $posuvník;

První dva řádky jsou povinné kvůli způsobu fungování. Bude trvat neuspořádaný seznam s názvem „ diapozitivy' uvnitř vrstvy '' a použije ji na ni javascriptová animace. V našem CSS také definován a ul.skluzy.

Poté vytvoříme smyčku WordPress, která shromažďuje všechny podobné příspěvky slider-image(náš vlastní typ příspěvku) a zobrazte větší verzi obrázku.

Několik poznámek

• S naším novým vlastním typem příspěvku můžeme přidat název a obrázek a také jsme přidali blok pro úpravy příspěvku. A přestože v současné době používáme pouze obrázek (a název pro atribut alt), zahrnuli jsme i editor pro případ, že bychom například v budoucnu chtěli podporovat umístění titulku na posuvník.
• Přidání nového příspěvku jako like Obrázek posuvníku, musíme načíst obrázek miniatury, aby posuvník fungoval. Nemůže si jen tak vzít soubor připojený k příspěvku.

Krok 6. Testování

Nyní je čas na testování! Jakmile do vlastního typu příspěvku přidáte nějaké obrázky, vytvořte nová stránka(Právě jsem nazval můj Slider) a přidejte k němu náš nově vytvořený krátký kód. Uložte stránku a zobrazte ji. Měli byste vidět něco takového:

Závěr

To je vše. Samozřejmě je ještě pár věcí, které by se v pluginu daly vylepšit. Například přidání podpory pro možnosti pokročilého přizpůsobení, které může FlexSlider nabídnout, nebo přidání podpory pro tituly.

Jak již bylo řečeno, tento plugin vám poskytuje vše, co potřebujete k vytvoření opravdu jednoduché, snadno ovladatelné a snadno vložené verze pro WordPress!

Pokud si nejste jisti vkládáním nebo přidáváním souborů, můžete si zdroje stáhnout z odkazu v horní části průvodce. Hodně štěstí!

Posuvník je jedním z těch prvků, které vidíte téměř na každém webu. Snadno se implementují a téměř vždy vypadají skvěle, pokud použijete působivé obrázky. Navíc můžete s posuvníkem WordPress dělat zábavné věci, jako je přidávání přechodových efektů.

Posuvníky však nejsou funkcí WordPressu, takže k jejich přidání budete potřebovat pluginy. V tomto článku vás naučíme, jak to udělat ve třech krocích:

1. Nainstalujte posuvník WordPress a přidejte média, která chcete použít.
2. Přizpůsobte si posuvník pro WordPress.
3. Umístěte nový posuvník tam, kde ho chcete zobrazit.

Jakmile to bude hotové, představíme vám také některé z nejlepších posuvných pluginů WordPress, abyste věděli, jaké máte možnosti. Jdeme na to!

Proč potřebujete posuvník pro WordPress

Posuvníky jsou jednoduché funkce, ale pokud vyberete správné obrázky, mohou vypadat úžasně.

Posuvník (neboli karusel pro WordPress) je vlastně docela jednoduchá funkce. Posuvník je kolekce obrázků, které otáčíte pomocí tlačítek nebo čekají na automatický přechod. Jinými slovy, je to prezentace obrázků.

S posuvníkem toho však můžete udělat mnohem více. Můžete do něj také přidat zábavné přechodové efekty, změnit jeho text, vytvořit jedinečná tlačítka a mnoho dalšího. Stručně řečeno, existuje mnoho způsobů, jak přejít od nudného obyčejného posuvníku k něčemu, díky čemu vaše webová stránka skutečně vynikne.

Pokud jde o Když Má smysl používat posuvníky, záleží na vašem webu a cílech. Mnoho webových stránek používá takzvané „hrdinské“ posuvníky, které jsou umístěny v horní části webové stránky jako alternativní záhlaví. Příklad v akci můžete vidět na začátku této části.

Kromě těchto posuvníků můžete také zveřejňovat zákaznické recenze, například takto:

Nakonec jsou posuvníky skvělým doplňkem téměř všech webových stránek. Nejlépe se však používají pro praktické účely, jako je zobrazení velkého množství obrázků na malém prostoru, spíše než jen jako dekorace. Také dodávají vašemu webu trochu pěkné interaktivity, což je skvělý způsob, jak zvýšit zapojení uživatelů.

Jak vytvořit posuvník pro WordPress (ve 3 krocích)

V několika následujících částech vám ukážeme, jak vytvořit posuvník pro WordPress pomocí Master Slider. Tento plugin jsme vybrali, protože se snadno používá, nabízí mnoho skvělých funkcí a umožňuje vám nainstalovat tolik posuvníků, kolik chcete.

Poté vám představíme některé kolotočové pluginy WordPress, které můžete použít, a povíme si více o samotném Master Slider. Mezitím si nainstalujte Master Slider a začněte!

Krok 1: Nastavte posuvník WordPress a přidejte média, která chcete použít

Jakmile plugin aktivujete Hlavní posuvník, najdete na svém panelu novou kartu Master Slider. Zde uvidíte seznam všech vašich posuvníků WordPress (který by měl být nyní prázdný). Pokračujte a stiskněte tlačítko Vytvořte nový posuvník:

Plugin se vás zeptá, jaký typ posuvníku chcete nainstalovat. Můžete si vybrat z osmi možností, včetně vodorovných posuvníků s miniaturami a bez nich:

V tomto tutoriálu nastavíme jednoduchý vlastní posuvník, abyste viděli, jak celý proces funguje. Vyberte tedy tuto možnost a klikněte na tlačítko VYTVOŘIT.

Plugin vás poté pošle na kartu SNÍMKY váš nový prvek. Zde můžete přidat všechny obrázky, které chcete zahrnout do posuvníku, pomocí WordPress Media Uploader nebo vybrat existující obrázky z vaší knihovny:

Po přidání několika fotografií se karta SNÍMKY by měl vypadat nějak takto:

Vaše obrázky jsou připraveny k použití. Nechte tuto kartu otevřenou a přejděte k dalšímu kroku.

Krok 2: Přizpůsobte si WordPress Slider

Poté můžete přizpůsobit způsob, jakým váš posuvník WordPress funguje. Chcete-li to provést, přejděte do sekce Pozadí v záložce SNÍMKY. Pro každý ze snímků si můžete přizpůsobit jedinečné pozadí pomocí zvoleného obrázku a libovolných barev a textu, které se vám líbí:

Právě teď nastavíme jednoduchý posuvník WordPress pomocí všech obrázků, které jsme nahráli. Pokud posouváte dolů, uvidíte, jak se každý obrázek zobrazí na posuvníku. Nechybí ani tlačítko Náhled, kterou můžete vybrat, abyste viděli, jak je tvarován váš posuvník WordPress:

Až budete hotovi, musíte přejít na kartu OVLÁDÁNÍ POSUVNÍKŮ. Zde si můžete vybrat, jaký typ ovládacích prvků bude váš posuvník používat. Výchozí nastavení je tzv Šipky a pravděpodobně uhodnete, jak vypadají:

Samozřejmě si můžete vybrat libovolné schéma ovládání. Poté musíte přejít na kartu NASTAVENÍ POSUVNÍKU, kde si můžete dále přizpůsobit svůj posuvník WordPress.

Najdete zde například možnosti, které vám umožní upravit šířku a výšku posuvníku. Můžete nastavit název, který se zobrazí na kartě Hlavní posuvník:

Pokud posunete trochu dále, můžete do posuvníku přidat i jednoduché přechodové efekty. Mějte na paměti, že bezplatná verze Master Slider obsahuje pouze dva efekty: Normální A Slábnout. Doporučujeme první možnost, protože nabízí elegantní přechod pro váš posuvník WordPress:

Nakonec si můžete také pohrát se skiny posunutím dolů do sekce Vzhled. Jedná se o šablony posuvníků, které umožňují měnit jeho vzhled.

V našich příkladech jsme zatím ukázali výchozí vzhled, ale existují další skvělé možnosti, se kterými si můžete hrát. Můžete se dokonce dostat do posuvníků WordPress, pokud se vám líbí tyto věci:

Jakmile dokončíte přizpůsobení stylu posuvníku WordPress, klikněte na tlačítko Uložit změny a přejděte k poslednímu kroku.

Krok 3: Umístěte nový posuvník tam, kde ho chcete mít

Nyní je váš posuvník WordPress připraven, zbývá jej pouze umístit na váš web. Proces je jednoduchý, protože plugin Master Slider generuje krátký kód pro každý posuvník, který vytvoříte.

Chcete-li najít tyto zkratky, přejděte na kartu Hlavní posuvník na panelu nástrojů a podívejte se pod sloupec Shortcode:

Zkopírujte krátký kód pro posuvník, který chcete umístit na svůj web, a poté otevřete editor stránky nebo příspěvku, kam jej chcete umístit. Jednoduše vložte krátký kód tam, kde chcete, aby se zobrazil váš posuvník WordPress, jako v příkladu níže:

Pokud zkontrolujete svou stránku, měla by v rozhraní vypadat nějak takto:

Nezapomeňte, že pomocí pluginu Master Slider můžete vytvořit tolik posuvníků, kolik chcete. Na kartě můžete dokonce odstranit ty, které již nechcete používat Hlavní posuvník stisknutím tlačítka Vymazat vedle kteréhokoli z nich:

Nyní můžete začít vytvářet nejlepší posuvník WordPress pro svůj web! Než však skončíme, podívejme se na několik alternativních možností pluginu.

5 nejlepších pluginů pro posuvníky WordPress

Jeden z nejlepších posuvných pluginů WordPress jsme již viděli v akci. Se všemi jeho funkcemi jsme vás však ještě neměli možnost seznámit. Udělejme to nyní a pak vám ukážeme některá další nejlepší řešení, která můžete použít, pokud vám Master Slider nevyhovuje.

1. Hlavní posuvník

Master Slider již znáte, pojďme tedy rovnou k tomu, co jste o pluginu možná nevěděli. Spolu se schopností vytvářet posuvníky WordPress poskytuje tento plugin také plnou odezvu. Funguje s dotykovou navigací, takže je ideální pro mobilní weby a je vytvořen pro spolupráci s vyhledávači.

Klíčové vlastnosti:

• Vytvořte tolik posuvníků, kolik chcete.
• Přidejte posuvníky na své stránky WordPress pomocí krátkých kódů.
• Přizpůsobte styl posuvníku a přechodové efekty.
• Ujistěte se, že vaše posuvníky plně reagují bez jakéhokoli dalšího přizpůsobení.
• Optimalizujte obsah svých posuvníků pro vyhledávače.

Cena: Můžete vyzkoušet bezplatnou verzi Master Slider nebo si vybrat plnou prémiovou verzi.

2. Inteligentní posuvník 3

Smart Slider 3 nabízí mnoho stejných funkcí jako Master Slider. Má však také živý editor přetahování, který můžete použít k vytváření posuvníků. Pokud jste typ člověka, který si rád přizpůsobuje prvky svého webu pomocí nástroje pro tvorbu stránek spíše než seznamů přizpůsobení, tento plugin by mohl být skvělou volbou.

Kromě této funkce Smart Slider 3 také zajišťuje, že vaše posuvníky jsou ve výchozím nastavení připraveny k použití i bez jakýchkoli dalších nastavení. Navíc obsahuje několik šablon, které můžete použít k rychlému přizpůsobení motorů.

Klíčové vlastnosti:

• Vytvořte posuvníky WordPress pomocí editoru drag-and-drop.
• Spolu s pluginem používejte tvůrce stránek třetích stran, jako je Divi a Beaver Builder.
• Nastavte posuvníky na výchozí.
• Vyberte si z několika šablon, abyste mohli své posuvníky rychle zprovoznit.
• Přidejte do obsahu snímků nějaká písma.

Cena: Smart Slider 3 nabízí bezplatnou základní verzi a několik placených úrovní.

3.MetaSlider

Pokud jde o posuvné pluginy WordPress, jen málo z nich je tak populárních jako MetaSlider. S téměř 1 000 000 aktivními instalacemi v době publikování tohoto článku je na vrcholu potravinového řetězce pluginů.

I když MetaSlider nemá úhledné rozhraní ostatních pluginů, které jsme dosud zkontrolovali, boduje, pokud jde o snadné použití. Přidávání snímků je snadné, stejně jako jejich přeskupování, přidávání textu a dokonce i optimalizace jejich metadat. S jinými pluginy může veškerá tato práce chvíli trvat, ale MetaSlider to usnadňuje jednoduchým a intuitivním rozhraním.

Klíčové vlastnosti:

• Nainstalujte několik posuvníků WordPress.
• Rychle přidávejte snímky a změňte jejich pořadí.
• Přidejte text na své snímky a proveďte nějakou optimalizaci pro vyhledávače (SEO).
• Přizpůsobte si přechodové efekty vašich posuvníků.
• Přidejte posuvníky na kteroukoli ze svých stránek pomocí krátkých kódů.

Cena: MetaSlider je zdarma v adresáři pluginů WordPress, nebo můžete získat prémiovou licenci s několika dalšími funkcemi.

4. Posuvník od WD

Pokud jste typ člověka, který si rád přizpůsobuje každý malý detail svého webu, pak Slider by WD může být pro vás to pravé. Má mnoho funkcí, které jej odlišují od ostatních posuvných pluginů, jako je podpora více snímků, responzivní design a další.

Plugin skutečně vyniká v tom, kolik úprav můžete provést pro každý ze svých snímků. Můžete si například pohrát s jejich velikostmi, barvami a přechodovými efekty. Můžete dokonce importovat a exportovat posuvníky a zkopírovat je z jednoho webu na druhý. Nakonec plugin obsahuje možnost vodoznaku vašich obrázků, což se může hodit, pokud potřebujete ochránit své původní dílo.

Klíčové vlastnosti:

• Nainstalujte mobilní posuvníky WordPress.
• Získejte přístup k široké škále nastavení vašich posuvníků.
• Vodoznak na snímky, abyste je ochránili před krádeží.
• Importujte a exportujte posuvníky, abyste je mohli kopírovat z jednoho webu na druhý.

Cena: Bezplatná verze Slider WD je spolehlivý nástroj, i když můžete také upgradovat na prémiovou licenci.

5. Posuňte cokoliv

Všechny pluginy, o kterých jsme mluvili, se zatím primárně zaměřují na obrázky. Jak jsme však zmínili dříve, posuvníky WordPress můžete použít i pro jiné účely. Můžete prezentovat recenze zákazníků a další.

Plugin Slide Anything vám umožňuje nastavit posuvníky pomocí téměř jakéhokoli typu obsahu, který chcete. Spolu s obrázky a textem vám také umožňuje používat HTML a dokonce i krátké kódy, které mohou vytvářet zábavné kombinace. Navíc tento plugin obsahuje některé zábavné funkce, jako je nekonečné posouvání (takže váš posuvník se zacyklí). Tento plugin má také celou sbírku skvělých přechodových efektů a mnoho dalšího.

Klíčové vlastnosti:

• Nastavte posuvníky pomocí libovolného typu obsahu, který chcete.
• Vyberte si z několika přechodových efektů pro vaše snímky.
• Použijte krátké kódy ve svých posuvnících.

Cena: Slide Anything Pro můžete vyzkoušet zdarma nebo získat přístup k několika dalším funkcím (jako jsou vyskakovací okna) s prémiovou verzí.

Závěr

Existuje důvod, proč jsou posuvníky tak oblíbené. Stačí vybrat několik obrázků, přidat přechodový efekt nebo dva a možná vložit nějaký text a máte prvek, který vypadá skvěle kdekoli na vašem webu (zejména jako záhlaví). S WordPress si můžete snadno přizpůsobit svůj posuvník pomocí svého oblíbeného pluginu. Jsme nakloněni Master Slider kvůli jeho bohatství funkcí, ale existuje mnoho dalších skvělých možností.

Máte již zkušenosti s přizpůsobením posuvníku WordPress? Řekněte nám o tom v sekci komentářů níže!