Setting up the menu

You can create a menu for Berlus as you would do for any other theme. Go to “Appereance-Menus” and drag and drop the sites you want into the menu area. If you can not find a specific page make sure to check if the box that contains the site is displayed: On the top right of the page – click “Screen Options” and then check all areas you want to display.

IMPORTANT: You have to tell WordPress that this is the menu you want to use as primary menu! Scroll to the bottom of the page and check “Theme location – Primary Menu”

 

Berlus Special Menu

Berlus has a very innovative menu style, which is actually very easy to create. First go to “Appearance-Theme Options- General”. Scroll down to “Menu Settings” and click on “add new”. Upload a small image that you want to appear on in the menu. The image should be small to make the menu work properly. Keep in mind that the image will always be right aligned! You can activate/deactivate an automatic gradient below the “Menu Settings” if you want the image to fade into the background color of the box. Add a title and text for the box. Important: Add a Menu class. This can be whatever, for example “menuimage1”. This will be very important for the next step: Go to “Apearance-Menus”. Now chose the link you want the box to appear on. Move it into the menu area. Click on the little arrow next to the item and in the box called “CSS classes (optional)” enter the menu class you created before (we called it “menuimage1” here. Save your menu and you are done. (Can’t see the input box? On the top right of the page – click “Screen Options” and then check all areas you want to display, including CSS Classes)

How to use the mega menu

Berlus features a mega menu. Setting it up is quite easy. First you want to upload an image to use as a background for the mega menu. The image should be small to make the menu work properly. Keep in mind that the image will always be right aligned! Go to “Appereance-Theme Option“ Scroll down to “Mega menu images”. Upload your image(s) and save your changes. Name the elements 1,2,3 etc. Now go to “Appereances-Menus“ Click on the arrow at the right of any menu item. You will find the inputfield called “CSS Clases“ (If not, on the top right of the page – click “Screen Options” and then check all areas you want to display, including CSS Classes) in here type the words “mega-menu mega-menu1“ The number after the second “mega-menu“ is the number for the image you uploaded in the theme options. For example if you uploaded three images in the theme options in the mega menu image area, to show the second image as background image write “mega-menu mega-menu2“.

megamenu

The next step is to create heading for the rows within the mega menu. Create a dummy menu item for this. You can create a dummy menu item by chosing “Links”. Add “#” as “URL” an a name of your choice for “Link Text”. “Links” is not showing as an option? On the top right of the page – click “Screen Options” – check “Links”

menu2-1

Underneath your headings you can now add all the pages, posts etc. you want!

 

How to change the main menu font size

If you need to modify the site’s main menu font size you would have to modify this css line that’s on styles.css at line 43. You could modify it there, or by adding the css rule to the CSS section of the theme options. This section code overrides any theme default code.

.menu li a { 
    font-size: 12px; 
}

 

Rate This Article

(11 out of 42 people found this article helpful)