Tweak för en JQuery-meny i WordPress
Skrivet i Wordpress - Kommentera
Det kan hända med jämna mellanrum att du måste ”tweaka” din WordPressinstallation.
Det kan vara exempelvis Loopen, men i det här fallet handlar det om functions.php.
Nyligen stötte jag på ett problem där jag ville använda mig av ett jQuery plugin som heter Sexy Drop Down Menu. Ni kan själv se att den har en snygg animation och är ideal för undermenyer, vilket passade uppdraget jag hade på gång alldeles utmärkt.
Nu var problemet så att funktionen wp_page:menu(); som jag oftast använder mig av när jag vill skriva ut en meny på sidan genererar hela paketet, dvs:
<div class="menu">
<ul>
<li>Länken här</li>
</ul>
</div>
jQuery pluginet Sexy Drop Down Menu behöver att UL ges ett ID, vilket inte skrivs ut av funktionen wp_page_menu(); Jag är ingen programmerare, så jag kan inte röra i pluginets rotfil och ändra detta på något sätt.
Nu tänker några av er säkerligen att jag kunde använt mig av wp_list_pages(); som också skriver ut hemsidans sidor i form av enbart LI, där jag själv definierar min lista UL. Anledningen till att jag inte använde denna funktion är att diverse plugins för menyhantering fungerar mycket bättre med funktionen wp_page_menu(); Så det tipset kan ni också ta med er…
För att komma åt UL som skrivs ut i wp_page_menu(); och ge den ett ID så får du som tidigare nämnt ”tweaka” din functions.php som ligger i samma mapp som ditt tema. Du öppnar upp functions.php och lägger till följande:
function add_menuclass($ulclass) {
return preg_replace('/<ul>/', '<ul id="menulist">', $ulclass, 1);
}
add_filter('wp_page_menu','add_menuclass');
Istället för att bara skriva ut UL som standard…
<ul></ul>
…så skriver den istället ut UL med en ID-tagg som i det här fallet heter menulist. Detta ID kan du sedan styla i CSS:en hur du vill.
Svårare än så är det inte. Nu lägger den till ett ID i din lista och du kan fritt fram använda dig av jQuery pluginet Sexy Drop Down Menu.
Fler inlägg om WordPress
Vill du veta hur jag jobbar?
Denna hemsida är självklart gjort i Wordpress!
Pingback: Att förstå Wordpress som ett CMS | Grafix Studio - webbdesigner och grafiker