WordPress Plugin#11 Jednoduchá animace textu Plugin: Text Block
Na tento plugin jsem narazil, při hledání jednoduchého způsobu jak animovat text. Modul je jednoduše nastavitelný a přívětivý i pro nezkušeného uživatele. Ukážu vám jak jednoduše s pluginem pracovat a na konci stránky jsem pro ukázku doplnil všechny animace které lze pomocí tohoto pluginu dosáhnout.
ANIMATED TEXT BLOCK wordpress.org#
Obsah návodu:
- Přidat animovaný textový blok:
- Nastavení/Možnosti:
- Nastavení postranního panelu:
- Nastavení animovaného textu / Hlavní nastavení:
- Styl animovaného textu:
Přidání animovaného text bloku:
Ve svém Gutenbergovém editoru najděte položku „animovaný text“ a vložte jej na stránku, stejně jako všechny ostatní bloky.
Nastavení/Možnosti:
Nastavení postranního panelu:
Vyberte blok, v pravém postranním panelu, kde uvidíte možnost nastavení. Existují dvě možnosti na výběr General a Style.
- V částiGeneral můžete změnit hlavní nastavení animovaného textového bloku .
- A v části Style můžete upravit písmo, styl animace a veškeré styly bloku.
Nastavení animovaného textu / Hlavní nastavení neboli General:
- V pravém postranním panelu vidíte možnost Nastavení animovaného textu.
- V tomto nastavení můžete změnit Text vaší animace.
- Můžete také povolit nebo zakázat Smyčku animace. To znamená že text se buď vy-animuje pouze jednou nebo pořád dokola.
- Animate in. V tomto nastavení si můžete vybrat buď animaci po slovech (Word) nebo po písmenech (char).
- In Effect. Nastavení efektu animace, níže pod tímto návodem jsem přidal ukázky, jak která animace vypadá.
- In Sequence. V dalším nastavení můžete také změnit vstupní a výstupní efekty a sekvence
- Out Effect. Konečná animace efekt po konci té první animace
- Out Sequence. V dalším nastavení můžete také změnit vstupní a výstupní efekty a sekvence
V případě vypnutí Loop což znamená opakovaní animace se nastavuje pouze In effect a in sequence. Pokud požadujete Loop a chcete aby animace skončila stejnou annimací jako začala musíte nastavit možnost In Effect aOut Effect na stejný efekt animace. A ještě jednou pokud se chcete podívat na všechny efekty animací naleznete je dole pod tímto návodem.
Nastavení stylů animovaného textu neboli Style:
Nejlepší funkcí tohoto modulu je volné nastavování stylů, fontů, barev, směrů animace i umístění v prostoru.
- Přepněte na kartu Style a uvidíte možnosti stylu animovaného textu .
- Můžete změnit pozadí, typografii i barvu textu.
- Také může změnit odsazení a ohraničení animovaného textu.
Všechny Efekty animavaného textu
Některé animace jsou nastavené bez opakování, pro jejich opětovnou animace je potřeba z refresh stránky. CTR + F5
Flash
Bounce
Shake
Tada
Swing
Wobble
Pulse
Flip
Fade In
Flip In X
Flip In Y
Fade In Up
Fade In Down
Fade In Left
Fade In Right
Fade In Up Big
Fade In Down Big
Fade In Left Big
Fade In Right Big
Bounce In
Bounce In Up
Bounce In Down
Bounce In Left
Bounce In Right
Rotate In
Rotate In Up Left
Rotate In Up Right
Rotate In Down Left
Rotate In Down Right
Roll In
Hinde