Absolute <> Relative Urls
Posted on by
This plugin converts WordPress absolute URLs into relative URLs when saving to the database. Then it converts back to absolute URLs when content is displayed. This maintains respect for SEO while giving the site owner greater flexibility.
Background
Since I started working with WordPress years ago, I've been one of those who has been frustrated with it's reliance on absolute URLs. Many designers and SEO artisans argue vehemently that URLs should always be absolute. End of story. Adjust your workflow to accommodate.
Don't build a site in development and then move it to production. Never copy a site from production into a test environment. Never change a domain name. Don't migrate from http to https. And if you are foolish enough to find yourself in one of these situations, suck it up and run a script on the database to catch and change all occurrences of absolute URLs. When a simple search and replace on the post_content
field isn't sufficient, look for a plugin that will do more.
SEO experts like Yoast make valid points. They've convinced me that absolute URLs are important when content is presented. But context is also important. There is nothing in their arguments that imply URLs must be absolute when stored in the database. We can achieve the requirements of both sides of the debate.
At the time of this writing WordPress is up to version 4.4.x and progress has been made in the way URLs get stored in the database. As long as images are loaded through the Upload Media tool, they appear to be saved in the database as root relative URLs. A featured image appears to adapt automatically when a site URL changes. So the challenge isn't as great as it could be.
The first iteration, version 1.0, of this plugin dealt with post content and the Black Studio Tiny MCE editor, dropping the site URL when it was saved and putting it back in when viewed. The second iteration, version 1.1, added the capability to the post excerpt.
Installation
wordpress.org
- In WordPress go to Plugins->Add New and locate the plugin (e.g. search 'absolute relative url'
- Click the install button
- Activate the plugin through the 'Plugins' menu
oxfordframework.com
- Download the plugin from www.oxfordframework.com/absolute-relative-urls to your Desktop (or other known location)
- In WordPress go to Plugins->Add New->Upload Plugin and upload the plugin file just downloaded
- Activate the plugin through the 'Plugins' menu in WordPress
That's it! Check your database after you've saved some content. URLs should be root relative. Check your editor. URLs should be absolute. Check the source on your web page. URLs should be absolute.
Example
Here is what you see when you edit the download button link in this post:
<a class="button" href="https://www.oxfordframework.com//wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
When you look at the same text in the_content
field for this post in the database, the scheme and domain have been removed:
<a class="button" href="/wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
And when you look at the source of the final displayed page, it's back to its original self:
<a class="button" href="https://www.oxfordframework.com//wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
Customization
There may be more places where hooks will be required. As a minimalist, I've chosen to wait until I see the need before including additional hooks. If you identify a need, please let me know. Email andrew@pattersonresearch.ca or add to the comments below. In the meantime, you can add your own hooks in your functions.php.
To remove the site URL and make it relative (when saving):
add_filter( 'filter_hook', 'pri_relative_url' );
To insert the site URL and make it absolute (when viewing):
add_filter( 'filter_hook', 'pri_absolute_url' );
The 'filter_hook'
has to be chosen carefully, and these functions do assume that the hook accepts $content
as the first parameter and returns $content
with the site URL removed or inserted.
Closing thoughts
Should you stop using the plugin your website will still work. The plugin saves root relative URLs and browsers assume the same domain when they see a relative URL. Exceptions may be when you are running in a subdirectory and that is part of your site URL, or if you are providing an RSS feed to third parties where absolute URLs are required and your feed doesn't explicitly add your domain.
Any posts or pages created prior to installing this plugin will not be impacted. If you are just starting out with a few pages you can edit each one and save it. That will bring them up to date. But if you have hundreds or thousands? Well in that case you probably know how to install and run a plugin to mass convert from absolute to relative URLs in your database. Should you do that, make your URLs root relative and this plugin will convert to absolute URLs when viewed.
Happy URLing!
This plugin converts WordPress absolute URLs into relative URLs when saving to the database. Then it converts back to absolute URLs when content is displayed. This maintains respect for SEO while giving the site owner greater flexibility.
Background
Since I started working with WordPress years ago, I've been one of those who has been frustrated with it's reliance on absolute URLs. Many designers and SEO artisans argue vehemently that URLs should always be absolute. End of story. Adjust your workflow to accommodate.
Don't build a site in development and then move it to production. Never copy a site from production into a test environment. Never change a domain name. Don't migrate from http to https. And if you are foolish enough to find yourself in one of these situations, suck it up and run a script on the database to catch and change all occurrences of absolute URLs. When a simple search and replace on the post_content
field isn't sufficient, look for a plugin that will do more.
SEO experts like Yoast make valid points. They've convinced me that absolute URLs are important when content is presented. But context is also important. There is nothing in their arguments that imply URLs must be absolute when stored in the database. We can achieve the requirements of both sides of the debate.
At the time of this writing WordPress is up to version 4.4.x and progress has been made in the way URLs get stored in the database. As long as images are loaded through the Upload Media tool, they appear to be saved in the database as root relative URLs. A featured image appears to adapt automatically when a site URL changes. So the challenge isn't as great as it could be.
The first iteration, version 1.0, of this plugin dealt with post content and the Black Studio Tiny MCE editor, dropping the site URL when it was saved and putting it back in when viewed. The second iteration, version 1.1, added the capability to the post excerpt.
Installation
wordpress.org
- In WordPress go to Plugins->Add New and locate the plugin (e.g. search 'absolute relative url'
- Click the install button
- Activate the plugin through the 'Plugins' menu
oxfordframework.com
- Download the plugin from www.oxfordframework.com/absolute-relative-urls to your Desktop (or other known location)
- In WordPress go to Plugins->Add New->Upload Plugin and upload the plugin file just downloaded
- Activate the plugin through the 'Plugins' menu in WordPress
That's it! Check your database after you've saved some content. URLs should be root relative. Check your editor. URLs should be absolute. Check the source on your web page. URLs should be absolute.
Example
Here is what you see when you edit the download button link in this post:
<a class="button" href="https://www.oxfordframework.com//wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
When you look at the same text in the_content
field for this post in the database, the scheme and domain have been removed:
<a class="button" href="/wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
And when you look at the source of the final displayed page, it's back to its original self:
<a class="button" href="https://www.oxfordframework.com//wp-content/uploads/pri-absolute-relative-urls.zip">Download</a>
Customization
There may be more places where hooks will be required. As a minimalist, I've chosen to wait until I see the need before including additional hooks. If you identify a need, please let me know. Email andrew@pattersonresearch.ca or add to the comments below. In the meantime, you can add your own hooks in your functions.php.
To remove the site URL and make it relative (when saving):
add_filter( 'filter_hook', 'pri_relative_url' );
To insert the site URL and make it absolute (when viewing):
add_filter( 'filter_hook', 'pri_absolute_url' );
The 'filter_hook'
has to be chosen carefully, and these functions do assume that the hook accepts $content
as the first parameter and returns $content
with the site URL removed or inserted.
Closing thoughts
Should you stop using the plugin your website will still work. The plugin saves root relative URLs and browsers assume the same domain when they see a relative URL. Exceptions may be when you are running in a subdirectory and that is part of your site URL, or if you are providing an RSS feed to third parties where absolute URLs are required and your feed doesn't explicitly add your domain.
Any posts or pages created prior to installing this plugin will not be impacted. If you are just starting out with a few pages you can edit each one and save it. That will bring them up to date. But if you have hundreds or thousands? Well in that case you probably know how to install and run a plugin to mass convert from absolute to relative URLs in your database. Should you do that, make your URLs root relative and this plugin will convert to absolute URLs when viewed.
Happy URLing!