HREF Filter

This is my first full complete and functional WordPress plugin. Give me a moment…Okay.

What is it and what does it do? Good question. I support a site that uses WordPress. On this site are some links to an external eCommerce system. The user will generally surf through the main site and click on the link to be taken to a donation page or some other purchase oriented page. Well one morning a few weeks ago I received an urgent phone call from the client. Seems this eCommerce system was down. Which meant the links were dead. The client was calling to ask me to go through the site and for every link to that external system change the HREF to point to an internal page. He was going to start working on the hard part he said, coming up with the copy for the page. I just had to find and replace all the links. Somehow I think I actually heard a snicker in his voice.

Well I go to thinking. I can make the needed changes to the template code where needed. I counted no less than 6 links in the menu and sidebar alone. But what about the dozens of pages of copy. Now, I consider myself a programmer’s programmer. I’ll be damned if I’m going to go through each page and change the links. Also since the external system will most likely be back online I’d have to repeat this little exercise and change the links back to point to the external system again.

So I put together a little JavaScript that will launch via the onLoad event. The first thing to do is find on the links on the given page. No big problem there. Using the JavaScript function ‘getElementsByTagName’ to find all the anchors. Then a simple for loop to check each HREF. If the link began with the external hostname I replaced the full HREF with an internal URL to his new message page. Simple enough. The JavaScript worked like a charm. Only problem is this external eCommerce system seems to be very unstable and there were days when I had to ‘activate’ and ‘de-activate’ JavaScript almost a dozen times. That’s it I cried. I need to put this function into the user’s hands. So I started on the journey to write this working JavScript into a WordPress plugin.

HREF Filter Setup How-to
1. First download the plugin.
2. Unzip this into the WordPress plugins folder ‘/wp-content/plugins’.
3. Access you WordPress admin. Navigate to the Plugins page. Click on the activate link in the right-most column.
4. Once the Plugin is activated, navigate to the Manage -> HREF Filter menu. Note this is not Options but Manage.

HREF Filter Usage
Upon activation there are two Filtered added as examples. There are basically two types of filters supports.

Replace only matched string – Think of this as a search and replace. Enter the searched pattern. Enter in the Replace pattern. For example your search is ‘Miles’ and the replace is ‘Davis’. Then is you have an href like http://www.miles.com/see-miles-play/. This will be filtered and changed to http://www.davis.com/see-davis-play/. The replace value can be any length and can also include the URL node seperator ‘/’.

Replace full HREF value – This is more ‘find the href the contains this pattern and replace the full href value’ filter. For example you have a search pattern of ‘google’ and a replace pattern of ‘http://www.yahoo.com’. Basically any href value that contains the search pattern will be replaced. For the replace you may use values with the leading slash as in ‘/someurl’. This replace filter will be checked and the site URL will be added to the beginning.

Also as part of the Filter setup is the ability to turn the filter off or on. This is handy in that you don’t need to delete and recreate the filter.

As mentioned before, the plugin uses 90% JavaScript code to search/replace the anchor href values. This JavaScript is added to the page’s html header via the WordPress ‘wp_head’ action. As part of this action the function ‘ch_hf_loader’ is called and the JavaScript ‘addLoadEvent’ is called to add the bootstrap function ‘ch_hf_proc_links’. This will start the processing.

You can also call this function ‘ch_hf_loader()’ function direct via PHP to load the needed JavaScript. Also if for some reason you don’t want to auto-load the JavaScript Event, you can also call the function with a single value ‘ch_hf_loader(1)’. This will disable the addLoadEvent call. You then need to call the function JavaScript function ‘ch_hf_proc_links’ yourself to start the processing.

This means once the filters are defined via the WordPress admin interface they will automatically be added to your page’s html head.
Enjoy and feel free to email me with request. I do have plans for the next version of this plugin coming up soon. This is the initial release.

About Paul Menard

Mis-placed Texas Geek now living on North Carolina. Lover of all things coding especially WordPress, Node.js, Objective-C and Swift. Love to work on interesting projects and come away with some new knowledge. Trying to keep my head on while I try to staying abreast of all the latest technologies. Lover of books and cats.