Hamburger menu for cell phones and tablets

[rherhood]

I have X theme with Ethos1. I would like to set up a mobile hamburger menu for devices other than desktops.
I am at a loss and just don’t know where to start. My site is at carbonsteelcookware.com if that helps.
Any help would be greatly appreciated. It seems like other themes put in the hamburger menu automatically like ocanwp and a few others. I need it for my X theme though.
Thanks
Bob

[paul.r]

Hi Bob,

Your mobile button is actually there but it’s not visible because it is similar in color to your navbar background.

To change the color to make it visible, you can add the code below in Theme Options > CSS

.x-btn-navbar.collapsed {
    color: #000;
}

.x-btn-navbar.collapsed:hover {
    color: #000;
} 

Hope this helps

[rherhood]

Paul,
Thank you. I can now see the hamburger.
How can I make the hamburger a little bigger and how can I change the color when it is inactive and active?
bob

[rherhood]

Wow…I added it to the options>CSS and it worked fine, then just stopped showing?

[rherhood]

I added this CSS
.x-btn-navbar,
.x-btn-navbar:hover,
.x-btn-navbar.collapsed,
.x-btn-navbar.collapsed:hover {
color: #220F0C;
}

But the hamburger color shows white. No matter what hex color I insert the color does not change from white. Any idea what I am doing wrong?

[thai]

Hi There,

Please try adding this custom CSS under Theme Options > CSS instead:

.x-btn-navbar.collapsed {
    color: #000
}
.x-btn-navbar.collapsed:hover {
    color: #847f7f
}
.x-btn-navbar {
    color: #af8787
}
.x-btn-navbar:hover {
    color: #d85151
}

In case you want to learn CSS please watch the videos below.

Thanks

[rherhood]

I sent a secure message. The last CSS did not change the color from white?

[jade]

Hi there,

The CSS code did not because there was a CSS error in the code you have in the Global CSS.

I have gone ahead and fixed. You should be able to see the burger menu icon now.

Hope this helps.

[rherhood]

Thank you so much. I really appreciate your help. You saved my hours of work. I have to look to see what errors I made in the Global CSS…
All is ok now.

[ruenel]

You’re welcome!
We’re glad we were able to help you out.

[rherhood]

I have another unrelated question and I know that I should start another topic of request. I would but the question is long so I thought I would present it here. I am using X theme with Ethos 1. When I write an article I assign a category to that article so that it shows up under the correct menu item like “Buyer’s Guide”. What is happening is that the article shoes up under two or more categories that I did not designate. What am I doing wrong?

[jade]

Hi Bob,

Do you have any specific articles that this issue happens to? I tried checking your site and they seem to be fine.

For example, the Vollrath French Style Carbon Steel Fry Pans article that is on the Buyer’s Guide category also shows up in the Featured Article category because both categories are assigned to the post:

This is also the same case as What is the Best Carbon Steel Skillet?.

In case there is a specific article in question, please let us know which article/post that is so that we can check.

Thank you.

[rherhood]

The article is “5 Best French Cuisine Cookbooks for Your Kitchen” and I have the category as “Buyer’s Guide” in which it does show up. However it also shows up under the Home page for some reason?

[nabeel]

Hi again,

I see your homepage is a blog page and the blog page shows all the posts regardless of the categories you assigned. I also noticed you’ve updated Cornerstone but didn’t update the X theme which can cause issues in future. Always make sure to update both X and Cornerstone to the latest version to avoid potentials conflicts. You can find the latest version numbers here: (http://theme.co/changelog/) Then you can compare them to what’s installed on your site.

If you find anything to be out of date, you can review our update guide.

Hope this helps!

[rherhood]

Thank you much

[nabeel]

Glad we could help.

Cheers!