Do you want to use my Foodie Pro code snippets? I made three Code Snippets for this Foodie Pro tutorial. They enable you to add a few finishing touches to the site. I’ve only used code snippets for the things Foodie Pro’s point and click settings can’t do.
First decide if you need to use any of my Foodie Pro code snippets.
You will only need to use these code snippets if you…
- Use a dark background color for the footer widget area. Or…
- You want to change navigation bar drop down links hover color. Or…
- You tick the: Show Category Archive Links, tick box. In the Featured Post widget settings. Or…
- You want to add padding above and below the main site
This is how you use the code snippets
Footer bg color
Did you change the background color of the Footer widget area?
This is called the Accent setting in Foodie Pro
Dashboard > Appearance > Customize: Accent Background Color
If you did change the Footer background color…
Paste the Footer Code Snippet in to your stlye.css file. Make sure you paste the snippet at the very bottom of the existing code.
The code snippet will make headlines and text links in the Footer widget area and the Recipe Top widget area white.
Show Category Archive Links
Did you click the, Show Category Archive Links, tick box?
The Featured Post widget has a tick box that lets you add a link to category pages. This link displays beneath the content of your featured posts widget.
BUT! Be careful. This only applies to category archive page links. Not to ordinary More Tag links. So remember. This is only relevant if you tick the: Show Category Archive Links, tick box. This is the very bottom option in the Foodie Pro – Featured Posts widget.
Many people never use this option. If you don’t tick the: Show Category Archive Links, tick box, you will not need this code snippet.
You only need this code snippet if your read more links are two different colors.
For instance, if you look carefully at the two links below, one is green and one is black.
Navbar drop down background color
Do you want to change the color of the drop down links in the Foodie Pro navbar? If you do you will have to change the colors in this code snippet, then paste the snippet at the bottom of your style.css file.
The code snippet uses two colors, white and grey. Just type in your own colors or use the hexadecimal code if you know what that is. If you use the code option, make sure you include the hash sign before the code. For instance #ff000 is red. If you type in the word such as red, green or blue you don’t need the # hash sign.
Padding above and below the main site
This code snippet adds some padding between the top widget area and the main body of the Foodie Pro site.
