Hlavička - Mezi monitorem a židlí

WordPress a plovoucí obrázky

Nedávno jsem se pokoušel do stránky WordPressu přidat sadu obrázků, které se měly řadit pěkně vedle sebe, dokud nedosáhnou pravého okraje článku a pak přetéct na další řádek. Zdrojový HTML kód té obrázkové části jsem si předem nachystal v PSPadu a ověřil si, že v prohlížeči všechno vypadá podle očekávání. Pak jsem přenesl HTML kód do WordPressu, k mému překvapení se ale obrázky v první řadě rozsypaly – každý další byl posunutý o řádek dolů.

Stačil jednoduchý průzkum zdrojového kódu zobrazené stránky, aby bylo jasné, že WordPress mezi tagy <img> vložil řádkový zlom (značku <br />). WordPress si prostě do kódu svévolně přidal svoje.

Dost dlouhou dobu jsem pak hledal způsob, jak tomu zabránit, jak tuto funkci ve WordPressu vypnout, ale nenacházel jsem ani potřebné nastavení ve WordPressu, ani žádné použitelné rady na webu.

Zakopaný pes byl ale jinde, než jsem si myslel. WordPress se totiž při přidávání řádkových zlomů neřídí tagy <img>, ale vkládá je na konec řádku. Když tedy v editoru WordPressu v HTML režimu ukončíte řádek a začnete psát na nový, WordPress na místo, kde jste stiskli Enter, vloží značku <br />. Matoucí ale je, že v editoru žádné <br /> neuvidíte, dostane se tam až při zobrazení stránky v prohlížeči.

Jak jsem měl HTML kód přehledně formátovaný, aby byla zřejmá jeho struktura a aby se dobře upravoval, WordPress mi do něj vložil zalomení řádku a výsledek rozbil.

Odstranění problému bylo tedy až dětinsky jednoduché. Stačilo řádky zrušit a části kódu poskládat bezprostředně za sebe. Od té chvíle byly plovoucí obrázky zase pěkně poslušné.

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna.