Make code for guest/logged out users

I want to add a CSS Style code for logged out users in my viewtopic_body:

Code:

.pun .postmain .user {
display: none!important;
}

Is it possible and where will I add it? in my Template viewtopic_body?

Just add a tag with class inside the logged out user variable:

Code:

<!-- BEGIN switch_user_logged_out --><div class="logged-out">
Content here
</div>
<!-- END switch_user_logged_out -->


Then for the CSS: (Just put some styles)

Code:

.logged-out {

}

so how would look like sir, like this?

Code:

<!-- BEGIN switch_user_logged_out --><div class="logged-out">
.pun .postmain .user {
display: none!important;
}
</div>

<!-- END switch_user_logged_out -->


then CSS

Code:

logged-out {

}

Nope. It should be like this: (Put this on index_body)

Code:

<!-- BEGIN switch_user_logged_out -->
<div class="logged-out">
This is the text that will saw by the users who are not yet logged in.
</div>
<!-- END switch_user_logged_out -->

Then on your CSS, put this one:

Code:

.logged-out {
// Put the styles here
}

but i want it on viewtopic_body , is it possible?

So i would add this:

Code:

.logged-out {
.pun .postmain .user {
display: none!important;
  }
}

Yes. It is possible, you can put them on viewtopic_body template.

here's a photo example sir:



and is this the code, that I will add in CSS

Code:

.logged-out {
.pun .postmain .user {
display: none!important;
  }
}

at which part will I add this

Code:

<!-- BEGIN switch_user_logged_out -->
<div class="logged-out">
This is the text that will saw by the users who are not yet logged in.
</div>
<!-- END switch_user_logged_out -->

to viewtopic_body

sorry if i have a lot of questions

Then use the logged in variable instead:

Code:

<!-- BEGIN switch_user_logged_in -->
<div class="logged-out">
This is the text that will saw by the users who logged in and will not be visible to users who are logged out.
</div>
<!-- END switch_user_logged_in -->

Also, don't use the .pun .postmain .user { as it is considered as redundant of opening tags. Also don't use display: none as it will hide the content of the class connected to it.

uhmm, sir, that's kind of my purpose to hide
.pun .postmain .user {

i want to hide it from Guests how can it be done?

Then just use this one:

Code:

<!-- BEGIN switch_user_logged_in -->
This is the text that will saw by the users who logged in and will not be visible to users who are logged out.
<!-- END switch_user_logged_in -->

The <!-- BEGIN switch_user_logged_in --> / <!-- END switch_user_logged_in --> will automatically hide the content inside it to guest users.

Try using this JavaScript if you don't want to edit templates, add it under Administration Panel -> Modules -> HTML & JavaScript -> JavaScript pages management -> Create a new JavaScript.

Code:

jQuery(document).ready(function(){

if(!jQuery('#logout')){

jQuery('.pun .postmain .user').each(function(){

jQuery(this).replaceWith('<span style="font-weight: bold; color: #ff1010; text-align: center;">You must be logged in to view this content.</span>');

});

}

});

@Ultron's Vision: it doesn't quite work, you can still see it here: http://ggpalace.forumotion.net/t1603-2013-sunny-s-birthday-message-thread

Please help me

Would you do me a favor?
Hover over the 'Register' link and then right-click and click on Inspect Element, then copy what the browser outputs (preferably, use Chrome so you can take a screenshot of the console in case you don't know what to do) in here (I'm looking for the CSS Selector for the Register link) so I can optimize my code above.

here sir

Okay, take the code I posted above and replace it with this.

Code:

jQuery(document).ready(function(){

if($('a[href="/register"]')){

$('.pun .postmain .user').each(function(){

$(this).replaceWith('<span style="text-align: center; color: #ff1010; font-weight: bold; text-decoration: underline;">You must be registered and logged in to view this content.</span>');

});

}

});

Sir, it works , but I can still see this
You must be registered to view this content.

even if I'm logged in

Errr, so I guess that even registered users see the register link somewhere on your site.

Could you provide a test admin account to me via PM so that I can inspect the site and post a new code for you?

yes sir, Even registered users see the "You must be logged in.."

Code:

jQuery(document).ready(function(){

if($('a[href="/register"]')){

$('.pun .postmain .user').each(function(){

$(this).replaceWith('<span style="text-align: center; color: #ff1010; font-weight: bold; text-decoration: underline;">You must be registered and logged in to view this content.</span>');

});

}

});

this works perfectly sir, only registered users see it also...


EDIT: Oh sorry for the trouble sir, thank you for helping Topic Solved

thefirstdanshin wrote:yes sir, Even registered users see the "You must be logged in.."

Code:

jQuery(document).ready(function(){

if($('a[href="/register"]')){

$('.pun .postmain .user').each(function(){

$(this).replaceWith('<span style="text-align: center; color: #ff1010; font-weight: bold; text-decoration: underline;">You must be registered and logged in to view this content.</span>');

});

}

});

this works perfectly sir, only registered users see it also...


EDIT: Oh sorry for the trouble sir, thank you for helping Topic Solved

So it is working for you?

yup i will do it on my other forum

Glad to be of help

Just so that I have it confirmed -- the code is working, and registered users are not affected by the code, did I get that right?

the registered users are still affected though, but I just removed the text:
You must be registered and logged in to view this content and it was fine thanks

Okay, give me about two hours, I'll have some code written for you, then.

ok sir, thank you very much

So after registering, I found a detail which is unique to guests.

Delete all the previous codes I gave you and type this in a new JavaScript under Administration Panel -> Modules -> HTML & JavaScript -> JavaScript pages management -> Create a new JavaScript.

Code:

$(document).ready(function(){

if($('img#i_icon_mini_login')){

$('.pun .postmain .user').each(function(){

$(this).replaceWith('<span style="text-align: center; color: #ff1010; font-weight: bold; text-decoration: none !important;">You must be registered and logged in to view this content.</span>');

});

}

});

WOW~ this one really works i thought it doesn't, I was using IE as my browser, turned out the Jscript was off now it works, i'm using chrome Thank you very very very much!!!!!!!!!!!!!!!!! :*

You're welcome

Don't forget to mark this as solved to simplify the moderators' work

Ok thank you very much Solved~