Change styles of current page link in weebly – Weebly Tutorials

My client asked me to change the color of navigation link of the page that is currently active and the also if it is the sub menu then its color should also be changed. Though its a very simple task but in weebly it’s little tricky. So I’m going to share how I’v completed this custom requirement of changing styles of current page link in weebly.
Steps To Change Styles of Current Page in Weebly:

Step 1:

Go inside weebly editor Design > Edit Html / Css > main_style.css

Step 2:

Add following lines of code at the end of main_style.css

#navigation li#active {
  font-weight: bold;
}

#wsite-menus .wsite-menu li.wsite-nav-current a {
  font-weight: bold;
}

Note:

These ID’s and Classes like #navigation, li#active etc are used by my theme. The ID’s or Classes used by your theme may be different so see your theme’s ID’s and Classes first and then change the above code accordingly (if needed). 

Leave a Comment