MyBB Community Forums

I'm currently working on coding a theme, but I've come across a little problem. I have a Sign Up button that isn't located in the header_welcomeblock_guest template, but I only want to show it when the user is logged out. So I added this code into the header_welcomeblock_guest template to only hide it when the user is logged out:

<script type="text/javascript">
if(document.getElementById('sign_up').style.display == "block"){
document.getElementById('sign_up').style.display = "none";
}else{
document.getElementById('sign_up').style.display = "block";
}
</script>

I know the code is sloppy but I was just testing. Anyways, here's the element:

<div class="sign_up" id="sign_up">
<a href="#">Sign Up! <i class="icon-cloud"></i></a>
</div>

I also have the element set to display: none; by default. However, it just won't show up, logged in or not. Any idea why? Hopefully I didn't just spell something wrong. xD

Kinda, extremely off topic but I like Create Account better than sign up.

I'm guessing this is for FK correct?

Use the MyBB user id variable as part of the class name - if it is class_name0 then display block, else display none.

Thanks a bunch Leefish, worked after a bit of testing (Though I think my problem was including the Javascript before the element was created). Here's the finished code if anyone is interested ^.^

<script type="text/javascript">
var sign_up = document.getElementById('sign_up0');
if (sign_up !== null)
{
	// Show the sign up
	sign_up.style.display = "block";
}
</script>

<div class="sign_up" id="sign_up{$mybb->user['uid']}" style="display: none;">
<a href="#">Sign Up! <i class="icon-cloud"></i></a>
</div>

@Trickshot - Sure, might as well switch, and that's what's it's for. ;p

There is a CSS-only version of this

hide it by default and add

.yourbutton {display:block;}

in the header_welcomeblock_guest template

I hope i didn't miss something coz that would make me sound stupid

and use

jQuery(document).ready(function() { 
//your code here
});

To overcome the 'element created after javascript executed' problem

Well, I wanted to keep all the CSS in the global.css file, inline isn't good practice. xD And I don't want to use jQuery due to it flashing elements before it hides them. With regular Javascript that doesn't happen. ^.^

Thanks for the suggestions though.