Avatar of Leevi Graham

LG Live Look v1.1.0 View entries in template context from the ExpressionEngine control panel publish tab and edit entry table.

Download LG Live Look v1.1.0 Table of contents

Need help setting up ExpressionEngine templates with LG Live Look?

I have written a comprehensive tutorial on setting up ExpressionEngine templates and LG Live Look over on the Newism blog.

1. Overview Top

LG Live Look is a Multi-Site Manager compatible ExpressionEngine extension that allows you to view the latest published revision of an entry in the ExpressionEngine control panel.

But that's not all… When installed along side NSM Publish Plus, LG Live Look adds the ability to preview unpublished entries, drafts and revisions in template context.

When activated a Live Look tab is added to the Publish Form which displays the entry in a rendered template and a Live Look links are added to the Edit Page.

1.1. The problem Top

ExpressionEngine implemented 'Live Look' entry previews in version 1.6.1. While a welcome addition, it didn’t quite match my development workflow.

IMHO, problems with the original Live Look are:

  1. it doesn't allow custom urls and forced you to use /template_group/template/entry_id/. This doesnt't suit my site which used custom url formats including the {url_title} parameter.
  2. it doesn't support urls generated in the Pages Module.
  3. there is no way to view the entry in the Publish Form.
  4. the third issue, which isn't directly related to the original Live Look (but is a general entry 'preview' issue), was that there is no way to preview updates to an existing entry before it was pushed live. That is why I integrated NSM Publish Plus which adds the fore-mentioned functionality to LG Live Look.

2. Features Top

LG Live Look has many features to enhance your publishing workflow. They include:

  • Publish Form Live Look tab - View published entry revisions in template context from the CP Publish Form. Previewing unpublished changes to entries, viewing drafts and revisions requires NSM Publish Plus.
  • Edit Page Live Look links - Quick navigation to the live entry from the edit entries table.
  • Hide default preview box - Remove the standard ExpressionEngine entry preview.

It's also:

3. Screenshots Top

4. User guide Top

4.1. Requirements Top

LG Live Look has been tested on ExpressionEngine 1.6.5+, but may work on earlier versions.

To function correctly javascript must enabled and the jQuery javascript library must be loaded in the control panel (added in version 1.0.1). jQuery can easily be included using LG Add Sitename (preferred method) or the CP jQuery extension which is bundled with ExpressionEngine 1.6.6+

Previewing unpublished drafts, entry drafts and old revisions require NSM Publish Plus.

The user must also be using a modern web browser (any thing better than IE6).

4.2. Download Top

Download version 1.1.0 of LG Live Look.

4.3. Installation Top

The LG Live Look extension contains an extension and language folder. To install LG Live Look follow the instructions below:

  1. Download the latest version of LG Live Look
  2. Extract the .zip file to your desktop
  3. Copy /extensions/ext.lg_live_look_ext.php file to your /extensions/ directory
  4. Copy /language/english/lang.lg_live_look_ext.php file to your /languages/english/ directory
  5. Activate LG Live Look

4.4. Activation Top

  1. Open the Extension Manager
  2. Enable Extensions if not already enabled
  3. Enable LG Live Look
  4. Configure LG Live Look

4.5. Configuration Top

4.5.1. Extension settings Top

LG Live Look has the following extension settings which need to be entered separately for each Multi-Site Manager site.

Extension access
Enable LG Live Look for this site? [required]
Yes|No

Enabling LG Live Look will add a new Live Look tab to the Publish Form and a Live Look link to the Edit Page.

Which member groups will see the LG Live Look tab and links?

Allowed member groups will see a Live Look tab and link in the Publish Form and Edit Page.

Weblog Settings
Display tab in the Publish Form
Yes|No

Displays the Live Look tab in the Publish Form for this weblog.

Display link in the Edit Page
Yes|No

Displays the Live Look link in the Edit Page entries table for this weblog.

Disable standard EE preview in the Publish Form
Yes|No

Hides the standard un-styled ExpressionEngine preview from the Publish Form.

Preview URL
/blog/post/{entry_id}/{url_title}/

Each weblog has it's own unique settings to add a Live Look tab in the Publish Form, add a Live Look link in the Edit Page table and display the default Publish Form preview. The Live Look tab and link will use the entry preview url.

The preview url setting will have the following variables replaced with entry specific attributes allowing you to create highly customisable urls:

  • {url_title}
  • {entry_id}
  • {weblog_id}
  • {title}
  • {author_id}
  • {status}
  • {entry_date_day}
  • {entry_date_month}
  • {entry_date_year}
  • {dst_enabled}
  • {comment_total}
  • {trackback_total}
  • {username}
  • {email}
  • {screen_name}
  • {field_id_n}

LG Live Look will also replace the entries custom fields with their values. Eg: {field_id_2} will use the data stored in the custom field and insert it into the url.

Check for updates
Would you like this extension to check for updates and display them on your CP homepage?
Yes|No

LG Live Look can call home and check for recent updates if you allow it. This feature requires LG Addon Updater to be installed and activated.

4.6. Creating LG Live Look templates Top

The Live Look tab displays the webpage that corresponds to the parsed Live Look URL inside an iFrame. If you can see the entry by typing in the URL into a browser directly you can see the entry in the Live Look tab.

What does this mean for closed, pending or future entries? You may need to adjust your existing weblog entries tag to show the entry or create a new "preview" template all together.

4.6.1. Index template Top

Index templates (eg: /blog/), will always require an additional "preview" template that displays entries that aren't visible by default. Without a additional "preview" template you may inadvertently display unpublished entries to the general public.

4.6.2. Entry template Top

Single entry templates are slightly different. It is possible to preview hidden entries by updating the {weblog:entries} tag parameters and viewing the url directly.

4.6.3. Example Top

A quick example using the following information:

  • LG Live Look URL is set to the entry page eg: /blog/post/{entry_id}/{url_title}/
  • The entry status is set to pending
  • The standard index template (/blog/index/) only displays open and featured entries; ie: status="open|Featured".
  • The preview index template (/blog/index_preview/) only displays open, featured and pending entries; ie: status="open|Featured|Pending" but is restricted from general viewing using Template Access Restrictions.
  • The entry template (/blog/post/) displays open, featured and pending entries; ie: status="open|Featured|Pending"

The end result:

  • The entry will not be rendered in the standard index template because it's status is not open or featured. As a result the general public will not be able to navigate to the entry page.
  • The entry will be rendered in the index preview unless the member is granted template access permissions.
  • All users will be able to view the entry template by manually typing the url into the browser.
  • LG Live Look will automatically display the entry template in the LG Live Look Tab.

4.6.4. Troubleshooting Top

After setting yup your templates correctly, if your entry is not being loaded here are some items to check:

  1. Is the entry status set to closed or not open?
  2. Are the weblog entry tag parameters correct?
    • Check the status parameter and try status="not closed".
    • Is the entry published in the future? If so try show_future_entries="yes".
    • Check the weblog="" parameter

4.6.5. Further reading Top

I've written up a full tutorial on setting up your templates for LG Live Look over on the Newism Blog. Additional information about setting up Live Look templates can also be found here and here.

4.7. Upgrade notes Top

4.7.1. Version 1.0.1 Top

  • Automatic insertion of jQuery has been removed. To function correctly javascript must enabled and the jQuery javascript library must be loaded in the control panel. jQuery can easily be included using LG Add Sitename (preferred method) or the CP jQuery extension which is bundled with ExpressionEngine 1.6.6+

5. Release notes Top

5.1. Version 1.1.0 Top

  • Added NSM Publish Plus integration!!!
  • Added custom field id support for urls eg: {field_id_9}
  • Rewrote documentation

5.2. Version 1.0.2 Top

  • Added Quicksave integration including support for new entries (bug)

5.3. Version 1.0.1 Top

  • Added Pages Module integration - Entries will use their {page_url} (where applicable) rather than the generated URL based on the extension settings (fr)
  • Fixed LANG file (bug)
  • Separated Javascript from extension file
  • Added jQuery dependency and removed "Scripts" extension setting

5.4. Version 1.0.0 Top

  • Initial Release w/ docs

6. Other topics Top

6.1. Support Top

Technical support is available primarily through the ExpressionEngine forums. Leevi Graham and Newism do not provide direct phone support. No representations or guarantees are made regarding the response time in which support questions are answered.

6.2. Upgrades Top

Although we are actively developing LG Live Look, Leevi Graham and Newism makes no guarantees that this extension will be upgraded within any specific timeframe.

7. License Top

LG Live Look is currently available for use in all personal or commercial projects under Creative Commons Attribution-Share Alike 3.0 Unported license.

You are free to:

  • Share - to copy, distribute and transmit the work
  • Remix - to adapt the work

Under the following conditions:

  • Attribution - You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work).
  • Share Alike - If you alter, transform, or build upon this work, you may distribute the resulting work only under the same, similar or a compatible license.

My mum: Newcastle massage - Remedial, sports, relaxation & Bowen therapist - BodyKneads.com.au