Dezvoltare WordPress: afișarea categoriilor într-un meniu derulant de tip select

Pe măsură ce un blog crește și acumulează zeci sau sute de articole, structura tematică devine tot mai amplă. O listă clasică de categorii afișată în bara laterală (sidebar) poate deveni excesiv de lungă, afectând negativ aspectul vizual și navigarea pe pagină.

Cea mai curată și compactă soluție pentru a optimiza spațiul disponibil constă în gruparea acestor secțiuni într-un meniu derulant (drop-down) de tip <select>, care redirecționează vizitatorul automat la alegerea unei categorii.

Implementarea formularului cu wp_dropdown_categories()

WordPress oferă o funcție nativă flexibilă numită wp_dropdown_categories(). Pentru a crea un meniu derulant funcțional în bara laterală sau în subsolul paginii, puteți include următorul fragment de cod în fișierele temei (cum ar fi sidebar.php sau într-un widget personalizat):

<form action="<?php echo esc_url( home_url( '/' ) ); ?>" method="get">
<?php
$select = wp_dropdown_categories( array(
    'show_option_none' => 'Selectează o categorie',
    'show_count'       => 1,
    'orderby'          => 'name',
    'echo'             => 0,
    'name'             => 'cat',
) );

// Adăugăm declanșatorul JavaScript pentru redirecționare automată la selecție
$select = preg_replace( '#<select([^>]*)>#', "<select$1 onchange='return this.form.submit()'>", $select );
echo $select;
?>
<noscript>
    <input type="submit" value="Afișează" />
</noscript>
</form>

Cum funcționează această soluție

• Funcția wp_dropdown_categories(): generează structura HTML a meniului. Parametrul show_count=1 afișează numărul de articole publicate în dreptul fiecărei categorii, iar orderby='name' le sortează alfabetic. Folosirea argumentului echo=0 returnează rezultatul sub formă de șir de caractere în variabila $select în loc să îl afișeze direct.
• Redirecționarea automată: funcția preg_replace() injectează atributul onchange='return this.form.submit()' pe eticheta <select>, astfel încât utilizatorul este redirecționat imediat la pagina categoriei alese, fără a fi nevoie să apese un buton separat.
• Accesibilitate prin eticheta <noscript>: pentru utilizatorii care au JavaScript dezactivat sau pentru motoarele de căutare, este inclus un buton clasic de trimitere (Submit), garantând funcționalitatea completă a formularului în orice scenariu.

Prin această tehnică, mențineți bara laterală aerisită și oferiți o experiență de navigare rapidă și intuitivă pe întregul site.