How to add CSS selectors based on page title
This tips is, in a sense, the next part of my tutorial on how to modify Xenporta portals, but this way, using nothing other than page titles.
This quick tutorial can be used with every pages which don't add CSS selectors on them. It allows you, in association with my last tips, to take full control on your page because you will be able to add a CSS selector at the very top of your html code.
1) Creating the template and the script
First thing to do is to create a new template in which you will put your jquery script. You will have to include it on your board using the way you want.
In this template you will put
This little code will track your h1 and will analyse their content. If this content is "yourtitle", it will add your custom class, pretty easy. However, this function is case sensitive so you will need to enter the right title (sometime it's not the one you see on your page).
2) How to take full control?
Nothing easier, just add after the code you entered.
Based on the class you add if the title is "yourtitle", you will add the class "newclass" to the body.
Every changes you will want to do after that will have to have .newclass at the beggining and this way, you will only change the good page.
I wish you success.
This tips is, in a sense, the next part of my tutorial on how to modify Xenporta portals, but this way, using nothing other than page titles.
This quick tutorial can be used with every pages which don't add CSS selectors on them. It allows you, in association with my last tips, to take full control on your page because you will be able to add a CSS selector at the very top of your html code.
1) Creating the template and the script
First thing to do is to create a new template in which you will put your jquery script. You will have to include it on your board using the way you want.
In this template you will put
Kod:
<script>
$( "h1:contains('yourtitle')" ).addClass( "yourclass" );
</script>
This little code will track your h1 and will analyse their content. If this content is "yourtitle", it will add your custom class, pretty easy. However, this function is case sensitive so you will need to enter the right title (sometime it's not the one you see on your page).
2) How to take full control?
Nothing easier, just add after the code you entered.
Kod:
<script>
$("body:has(."yourclass")").addClass(newclass);
</script>
Based on the class you add if the title is "yourtitle", you will add the class "newclass" to the body.
Every changes you will want to do after that will have to have .newclass at the beggining and this way, you will only change the good page.
I wish you success.