Search Widget on the Custom Sidebar

  • Resolved Boi Suerte

    (@boi-suerte)


    9 years ago

    Hi,

    I have a custom sidebar using the Search Widget.

    How can I :

    – change the shape of the search box from oval to rectangle?
    – add a rectangular Search button next to the search box?

    Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Benjamin Lu

    (@benlumia007)

    9 years ago

    in the style.css,

    look for input.search-field, there are actually two of them so make sure you don’t choose the one in the header one. 

    input.search-field {

}
    input.search-submit {
remove display: none
}
    Thread Starter Boi Suerte

    (@boi-suerte)

    9 years ago

    Benjamin,

    It did not work for me. I am doing something wrong. Below is what I have`

    `<section id = “site-sidebar”>
    <aside>
    <li id = “search-6 class = “search-6”><h1 class = “widget-title”>Search</h1> <form role=”search” method=”get” class=”search-form” action=”http://localhost:8888/wp_manilamail/”&gt;
    <label>
    <span class=”screen-reader-text”>Search for:</span>
    <input type=”search” class=”search-field” placeholder=”Search …” value=”” name=”s” title=”Search for:” />
    </label>
    <input type=”submit” class=”search-submit” value=”Search” />

    `

    Benjamin Lu

    (@benlumia007)

    9 years ago

    try

    #site-sidebar .input-search-field {

}
    #site-sidebar .input-search-submit {

}
    Thread Starter Boi Suerte

    (@boi-suerte)

    9 years ago

    It still did not work for me. 🙁

    Do the CSS statements you provided really do not have any declaration block?

    Benjamin Lu

    (@benlumia007)

    9 years ago

    you can’t modified the actual html because, that is part of the WordPress Core.

    you can only modified if the section is decoare in a nav, div, etc.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Search Widget on the Custom Sidebar’ is closed to new replies.