Follow Brian Li (@DecryptoBL) on Twitter.
Follow Brian Li (@bwhli) on Instagram.

Implementing Link Blog Functionality in WordPress

June 14, 2015

I recently discovered Page Links To, a plugin that can be used to add link blog functionality to WordPress. It’s important to distinguish original content with linked content, so here’s how linked posts work on my blog.

Here’s a screenshot of a linked post on BrianLi.com

link-blog-example

Compared to a normal post, a linked post has two major differences.

  • There is an @ symbol to the left of the entry title.
  • There is no read more link.

Initially, I had chosen “Re:” instead of “@”. I ended up going with the latter option simply because it’s more eye-catching. I also decided to hide the read more link because it actually links to Page Links To’s specified external URL. The entry title already exhibits the same behavior, so there’s no reason to display the read more link.

Instead of directly adding the @ symbol into the entry title via the post editor, I elected to use custom CSS instead. Firstly, this makes it easy to change the symbol later on if necessary. Secondly, since the @ is not physically part of the entry title link, it has the added effect of symbolizing a link post – more clarity for readers.

Since I didn’t want to add the @ symbol to all entry titles, I used a custom post class to achieve CSS specificity. Custom post classes can be achieved in the post editor’s layout settings box. Whenever I want to create a new link post, I use pagelinksto for the custom post class.

Here’s what the custom CSS looks like.

.pagelinksto .entry-title:before {
content: "@ "
}
.pagelinksto .read-more {
display: none;
}

The first CSS entry adds the @ symbol before the entry title, and the second entry removes the read more link.


Questions?

Find me on Twitter, or send me an email.