Blog

Titel einer Customize-Section verändern

Veröffentlicht am

Beim Erstellen einer Customize-Section wird ein Titel vergeben. In einigen Fällen kann es sein, dass dieser Titel während einer Customize-Session dynamisch verändert werden soll, um beispielsweise den veränderten Wert eines Formularfeldes wiederzugeben, wie unten im GIF zu sehen ist.

Ein GIF, das die Detailansicht einer Section zeigt. Beim Verändern eines Select-Feldes wird der Section-Titel ebenfalls aktualisiert.

Ich habe keine Möglichkeit gefunden den Titel über die Customize-JS-API zu verändern, also blieb nur der Weg über die direkte Manipulation des DOM.

"Titel einer Customize-Section verändern" Weiterlesen

Eigenes Template für den Head-Container einer Customizer-Section nutzen

Veröffentlicht am

Wenn ihr im Customizer ein Panel öffnet, kommen entweder direkt Optionen (wie bei dem »Website-Informationen«-Panel) oder Verweise auf Sections, in denen dann die Optionen zu finden sind (wie bei den Menüs). Standardmäßig sehen diese Verweise aus wie im Screenshot unten das Slider settings – der Titel der Section in einem Bereich mit hellerem Hintergrund und rechts einem Pfeil.

Wir möchten das verändern, sodass stattdessen ein beschreibender Text und ein Button angezeigt wird, der dann die Section öffnet – so wie es im Screenshot für Portfolio feature zu sehen ist.

"Eigenes Template für den Head-Container einer Customizer-Section nutzen" Weiterlesen

Eine Customize-Section via JS schließen

Veröffentlicht am

Manchmal kann es nützlich sein, im Customizer von WordPress zum Beispiel nach einem Klick auf einen Button eine Section zu schließen. Das ist an sich leicht gemacht, es hat neulich aber doch ein bisschen gedauert, bis ich herausgefunden habe wie es geht.

Mit diesem Einzeiler lässt sich eine Section schließen:

wp.customize.section('hannover_portfolio_archive_page_options').collapse();Code-Sprache: JavaScript (javascript)

Dabei ist hannover_portfolio_archive_page_options die ID der Section.

Theme-Mod nach Button-Klick im Customizer entfernen

Veröffentlicht am

In der kommenden Version meines Hannover-Themes soll es neben überarbeitetem Design und Code auch eine verbesserte User-Experience im Customizer geben. Dabei soll es für den Nutzer unter anderem möglich sein, Sections über einen Button-Klick zu entfernen (wie beim Löschen eines Menüs im Customizer). Daraufhin soll natürlich nicht nur die Section aus dem Customizer verschwinden, sondern auch die entsprechenden Theme-Mods aus der Datenbank gelöscht werden. Hier zeige ich, wie ich dazu vorgegangen bin.

"Theme-Mod nach Button-Klick im Customizer entfernen" Weiterlesen

Dropdown-Pages-Control mit der Customize-JS-API erstellen

Veröffentlicht am

Es lassen sich alle Standard-Controls vom Core über die Customize-JS-API erstellen, bis auf eine: die Dropdown-Pages-Control, die eine Select-Liste aller Seiten einer Installation anzeigt (beispielsweise bekannt von der Einstellung zum Festlegen einer statischen Startseite). Das heißt, dass wir Controls von diesem Typ normalerweise aktuell noch mit PHP registrieren müssen.

Auf eine Frage bei wordpress.stackexchange.com hin hat Weston Ruter ein Plugin geschrieben, das die Erstellung von Dropdown-Pages-Controls mit der JS-API ermöglicht (ein bisschen Erläuterung zu dem Thema gibt es in seiner Antwort auf die Frage). Der dafür wichtige Teil ist die print_control_templates()-Methode, die ein Control-Template erstellt, auf das die JS-API zurückgreift wenn sie eine dropdown-pages-Control erstellen soll. Dieses Template wird über den folgenden Aufruf in der init()-Methode des Plugins in den Customizer eingefügt:

add_action( 'customize_controls_print_footer_scripts', array( $this, 'print_control_templates' ) );Code-Sprache: PHP (php)