--- site_name: WPlama site_description: "Správa, opravy a vývoj WordPress webů a e-shopů" site_url: https://www.wplama.cz contact_email: info@wplama.cz title: "Divi 3.21: Přepracované nastavení transformace prvků" url: https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/ date: 2019-03-28 modified: 2019-07-10 author: Tomáš Cirkl type: post categories: [Divi šablona a Elegant Themes] tags: [aktualizace, Divi, Elegant Themes, Nově v Divi, transformace] --- Divi šablona a Elegant Themes # Divi 3.21: Přepracované nastavení transformace prvků [TC **Tomáš Cirkl**](https://www.wplama.cz/author/tomas/) Publikováno 28. 3. 2019 Aktualizováno **10. 7. 2019** 2 min čtení Pozor: Článek je z roku 2019. Některé postupy se mohly změnit. ![transformace](https://www.wplama.cz/wp-content/uploads/2019/03/transformace.png "transformace") Obsah článku (3 kapitoly) 1. [Nové uživatelské rozhraní](https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/#nove-uzivatelske-rozhrani) 2. [Využití transformací při najetí myši na prvek](https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/#vyuziti-transformaci-pri-najeti-mysi-na-prvek) 3. [Volnost při designu obsahu](https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/#volnost-pri-designu-obsahu) Aktualizace z 14.3.2019 mění nastavení tranformace prvků v [Divi šabloně](https://www.wplama.cz/divi). Nové funkce transformace prvků přidávají velké množství nových možností do designu. [The All New And Amazing Divi Transformation Controls!](about:blank) ## Nové uživatelské rozhraní [https://www.wplama.cz/wp-content/uploads/2019/03/interface.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/interface.mp4) Nové uživatelské rozhraní pro nastavení transformací vám graficky ukáže, co daná transformace s objektem provede. Transformace jsou dostupné v záložce Design pro řádky i moduly. Podívejme se na jednotlivé možnosti, které transformace nabízí. ### Scale [https://www.wplama.cz/wp-content/uploads/2019/03/scale.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/scale.mp4) Scale umožňuje změnu velikosti prvku. Změnu velikost prvku můžete udělat při zachování poměru stran nebo bez. ### Position [https://www.wplama.cz/wp-content/uploads/2019/03/move.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/move.mp4) S position můžete posunout prvek jakýmkoliv směrem bez jakékoliv závislosti na okolních prvcích. ### Rotate [https://www.wplama.cz/wp-content/uploads/2019/03/rotate.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/rotate.mp4) Rotate umožňuje otočení prvku kolem všech tří os. Vytvoření optických 3D náhledů nyní půjde snadno i bez grafického programu. ### Skew [https://www.wplama.cz/wp-content/uploads/2019/03/skew.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/skew.mp4) Funkce skew umožňuje deformování prvku, opět lze využít funkce uzamčení poměru stran. ### Transform origin [https://www.wplama.cz/wp-content/uploads/2019/03/origin.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/origin.mp4) Možnost transform origin povoluje změnu pozice transformovaného elementu. Posun lze udělat v ose x a y. Lze tak upravit výchozí pozici prvku, který již má nastavené transformace. ## Využití transformací při najetí myši na prvek [https://www.wplama.cz/wp-content/uploads/2019/03/hover.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/hover.mp4) V ukázce se můžete podívat, jak pomocí transformací upravit portfólio novým způsobem, který návštěvníka stránek zaujme. ## Volnost při designu obsahu [https://www.wplama.cz/wp-content/uploads/2019/03/collage.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/collage.mp4) Výhoda transformace prvku je především v tom, že neovlivňuje okolní prvky. Tvorba designu je pak mnohem volnější, bez „omezení“. A na konec ještě jedna ukázka práce s transformacemi prvků. [https://www.wplama.cz/wp-content/uploads/2019/03/stacking.mp4](https://www.wplama.cz/wp-content/uploads/2019/03/stacking.mp4) - [#aktualizace](https://www.wplama.cz/stitek/aktualizace/) - [#Divi](https://www.wplama.cz/stitek/divi/) - [#Elegant Themes](https://www.wplama.cz/stitek/elegant-themes/) - [#Nově v Divi](https://www.wplama.cz/stitek/nove-v-divi/) - [#transformace](https://www.wplama.cz/stitek/transformace/) Sdílet - - [](mailto:?subject=Divi 3.21: Přepracované nastavení transformace prvků&body=Divi 3.21: Přepracované nastavení transformace prvků https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/) - [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.wplama.cz%2Fdivi-3-21-prepracovane-nastaveni-transformace-prvku%2F) - [](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.wplama.cz%2Fdivi-3-21-prepracovane-nastaveni-transformace-prvku%2F) TC Autor Tomáš Cirkl Baví mě Internet a zvláště pak redakční systém WordPress. Jsem pravidelným účastníkem a přednášejícím na Word Camp Praha a WordPress konferencích. 1 030 článků [Všechny články autora →](https://www.wplama.cz/author/tomas/) ## Komentáře Zatím tu nikdo nekomentoval. Napište první komentář. ### Přidat komentář [Zrušit odpověď](https://www.wplama.cz/divi-3-21-prepracovane-nastaveni-transformace-prvku/#respond) [← Předchozí článek Jak ve WordPress umožnit zobrazení specifického obsahu (příspěvku, stránky) jen přihlášeným uživatelům](https://www.wplama.cz/zobrazeni-specifickeho-obsahu-jen-prihlasenym-uzivatelum/) [Další článek → Jak upravit CSS v administraci WordPress](https://www.wplama.cz/jak-upravit-css-v-administraci-wordpress/) Související ## Mohlo by vás zajímat [Všechny články z rubriky Divi šablona a Elegant Themes →](https://www.wplama.cz/wordpress/divi-elegant-themes/) ![kombinovatelne nastaveni](https://www.wplama.cz/wp-content/uploads/2026/04/kombinovatelne-nastaveni.png "kombinovatelne nastaveni") Divi šablona a Elegant Themes ### [Divi 5: Kombinovatelné nastavení](https://www.wplama.cz/divi-5-kombinovatelne-nastaveni/) 13. 4. 2026 2 min čtení --- ![command center](https://www.wplama.cz/wp-content/uploads/2026/03/command-center.png "command center") Divi šablona a Elegant Themes ### [Divi 5: Command Center](https://www.wplama.cz/divi-5-command-center/) 7. 4. 2026 4 min čtení --- ![spekulativni prerendering](https://www.wplama.cz/wp-content/uploads/2026/03/spekulativni-prerendering.png "spekulativni prerendering") Divi šablona a Elegant Themes ### [Divi 5: Spekulativní prerendering](https://www.wplama.cz/divi-5-spekulativni-prerendering/) 30. 3. 2026 3 min čtení ---