I’m having a hard time figuring out how to move the search bar on our site. I would like to move it from the top-left header to the right side of the header. Any help would be greatly appreciated.
Hello There,
Please share your store URL and screenshot.
So that I will check and let you know the exact solution here.
Hi @7XCHANGE
Aibek is here from Speedimize.io
You already have a search in the header on the right, but it is only hidden. To make it visible, find the class below and delete display: none in styles. css. To search, use the combination ctrl+f or cmd+f
As a result, it should be as below:
.logo-area__right .show-search-link {
margin-right: 20px;
}
It remains to delete the search, which is located on the left. If we are not mistaken, this can be done through the Online Store->Themes->Customize.
But if there is no such option, then write the style below at the very end of styles.css:
.logo-area__left .show-search-link {
display:none;
}
1 Like
Hi @7XCHANGE ,
Please send your site and if your site is password protected, please send me the password. I will check it for you
Hi @7XCHANGE ,
Please follow the steps:
-
Step 1: Go to Online store > Themes > Actions > Edit code.
-
Step 2: Go to Assets > styles.css and paste this at the bottom of the file:
.logo-area__left .show-search-link{
display: none !important;
}
@media (max-width: 767px){
.logo-area__left .show-search-link{
display: inline-block !important;
}
}
.logo-area__right .show-search-link{
display: inline-block !important;
}
@media (max-width: 767px){
.logo-area__right .show-search-link{
display: none !important;
}
}
For some reason, it didn’t work when I copied the code