I am trying to design my first wordpress theme. There is a “Edit Button” that should only be visible if the “webmaster” is logged in. For everyone else it should be hidden.
I have given a class to that button (so it looks like the other buttons on the site).
When we are not logged in, the button still shows, but empty.
When we are logged in the code looks like this:
<!-- edit button -->
<div class="editbutton buntbutton">
<a><span class="edit-link mymetatitle"><a class="post-edit-link" href="http://localhost:8888/WP_DEVELOPMENT/wp-admin/post.php?post=1241&action=edit">Edit your post</a></span></a>
</div>
and when we aren’t logged in it looks like this:
<!-- edit button -->
<div class="editbutton buntbutton">
<a></a>
</div>
So the difference is that the “a tag” inside the .editbutton is empty when we aren’t logged in.
Would i be able to check them with jQuery and hide it if the “a tag” is empty? I tryed something like this:
var editbuttonempty = $(".editbutton a").length();
if (editbuttonempty < 1) {
$(this).css("visibility", "hidden");
}
…but it is still not working. Any suggestions on how to do this? Thanks!
What about using
:empty, if so hide its parent:Code:
$(".editbutton a:empty").parent().hide();Demo: http://jsfiddle.net/IrvinDominin/sBAnB/
You can use
text()to get the text data inside div &hide()for hiding divDocumentation : http://api.jquery.com/text/
Also you can use
is()Documentation : http://api.jquery.com/is/
Why show the edit button markup at all to non-administrators?
Why bloat your page with more code to hide the empty edit button markup?
All of the solutions provided are redundant. They simply mask the problem by adding more code. My approach is to handle the issue at its root. The below PHP code checks if your an administrator and shows you the edit button markup, otherwise it shows nothing. No extra code needed.
… or just hide the whole thing from the user(s) with is_admin(). The WordPress design philosophy says ‘do not show thing you do not need’, so you don’t have to fiddle with such things. As long as you don’t try to build a completely ajaxe’s theme.
FIDDLE
Hides the
.editbuttonelement when it contains an empty anchor.