Styling Archives Widget Dropdown Menu

  • Hi! I’ve been trying to style the default wordpress archives widget dropdown menu to no avail.

    In /wp-includes/default-widgets.php, I’ve added an id and class. I.e.:
    <select name=”archive-dropdown” id=”archive_dropdown” class=”archive_dropdown” onchange=’document.location.href=this.options[this.selectedIndex].value;’> <option value=””><?php echo esc_attr(__(‘Select Month’)); ?></option> <?php wp_get_archives(apply_filters(‘widget_archives_dropdown_args’, array(‘type’ => ‘monthly’, ‘format’ => ‘option’, ‘show_post_count’ => $c))); ?> </select>

    And in my theme style.css, added:
    #archive_dropdown,
    .archive_dropdown {
    font-family: inherit;
    cursor: crosshair !important;
    }

    I’ve also tried styling using these”
    .widget_archive {}
    .widget_archive ul {}
    .widget_archive ul li {}
    .widget_archive ul li a {}
    .widget_archive select {}
    .widget_archive option {}
    as seen here
    but also to no avail.

    Additional info: I am using Google Chrome browser.

    Has anyone managed to successfully style their dropdown menus? What codes did you use/edit? Thank you so much for any advice!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    1. Try to avoid editing core markup.

    2. That would all depend on how your theme is structured as well. Off the top of my head I know you can easily target the widget class and WordPress adds an ID as well to that widget. Are you able to post a link to the site?

    Thread Starter ru

    (@ruyu)

    Hi Jose! Thanks for your quick response! This is a copy of the website Im currently working on, the footer widgets are exactly the same:
    https://www.polkadotsandpastels.com/

    Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    I do have to ask the question of why are you styling the dropdown, or better yet what in particular? If it’s just a cursor why not just use the widget class to style it?

    Thread Starter ru

    (@ruyu)

    Hi Jose,

    I want to change the font of the dropdown and the cursor to crosshair. Currently, the hover cursor is crosshair. however when I click to select the month, the cursor goes back to pointer. Also, I cant seem to get the font to change at all.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Styling Archives Widget Dropdown Menu’ is closed to new replies.