Writing posts in WordPress, I got sick of trying to remember what tags I had already created and which ones applied to the post I was writing. Maybe you know the feeling?
I searched around… it looked like the perfect plugin for the job was no longer supported. Simple Tags is also a very good plugin, which I used for a while, but I didn’t want to use quite an extensive plugin for something so small. I was using Simple Tags to add tags to my old posts, the clickable tags in the write panel were a bonus. However, I tagges my old posts for a while, and I have pluginaphobia (fear of using too many plugins that need to be updated and depend on other people for development), so I wanted to find a simpler solution.
I decided that a simple text list of the current tags was enough for me, which I achieved. My husband decided it would be so easy to make them clickable and automatically insert the tags, so he grabbed my computer and started javascripting away!
The result (after I applied a bit of styling) was this:
When you click on one of the tags it adds that tag to the post, just the same as if you’d typed the tag into the box and hit enter.
I would have liked to make it a small plugin, but I haven’t figured it out yet. At the moment I’ve edited one of the core files, wp-admin/edit-form-advanced.php.
The code is,
<?php
$tags = get_tags(array('orderby' => 'name', 'order' => 'ASC'));
echo '<p>Existing tags: ';
foreach ($tags as $tag) {
echo '<a style="margin:3px; line-height:3em; padding:3px 6px; background:#eef; border:1px solid #bbb; text-decoration:none;" href="#" onClick="addTag(\'' . $tag->name . '\'); return false" >' . $tag->name . '</a> ';
}
echo '</p>';
?>
<script type="text/javascript">
function addTag(tag) {
var elt = document.getElementById('newtag');
elt.value = tag;
tag_flush_to_text();
}
</script>
The code goes after the end of <p id="jaxtag">
(line 227, after the whole paragraph that is) and before the start of <div id="tagchecklist">
.
There might be a better way to do it, but this works very nicely. Thankyou!
If you know how to make this a plugin this I would appreciate your help! Otherwise, feel free to use this code in your WP setup.
inspirationbit says
this looks very good, Kristarella. Well done, both of you.
If you want to learn how to write a WP plugin, check out Ronald’s series over at Devlounge. He’s really good at explaining things.
P.S. Ronald is the author of the Ajax Edits plugin that you’ve got installed here 😉
dinu says
good job 🙂
anyways, I am using the auto tagger plugin 🙂
Matt Packer says
That’s pretty cool.
Instead of tagging like that, or directly writing articles on my WordPress installations, I use an application called ecto. With ecto I can write articles offline and tag, categorize, etc. and then publish them whenever I go online.
It’s pretty cool and costs about $20 I think.
kristarella says
Thanks Vivien 🙂
I’ve read Ronald’s series. I have written a couple of plugins before. The main problem I’m having with this one is hooking the code into the tag area in the write panel… I think that’s the problem anyway! Anywho, I’ll have another look at it, perhas it will shed some light.
Cheers dinu, do you find that you wind up with too many tags for them to be useful to anyone. Are you tagging mainly for SEO purposes?
Hey Matt,
I tried MarsEdit, but in the end didn’t like it that much, I think it had problems retrieving my categories or something. Does Ecto have any way of knowing what tags you’ve already used? That’s what I mainly wanted this for.
Matt Packer says
Ecto keeps a full list of the tags you use, i’ll do a quick screen cap and link it back for you.
Matt Packer says
Check out the first 4 images on my flickr, http://www.flickr.com/photos/mpimagery/
The first is html edit mode where you can hand code if you like.
The second is WYSIWYG mode where the editor does all the formatting
The third is the retrieved categories
The fourth is a list of all the tags you’ve previously used, you enter new ones below it.
kristarella says
Thanks Matt! Those screenshots explain a lot.
I will look into it more, although I don’t really have a problem writing online. If I write offline I just use a text editor and copy it in later.
dinu says
Yes, sometimes, too many, but you can remove them with single click 🙂 so no problem ..
I have a related posts plugin working on my blog which uses tags to to identify possibly related posts 🙂 that is the main use ..
second, I am too lazy to write tags for every post 😛
Armen says
Nice work!
To be honest, I’ve never fallen for ‘tags’. They’ve always bugged me, and organising them is a task in itself. As a result, I solely use categories.
bipul says
Hi,
Exactly what I was looking for! Thanks. Although “get_tags()” did not seem to work for me, and I had to query the tags from the database directly. However, the tags do not get posted when I click them. I checked the edit-form-advanced.php and found no tag like this
. Instead there is
. Further, the piece of javascript code that you have suggests that the name of the text input field is “newtag” (re: getElementById(‘newtag’)). In my version of wordpress (2.8.4), the text field is not named ‘newtag’ but ‘new-tag-post_tag’. When I replace the id, the name of the tag is passed to the text box, but is not posted. I placed the code just above the
. Am I missing something?
bipul says
seems like my tags got stripped! Edit: *found no tags like this: [p id=”jaxtag”]. Instead there is [div class=”jaxtag”].* Further…. *just above the [div class=”tagchecklist”]*.. Am I missing something?
kristarella says
bipul — I haven’t used this code for some time (WordPress 2.6 I think) because in WordPress 2.7 they introduced a list of commonly used tags in the tag meta box of the write page anyway. I don’t know how the meta box code might have changed since then.
I do know that
get_tags()
still works and gets an array of the tags and their details. I still use that function on my archive page.What are you trying to do with this, given that WordPress has its own clicky list of tags on the write page?
bipul says
Yes, WordPress has its own “most used tags” in the write page. I don’t want “most used”, I want all of my tags to show up there cause I have a specific list of tags and I am trying to build a navigation menu based on these tags. So, I don’t want to add new, but similar, tags (eg. Smart grid, Smart-grid are treated as two different tags) by mistake.
kristarella says
Yes, quite fair enough too. When they were previewing 2.7 at WordCamp they hadn’t decided whether to do most used or recently used, or all of them… I was disappointed with the choice.
I will investigate how to make this work again. Since the functionality is now partially built in, the method of posting the tags has changed a fair bit, but we should be able to work it.
kristarella says
I have the answer for WordPress 2.8.4! This adds clickable tags for all the tags in your blog. Note, it is completely dependent on javascript to add the links to the page, which should be fine under most circumstances (I can’t imagine many people are using the WP dashboard without javascript). Also, it is a standalone thing, you can essentially ignore the instructions in the post.
You can put the following code in your theme’s functions.php file. If you’re using Thesis it would be in custom_functions.php. If your theme doesn’t have a functions.php file you can just make one (starting with
<?php
) and put it in the main directory of your theme. Or you can also create a simple plugin file and activate the code as a plugin.bipul says
Thanks a lot! Really appreciate your effort in trying to figure this out.