Category bar

Avatar
heartland
  • Answered
Half of my categories are under my category bar on the home page. They are hidden. Notice that account wish list etc are in the category bar. I have never seen that before. This is a new template for me.
Dog toys ..cat toys.....dog sweaters are hidden...just under the bar
Replies 1
Avatar
0
Arn
Hello Heartland, Anytime that you are having formatting issues, you may need to manually change formatting of the elements of the screen. This can typically be done with the CSS. In this, case you can find this by using a browser like Chrome and then right click on your website page, and use INSPECT ELEMENT to identify what needs to change. You can even change the values on the fly using the element inspector to see the changes live - but making the change that way isn't permanent. You would still need to find the associated CSS file and then change the value of the width allowed by that menu. Right now, the default value is something like 750 pixels. If you change it to 1200 pixels, then menu stays in the bar. However, you will also need to move the SEARCH bar. You can do this by changing the TOP value (basically a margin) that will force the search bar up or down. And again, this value is found in the CSS (the file is styles.css) file for the theme that you are using. Chromes ability to make these changes on the fly to see how they may look is invaluable. I'll walk you through one of the changes: If you're not already using the browser, download it, then right-click on the element you want to change and select INSPECT ELEMENT. This will open a window full of CSS code - but don't be afraid of it. Look in the right hand column and search for STYLES. Under styles there will be several windows. Look for Matched CSS Rules and stylesheet.css:409. Under this will be the formatting options for that section of the page. If you have a wheeled mouse, try this trick. First, move the screen so that you can see both the screen of your web page AND the code you're changing. Next, double-click on the number next to WIDTH. This should highlight. Now use the wheel on your mouse and go up or down. If you don't have a wheeled mouse, then simply change the value. Observe the change to your menu on the screen. This change will happen live. We settled at 1200px as the appropriate value. If this is okay for you then you find the STYLES.CSS file, open it to edit it (you can use the file manager editor), then look for the stylesheet.css:409 section (just like we found it above). Change the value for the menu and save. You will need to also move the SEARCH BAR and the item with the blue shopping bag (labeled Shopping Cart in the CSS ). I'm not sure what you'll prefer, but I moved the Search bar UP and to the left so that the CHECKOUT button didn't move. You will need to re-arrange these elements of the page using the CSS formatting. As you make these changes, hopefully, you'll find that it's not very difficult and a valuable thing to know so that you make changes in other web pages or other themes. I hope this helps put your new theme in order. Please let us know if you require any further assistance. If you have any further questions, please contact technical support available 24 hours a day / 7 days a week. Arnel C. InMotion Hosting Community Support Team