Widget toevoegen voor Header WordPress

Widget toevoegen voor Header WordPress

Het toevoegen van een widget aan WordPress is niet moeilijk. Volg de volgende instructies:

Voeg eerst de volgende functie toe aan functions.php:

register_sidebar(array(

‘name’ => ‘Header Widgets’,

‘id’   => ‘header-widgets’,

‘description’   => ‘Header Agenda’,

‘before_widget’ => ‘<div id=”agenda-header” class=”agenda-htekst”>’,

‘after_widget’  => ‘</div>’,

‘before_title’  => ‘<h2>’,

‘after_title’   => ‘</h2>’

));

Hiermee is een widget aangemaakt, maar nog niet zichtbaar in de header. We willen deze toevoegen in header.php en in dit geval alleen zichtbaar maken op de frontpage en op een pagina met id 91:

 

<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Header Widgets’) ) : ?>

<?php endif; ?> <?php   }  ?>

Vervolgens nog een beetje styling toevoegen aan style.css:

 

 

#agenda-header a {color: #E2001A; }

#agenda-header.agenda-htekst div.textwidget {max-width: 220px; max-height: 160px; word-wrap: break-word; overflow:hidden;}

 

@media all and (max-width: 1000px) and (min-width: 930px) {

#agenda-header.agenda-htekst div.textwidget{

font-size: 0.9em;

line-height: 1;

}

}

 

@media all and (max-width: 930px)  {

#agenda-header.agenda-htekst div.textwidget{

font-size: 0.5em;

line-height: 2;

margin-left: -4em;

}

 

@media all and (max-width: 830px)  {

#agenda-header.agenda-htekst div.textwidget{

font-size: 0.5em;

line-height: 2;

margin-left: -6em;

En klaar zijn we.

 

Geef een reactie