You're on the right track putting your script in the wrapper Page Head Content, though there are several other ways of including script blocks, depending on your preference. Previous advice is sound, though you can probably simplify this one a bit. You might leave the CSS rule which hides the icons, then just turn on the ones for the roles you want -- assuming you have far fewer Admin and Support users here than ordinary users -- which you should be able to select like so:
<script type="text/javascript">
(function($){
$(document).ready(function() {
$('.lia-user-rank-icon-left[title="DigitalPlatforms Support"], .lia-user-rank-icon-left[title="Administrator"]').show();
});
})(LITHIUM.jQuery);
</script>
I've wrapped this in a doc.ready so it won't execute until all of the elements in question are loaded. You could substitute Lithium versions of the <script> and doc.ready bits, though that's really not necessary if you're executing this in your wrapper header.
Cheers,
Tyson
Also, if you're going to stick this script in the wrapper header, you might want to wrap it with something like the following:
<#if page.name == "ForumPage"> <script> ... </script> </#if>
So it doesn't execute on every single page on the site.
Cheers,
Tyson
Thanks Tyson.
But its not working for me.
Hi bhupen - The method VarunLuthra mentioned is the way to go, I just made a few tweaks to it, it should work. Please check and let me know if you have any concerns.
<script>
$(".thread-list .lia-list-row .messageAuthorColumn").each(function(){
var getRole = $(this).find('.lia-user-rank-icon-left').attr('title');
if(getRole == "PlayStation MVP" || getRole =="Administrator"){
$(this).find('.lia-user-rank-icon-left').show();
}else {
$(this).find('.lia-user-rank-icon-left').hide();
}
});
</script>
Thanks VarunGrazitti but Iam not sure what iam missing because nothing is working for me. I have followed the following steps but iam not able to make the changes. Please see the steps I followed and correct me If Iam doing anythig wrong:
Step One:
Put the folowing css on skin and enable the all icon
.messageAuthorColumn .UserName.lia-user-name img.lia-user-rank-icon-left {
display: block;
margin-left: -81px !important;
}
aded a Digitalplatforms role in backend.
Step 2:
Put the following code in header section "Page Head Content" and "Page Header". I tried to put code on both section at a time because its not working in any place. First I put the code in "Page Head Content" and later on "Page Header".
Step 3:
Paste the following script on "Page Head content"
-> script is about to show the icon on only on "DigitalPlatforms Support" or - "Administrator" role. But its not working at front end. Suggest me where to put i this script so that it starts working.
<script>
$(".thread-list .lia-list-row .messageAuthorColumn").each(function(){
var getRole = $(this).find('.lia-user-rank-icon-left').attr('**bleep**le');
if(getRole == "Digital Platform" || getRole =="Administrator"){
$(this).find('.lia-user-rank-icon-left').show();
}else {
$(this).find('.lia-user-rank-icon-left').hide();
}
});
</script>
Also I put the icon directly on img tag below script. its showing directly on front end
<img class="lia-user-rank-icon-left" title="DigitalPlatforms Support" alt="DigitalPlatforms Support" id="display_9" src="http://stage.community.us.playstation.com/html/**bleep**ets/true.png" >
<img class="lia-user-rank-icon-left" title="Administrator" alt="Administrator" id="display_7" src="http://stage.community.us.playstation.com/html/**bleep**ets/true.png" >
Please suggest me right step to accomplish this task:
Right now All icon are enable at front end. Although I want only show icon on the role of "DigitalPlatforms Support" and "Administrator".
Thanks
