[Michael]

Hi,

There are three things I would like to change in the Catch Evolution Pro theme:
1. Move the Top Fixed Menu Bar to below the logo.
2. Increase the font size in the Top Fixed Menu Bar.
3. Change the background and font color in the Top Fixed Menu Bar.

Thanks in advance for your help!

Nancy

[Sakin]

@Michael:
1. Top fixed menu is fixed menu at the top and it cannot be moved below the logo. So, why don’t you use Primary Menu instead.

2. To increase the font size in the Top Fixed Menu bar, you can edit the font size in the following css and then add it in “Appearance => Theme Options => Custom CSS” box:

#fixed-header-top ul li a {
    font-size: 14px;
}

3. You can change the background and color code in the following css as per you need and then add it in “Appearance => Theme Options => Custom CSS” box:

/* Background */
#fixed-header-top {
    background-color: #000;
}
/* Text Color */
#fixed-header-top ul.menu > li a {
    color: #ddd;
}
/* Text Hover Color */
#fixed-header-top ul.menu li:hover > a,
#fixed-header-top ul.menu ul :hover > a,
#fixed-header-top ul.menu a:focus {
	color: #fff;
}

[Michael]

Sakin,

Thanks for your help. I did try the Primary Menu and it looks great, except it lacks the color transparency of the Top Fixed Menu. Can transparency be added to the Primary Menu?

Thanks,
Nancy

[Sakin]

@Michael: For transparency, you need to add that color code in rgba as well. So, replace the following css:

/* Background */
#fixed-header-top {
    background-color: #000;
}

With the following, where you need to change both colors:

/* Background */
#fixed-header-top {
	background: #000;
	background: rgba(0, 0, 0, 0.7);
}

[Michael]

Michael,

Where would I find the code I need to replace? I found something similar in the CSS Stylesheet but not a match. Also, the replacement code appears to already be there.

Please advise. Thanks for your help with this!

Nancy

[Sakin]

@Michael: If that css:

#fixed-header-top {
	background: #000; /* This is fallback if the browser doesn't support transparent then full color */
	background: rgba(0, 0, 0, 0.7); /* this first 3 digit if rgba color and last 0.7 is transparency. 1 is full color and 0.7 mean 70% fill and 30% transparent. 
}

You can generate color code from http://html-generator.weebly.com/css-rgba-color-generator.html

[Will]

Hi

These css code suggestions answer many of my similar questions about the fixed top menu. But I’d also like to change the background of the dropdown/secondary menus coming off the fixed top menu items. Currently they’re semitransparent black. I’d like them to be the same as the dropdown items off the primary menu.

Also, is there a way to right justify the fixed top menu items so they align in the same way as the primary menu items? (not all the way to the left but aligned with the first content column’s left edge).

Thanks.

[Sakin]

@Will: Please post in your site URL so that I can check in.

[Author]

Posts