[Resolved] Height Reduce for Search Widget in Side Bar

[Sourabh]

HI,

How to reduce the height of the search widget in the sidebar, at present it’s looking like below –

https://www.dropbox.com/s/dfkb3y0a2xepuzv/Search%20Box%20in%20side%20Bar.png?dl=0

so I want to reduce the height from top and bottom and wants to remove the colour of search icon so that I can get below look –

https://www.dropbox.com/s/v9ani3o9n8c9nds/Search%20Box%20in%20side%20Bar%201.png?dl=0

Also, find reference URL below if you need help to see via inspecting elements etc.

https://jnews.io/citynews/2018/07/06/grab-tackles-jakartas-odd-even-license-plate-policy-with-special-algorithm/

[Leo]

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know 🙂

[Sourabh]

Yes.. check

[Leo]

The link isn’t working for me.

Can you double check?

[Sourabh]

Due to https its giving issue sometimes… I will change host this month…

Give a retry…

[Leo]

No luck – it just says This site can’t be reached.

[Sourabh]

Ohh.. it happens sometime…can’t u understand by above giving urls..

?

[Leo]

I need to see the page in question so please sort that out first.

Thanks!

[Sourabh]

Hi,

Check the link is working now, I have updated SSL, Problem is resolved now…

[David]

Hi there,

try this CSS:

.is-right-sidebar .widget.widget_search {
    padding: 20px;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.08);
    box-shadow: 0 2px 4px rgba(0,0,0,.08);
}
.widget .search-form {
    position: relative;
}

.is-right-sidebar .widget.widget_search label {
    width: 100%;
}

.is-right-sidebar .widget.widget_search input[type="search"] {
    padding: 5px 40px 5px 15px;
    background-color: #fff;
}

.is-right-sidebar .widget .search-form button.search-submit {
    padding: 5px;
    background-color: transparent;
    color: #000;
    position: absolute;
    right: 10px;
}

[Sourabh]

Hi David,

You did a great job, but seems something incorrect in css, I have attached a snapshot if you can rectify the problem of the area, Another this is that, when I try to search something using the same search box, we don’t get a search result Instead it’s redirecting to the posts page ???

https://www.dropbox.com/s/6jos81n669gng0j/area%20of%20problem.png?dl=0

its site reference for your testing purpose –

https://venusentertainments.com/89-proven-ways-to-make-money-with-your-blog-in-2020

[David]

I have correct the CSS here:

https://generatepress.com/forums/topic/height-reduce-for-search-widget-in-side-bar/#post-1565907

Looks like you have created archive pages with Elementor – the theme has no control over there conditional displays, you would need to ask Elementor support regarding that issue.

[Sourabh]

Yes, you are true, I have created an archive template in elementor ?

So you mean it’s happening because of the archive template ??

If I remove it then how should I display posts etc, does GP having such a facility?

[Leo]

So you mean it’s happening because of the archive template ??

Yes that’s what David is saying.

If I remove it then how should I display posts etc, does GP having such a facility?

Yes – GP displays posts on the posts page (this is a WordPress functionality) and you can use the customizer options here to modify the layout:
https://docs.generatepress.com/article/blog-content-layout/

[Sourabh]

It’s resolved now, Thanks David for your CSS help.

[Author]

Posts