Integrating External Content with WordPress
I've been developing andrewj.com for about 15 years, and
although I'm not that prolific I've built up quite a lot of content.
I recently converted my blog from an old bespoke (= "custom", for my
American friends) solution to one based on WordPress. However, this
created a problem, in that the WordPress model is to hold all content in
the database, and that wasn't the right model for me.
Firstly, I have a number of articles which are very long for a blog
post, and I had no interest in restructuring them. I also didn't want to
break external links to the existing articles.
Next, I decided that I wanted the freedom to continue to write in
that style. Some of my writing takes several weeks, and it works for me
to draft it as separate HTML pages. I also sometimes want to include
active content or multiple images, and I don't want to create a large
and unwieldy WordPress database full of such stuff.
Finally, my online photo galleries are managed and generated using
Jalbum, and I wanted to find a way of neatly integrating single images
into my blog, complete with the watermarks and metadata extraction which
Jalbum manages so well, without duplicating that functionality in
This is probably typical of many older web sites, but WordPress
doesn't really embrace the integration of external content. This article
describes how I solved this problem, and a WordPress plugin I have
developed to make my solution reusable.
The Requirements for Integration
My requirements for "integrating external content" derived from what
I'd done with my bespoke blog, and can be summarised as:
- WordPress should publish the abstract / commentary /
announcements. I would write these separately to the main article.
WordPress should also handle feed generation and so on.
- Default links from WordPress (for example, from the post title)
should go to the full external article, not the blog post. There
should be separate links to the Permalink and so on. This should all
be automated driven by the addition of one item of metadata to the
post, a link to the external page.
- WordPress should also handle the collection and approval of
comments and trackbacks. These should be visible appended to the
external page, with a link back to the WordPress post for further
commenting. This should be capable of integration with any web page,
by the addition of a maximum of one line of HTML code.
- For image posts, WordPress should automatically link to the the
image and bring in its metadata from the relevant Jalbum slide page.
I'm not interested in merging the whole of my album into WordPress.
The image should be accessed as a link, not copied into the
WordPress file structure.
- WordPress should also manage comments on my album. It should be
possible to comment on any image in my album without having a blog
post for every image.
- Image posts should include a thumbnail of the image in my feeds,
which will show up in feed-readers (such as Internet Explorer's feed
reader, or Google's feed support).
Essentially the solution is as follows:
- "Tag" any blog post with one of three custom fields, each of
which contains the URL of external content: link (for pages
outside your web site), full (for pages on your web site),
or image (for a Jalbum slide).
- Add code to your WordPress theme which adds or modifies
appropriate links in the post if it finds one of these custom
- For posts with an image tag, use S C Chen and Jose
Solorzano's excellent simplehtmldom library to parse the Jalbum
slide page, extract the main <img> tag and optionally the image
metadata, and include those in the blog post.
- Develop a couple of simple php pages which attach to WordPress
and display any comments on the relevant post. Include these in an
iframe on the relevant external pages.
- For external articles, the <iframe> code includes the blog
post slug, so it links back directly to the original blog post.
- For Jalbum slide pages the mechanism is slightly more
generic, extracts the URL of the parent slide page, and points
back to a generic WordPress page for managing image comments.
- Add code to the WordPress page template so that it can display
an image (in the same way as for a blog post with an image
tag), and then marks any comments with the root filename of the
image to which they apply.
The WordPress Plugin
I've wrapped my solution up into a WordPress plugin. To use this
you'll have to be willing to edit your theme files, a couple of
general-purpose include files and, if you're linking into Jalbum, the
slide template for your Jalbum skin.
The plugin is designed and tested to work with WordPress 3.0, but it
should work with 2.9 which also supports the required metadata
|Your can download the latest version from the
WordPress plugin repository.
If you like this plugin,
then feel free to make a donation towards future developments.
Detailed instructions for using the plugin are on
The Instructions Page.
If you'd like to comment on this article, with ideas, examples, or just to
praise it to the skies then I'd love to hear from you.