Foodie Theme: Choosing Colors

On this page:

  • Announcement Bar
  • Header
  • General
  • Buttons
  • Directional Buttons
  • Pre-footer(Newsletter)
  • Footer

Announcement Bar

These colors control the announcement bar section.

  • Phone number text and bg for the Phone Number content block.
  • Note text and bg for the Shop Note content block.
  • Announcement text and bg for Announcement text content block.

Header

These colors control the main header and its links and dropdowns.

  • Header background color for all pages except the homepage if using the image with text section.
  • Logo text will apply if you do not upload a logo image.
  • Header links apply to the main navigation links and search, account, and cart links.
  • Header hover underline applies to the border under each main navigation link on hover.
  • Drop-down links apply to the links inside a submenu or mega menu dropdown.
  • Drop-down hover link applies when a submenu or mega menu dropdown link is hovered.
  • Drop-down background applies a background color on the submenu and mega menu dropdowns.

General

  • Background applies to the main background color across the entire site.
  • Secondary Background is set to white on install and is applied in a few different areas across the site, here is a list:

  • The secondary background is used on the Product Grid and Collection Grid background below product content when hovered.

  • The secondary background is used on the Featured Menu section background color.

  • The secondary background is used on the Customer reviews section background on the product page.

  • The secondary background is used on all Image w/Text sections below the text.
  • Links and Links hover color applies to all links used in Rich Text areas.
  • Box shadow color applies to all shadow effects throughout the design like the shadow in the Image W/Text picture above.
  • Borders apply to all borders and lines throughout the whole site.
  • Sale tag applies to the small rectangle tag on the collection grid of products. The color will apply to the tag background and will always use white text.
  • Sold out tag applies to the small rectangle tag on the collection grid of products. The color will apply to the tag background and will always use white text.
  • New icon applies to the small rectangle tag on the collection grid of products. The color will apply to the tag background and will always use white text.
  • Error messages apply to any error messages for cart or quantity.
  • Success messages apply to any success messages for cart or adding to cart.
  • Additional Accents apply to product gallery active thumbnail border, pagination current page border, and slideshow navigation arrows.

Buttons

  • Button border, button border hover, button text, button hover text, button bg, and button bg hover all apply to the regular buttons across the site.
  • Secondary button bg, secondary button bg hover, secondary button text, and secondary button hover text apply to all secondary buttons across the site.

Directional Buttons

  • Directional buttons apply to the arrows and enlarge the icon on the product gallery.

Pre-footer(Newsletter)

  • Pre-footer colors apply to the newsletter section above the footer.

Footer

  • Footer colors apply to the footer section.