Anpassung von Sidebar und Footer Bereich für Twenty Eleven

Wallensko

Hallo zusammen,

Ich habe folgendes Problem und hoffe, dass Ihr mir helfen könnt.
Ich verwende aktuell das Theme Twenty Eleven und will dort folgende Änderungen vornehmen.

Auf der Startseite soll die Sidebar nicht erscheinen und ebenso soll der Text dann über die komplette Seite gehen. Wo muss ich was genau ändern?
Der Footer Bereich ist bereits in 3 Spalten aufgeteilt. Diesen Bereich will ich nun nochmals unterteilen so das ich komplett 6 Footer Blöcke habe. Was muss ich hier genau wo eintragen.

Da ich absolut kein Experte bin will ich kein Child Theme erstellen.
Ich habe mich fast schon zu tode gegoogelt aber nichts passendes gefunden. Es gibt zwar viele Beiträge über “Sidebar ausblenden” etc. aber nichts hat bei mir funktioniert.
Vielen Dank für Eure Hilfe

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

alchymyth

zu 1.
ist die startseite eine statische seite oder der 'blog' d.h. die seite mit den artikeln?

zu 2.
sollen die bloecke nebeneinander angeordnet werden?

in functions.php nach diesem block unter anwendung von logischem denken noch entsprechende bloecke dreimal mit anderen zahlenwerten anfuegen:

PHP

register_sidebar( array(
  'name' => __( 'Footer Area Three', 'twentyeleven' ),
  'id' => 'sidebar-5',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );

http://codex.wordpress.org/Function_Refer…egister_sidebar

in sidebar-footer.php auch das ganze entsprechend mit drei weiteren bloecken ergaenzen.

und in style.css diese styles auch mit drei weiteren mit dem selben muster erweitern:

Code

/* Three Footer Widget Areas */
#supplementary.three .widget-area {
 float: left;
 margin-right: 3.7%;
 width: 30.85%;
}
#supplementary.three .widget-area + .widget-area + .widget-area {
 margin-right: 0;
}

alchymyth

ausserdem in functions.php diese funktion erweitern:

PHP

/**
 * Count the number of footer sidebars to enable dynamic classes for the footer
 */
function twentyeleven_footer_sidebar_class() {
 $count = 0;
 if ( is_active_sidebar( 'sidebar-3' ) )
  $count++;
 if ( is_active_sidebar( 'sidebar-4' ) )
  $count++;
 if ( is_active_sidebar( 'sidebar-5' ) )
  $count++;
 $class = '';
 switch ( $count ) {
  case '1':
   $class = 'one';
   break;
  case '2':
   $class = 'two';
   break;
  case '3':
   $class = 'three';
   break;
 }
 if ( $class )
  echo 'class="' . $class . '"';
}

Alles anzeigen

Wallensko

Vielen Dank für Deine schnelle Hilfe.

Zu Deiner Frage 1: Meine S[COLOR=#333333]tartseite ist statische Seite
[/COLOR]Zu Deiner Frage 2: [COLOR=#333333]Drei Blöcke sollen unten und drei Blöcke genau darüber sein[/COLOR]

alchymyth

zu 1.

verwende das 'Sidebar-Template' unter 'attribute';

dann passe diesen style an:

Code

/* One column */
.one-column #page {
 max-width: 690px;
}

und evtl einige styles direkt danach.

zu 2.

die anordnung ist zweitrangig und hilfe dazu geht am besten wenn du einen link zu der seite angeben kannst;

- siehe erstmal wieweit du damit kommst, die widgetbereiche auf 6 zu erweitern.

Wallensko

Vielen Dank für Deine schnelle Hilfe. Da ich wirklich kein Experte bin verstehe ich nicht ganz wie Du das meinst... Verstehe ich Dich richtig das ich die Sidebar.php ändern muss? Was meinst Du genau damit, dass [COLOR=#333333]evtl einige styles direkt danach geändert werden müssen? Sorry das ich nerve aber ich brauche wirklich Hilfe.
[/COLOR]

alchymyth

Twenty Eleven mit 6 footer widgets

die drei dateien, in denen geaendert werden muss, sind:
- functions.php
- sidebar-footer.php
- style.css

in functions.php muss der bereich mit 'register-sidebar()' nach der anpassung so aussehen:

PHP

/**
 * Register our sidebars and widgetized areas. Also register the default Epherma widget.
 *
 * @since Twenty Eleven 1.0
 */
function twentyeleven_widgets_init() {
 register_widget( 'Twenty_Eleven_Ephemera_Widget' );
 register_sidebar( array(
  'name' => __( 'Main Sidebar', 'twentyeleven' ),
  'id' => 'sidebar-1',
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Showcase Sidebar', 'twentyeleven' ),
  'id' => 'sidebar-2',
  'description' => __( 'The sidebar for the optional Showcase Template', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Footer Area One', 'twentyeleven' ),
  'id' => 'sidebar-3',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Footer Area Two', 'twentyeleven' ),
  'id' => 'sidebar-4',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Footer Area Three', 'twentyeleven' ),
  'id' => 'sidebar-5',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
//neuer abschnitt beginnt//
 register_sidebar( array(
  'name' => __( 'Footer Area Four', 'twentyeleven' ),
  'id' => 'sidebar-6',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Footer Area Five', 'twentyeleven' ),
  'id' => 'sidebar-7',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
 register_sidebar( array(
  'name' => __( 'Footer Area Six', 'twentyeleven' ),
  'id' => 'sidebar-8',
  'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => "</aside>",
  'before_title' => '<h3 class="widget-title">',
  'after_title' => '</h3>',
 ) );
//neuer abschnitt endet//
}
add_action( 'widgets_init', 'twentyeleven_widgets_init' );

Alles anzeigen

(da die 'description'-begriffe nicht in der uebersetzungsdatei beinhaltet sind, musst du die evtl eindeutschen)

der bereich wo die css class festgelegt wird, muss in der functions.php dann so aussehen:

PHP

function twentyeleven_footer_sidebar_class() {
 $count = 0;
 if ( is_active_sidebar( 'sidebar-3' ) )
  $count++;
 if ( is_active_sidebar( 'sidebar-4' ) )
  $count++;
 if ( is_active_sidebar( 'sidebar-5' ) )
  $count++;
 
 if ( is_active_sidebar( 'sidebar-6' ) ) //the fourth new one// 
  $count++;
 if ( is_active_sidebar( 'sidebar-7' ) ) //the fifth new one// 
  $count++;
 if ( is_active_sidebar( 'sidebar-8' ) ) //the sixth new one// 
  $count++;
 $class = '';
 switch ( $count ) {
  case '1':
   $class = 'one';
   break;
  case '2':
   $class = 'two';
   break;
  case '3':
   $class = 'three';
   break;
  case '4':
   $class = 'four';
   break;
  case '5':
   $class = 'five';
   break;
  case '6':
   $class = 'six';
   break;
 }
 if ( $class )
  echo 'class="' . $class . '"';
}

Alles anzeigen

sidebar-footer.php sollte so aussehen: http://pastebin.com/1ifiQFWy

in style.css sollte das angefuegt werden:

CSS

/* Four Footer Widget Areas */
#supplementary.four .widget-area {
 float: left;
 margin-right: 3.7%;
 width: 30.85%;
}
#supplementary.four .widget-area + .widget-area + .widget-area + .widget-area {
 margin-right: 0;
}
/* Five Footer Widget Areas */
#supplementary.five .widget-area {
 float: left;
 margin-right: 3.7%;
 width: 30.85%;
}
#supplementary.five .widget-area + .widget-area + .widget-area + .widget-area + .widget-area {
 margin-right: 0;
}
/* Six Footer Widget Areas */
#supplementary.six .widget-area {
 float: left;
 margin-right: 3.7%;
 width: 30.85%;
}
#supplementary.six .widget-area + .widget-area + .widget-area + .widget-area + .widget-area + .widget-area {
 margin-right: 0;
}
.footer-widget-last { margin-right: 0!important; }
.clear { clear:left; }

Alles anzeigen

das sollte eigenlich alles sein.

Wallensko

Super Klasse Danke Dir vielmals... Das Ändern des Footer Bereichs war mit Deiner Anleitung echt kein Problem... Jetzt muss ich nur noch genau wissen, was ich bei meiner ersten Frage alles Ändern muss, damit auf meiner statischen Seite keine Sidebar mehr erscheint und der Text dann über den kompletten Bereich geht.
Vielen vielen Dank für Deine Hilfe.

Wallensko

Hallo Michael, da mir Deine Hilfe super geholfen hat würde ich Dich bitten, mir auch nochmals für Frage 1 zur Seite zu stehen... Vielen Dank

Uwe_EF

Zitat

Auf der Startseite soll die Sidebar nicht erscheinen und ebenso soll der Text dann über die komplette Seite gehen. Wo muss ich was genau ändern?

Du erstellst ein neues Template in dem du den Aufruf der Sidebar verhinderst. Da erreichst du, wenn du in deinem neuen Template die Anweisung

PHP

<?php get_sidebar(); ?>

auskommentierst. Desweiteren brauchst du in deiner style.css einen Container für den Inhalt der Startseite, der über die ganze Seitenbreite geht, (width:100%;). Wo und wie du den einbindest steht in dem oben verlinkten Artikel. Wenn du das alles hast legst du diese Seite als Startseite fest und fertig.

alchymyth

wenn du eine statische vorderseite setzt ( http://codex.wordpress.org/Creating_a_Static_Front_Page ) dann verwendet Twenty Eleven ohne weitere anpassungen page.php welches keine sidebar hat;

in der style.css musst du dann noch die weite anpassen:

Code

.singular #content,
.left-sidebar.singular #content {
 margin: 0 7.6%;
 position: relative;
 width: auto;
}
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
 margin: 0 auto;
 width: 68.9%;
}

Alles anzeigen

wenn das fuer alle seiten und einzel-artikel angepasst werden soll, dann aendere das obige direkt in style.sss.

wenn du das nur fuer die startseite haben willst (und einzel-artikel und seiten schmal lassen willst) dann fuege das neu in die style.css ein, mit neuen werten fuer margin und width:

Code

.home.singular #content,
.home.left-sidebar.singular #content {
 margin: 0 2.6%;
 position: relative;
 width: auto;
}
.home.singular .entry-header,
.home.singular .entry-content,
.home.singular footer.entry-meta,
.home.singular #comments-title {
 margin: 0 auto;
 width: 88.9%;
}

Alles anzeigen

Wallensko

Hallo Michael, verstehe ich jetzt nicht ganz... wieso taucht dann bei mir die Sidebar bei der statischen Seite auf? Muss ich da etwas speziell noch einstellen?

alchymyth

Zitat

wieso taucht dann bei mir die Sidebar bei der statischen Seite auf?

hast du evtl das plugin 'twentyeleven theme extensions' aktiviert? oder das 'Sidebar Template' fuer die seite unter 'Attributes' angewaehlt?

hattest du schon einen link zu deiner webseite angegeben?
das wuerde naemlich helfen, dein problem besser zu verstehen.

Wallensko

sorry...hier der Link http://www.romantisch24.de/...

[COLOR=#333333]Ja, ich habe twenty eleven theme extensions aktiviert.[/COLOR]

alchymyth

ich kenn die plugin-einstellungen nicht;
gibt es da keine moeglichkeit, statische seiten ohne sidebar zu lassen?

Wallensko

nein leider nicht... wenn ich den Haken bei "[COLOR=#333333][FONT=sans-serif]Enable the widget sidebar on pages" raus nehme ist auf allen Seiten die Sidebar verschwunden...[/FONT][/COLOR]

alchymyth

evtl kannst du mit einer reinen CSS loesung arbeiten:

am ende der style.css oder in einem custom-css bereich vom plugin (gibt es da sowas?) das hier einfuegen:

Code

.home #secondary { display: none; }
.home #content { width: 84.5%; }


/*optional um den titel 'startseite' auszublenden*/
.home .entry-title { display: none; }

Wallensko

[COLOR=#333333]custom-css bereich vom plugin gibt es nicht.... ich habe gerade die Ergänzungen vom style.css gemacht, hat sich aber leider nichts verändert...:-( Gibt es eventuell noch andere Möglichkeiten?[/COLOR]

alchymyth

Zitat

ich habe gerade die Ergänzungen vom style.css gemacht

wo genau - ich seh das gerade nicht in der style.css von deiner webseite.

manchmal musst du den browser-cache leeren, um die neue css zu sehen - zb mit 'STRG F5' oder seite neu laden oder in der browser-anleitung nachsehen...

Wallensko

yeah...ich glaubs ja nicht...es hat geklappt!!!! Vielen Dank für Deine Hilfe.

Eine weitere Frage hätte ich da noch... auf einer EINER ganz normalen Seite meines Blogs will ich ebenso die Sidebar ausblenden... Geht das auch ohne größeren Aufwand?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Anpassung von Sidebar und Footer Bereich für Twenty Eleven

Jetzt mitmachen!