How customize primary menu?

Hi there,

How can I customize the primary menu? For example, I need it in bold, but just this menu. Is there a way?

My site:

Thanks a lot!


To make the specific menu bolder, you can use chrome dev tools to inspect the ID element of the menu and add css code.

Here is the example

li#menu-item-10851 {
    font-weight: bold;

And you can put the css code using simple custom css plugin

Hi Awan, thanks for your answer!

I made like you advised me, but the menu was divided in two lines… is there a way to increase the menu’s area, in order to be more near the logo? I think so the menu will fit on one line.

Thanks in advance!

Oh I see…

There is two ways to reduce the width of the header content.

  • Using child theme
  1. create a child theme
  2. duplicate header.php from parent theme to the child theme
  3. change this line:
    <div class="site-branding col-md-4">
    <div class="site-branding col-md-3">

and change this line:
<nav id="site-navigation" class="main-navigation col-md-8" role="navigation">
<nav id="site-navigation" class="main-navigation col-md-9" role="navigation">

  • or using custom css:
.site-branding.col-md-4 {
    width: 25%;

.main-navigation.col-md-8 {
    width: 75%;

Hi Awan,

Your solution worked perfectly!

Thanks a lot!


Feel free to ask here if you need more helps :slight_smile: