Return to previous page

How to change search appearing in header

This topic has 4 replies, 2 voices, and was last updated 6 years, 4 months ago ago by Rose Tyler

margerretta

Participant

July 6, 2018 at 14:52

Hello!
I’d like to edit this search button. I would like it is on the right together with shopping cart and appears like simple search icon without place for typing. Where can I edit header?
http://prntscr.com/k3brrv
Thank you!

#196252 Copied

3 Answers

Rose Tyler

Support staff

July 6, 2018 at 16:01

Hello,

You can edit header structure file depending on header type that you use, in your case, it is xstore/headers/center.php. Do all the changes in child theme files.
If you need help with customization you may contact WPKraken team.

Regards

#196259 Copied

margerretta

Participant

July 7, 2018 at 12:43

Thank you! Then how can I just change this view of search button https://prnt.sc/k3mkju
to this view https://prnt.sc/k3mkzl from another header type

#196282 Copied
Rose Tyler

Support staff

July 9, 2018 at 07:31
In this case, you can use css code (add own code in Theme Options > Styling > Custom css or in style.css of child theme).
For example:
```
.header-search.act-default [role="searchform"] .btn {
    background-color:  transparent;
    margin-right: 3px;
}
.header-search .fa:before {
    color: #b1b1b1;
}
.header-search.act-default input[type="text"] {
    border-color: #c1c1c1;
}
.header-search.act-default [role=searchform] .btn:hover {
    background-color:  transparent;
}
```
Regards
#196304 Copied
Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder

Underwear Store – WordPress WooCommerce Theme

lazy-placeholder

Architecture – WordPress Theme

lazy-placeholder

Marseille04 – WordPress WooCommerce Theme

lazy-placeholder

Home Decor 02 Store – WordPress WooCommerce Theme

lazy-placeholder

Legenda – E-Commerce and Corporate PSD Theme

lazy-placeholder

Typography – WordPress WooCommerce Theme

lazy-placeholder

Zoo Shop – WooCommerce Theme

lazy-placeholder

Agricultural Store – WordPress WooCommerce Theme

lazy-placeholder

Beaty & Cosmetics – WordPress WooCommerce Theme

lazy-placeholder

Boxed Store – WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.