Widgets zuklappen

Das wüsste ich auch gerne

Mojn,

So ein Effekt ist unter anderem auch als collapse, oder accordion bekannt.

Habe ich zwar jetzt nicht ausprobiert, aber dieses wäre so ein Plugin;
http://wordpress.org/extend/plugins…accordion-menu/

Ansonsten schaut mal nach, ob ein anderes Plugin für euch geeigneter wäre, falls dieses nicht ganz euren Vorstellungen entspricht. ;)
http://wordpress.org/extend/plugins…on+widget&sort=

Ich hoffe ich konnte euch damit so im Ansatz weiterhelfen.

@the_zoker_09 und alphachris

hab gerade mal etwas gegoogelt, herumgebastelt und das bei mir mal umgesetzt :wink:

Das geht relativ einfach über die function.php oder sidebar.php je nach Theme

suchen nach diesem Code (Beispiel aus meinem Theme)

register_sidebar(array(
        'name' => 'Sidebar',
        'before_widget' => '<div id="%1$s" class="block %2$s">',
        'after_widget' => '</div>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ));

hier

'before_title' => '<h2>',

die class hinzufügen

'before_title' => '<h2 class="widgettoogle">',

sowie ein an dein Theme angepasstes Script für die header.php.
sieht bei mir so aus:

<script type="text/javascript">
function toggleWidgets() {
    jQuery('.block h2.widgettoogle').addClass('plus'); 


    jQuery('.block h2.widgettoogle').click(function() {
        $(this).toggleClass('plus').toggleClass('minus').next().toggle(180);
    });


} jQuery(document).ready(function() {
    toggleWidgets();
    } )
</script>

[COLOR="Red"].block[/COLOR] ist die class des div das zugeklappt werden soll, also eurem Theme anpassen
das Script fügt noch jeweils für den Zustand, eine Class für das Plus und Minus Zeichen hinzu
dies kann dann in der style.css des Themes definiert werden
sieht bei mir so aus

#sidebar .plus:after {
    content: "-";
    float: right;
    margin-right: 42px;
}
#sidebar .minus:after {
    content: "+";
    float: right;
    margin-right: 40px;
}

anschauen könnt ihr euch das derzeit auf meiner Seite ;)

einfach dazufügen

'before_title'  => '<h2 class="widget-title widgettoogle">',

Zitat von the_zoker_09

Wo bekomme ich die klasse des div`s her?

am einfachsten im Quelltext des Browsers nachsehen ;)

[COLOR=Red]Edit[/COLOR]:hab das gerade nochmal getestet, die class kann man weglassen, wenn sie schon in

'before_widget' => '<div id="%1$s" class="block %2$s">', 
        'after_widget' => '</div>',

angegeben ist

es reicht also dann

<script type="text/javascript">
function toggleWidgets() {
    jQuery('h2.widgettoogle').addClass('plus'); 


    jQuery('h2.widgettoogle').click(function() {
        $(this).toggleClass('plus').toggleClass('minus').next().toggle(180);
    });


} jQuery(document).ready(function() {
    toggleWidgets();
    } )
</script>