--- 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: Jak přidat obrázek do menu ve WordPress url: https://www.wplama.cz/pridat-obrazek-menu/ date: 2017-06-26 modified: 2017-11-13 author: Tomáš Cirkl type: post categories: [WordPress návody] tags: [Menu, obrázek, plugin, WordPress] --- WordPress návody # Jak přidat obrázek do menu ve WordPress [TC **Tomáš Cirkl**](https://www.wplama.cz/author/tomas/) Publikováno 26. 6. 2017 Aktualizováno **13. 11. 2017** 2 min čtení Pozor: Článek je z roku 2017. Některé postupy se mohly změnit. ![tužky](https://www.wplama.cz/wp-content/uploads/2017/06/tuzky.jpg "tužky") Chcete vytvořit poutavé menu pomocí obrázků? Nebo chcete zjednodušit orientaci návštěvníků na stránce a do menu si přidat vlastní ikony, které pomůžou s orientací? V tomto článku si ukážeme, jak ve WordPress přidat do menu možnost vlastního obrázku nebo ikony. Využijeme k tomu plugin [Menu Image](https://wordpress.org/plugins/menu-image/), který se nachází v oficiálním katalogu a [plugin lze nainstalovat přímo z WordPress administrace](https://www.wplama.cz/3-zpusoby-jak-nainstalovat-wordpress-plugin/). [![Menu Image](https://www.wplama.cz/wp-content/uploads/2017/06/menu-image-1024x324.png "Menu Image")](https://www.wplama.cz/wp-content/uploads/2017/06 / menu-image.png) Menu Image Plugin nemá žádné vlastní nastavení. Po instalaci a aktivaci proto běžte rovnou do *Vzhled -> Menu* a vyberte položku, ke které chcete přidat obrázek. Po jejím rozbalení uvidíte, že zde máte nové nastavení. Můžete vybrat obrázek pro položku, vybrat jeho velikost a nastavit jeho pozici. Obrázek vyberete tak, že kliknete na tlačítko **Set Image**. [![Vybrat obrázek](https://www.wplama.cz/wp-content/uploads/2017/06/vybrat-obrazek.png "Vybrat obrázek")](https://www.wplama.cz/wp-content/uploads/2017/06 / vybrat-obrazek.png) Vybrat obrázek Zobrazí se WordPress média, kde si pak obrázek můžete vybrat z knihovny nebo nahrát z počítače. Pokud budete chtít, můžete pomocí tlačítka **Set image on hover** nahrát jiný obrázek, který se zobrazí při najetí myší na položku menu. [![Vybrat obrázek po najetí myši na položku](https://www.wplama.cz/wp-content/uploads/2017/06/vybrat-obrazek-po-najeti-mysi.png "Vybrat obrázek po najetí myši na položku")](https://www.wplama.cz/wp-content/uploads/2017/06 / vybrat-obrazek-po-najeti-mysi.png) Vybrat obrázek po najetí myši na položku Dalším krokem by měl být **výběr velikosti obrázku v menu** (Image size). Plugin vytváří několik svých velikostí (36x36px, 48x48px a 24x24px), ale vybrat můžete i z dalších velikostí náhledových obrázků definovaných ve WordPress. [![Nabídka velikosti obrázku](https://www.wplama.cz/wp-content/uploads/2017/06/nabidka-velikosti-obrazku.jpg "Nabídka velikosti obrázku")](https://www.wplama.cz/wp-content/uploads/2017/06 / nabidka-velikosti-obrazku.jpg) Nabídka velikosti obrázku Jako poslední je třeba určit **umístění obrázku vůči textu** menu. Vybrat můžete z : - Hide (Skrýt text) - Above (Nad textem) - Below (Pod textem) - Before (Před textem) - After (Za textem) V závislosti na šabloně je možné, že u některých pozic obrázku bude potřeba upravit CSS styly, aby to vypadalo dobře. Jakmile vše nastavíte, nezapomeňte **menu uložit**. Vytvořené menu pak může vypadat například jako na obrázku níže, kde jsou vložené vlastní ikony o velikosti 36×36 px k položce menu. [![Jak může vypadat menu s obrázky](https://www.wplama.cz/wp-content/uploads/2017/06/jak-muze-vypadat-menu-s-obrazky-1024x228.png "Jak může vypadat menu s obrázky")](https://www.wplama.cz/wp-content/uploads/2017/06 / jak-muze-vypadat-menu-s-obrazky.png) Jak může vypadat menu s obrázky Plugin má k dispozici i [češtinu](https://www.wplama.cz/preklad-cestina/). - [#Menu](https://www.wplama.cz/stitek/menu/) - [#obrázek](https://www.wplama.cz/stitek/obrazek/) - [#plugin](https://www.wplama.cz/stitek/plugin/) - [#WordPress](https://www.wplama.cz/stitek/wordpress/) Sdílet - - [](mailto:?subject=Jak přidat obrázek do menu ve WordPress&body=Jak přidat obrázek do menu ve WordPress https://www.wplama.cz/pridat-obrazek-menu/) - [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.wplama.cz%2Fpridat-obrazek-menu%2F) - [](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.wplama.cz%2Fpridat-obrazek-menu%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 031 článků [Všechny články autora →](https://www.wplama.cz/author/tomas/) ## Komentáře (3) [Přidat komentář →](https://www.wplama.cz/pridat-obrazek-menu/#respond) M Miroslava [26. 6. 2017](https://www.wplama.cz/pridat-obrazek-menu/#comment-55424) Geniální. Díky, díky, díky. Určitě využiju. [Odpovědět](https://www.wplama.cz/pridat-obrazek-menu/#comment-55424) --- M Milu [27. 6. 2017](https://www.wplama.cz/pridat-obrazek-menu/#comment-55430) jj, funguje to výborně. Můžete tam nahrávat i vlastní obrázky 🙂 [Odpovědět](https://www.wplama.cz/pridat-obrazek-menu/#comment-55430) --- M Milu [27. 6. 2017](https://www.wplama.cz/pridat-obrazek-menu/#comment-55431) Ještě je jeden výborný plugin, který mi funguje lépe (vzhledem k tomu, že dělám šablony v Themleru), jmenuje se Menu Icons. Pracuje se s ním stejně jako s Menu Image. [Odpovědět](https://www.wplama.cz/pridat-obrazek-menu/#comment-55431) --- ### Přidat komentář [Zrušit odpověď](https://www.wplama.cz/pridat-obrazek-menu/#respond) [← Předchozí článek Průvodce nastavením Yoast SEO: Detail příspěvku a stránky](https://www.wplama.cz/yoast-seo-detail-prispevku/) [Další článek → WooCommerce školení 18.7. 2017 od Vladislava Musílka](https://www.wplama.cz/woocommerce-skoleni-18-7-2017-od-vladislava-musilka/) Související ## Mohlo by vás zajímat [Všechny články z rubriky WordPress návody →](https://www.wplama.cz/wordpress/navody/) ![llms txt scaled](https://www.wplama.cz/wp-content/uploads/2026/03/llms-txt-scaled.png "llms txt scaled") WordPress návody ### [Konec tradičního SEO? Jak a proč začít optimalizovat WordPress web pro AI vyhledávače](https://www.wplama.cz/optimalizace-pro-ai-vyhledavace/) 3. 3. 2026 9 min čtení --- ![cloudflare turnstile scaled](https://www.wplama.cz/wp-content/uploads/2025/12/cloudflare-turnstile-scaled.png "cloudflare turnstile scaled") WordPress návody ### [Cloudflare Turnstile – Jeden antispam, který ochrání celý váš WordPress](https://www.wplama.cz/cloudflare-turnstile-antispam/) 17. 12. 2025 4 min čtení --- ![image scaled](https://www.wplama.cz/wp-content/uploads/2025/09/image-scaled.png "image scaled") WordPress návody ### [Jak přidat měřicí kód Sklik do WordPress pomocí Complianz](https://www.wplama.cz/jak-pridat-merici-kod-sklik-do-wordpress-pomoci-complianz/) 16. 9. 2025 3 min čtení ---