Create your own stylesheet switcher for any website


Here following the steps in this article to make your own stylesheet switcher for any website. You can use that to show the different color schemes or styles for websites.

Add scripts on your template

Make sure that you have included jQuery on your web template. If you don’t have jquery then simply follow the code below

Add this code before </head> tag

Now add the stylesheet switcher’s JavaScript bellow,


 Link your own styles

add your own styles there with different css.

Eaxmple :

For red.css body{background-color:red}, for  blue.css body{background-color:blue}, for green.css body{background-color:green}

Add switcher menu in template

when you will click on the menu item then particular css file will be select automatically. If you want to add more menu item there, you should add extra stylesheet link too on your website head area.

How can i change the content for every page after click on menu ?

Just add the content’s  href link in switcher menu.

Example :



About Author

I have no more personal information to share with you but have enough experience to share with all. I am always funny