tl;dr I’ll be *****ed if I will use such a cliché.
This post is a bit techy, and is mainly for WordPress tinkerers, aimed to help explain something in an email I am sending Tom. But hey, you never can know if someone else is trying to do something like this.
Hopefully you can know the difference between a WordPress Page and Post, or a web page and a WordPress Page. Simple, eh? There are times when it’s useful for me to have something that presents a URL on my WordPress site that looks like its part of the site as a Page but redirects the visitor elsewhere.
This is not needed for WordPress menus, where you can code a URL into a menu as a link. It’s really meant for sites where I list a series of pages, and I want to have that external one included in the mix. Most often, it’s when I use the Page List plugin to create an index to a series of pages, and I want to include something that’s actually not on my site. Sure I could just make a stub page with a “go here” link but #lame.
For example, in the UdG Agora site, I have essentially a site map (because typically I create more stuff than people can ever find), and use the Page-List shortcode to generate an index of all Pages on the site. But two of the items listed, one for Vivsible Tweets and the other for our Tag Board, actually bop you somewhere else:
Items in the red boxes look like Pages but are redirectors
Doing this calls for adding a template to your theme (which should obviously say #YouCantDoThisOnWordpress.Com get yer domain, willya?). Create a new one called page-direct.php and put this into it:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<?php /* Template Name: Page Redirector Page holder that transparently sends the viewer elsewhere via url in custom field. Featured image etc can still be used on front */ global $post; // check if we have a custom meta field requesting a redirect to a different URL $redirect = get_post_meta( $post->ID, 'redirect', true ); // check if the custom field has a value if ( ! empty( $redirect ) ) { // bingo! send us there instead wp_redirect ( $redirect ); } else { die ('Ooops, someone forgot the redirect! Do something about this'); } ?> |
It looks for a custom field named redirect and will divert the browser there before any WordPress stuff appears.
In use, you create a new Page, and from the Template menu in the bottom right, select Page Redirector. This says, ‘Don’t do what WordPress wants to do, do what Alan wants to do’.
Name the page whatever you want it to look like when pages are listed. It needs no content.
Now you need to add a custom field. If you do nott see that below the fold, hit the Screen Options thing in the top right, and check the box to tell WordPress you want to see them (you should only need to do this once).
The first time you do this you will have to click the Enter New link for a custom field
In the name field enter redirect (no variations allowed), and in the value, enter the URL where you want to send your visitors. It’s highly likely you want to send them to my blog
If you every do this again, the redirect name will now be available on the drop down menu of available custom field names.
That’s all folks.
Now, if you every click a link to this page, you go instead to the URL you put in the custom field.
This gets really nifty when you use the Page-List code for generating a graphic index of the pages you want to show (pagelist_ext shortcode). What’s neat here is that the same redirector will do its thing, but you can add a featured image to the page (used in the shortcode), and the content you use in the Page (now use it) becomes the description text.
For example, on the UdG Agora How to Participate page at http://udg.theagoraonline.net/how/ the first item for welcome looks like it is a sub page http://udg.theagoraonline.net/how/welcome/ but actually it redirects to the site’s About Page (thus saving me from copying content) (because most of my tips are written for me).
Chance are you never need to use this; but I rely a lot now on the Page-List plugin to generate indices of Page structures on my site. That saves time too in creating navigation lists because it is generated dynamically based on your Page structure.
Top / Featured Image credit: Public Domain image by Hans on pixabay https://pixabay.com/en/spectrum-light-spectrum-optics-113364/. I have to say that pixabay is a real goto these days for good, reusable images.
I hope I’m reading this wrong and you were trying to do something different, because I really hate when I struggle and fight to figure something out and some guy chips in and says “Oh, didn’t you know there’s a plugin that does exactly that with no trouble?”
I don’t want to be that guy. But did you try the Page-Links-to plugin?
You are that guy 😉 I cannot remember if I have seen the plugin, but yes it does the same thing.
Here’s my rationale. I try to be parsimonious on the plugins for the load they put on the whole stack. But can I see the little bit of code I run in a php template has less impact than similar code in a plugin? I might say that the plugin gets loaded on every access on the site, even where it is not needed.
But more importantly, in trying to figure this out in code, I am always amping up my understanding of WordPress. If I reach for the plugin first, it’s like just knowing there’s an engine under the hood rather than poking around in it with your hands.
Plus this was easy to do, it took me maybe 15 minutes max from idea to code. If I struggled, I might have pulled my head out and looked for a plugin. But I see lot of plugins that do stuff just as easily rolled into a function.
6, half of a dozen, makes no difference to the person clicking the link, right?
Thanks Joe
I fixed this today. For some reason, although the twitter button code is inside a div I set to visibility:none via document.(ready) the code for the twitter buttons is written via Javascript as an iframe, which while inside the div, shows up in Safari.
I end-arounded by setting the position for the dic to left:-3000px rather than making it invisible, and when it needs to be showm, my jQuery adjust the CSS to be left:20%
Seems to work as expected in Safari on laptop and iPad. Thanks for catching this
(https://wordpress.org/plugins/page-links-to/)