How to make description links open in a new window

There may be times when you want to open all links from an external feed in a new window. There are a few things to take into account when doing this:

The best way to target specific HTML tags for modification is by parsing the DOM. Newer versions of PHP have a DOM extension, but because SimplePie still supports PHP 4.x, SimplePie is not currently built on the PHP DOM extension (SimplePie 2.0 will be, however). In light of this, the simplest solution would be to use the DOM support in the web browser's JavaScript implementation. Even Internet Explorer 6.0 (which currently has the oldest, most outdated JavaScript engine, version 1.3) supports the scripting we're going to use.
It's bad practice to hard-code your event handlers to your code, so we'll want to separate it from our HTML as much as humanly possible.
We're going to strictly adhere to the notes in YoungPup's How to create popups tutorial.

:!: This tutorial assumes that you're already familiar with using SimplePie, including looping through items. This is only sample code, and you should not create real pages using the (horrid) HTML generated by this example.

Compatibility

Supported in SimplePie 1.0.
Code in this tutorial should be compatible with PHP 4.3 or newer, and should not use PHP short tags, in order to support the largest number of PHP installations.
This solution requires a modern web browser. 2001's Internet Explorer 6.0 is the least capable of the previous generation web browsers, so this will be our baseline browser.

Let's do this!

The first thing you'll need is Ben Nolan's Behaviour JavaScript library. We'll use this to easily add our event handlers to make the windows open in a new window instead of the current one. Save it in the same directory as the following SimplePie page.

Save the following source as a page and view it in your browser. You should be able to do a normal left-click to open the links in a new window, right-click to see all available contextual menu options, or middle-click to open the page in a new tab (in most current generation web browsers).

<?php
require_once('../simplepie.inc');
 
$feed = new SimplePie('http://simplepie.org/blog/feed/');
$feed->handle_content_type();
 
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">    
<head>
	<title>Test Page</title>
 
	<!-- http://bennolan.com/behaviour/ -->
	<script src="behaviour.js" type="text/javascript"></script>
 
	<script type="text/javascript">
	// All <a> tags inside if a <div class="feeds"> tag will open in a new window.
	// See Behaviour's documentation for details on syntax.
	Behaviour.register({
		'div.feeds a' : function(a) {
			a.onclick = function() {
				window.open(a.href);
				return false;
			}
		}
	});
	</script>
</head>
 
<body>
 
	<div class="feeds">
		<ol>
			<?php foreach ($feed->get_items() as $item): ?>
 
			<li><a href="<?php echo $item->get_permalink(); ?>"><?php echo $item->get_title(); ?></a></li>
			<?php echo $item->get_description(); ?>
 
			<?php endforeach; ?>
		</ol>
	</div>
 
</body>
</html>

tutorial/how_to_make_description_links_open_in_a_new_window.txt · Last modified: 2011/03/06 03:56 (external edit)