| ||||||||||
Shopping cart software Solutions for online shops and malls | ||||||||||
|
X-Cart Home | FAQ | Forum rules | Calendar | User manuals | Login |
How to change the appearance of the Search Box | ||||
|
|
Thread Tools | Search this Thread |
#1
|
|||||||||
|
|||||||||
How to change the appearance of the Search Box
I need to make the following changes to the Search Box at the top centre of each page of my site:
1) Change the background text from "Search Items..." to "Search...". I cannot work out where the text is defined. 2) Change the borders of the Search Box so it is more visible. Again, I am unable to find the relevant CSS statement for this. I would appreciate being pointed in the right direction, please.
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#2
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
1. admin.php?target=labels - search for "Search items"
2. Add to custom css in admin rules for .simple-search-box
__________________
Steve Stoyanov CFLSystems.com Web Development |
|||||||||
|
#3
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
Hi Steve
Many thanks. Label changed. I am using your 2nd Category mod to display the blue-text in the attached image. The space between the menu bar, the 1st Category description and the 2nd Category description is too wide. It looks even wider in mobile view. What is the best way to narrow the gap?
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#4
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
There is no image attached but again this will be custom css. Just add whatever rules are needed to existing classes to control the space.
__________________
Steve Stoyanov CFLSystems.com Web Development |
|||||||||
|
#5
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
Hi Steve
Image attached. I agree, custom css should sort this out. I am struggling working out which bits of the layout to edit. It was much easier with XC4.
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#6
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
Problem solved. My lack of practical knowledge of css had me struggling with "unnamed" classes such as:
table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td{ xxxxxx } I can add the above as custom css but I am worried that if I change the attributes for this combination of elements, it could then mess up the layout elsewhere. How can I avoid that?
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#7
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
The category description is wrapped around a div with class "
category-description " and so is the second category description. The second category description also has "category-description-2 " applied if you need to have specific changes to the second one only.
__________________
Steve Stoyanov CFLSystems.com Web Development |
|||||||||
|
#8
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
Yes, that has partially solved the issue but I also needed to override the css for the table stuff to get rid of spacing added outside these classes.
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#9
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
Hi Steve
Category Description 2 is now perfect. I just need to remove some of the whitespace above and below Category Description 1 (see attachment)
__________________
John Legg www.TheDebugStore.com 5.4.1.18 Business, Crisp White Skin Template Backorder-Preorder Module X-Cart to Zoho Creator (in progress) Zoho Creator <-> Zoho Inventory for order processing NGINX hosted - XC virtual server |
|||||||||
#10
|
|||||||||
|
|||||||||
Re: How to change the appearance of the Search Box
You'll have to play with the css for the element or its parent to make things work the way you want them. It all depends on your theme and what's in the html code. It is really hard to impossible for anyone to tell you what/how to adjust css based on image.
Just use the browser dev tools to make changes then transfer them to custom css in cart admin
__________________
Steve Stoyanov CFLSystems.com Web Development |
|||||||||
|
|
|||
X-Cart forums © 2001-2020
|