WordPress menu span hack

Írta: | 2008. január 15. | kategóriák: Blogolok, CMS, CSS, Design, PHP

A minap felkerült egy írás, ahol dinamikusan lehet gombot készíteni CSS segítségével. DeX hozzászólása kapcsán:

Ha a gombon nyomvatartod az egeret, majd lehúzod róla, és ott engeded el, akkor beragad a lenyomott állás?

arra gondoltam, ha már az active-ot hover-re cserélem, használhatom menünek is az egész CSS kódot, a minimális modosításokkal. A CSSben mindössze annyi a tennivaló, hogy az active modosítókat kicseréljük hoverre. Így a link fölé görgetéskor aktíválodik az új kinézet és nem a link lenyomásakor. Miután készen vagyunk a CSS résszel, nyugodtan használhatjuk weboldalainkban.

Mi van akkor, ha a kódot nem mi írjuk? Én arra az esetre gondoltam, amikor a WordPress által kilistázott oldalakat/kategóriákat formázom menüként. A megoldás egy kis ügyesség, okosság. A probléma orvoslását keresve az alábbi megoldást találtam a legmegfelelőbbnek.

// lekérem a formázni való oldalakat
// fontos, hogy az echo legyen nulla, hogy ne történjen kiírás a sablonba
$pages = wp_list_pages('depth=1&title_li=&echo=0');

// behelyettesítem az <a> tagokat <a><span> tagpárosokkal
// mivel a linknek vannak paraméterei, kegyetlen vagyok regular expressiont használni
$pages = preg_replace(‘/(<a[^>]*>)/’,'$1<span>’,$pages);

// a link záró tagokat sima szöveg behelyettesítéssel is végezhetem
$pages = str_replace(‘</a>’, ‘</span></a>’, $pages);

// végül kiírom a menüt
echo $pages;

0


Értékeld a bejegyzést!

Loading ... Loading ...

A bejegyzésre érkező kommenteket elérheted RSS 2.0 formájában vagy emailben is:

A bejegyzéshez tartozó trackback cím, illetve a permalink.

A megjegyzéseket kérlek, tedd fel érthető és illendő módon, ne fikázz le másokat, mert nem tudnak valamit, amit te már igen. A kommentár lehetőleg függjön a bejegyzéshez :)

kötelező
kötelező, titok marad
ha nincs, maradjon üres



Jó ez az írás de én keresgéltem anno egy cms független megoldást és létezik is mégpedig a W3.org jelentette meg a megoldást, pusztán css-t használva. itt a link, ha valakit érdekel http://www.w3.org/TR/WCAG20-TECHS/C7.html

Piszi 2009. február 16. - 23:46

Az adott linken is te írod a markup (HTML) részt is, meg a CSSt is. Ahogyan a cím is sugallja, itt az van leírva, hogy minként tudod megváltoztatni a WordPresst úgy, hogy ne a megszokott módon írja ki a linkeket egy listában, hanem szúrja be a SPAN tagokat is az anchorokon belölre.
Röviden, a két leírás külön malomban őröl :)
Azért köszi a linket, hasznos dolgokról tart beszédet.

Avatar Tupacko
2009. február 17.
11:39