WordPress: Add Preview Button in Distraction Free Writing

Print View Mobile View

This code snippet adds a preview button to the right of the Save button in Distraction Free Editor in WordPress.
dfw preview button

function dfw_preview_button() {
?>
<script type="text/javascript">
;(function($) {
	var $preview = $('#post-preview');
	$preview.clone()
		.removeAttr('id').removeClass('preview').addClass('right')
		.css('margin-left', '5px')
		.click(function(e) {
			$preview.click();
			e.preventDefault();
		})
		.insertBefore('#wp-fullscreen-save input.button-primary');
}(jQuery));
</script>
<?php
}
add_action('admin_footer-post-new.php', 'dfw_preview_button');
add_action('admin_footer-post.php', 'dfw_preview_button');

Drop the code in your active theme’s functions.php file. (via)