Dagens hjemmeside tip! #6

Endnu engang er dagens hjemmeside tip, henvendt til WordPress brugere. Denne gang er det en tutorial til, hvorledes du laver et nyt dynamisk widget area. De fleste wordpress themes har en dynamisk sidebar, men denne tutorial kan fx. bruges, hvis man, som jeg, ønsker at have et widget område i fx. bunden af sin side.

Let’s get started!

I dette eksempel vil jeg gå ud fra, at du allerede har en wigetized sidebar, og nu blot ønsker endnu et widget område. Lad os gå ud fra at det er i footeren du ønsker dette. I så tilfælde vil vi komme til, at skulle tilføje kode til følgende filer:

  • Theme functions (Functions.php)
  • Footer (footer.php)

Placeringen af den sidste kodedel vil selvfølgelig variere (men i dette tilfælde, i footeren) alt efter hvor vi gerne vil have det nye widget område.

Functions.php

Lig ud med at åbne Functions.php. Denne fil kan du få adgang til via dit ftp program, men det er også muligt direkte fra dit administrator panel (Appearance >> Editor >> Theme functions (Functions.php)).

Da vi i dette eksempel går ud fra, at du allerede har en sidebar, som er et dynamisk widget område, vil der allerede være registreret et widget område. Led derefter efter det sted i functions.php’s kode der ser således ud (efterfulgt af mere kode): register_sidebar( array(.

Eksempel på et registreret widget område:
register_sidebar( array(
name’ => ‘Home right sidebar’,
id’ => ‘home_right_1′,
before_widget’ => ‘<div>’,
after_widget’ => ‘</div>’,
before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
) );

Udseendet af et registeret widget område kan variere, så jeg vil anbefale dig at kopirere det widget område som allerede er registreret i dit theme, og indsætte det nedenunder det allerede eksisterende, og ændre følgende punkter:

  • Name: ændre dette til et nyt navn. Fx. ‘bottom area’.
  • Id: ændre dette til et nyt navn. Fx. ‘bottom area’.

Men overstående eksmepel på en et widget område kan også sagtens bruges til et hvert theme. Jeg vil derfor kort gennemgå hvad koden egentlig gør.

Gennemgang af et registreret widget område:
register_sidebar( array( – Registrer widget området. Dette skal ikke ændres.

name’ => ‘Home right sidebar’, – Navnet på widget området sættes her. Ændre det tilnoget du finder passende og logisk.

id’ => ‘home_right_1’, – Id’et på widget området sættes her. Jeg plejer at give mine widget område, samme Id, som dets navn.

before_widget’ => ‘<div>’, – Her foreskrives det, hvad der skal ske før hver widget starter. I dette eksempel forskrives det blot, at den skal starte en ‘div’. Du kan her være meget mere specifik, og fx. give din ‘div’ et id eller en class.

after_widget’ => ‘</div>’, – Her foreskrives det hvad der skal ske efter hver widget. I dette eksempel lukkes den ‘div’ vi før har startet.

before_title’ => ‘<h2>’, – Ved dette punkt, besluttes det, hvad der skal “ske”, før hver overskrift, som de enkelte widgets har, startes. I dette tilfælde startes en heading 2. Det kunne også have været en heading 3, eller 1 mv. Ligeledes kunne man også være mere specifik, med fx. at indsætte et billede foran hver widget overskrift.

‘after_title’ => ‘</h2>’,    ) ); – Til sidst beslutter vi hvad der skal ske efter hver widget overskrift. I dette eksempel lukker vi bare headingen.

) ); – Lukker widget området. Skal ikke ændres.

Hvis du nu har skrevet oplysningerne til endnu et widget area ind, skulle din functions.php gerne se nogenlunde således ud (små variationer kan som sagt forekomme):

Eksempel på widget flere widget områder
function theme_widgets_init() {

register_sidebar( array(
‘name’ => ‘Home right sidebar’,
‘id’ => ‘home_right_1’,
‘before_widget’ => ‘<div>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
) );

register_sidebar( array(
‘name’ => ‘Bottom area’,
‘id’ => ‘Bottom area’,
‘before_widget’ => ‘<div>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
) );
}

Hvis din kode nu ser nogenlunde ud, som overstående, kan du ikke være helt på afveje, og vi hopper derfor videre til næste skridt. Nemlig at gøre vores nye widget område synligt på vores side. Vi gemmer derfor filen ‘functions.php’, og hopper videre til ‘footer.php’.

Footer.php

Du åbner nu footer.php. Denne fil kan du få adgang til via dit ftp program, men det er også muligt direkte fra dit administrator panel (Appearance >> Editor >>  Footer (Footer.php)).

Du indsætter nu følgende kode, ved den ønskede placering:

Synliggør dit widget område
<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Bottom Area’)) : ?>
[ do default stuff if no widgets ]
<?php endif; ?>

Den eneste ændring du her skal foretage dig, er at ændre ‘Bottom area’, til det navn, som du gav det widget area som du registrerede. Gem footer.php.

Du skulle nu kunne finde et nyt widget område under ‘Appearance’ >> ‘widgets’. Fold det nye widget område ud, og fyld de ønskede widgets ind i det!

Leave a Reply

Your email address will not be published. Required fields are marked *