I currently have a sharepoint site setup with subsite links located on the left-hand side, but the text for each link are the same color. I would like know how to make each link text a different color?
2 Answers
So basically you are going to have to access the list items in the menu and then set the colours from there. You will have to access the item by it's class as the ID is dynamically created so:
var nodeList= document.getElementsByClassName("ms-core-listMenu-root");
var listItems = nodeList[0];
You will then have to set the colour of each item in the list:
for(var i=0; i<listItems.length; i++){
listItems[i].style.color="#00FF00";
}
You will just need to create an array of different colours and loop through that at the same time you are looping through the links.
Hope this helps.
-
I am basically a beginner with Sharepoint, and I am unsure exactly how I go about accessing the code to make the modifications that you listed above. The Master file does not show subsite information. I know where to make the changes when you inspect the element of the page but those changes can be saved.– KyleFeb 2, 2016 at 13:30
-
I am not sure how you are going to do by sub site. My solution merely hooks into the section where sub sites and lists are displayed. You would have to further add logic to ensure the section you are modifying is the list of sites. I am not sure where SharePoint builds the list. I assume there is some code in behind that does it as I don't believe it is done in one of the .js files. This means you have to wait for the page to render to modify the list. You can do this by attaching a .js file to your master page or adding the code directly to the master page (not recommended). Feb 4, 2016 at 16:30
You can override style for menu Items in masterpage or alternate style section (From master page change menu you can see it). You can find those Item class or html tag using browser developer tools easily.
