wagtail-livepreview

Live preview your page changes as you make them.

These details have not been verified by PyPI

Project links

Homepage

Project description

Wagtail Live Preview

Wagtail Live Preview lets you view your page changes as you make them in the Wagtail Admin.

Using React or Vue? This won’t work for you, nor was it designed to. This Live Preview package is designed for simple Wagtail websites.

How it works

Tell it how often to save a snapshot of the page you’re working on and how often to poll for updates in the Live Preview.

It does not piggy back on Wagtails Revision system, but you can tell it to save a page revision every x number of saves so you never accidentally lose your work (or if you just want to log your progress and maybe revert back to a previous content iteration).

The package itself is called wagtail-livepreview to let everyone know this is a Wagtail specific package. But the code references livepreview instead of wagtail_livepreview as to not confuse Wagtail features with what’s in this package.

Installation

Install the package with:
```
pip install wagtail-livepreview
```

Add it to your INSTALLED_APPS above the 'wagtail.admin' app:

INSTALLED_APPS = [
    # ...
    'livepreview',
    # ...
    'wagtail.admin',
]

Add {% load livepreview_tags %} to your base.html template. And add {% livepreview_js %} right above your </body> tag in base.html:

{% load static wagtailuserbar livepreview_tags %}

<!DOCTYPE html>
<html class="no-js" lang="en">
        <head>
                ...
        </head>

        <body class="{% block body_class %}{% endblock %}">
                ...

                {% livepreview_js %}
        </body>
</html>

You’ll need to apply migrations:
```
python manage.py migrate
```

Hooks

You can take an action before and after a Live Preview using a generic Wagtail hook:

@hooks.register('after_live_preview_save')
def after_live_preview_save(request, page):
        """Event to happen before the live preview is served."""
        print(page.id)


@hooks.register('before_live_preview_save')
def before_live_preview_save(request, page):
        """Event to happen after the live preview is served."""
        print(page.id)

Caution: It’s a bad idea to provide a process intensive task in these hooks since these hooks may end up being called as frequently as once per second. It might be best to offload your tasks in these hooks to a task runner.

Checking if a view is a Live Preview or not

You’ll want to adjust your template so you aren’t triggering your analytics every second. You can prevent this with:

{% if not livepreview %}
        .. analytics in here
{% else %}
        <div id="warning">This is a live preview</div>
{% endif %}

You can also use {{ request.livepreview }} in your template to check against the request.

Settings

There a few global settings you can apply:

# base settings.py

# How often (in milliseconds) should the livepreview check for page updates? Default is 1000ms.
LIVEPREVIEW_TIMEOUT = 1000

# If you'd like to turn on auto-revision saving every x number of Live Preview saves, set this as True. Default is False.
LIVEPREVIEW_SAVE_AS_REVISIONS = False

# How many Live Preview saves should happen before a new revision is automatically saved? Default is 10. Requires LIVEPREVIEW_SAVE_AS_REVISIONS = True.
LIVEPREVIEW_SAVE_REVISION_COUNT = 10

# Render Live Previews into a temporary file, and attempt to serve that file. Default is true.
# If True, LIVEPREVIEW_TIMEOUT can be as low as 250ms.
# If False, the minimum LIVEPREVIEW_TIMEOUT is 1000ms.
LIVEPREVIEW_USE_FILE_RENDERING = True

Model Settings

You can disable Live Preview for specific page models. For example, you might have a simple Blog Index Page with just a title field. Or a page that redirects to another page. In these scenarios you might not want Live Preview enabled:

class YourPage(Page):
        # ...
        LIVEPREVIEW_DISABLED = True  # Disable Live Preview on a per-model basis

Project details

These details have not been verified by PyPI

Project links

Homepage

Release history Release notifications | RSS feed

This version

0.1

Aug 10, 2019

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

wagtail-livepreview-0.1.tar.gz (11.5 MB view details)

Uploaded Aug 10, 2019 Source

File details

Details for the file wagtail-livepreview-0.1.tar.gz.

File metadata

Download URL: wagtail-livepreview-0.1.tar.gz
Upload date: Aug 10, 2019
Size: 11.5 MB
Tags: Source
Uploaded using Trusted Publishing? No
Uploaded via: twine/1.13.0 pkginfo/1.5.0.1 requests/2.18.4 setuptools/41.0.1 requests-toolbelt/0.9.1 tqdm/4.33.0 CPython/3.6.0

File hashes

Hashes for wagtail-livepreview-0.1.tar.gz
Algorithm	Hash digest
SHA256	`fc19d1337933185575e4fb1bd6b0c785fb423d73347745048cdb2887765bdfbf`
MD5	`fb25c2bdd9d9c6f72b25f814c2a4ed96`
BLAKE2b-256	`8e68ee43efc07b1adaa78c837fee4a99dfcce59a5062f8ed6ee2884e22c40670`