≡ Menu

WordPress Change Preview Post Link Button URL Via preview_post_link Filter

How do change the default “preview” button when posting using wordpress user/admin panel?

You need use the hook or filter called preview_post_link under wordpress to change the default “preview” button when posting. According to wordpress filter documentation:

  1. preview_page_link – Applied to the link on the page editing screen that shows the page preview at the bottom (or right) of the screen.
  2. preview_post_link – Applied to the link on the post editing screen that shows the post preview at the bottom (or right) of the screen.

You need to use functions.php a functions file, which resides in the theme subdirectory. This file acts like a plugin, and if it is present in the theme you are using, it is automatically loaded during WordPress initialization. Edit file using a text editor such as vim:
$ vi functions.php
Append the following code:

// Change post preview button url 
// Change www.cyberciti.biz/faq/?p=124&preview=true
// To server1.cyberciti.biz/faq/?p=124&preview=true
function nixcraft_preview_link() {
    $slug = basename(get_permalink());
    $mydomain = 'http://server1.cyberciti.biz';
    $mydir = '/faq/'; 
    $mynewpurl = "$mydomain$mydir$slug&preview=true";
    return "$mynewpurl";
add_filter( 'preview_post_link', 'nixcraft_preview_link' );

Save and close the file. Another example:

function nixcraft_update_post_link($link) {
        //replace www part with server1 using the following php function
        //preg_replace ( patter, replace, subject ) syntax
        $link = preg_replace('/www/', 'server1', $link); 
        return $link;
add_filter('preview_post_link', 'nixcraft_update_post_link');

You can use the same filter when previewing to posts from a secure page (taken from secure-admin plugin):

function sa_post_link($link) {
	global $pagenow;
	if ( ('on' == $_SERVER['HTTPS']) && ('wp-comments-post.php' != $pagenow) )
		$link = preg_replace('/^https?/', 'https', $link);
	return $link;
add_filter('preview_post_link', 'sa_post_link');
add_filter('preview_page_link', 'sa_post_link');
Share this tutorial on:

Your support makes a big difference:
I have a small favor to ask. More people are reading the nixCraft. Many of you block advertising which is your right, and advertising revenues are not sufficient to cover my operating costs. So you can see why I need to ask for your help. The nixCraft, takes a lot of my time and hard work to produce. If you use nixCraft, who likes it, helps me with donations:
Become a Supporter →    Make a contribution via Paypal/Bitcoin →   

Don't Miss Any Linux and Unix Tips

Get nixCraft in your inbox. It's free:

{ 7 comments… add one }
  • Paul Thomson April 1, 2013, 3:31 pm

    Why on earth would you ever need to do this??

    • Mehdi April 8, 2013, 1:38 pm

      Because sometimes you need a different url structure (for your posts or pages), so the preview url has to reflect the real url structure, or it could show a 404 instead of the post preview.

    • Alex Leonard February 7, 2014, 2:02 am

      I have a perfect use-case. I’m using WordPress as an API for post content but the posts are actually appearing on a Laravel driven bespoke web-app.

      As a result WordPress is not handling front-end display of post content at all.

      Thank you NixCraft for sharing this!

  • Terry May 31, 2013, 11:17 pm

    I am having a problem where all of my links all show the same preview under them..

    Whatever the top post is reading as a preview is being put under all other posts, any idea why?

  • Matthias Max July 10, 2015, 8:49 pm

    This doesn’t seem to work for me in WP 4.

    Did anyone else try it?

  • toddkh November 19, 2015, 5:01 pm

    Thanks for sharing, this is great, I have it working like this: (in wp 4.3.1

    function update_preview_link() {
        $slug = get_the_ID();
        $mydomain = 'http://myreviseddomain.com';
        $mynewpurl = "$mydomain/preview/$slug";
        return "$mynewpurl";
    add_filter( 'preview_post_link', 'update_preview_link' );
  • Tim October 13, 2016, 8:27 pm

    Absolutely needed this today! We build a custom preview engine and needed to change these links globally!

Security: Are you a robot or human?

Leave a Comment

You can use these HTML tags and attributes: <strong> <em> <pre> <code> <a href="" title="">

   Tagged with: , , ,