WordPress Header-Widget

Beispiel um ein Widget in den WordPress-Theme-Header einzubinden
Das CSS-Beispiel ist für einen Text im rechten Headerbereich, je nach CSS-Einstellung kann natürlich auch die Suchfunktion oder andere Plugins eingefügt werden.
 

Code für die functions.php

1
2
3
4
5
6
7
8
register_sidebar(array(
 'name'=>'Header-Text',
 'id' => 'headertextrechts',
 'before_widget' => '<div><p>',
 'after_widget' => '</p></div>',
 'before_title' => '<h2>',
 'after_title' => '</h2>'
));

Code für header.php

1
2
3
<div id="headertextrechts">
    <?php dynamic_sidebar( 'Header-Text' ); ?>
</div>

Code für style.css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
#headertextrechts {
  float:right;
  background: #fff;
  color: #a1a0a0;
  width: 315px;
  height: 120px;
  margin: 25px;
}
 
#headertextrechts .textwidget p {
  color: #a1a0a0;
  font-size: 12px;
  font-weight: 400;
  padding: 8px 0 0 5px;
  text-align: right;
  line-height: 25px;
}
 
#headertextrechts .textwidget i, em {
  color: #a1a0a0;
  font-size: 20px;
  font-weight: 300;
  padding: 5px 0 0 5px;
  text-align: right;
}

Wir setzen für unseren Internetauftritt sog. Cookies ein. Durch Einstellungen in Ihrem Browser können Sie die weitere Verwendung von Cookies deaktivieren. Weitere Informationen zu Cookies finden Sie in unserer Datenschutzerklärung

Die Cookie-Einstellungen auf dieser Website sind auf "Cookies zulassen" eingestellt, um das beste Surferlebnis zu ermöglichen. Wenn du diese Website ohne Änderung der Cookie-Einstellungen verwendest oder auf "Akzeptieren" klickst, erklärst du sich damit einverstanden.

Schließen