I would like to increase the padding between the bottom of the category menu bar and the top of the main slider. Please advise where to look and I will play with it.
Hello heartlandpet,
To find out where things are located in PrestaShop, I would recommend using Google Chrome as your web browser. The element inspector makes it pretty easy to find things to edit.
The example of wanting to change the padding between the main image slider and the top menu, can be accomplished like this:
In Google Chrome on your page hit Ctrl Shift C to open the element inspector.
As you move your mouse cursor around the page, elements will highlight blue.
Hover around till you're just over your image slider, you should see a pop-up with a.nivo-imageLink 960px x 400px click on that blue box.
The element is opened in the Elements tab at the bottom, but this is just the anchor link element itself.
Hit the up arrow key to move up one element to the <div id="slider" class="nivoSlider" element.
Now on the far right you should see the Styles tab.
Hope that helps. If these answers are helpful to you, please be sure to come back and mark them as best answer or comment if you had any further issues with them.
- Jacob
- In Google Chrome on your page hit Ctrl Shift C to open the element inspector.
I'd recommend this change: /prestashop/modules/csslider/jquery.nivo.slider.css Line 1As you move your mouse cursor around the page, elements will highlight blue.
Hover around till you're just over your image slider, you should see a pop-up with a.nivo-imageLink 960px x 400px click on that blue box.
The element is opened in the Elements tab at the bottom, but this is just the anchor link element itself.
Hit the up arrow key to move up one element to the <div id="slider" class="nivoSlider" element.
Now on the far right you should see the Styles tab.
In the second section you should see:
.theme-default jquery.nivo.slider.css:1 #slider { margin: 0 auto; height: 400px;
Click on jquery.nivo.slider.css
Right-click anywhere on the CSS script that pops up, and click on Reveal in navigator.
You should now see the full path of your file as:
/prestashop/modules/csslider/jquery.nivo.slider.css
.theme-default #slider { margin:25px auto; height:400px; }
Hope that helps. If these answers are helpful to you, please be sure to come back and mark them as best answer or comment if you had any further issues with them. - Jacob