Top Bar questions

Hi everyone. I’m so sorry; some things I just have troubles understanding.

Ok, I’m just trying to create a very simple Top Bar. So, I’ve started with Joe’s basis Top Bar which is a 2-column thing. What I’m trying to do is simply add some menu links on the right (standard website stuff like Clients, Support, Contact, etc). On the left, I would like my Logo. Easy enough.

I know how to handle the right side menus and their links. They all work as planned, with their links doing what they should. Stupid question. Why can’t I seem to change the text color of those menu items to WHITE. Is it because I can’t have a word that acts as a link in WHITE?

Next, on the left column, I’ve added Joe’s SVG stack. But when I try dropping my logo (as a JPEG) into the SVG box, my logo appears there, but then when I preview the page, it doesn’t. Can anyone suggest what I might be doing wrong?

Thank you in advance for any help you can give…

Hi John,

Do you have a link to your site, sometimes easier to diagnose issues and help.

I presume you are using Foundation 6?

The SVG stack will/should only display SVG files, which unlike other picture formats are not drag and drop. Click on the default image on the SVG stack and you will see a load of text. This is the SVG contents, which is then drawn to show the image you see in preview.

If you have a SVG file for your logo then you can use this for the SVG stack, just copy in the code. Dropping in a jpg/png will not auto-convert it to a SVG. If you have a jpg/png file for your logo then you’ll have to use the picture stack instead.

I’m just building a menu in F6 for the first time, so might be able to help out on the second part of your question later.

Hey Paul,

Thanks for that super helpful information. Up until now, I didn’t really know what SVG actually is. Sounds to me like I should forget the SVG stack and put a different stack that would take a jpeg.

Will try that in a little bit and let you know!

Thank you SO MUCH!


No worries John.

For the menu links go to Site Styles, click on the blue/white plus icon to add a menu styles swatch. Once you’ve named it and set your colours try applying the swatch to the Menu stack. That should allow you to style the links as you’d like them to be