Editing the Edit This WordPress Template Tag

For those of you just reading WordPress blogs, there is a part of the blog, just under the title, that you can’t see. If you are the administrator, owner, or chef-cook-and-bottle-washer of a WordPress blog, and logged in, you see it. It’s called the Edit Post Link Template Tag.

Once you are logged in, the Edit This Post Link shows up, allowing you to click it to access the Write Post editing panel to make changes in the post.

The Edit Post Link can go anywhere. Most WordPress Theme designers put it under the title, next to the categories, but it can be in your post meta data section or anywhere you want it, as long as it is in the WordPress Loop, the PHP code that generates your post content.

The core template tag for the Edit Post Link in WordPress is:

<?php edit_post_link(); ?>

By default, it appears only when the viewer is logged into the blog, and as a normal link.

Edit This

What if you want it to say “Fix This Puppy” instead of “Edit This”? You can do that:

<?php edit_post_link('Fix This Puppy'); ?>

Fix This Puppy

By default, it creates a link. There is no list or paragraph or line break code within it. It just sits wherever you put it and shows up when you are logged in. So what if you want it to be in its own line below the title?

<h2 id="post-" class="posttitle"><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
<?php edit_post_link('Fix This Puppy', '<p>', '</p>'); ?>

The end result might look like:

Title of This Post Fix This Puppy

The parameters for the Edit Post Link are:

<?php edit_post_link('link text string', 'before', 'after'); ?>

You can add any tags or text before or after the link.

Styling the Edit Post Link – Make It Stand Out

One of the problems I have with many WordPress Themes is the lack of obvious blatancy with the Edit Post Link. If I find an error, I want to find it NOW and fast, quickly jabbing the link so I can fix the boo boo before too many people see it. When it is smashed up against the categories list, or tucked into a corner of the web page design, I have to search around for it. A panic can hit me as I just know people are reading this and thinking I’m an idiot because I misspelled “from” as “form”. I need that button NOW.

Using your WordPress Theme stylesheet, you can style your Edit Post Link to look distinctive – okay, let’s be blunt about this – in-your-face-obvious. There are two ways to do this.

<span class="editthis"><?php edit_post_link('FIX THIS'); ?></span>

OR

<?php edit_post_link('FIX THIS', '<span class="editthis">', '</span>'); ?>

Whether you put the styles outside or inside of the template tag, you can style it however you want. For my examples, I added >>EDIT THIS<< to the link text for emphasis. The following adds a simple border in red around the link and puts the text in bold.

span.editthis a {margin-left: 10px; padding: 5px 10px 3px 10px; font-weight: 600; color: black; border:2px single red; }

Or really add some emphasis with a red background to the link.

span.editthis a {background: red; margin-left: 10px; padding: 5px 10px 3px 10px; font-weight: 600; color: black;}

Now add a black border to the red background and it is outlined with emphasis.

span.editthis a {margin-left: 10px; padding: 5px 10px 3px 10px; background: red; font-weight: 600; color: black; border:2px single black; }

Want to add a little more emphasis? Add a yellow background hover so the background of the link changes when the mouse moves over it.

span.editthis a:link, span.editthis a:visited {background: red; margin-left: 10px; padding: 5px 10px 3px 10px; font-weight: 600; color: black; border: 2px solid black;}
span.editthis a:hover {background: yellow; color: black;}

You can style it however you want to make it stand out against the regular page content. It is to help you or your users find the Edit Post Link. Since regular visitors never see it, who cares what it looks like. Only those who need it. So, experiment and see how it works for you.

BlinkList | Blogmarks | Digg | Del.icio.us | Ekstreme Socializer | Feedmarker | Furl | Google Bookmarks | ma.gnolia | Netvouz | RawSugar | Reddit | Scuttle | Shadows | Simpy | Spurl | Technorati | Unalog | Wink | Yahoo MyWeb2

---

Site Search Tags: wordpress, template, tags, edit, post, link, styles, web, page, design, theme, files, login, log, logging
Copyright Lorelle VanFossen