Support » Fixing WordPress » How to add in a Post Preview Option

  • Okay, got it working.
    There are some interesting hacks to get this to work, so holler if you need more than the sketchy details here.
    First thing first, this is for WP 1.02, not the nightly.
    Second, you’ll need to make a copy of the file wp-blog-header.php, located in your root directory. I called mine ‘wp-blog-draft-header.php’.
    Once copied, edit the file and just change every instance of ‘publish’ to ‘draft’. Look for the words, ‘No point in doing all this work if we didn’t….’ and delete everything after that point (but not the closing PHP tag).
    (You can get a copy of mine at
    I had created a separate individual archive file by copying index.php into a file called individual.php, and then removing most of the stuff I don’t want with the individual archive page — such as the RSS links and monthly archive links and that sort of thing.
    To create a Preview page, I copied this individual page to a new page called draftpreview.php. I then edited the header file to use this new ‘draft mode’ header file, not the publish header file.
    (Note that I can probably clean a lot of this file up, but I don’t care — it works, it doesn’t hurt anything, that’s all I want.)
    The next part is where you have to modify an existing file. MAKE SURE YOU BACK IT UP FIRST!
    In the wp-admin directory, edit the edit-form-advanced.php file, modigying the followin section:
    <?php echo $saveasdraft; ?> <input type="submit" name="submit" value="Save" style="font-weight: bold;" tabindex="6" />
    <input name="publish" type="submit" id="publish" tabindex="10" value="Publish" />
    <input name="referredby" type="hidden" id="referredby" value="<?php echo $HTTP_SERVER_VARS['HTTP_REFERER']; ?>" />

    <?php echo $saveasdraft; ?> <input type="submit" name="submit" value="Save" style="font-weight: bold;" tabindex="6" />
    <input name="publish" type="submit" id="publish" tabindex="10" value="Publish" />
    ID' target='_preview'>Preview
    <input name="referredby" type="hidden" id="referredby" value="<?php echo $HTTP_SERVER_VARS['HTTP_REFERER']; ?>" />

    The part that’s added is the hypertext link to the preview page (make sure the preview page is in the root directory, not the wp-admin.php — there is already a preview.php page in wp-admin).
    That’s it. Works a charm. I’m in the process of trying to formalize this into something for the documentation wiki, including how to make the individual archive page, but I wanted to just post this quickly so that people don’t have to wait.
    Now, if you’re concerned about people seeing this page (and if you don’t link to it, they won’t see it), you put this into a separate directory, or even into wp-admin, but you’ll have to modify the require directive in the top of the file to
    And you’ll also have to adjust any relative links for stylesheets, images, etc.
    You have to save the draft, first, and then edit it to see the Preview button. You can leave the page open as you edit, just click Save and Continue to update the content, and then click Preview again to see the post in process.
    Second update
    Nice feature on this is that once you publish the post, it can no longer be accessed by the Preview page, which is for drafts only. This way if a snoop finds the page, the only thing they can do is pull up your drafts.
    If you want to preview a published page, you’ll have to revert it back to draft mode.

Viewing 14 replies - 1 through 14 (of 14 total)
  • okay lets jus see what happens

    Well, anonymous — feel free to email me for additional directions if you can’t get it working. But you’ll have to actually identify yourself.
    Too bad.
    Too too bad.

    nice hack, but why isn’t it in the hacks section?

    It will be, with a half a dozen others I’m doing. I wanted to finish all of them and clean up the code and actually document it before posting in the official documentation wiki.
    Once I finish the last hack — the redirects for the old MT pages to the new WP pages– then I’ll be done this round, and will put it all online. Promise.
    (Of course, there’s a comment preview….hmmm)

    Great! Have you looked at Alex’s Redirecting MT requests effort?

    Moderator Matt Mullenweg



    It would be neat to put this in an iframe, maybe refreshed with javascript command?

    There really isn’t room on the page for a preview. If there were, you’d have to put it at the bottom and then scroll back and forth to look at it.
    I prefer the separate page. If I make another hack for my own version, it would be to refresh this page everytime the person hits the Save and Continue button.
    However, I did just notice that there is a bug in 1.02 in that draft mode isn’t taking once you publish a post. I imagine this is fixed in 1.2, but will probably look at fixing this in 1.02, too.
    Even when I go to 1.2, I’ll probably take this hack with me — I like the separate page.

    why cant we incorporate the same preview feature that some guy made for the comment thingy… that worked well in all browsers!

    Whoo Hoo! Long Live my comments preview port! I was thinking of hacking something up for this as well.
    Be back in a bit with some expamples and possible implementations…

    jesuit, make a plugin for it please…

    If the direction is to go with the live preview on the same page as the edit, should I bag providing my alternative then? I don’t want to put in the time to clean up or document if it’s only being used by myself.

    Okay I was lying about the plugin thing… it is all done. You can find it here:
    Shelleyp: No, no. This is all about choice! There will be people who will want it in another page/pane, so they won’t use mine; also not everyone is going to want a live preview of what they are typing.
    I for one would love to see what you are working on , and I think Allusion and the other devs would like it as well.
    Hack on!

    You can now find more info on the wiki under plugins.

    Oh and I fixed the problems with the “too many spaces” junk.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘How to add in a Post Preview Option’ is closed to new replies.