Nastavitelná barva titulku u widgetů

V rubrice: Tipy & Triky | Obtížnost:

Jak vytvořit vlastní widget jste si mohli v jednom z předchozích tipů již přečíst. Dnes si ukážeme, jak pomocí filtrů upravit ty stávající. Konkrétně pomocí formulářového prvku z HTML5 změnit barvu nadpisu u jednotlivých widgetů a tím ho odlišit od ostatních – zvýraznit.


Následující kód přidejte do functions.php:

add_action('in_widget_form', 'color_show_hide_widget_options', 10, 3);
add_filter('widget_update_callback', 'color_update_widget_options', 13, 3);

function color_update_widget_options($instance, $new_instance, $old_instance) {
    $instance['color'] = $new_instance['color'];
    return $instance;
}

function color_show_hide_widget_options($widget, $return, $instance) {
    ?>
    <p>
        <label for="<?php echo $widget->get_field_id('color'); ?>">Barva titulku:</label><br />
        <input type="color"
               name="<?php echo $widget->get_field_name('color'); ?>"
               value="<?php echo $instance['color']; ?>" />
    </p>
    <?php
}

add_filter('widget_display_callback', 'show_color_widget');

function show_color_widget($instance) {
    global $widgetColor;
    $widgetColor = $instance['color'];
    return $instance;
}

function color_widget_title($text) {
    global $widgetColor;
    if ($text == '')
        return '';
    if ($widgetColor != '')
        return "<span style='color: " . $widgetColor . " !important'>" . $text . "</span>";
    else
        return $text;
}

add_filter('widget_title', 'color_widget_title', 11);

Input s type color zatím podporuje pouze Opera, ostatní prohlížeče jsou v tomto směru pozadu, takže vám neukáží jednoduché GUI pro výběr. Nicméně v ostatní je možné barvu vyplnit alespoň ručně ve formátu #FFFFFF nebo přímo název barvy např. white či black.

V rubrice: Tipy & Triky | Obtížnost: