The Joomlashack Blog

Better Preview for Joomla

Written by Ed Andrea Ed Andrea
Published: 09 August 2012 09 August 2012

tutuploadsmedia_1342564952537.pngBetter Preview is a Joomla extension which makes it much easier to see a preview of the article you're writing. 

The core Joomla preview function just returns you to the homepage or an isolated preview that is not integrated with the template.

Better Preview allows you to immediately see the changes you've made to articles. You'll see them on the front of the site, inside your template, and surrounded by modules.

How the normal Joomla preview works

The normal Joomla preview option is limited. It really doesn't give you a good idea of how the article will appear on the site. Here's how the default option works:

  • Click the Preview button in the top-right of the page:
tutuploadsmedia_1344537951297.png
  • You'll see a pop-up with the article inside. 
tutuploadsmedia_1344537939526.png

Step 1: Install Better Preview

  • You can download the extension from https://www.nonumber.nl/extensions/betterpreview
  • There is both a free and paid version available.
  • After downloading, go to Extensions > Extension Manager and install the extension.
  • After it's installed go to Extensions > Plugin Manager.
  • Be sure the Status is "Enabled". If you see a red circle, click it, and it will change to a green circle with a check. Green is the enabled state.
tutuploadsmedia_1342559820767.png

Edit the Options

  • In the Plugin Manager, click the name of the plugin to open it for configuration.
  • Here are the options:
    • Display Link - You can choose to display a link, icon, or both. See the image below as an example.
    • Icon type - Use the default icon for your template, or the one supplied by Better Preview.
    • Link Text - The default link text is Preview. You can change it to anything that will make it easier for you..
    • Display Tooltip - Choosing "Yes" allows a tooltip to show when you hover the icon or link. The tooltip will show you the link to the article.
    • Show Copy to Clipboard - This is only available in the Pro Version. The link you see in the tooltip will be copied to your clipboard ready to paste into an article.
    • Open Sections/ Categories as - Better Preview will show you a category blog or list, even if no menu item is created for the category. The menu item display takes precedence.
    • Disable on Components - Not all components can be previewed. You can exclude any components from the search with this checklist. When a component is disable tn message shows in the tooltip, telling the user to contact the administrator. Clicking the preview link or button will display the home page.
    • Homepage - It's easiest to leave this blank. If a page can't be displayed you are atomically returned to the root. Fill this in, and the preview will return you to whatever URL is put here. For example https://example.com/sample.html
tutuploadsmedia_1342559892480.png

Configure Better Preview

Once you have enabled and configured Better Preview, you'll see a new link in the top-right corner of the admin area.

  1. This is the link to see your article live on the site.
  2. The tooltip shows the article title, the default Joomla URL to the article, and whether there is a menu link to this article. 
If you click the "Preview" link you will see the article you are viewing, surrounded by menus and modules. It will be much easier to picture how the article will appear on your site.
 
tutuploadsmedia_1342561749665.png

 

This is the free version. In the paid version you would also see a "Copy to Clipboard" icon. Better Preview is simple and intuitive. Once you start using it you will really come to rely on it.