DFLL plugin update: now supports “Press This”

### The Boring Backstory

On Tuesday, I read about Justin Blanton’s [Slugger+](http://hypertext.net/projects/sluggerplus) WordPress plugin, which allows you to set your [post slug](http://wordpress.org/tags/post-slug) by entering your desired slug enclosed in `[slug]` tags, e.g. `[slug]this-is-my-slug[/slug]`. I wondered if I could adapt my [Daring Fireball Linked List plugin](http://yjsoon.com/dfll-plugin) to do the same, i.e. if someone entered, `[dfll]http://yjsoon.com[/dfll]` somewhere in their post, the plugin could find the URL and set the custom field link to it.

So I tried implementing this, and I was stalled when I [ran into a problem](http://wordpress.org/support/topic/adding-a-custom-field-from-content_save_pre-filter-through-xmlrpc?replies=2). Apart from posting it on the WP forums, I emailed Justin to see if he had any ideas. Coincidentally, he had been working on the same feature, and he’d also run into the same problem! I went off for work, and a few hours later, Justin emailed to say he’d solved the problem, and he released his [CF Setter](http://hypertext.net/projects/cfsetter) plugin the next day.

After CF Setter was released, I decided not to replicate its functionality in my plugin. (If you’d like to use that feature, go take a look — you just need some minor adjustments to get it to work with my plugin.) Instead, I thought I’d try and adapt Justin’s code to solve another problem: posting using WordPress’s built-in “[Press This](http://codex.wordpress.org/Press_This)” bookmarklet. [Shawn Blanc](http://shawnblanc.net/2009/08/wp-linked-list-plugin/) had put up a customised version of the bookmarklet’s code a while ago, but I was never comfortable with editing core files, what with automatic upgrades and all.

### New Coolness: Link from Post Content

So, long story long, a few hours and a lot of painful regular expression writing later, the [new DFLL plugin](http://yjsoon.com/dfll-plugin) supports “Press This” by extracting the link from the first anchor tag in the post content.

Here’s how you use it: First, turn on the setting in the options page. Next, on any page you’d like to link to, just click the “Press This” bookmarklet, and the following will pop up:

Screen shot 2011 03 31 at PM 08 15 13

Click on the end of the first line, press enter (_be careful not to delete the period!_), and type whatever comments you’d like. The plugin will automatically __grab the URL in the first line__, __set it to the linked\_list\_url custom field__, and __delete the entire first line__ for you, preserving whatever you’ve entered into the rest of the post content. Ta-da! Linked list item!

If you’d like to use this with the [MarsEdit](http://www.red-sweater.com/marsedit/) bookmarklet, you can customise the Attribution preference as follows:

Screen shot 2011 03 31 at PM 08 25 09

More details are on the [DFLL plugin](http://yjsoon.com/dfll-plugin) page, which I’ve linked to thrice already in this post. Many thanks to Justin Blanton for his plugins which both inspired and laid the foundations for this feature.

Questions and comments? Look for me on [Twitter](http://twitter.com/yjsoon) or through the [contact form](http://yjsoon.com/contact).

Customising your WordPress theme for the DF Linked List plugin

I’ve received quite a few emails asking about how to customise WordPress themes for the [Daring Fireball Linked List plugin](http://yjsoon.com/dfll-plugin). Since the plugin only affects the RSS feed items’ links, some users aren’t sure how to get the same effect on their webpages. So here’s my attempt at helping budding link-bloggers build their own “DFLL-compliant” WordPress themes. For this guide, I’ll be basing my instructions on the (current) default WordPress theme, [TwentyTen](http://2010dev.wordpress.com/).

[__Aside__: To briefly answer another question I’ve gotten more than once — instead of just changing the RSS links and then going through all this trouble to adjust the theme, why doesn’t the plugin just change your permalinks? Because then you wouldn’t get _any_ permalinks to your linked list posts. If that’s your cup of tea, though, you can try the [FeedWordPress](http://feedwordpress.radgeek.com/) plugin.]

__Disclaimer__: Please be careful! I’ve done a bit of testing, but I can’t be responsible for helping you if you mess up your WordPress install with these instructions. Back up! If you don’t know where to find these theme files, or if you’re not comfortable mucking around with code, you might be better off getting someone to do it for you. I can help for a small fee — see the bottom of this post.

### Before you begin

Did you actually [install the plugin](http://yjsoon.com/dfll-plugin), either from the link or by searching in your WordPress blog’s plugin directory? Please do, before following any of the instructions below.

### The Quick Way: Using a child theme

I’ve prepared the methods below as a [child theme](http://codex.wordpress.org/Child_Themes), which will only work if you have TwentyTen installed in the default directory. This could be useful if you’re starting a new blog.

You can either get it here: [TwentyTen DF Linked List Child Theme](http://yjsoon.com/files/twentyten-dfll.zip), or find it in your DFLL plugin directory if you have the latest version. Move it to your WordPress themes directory, and activate it.

### The Long Way: Editing your theme manually

This section goes into detail about how to edit your theme by hand. You might want to read this if you’re not using TwentyTen but are vaguely familiar with how PHP and WordPress themes work.

First, edit the linked list titles on your main page. To do this, open up loop.php, and look for this line around line 126:

<h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>

Edit it to:

<?php if (is_linked_list()): ?>
  <h2 class="entry-title linked-list-item"><a href="<?php the_linked_list_link(); ?>" title="<?php printf( esc_attr__( 'Link to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?> &rarr;</a></h2>
<?php else: ?>
  <h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
<?php endif; ?>

__Notes__:

* The first section occurs twice. The first occurrence, on line 62, applies only to gallery items — you want the second occurrence on line 126. (Line numbers may have changed in later versions of WordPress.)
* I’ve taken the liberty of changing the link title to become “Link to your post title” instead of “Permalink to your post title”, and adding a right arrow (→) at the end of your post title. You can change these in line 3 of the code. If you want, you can use the symbol you define in the DFLL settings by using get_glyph().
* Readers can still click on the date to get to the permalink. You can change this, of course.
* I’ve also added a class to your title, linked-list-item. You can use this to style the title to look different from your other entries. Take a look at how Misters [Blanc](http://shawnblanc.net/) and [Brooks](http://brooksreview.net/) do it.

Next, you should also edit your single page template, so that if anyone gets to your link post’s permalink, they can get to the link. Open single.php and look for this line (line 22, in my version):

<h1 class="entry-title"><?php the_title(); ?></h1>

It doesn’t link to anything at the moment, so you can either make it go to your link:

<?php if (is_linked_list()): ?>
  <h1 class="entry-title linked-list-single"><a href="<?php the_linked_list_link() ?>" title="Link to <?php the_title_attribute(); ?>"><?php the_title(); ?> &rarr;</a></h1>
<?php else: ?>
  <h1 class="entry-title"><?php the_title(); ?></h1>
<?php endif; ?>

… or you can just insert the link below, like so:

<h1 class="entry-title"><?php the_title(); ?></h1>
<?php if (is_linked_list()): ?>
<div class="linked-list-single"><a href="<?php the_linked_list_link() ?>" title="Link to <?php the_title_attribute(); ?>">Go to this link</a></div>
<?php endif; ?>

Edit my suggested defaults as appropriate, of course.

_Update, 31 March_: I forgot something when I first wrote this article — how to add the permalink glyph into your post. (Thanks go to [Jason Clarke](http://twitter.com/jasonclarke) for reminding me.)

Here’s how you add a permalink glyph to your linked list posts:

<?php if (is_linked_list()): ?>
 <div class="linked-list-permalink"><?php the_permalink_glyph(); ?></div>
<?php endif; ?>

This adds a link, using the glyph you define in the plugin’s options page, to this post. With this, you can probably get rid of other links that come by default in TwentyTen — try searching for other anchor tags to the_permalink. (Note: Previous versions of this had a link to the permalink surrounding the call to the_permalink_glyph, which resulted in a double link. This has been fixed — thanks to [Nat Robertson](http://overanalyze.net/) for pointing it out.)

If you want this permalink glyph to show up for all posts (and not just linked list posts), remove the first and third lines (the “if” and “endif” ones).

I only put this in loop.php, so it only shows up on the front page, since I suppose the single-page view is already at the permalink.

If you’re not using TwentyTen, look for similar code in page.php, post.php and single.php. Usually, you’ll want to find a h1 or h2 tag that calls the WordPress function the_permalink(), something like the below:

<h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>

Which you can adapt to:

<?php if (is_linked_list()): ?>
  <h1><a href="<?php the_linked_list_link() ?>" title="Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
<?php else: ?>
  <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
<?php endif; ?>

Hopefully these examples have given you enough information to do some “pattern-matching” on how to identify the code to change, and what to change it to. Once again, remember to back up before doing anything drastic!

### References

* To see an example of the plugin and theme in action, go to my [test blog](http://soon.sg/blog), which has the plugin set up and the child theme installed.
* If you want to create your own WordPress theme instead, [here’s a walkthrough](http://line25.com/tutorials/how-to-create-your-own-custom-wordpress-theme) by Chris Spooner.
* If you’re migrating from Tumblr, Ian Hines has you covered with a set of [detailed instructions](http://ianhin.es/wrote-about/tumblr-to-wordpress/).

### None of this makes any sense. Can you do it for me?

Sure, I can customise your theme for a small fee. [Get in touch](http://yjsoon.com/contact) and we’ll work something out.