Lightning Rank - Private Blog Network

Create A WordPress Post Source Root Domain URL From An External Sites Full Article URL

By Leave a Comment

Recently when creating a tumblr style theme for wordpress I wanted include a source article link  in the wordpress post_type links linking back to the original article. When I was displaying the source link I wanted it to display only the sites root domain as the source rather than the full url of the article. This tutorial will teach you how to achieve this through a php function that you can easily place within your own themes functions.php file to get the same feature on your existing wordpress site.

The main article title links to the source article on the external site and it also shows the root domain as the source “from poynter.org” instead of where the blog author name would usually be.

wordpress-short-url-example

What will this tutorial teach me?

  1. You will learn how to use custom fields to link to the source article.
  2. You will learn how to create a post metabox for the custom field input.
  3. you will learn how to shorten the full article url to show the sites main domain as the source in your post.

Lets get started.

Step 1: Create Custom Field On Your Post

First off we need to create a custom field in your post where you will reference the external articles source link url. Call this new custom field source_url.

source-url-custom-field

Step 2: Shorten Custom Field External Site URL

The php function below will shorten the full external articles URL that you referenced in the custom field to the root domain of the website. I have commented the code so to indicate what each step of the function does to the full URL to help you better understand it’s workings.

//------------------------- [ Short Post Source URL ] ------------------------//

function short_source_url() {
    // Get the post ID
    $PostID = get_the_ID();
    // Get source url for this post
    $source_url =  get_post_meta($PostID, "source_url");
    // Remove http:// from full url
    $urlexplode = explode("//", $source_url[0]);
    // Remove everything after the domain / from full url
    $urlexploded = explode("/", $urlexplode[1]);
    // Remove www. if present from full url
    $short_source_url = str_replace('www.', '', $urlexploded[0]);
    // Output the shortened source url
    echo $short_source_url;
}

Step 3: Display The Shortened External Article URL In Your Theme

To display the shortened root domain url in your post content simply place the code below where you would like the URL to display in your theme files.

<?php short_source_url() >

Below is an example of where I placed the code and selected between Standard Post and Link Post details using conditionals.

    <?php if ($source_url = get_post_meta($post->ID, 'source_url', true)) { ?>
    <p class="post-meta"><?php _e('In', 'wpshock'); ?> <?php the_category(''); ?> - <small><?php short_source_url() ?></small></p>
    <?php } else { ?>
    <p class="post-meta"><?php _e('Posted in', 'wpshock'); ?> <?php the_category(''); ?> <?php _e('by', 'wpshock'); ?> <span class="fn"><?php the_author() ?></span></p>
    <?php } ?>

Next if you want your post title to link to the full external source URL do something like this below. Again I have used conditonals to detect if your post has an external source link or not, if not it shows the standard post title that links to your own post page. If your post does have a custom field source_url your post title will then link to the external article source full URL.

    <?php if ($source_url = get_post_meta($post->ID, 'source_url', true)) { ?>
    <h2><a href="<?php echo $source_url; ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'wpshock' ), the_title_attribute( 'echo=0' ) ); ?>" target="_blank"><?php the_title();?></a></h2>
    <?php } else { ?>
    <h2><a href="<?php the_permalink() ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'wpshock' ), the_title_attribute( 'echo=0' ) ); ?>"><?php the_title();?></a></h2>
    <?php } ?>

Step 4: Adding A Post Write Screen MetaBox For Your Custom Field

If you want to make it a little easier to insert an articles source url on the post create screen of wordpress you can use a metabox specifically for custom fields and in this case the source_url field.

Create a file titled post-metabox.php in your theme directory and copy the code below into that file then save it.

<?php 

// Custom fields for WP write panel
// This code is protected under Creative Commons License: http://creativecommons.org/licenses/by-nc-nd/3.0/

$wp_submission_metaboxes = array(
		"image" => array (
			"name"		=> "source_url",
			"default" 	=> "",
			"label" 	=> "Article Source Link URL",
			"type" 		=> "text",
			"desc"      => "Copy the URL of the article you would like to link to here."
		),
	);	

function submission_meta_box_content() {
	global $post, $wp_submission_metaboxes;
	echo '<table>'."n";
	foreach ($wp_submission_metaboxes as $wp_metabox) {
		$wp_metaboxvalue = get_post_meta($post->ID,$wp_metabox["name"],true);
		if ($wp_metaboxvalue == "" || !isset($wp_metaboxvalue)) {
			$wp_metaboxvalue = $wp_metabox['default'];
		}
		echo "t".'<tr>';
		echo "tt".'<th style="text-align: right;"><label for="'.$wp_metabox.'">'.$wp_metabox['label'].':</label></th>'."n";
		echo "tt".'<td><input size="70" type="'.$wp_metabox['type'].'" value="'.$wp_metaboxvalue.'" name="submission_'.$wp_metabox["name"].'" id="'.$wp_metabox.'"/></td>'."n";
		echo "t".'</tr>'."n";
		echo "tt".'<tr><td colspan="2"><span style="font-size:11px">'.$wp_metabox['desc'].'</span></td></tr>'."n";
	}
	echo '</table>'."nn";
}

function submission_metabox_insert($pID) {
	global $wp_submission_metaboxes;
	foreach ($wp_submission_metaboxes as $wp_metabox) {
		$var = "submission_".$wp_metabox["name"];
		if (isset($_POST[$var])) {
			if( get_post_meta( $pID, $wp_metabox["name"] ) == "" )
				add_post_meta($pID, $wp_metabox["name"], $_POST[$var], true );
			elseif($_POST[$var] != get_post_meta($pID, $wp_metabox["name"], true))
				update_post_meta($pID, $wp_metabox["name"], $_POST[$var]);
			elseif($_POST[$var] == "")
				delete_post_meta($pID, $wp_metabox["name"], get_post_meta($pID, $wp_metabox["name"], true));
		}
	}
}

function submission_meta_box() {
	if ( function_exists('add_meta_box') ) {
		add_meta_box('theme-settings',$GLOBALS['themename'].' Additional Post Details','submission_meta_box_content','post','normal','high');
	}
}

add_action('admin_menu', 'submission_meta_box');
add_action('wp_insert_post', 'submission_metabox_insert');

Now open your themes functions.php file and add the code below to activate the metabox.

require_once (TEMPLATEPATH . '/post-metabox.php');

As always all feed back and any imporvemnts or questions you have please leave a comment.

Leave a Reply