Search box duplicate IDs

  • Resolved mica123

    (@mica123)


    10 years, 11 months ago

    I hope you’ll be able to help.
    Here is the scenario:

    1.have a search box in the menu using this code:

    function add_search_box($items, $args) {
    if($args->theme_location == 'header-menu') {
        ob_start();
        get_search_form();
        $searchform = ob_get_contents();
        ob_end_clean();
        return $items .= '<li id="searchform-item">' . $searchform . '</li>';
    }
    return $items;
}

    2.have a search box in the sidebar as well but hide it from view for screen sizes max-width above 800px;
    3.hide the menu search box from the menu for screen sizes below and equal to 800px;
    4.display the search box in the sidebar for creen sizes below and equal to 800px.

    This works, but the W3C validator is complaining about the duplicate IDs. This is because
    the same search form with all the elements is used twice for the menu as well as the sidebar.
    Is there any way to change all the IDs in the searchform.php to classes? Or is there another solution.
    I would be grateful for your help. I am not using this at the moment until I find a solution – hopefully.

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi Mica. You sorta answered your own question – you can edit searchform.php and remove the id attribute from the form and use a class instead – and update your css accordingly.

    Thread Starter mica123

    (@mica123)

    That’s great, Lucas.

    So just to be on the safe side (because I am worried about breaking everything) – instead of this code:

    <form method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
	<input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'search here &hellip;', 'responsive' ); ?>"/>
	<input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e('Go', 'responsive' ); ?>"/>
</form>

    I could use this:

    <form method="get" class="searchform" action="<?php echo home_url( '/' ); ?>">
	<input type="text" class="field" name="s" class="s" placeholder="<?php esc_attr_e( 'search here &hellip;', 'responsive' ); ?>"/>
	<input type="submit" class="submit" name="submit" class="searchsubmit" value="<?php esc_attr_e('Go', 'responsive' ); ?>"/>
</form>

    Would that be correct (including class=”s”) ?

    Many thanks!

    Thread Starter mica123

    (@mica123)

    Hello,

    I replaced the id attribute from the form and used a class, but it didn’t help as the validator complained about the remaining id duplicates. So I replaced them all with a class – that didn’t help either – it was even worse because the validator came up with even more duplicate class errors.

    So unfortunately I am stuck – I very much hope there is a solution? I would really like to sort out this problem.

    Many thanks.

    Thread Starter mica123

    (@mica123)

    Just to say that there is no need to look into this. It’s been sorted.
    Thanks.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Search box duplicate IDs’ is closed to new replies.