Extend Wagtail's Documents with image previews and metadata from FilePreviews.io

Install with pip:

$ pip install wagtaildocs_previews

In your settings file, add wagtaildocs_previews to INSTALLED_APPS:

INSTALLED_APPS = [
    # ...
    'wagtaildocs_previews',
    # ...
]

You'll also need to set WAGTAILDOCS_DOCUMENT_MODEL.

WAGTAILDOCS_DOCUMENT_MODEL = 'wagtaildocs_previews.PreviewableDocument'

from wagtaildocs_previews import urls as wagtaildocs_urls

urlpatterns = [
    # ...
    url(r'^documents/', include(wagtaildocs_urls)),
    # ...
]

For previews to be generated for your documents, you'll need to have a FilePreviews.io account and an application's credentials. Once you have the credentials, add them under the FilePreviews settings in your Wagtail admin.

Since we're extending via WAGTAILDOCS_DOCUMENT_MODEL you should be using get_document_model() to reference the correct Document model.

from wagtail.core.models import Page
from wagtail.documents.models import get_document_model
from wagtail.documents.edit_handlers import DocumentChooserPanel


class BookPage(Page):
    book_file = models.ForeignKey(
        get_document_model(),
        null=True,
        blank=True,
        on_delete=models.SET_NULL,
        related_name='+'
    )

    content_panels = Page.content_panels + [
        DocumentChooserPanel('book_file'),
    ]

In your template now you'll be able to access the preview_data field.

{% extends "base.html" %}
{% load wagtailcore_tags %}

{% block body_class %}resource-page{% endblock %}

{% block content %}
    <h1>Book</h>
    <h2>{{ page.book_file.title }}</h2>
    <img src="{{ page.book_file.preview_data.preview.url|default:'http://placehold.it/300x300' }}" alt="">
{% endblock %}

By default, image previews and not resized at all. If you want to specify additional FilePreviews options like thumbnail size or metadata, specify the WAGTAILDOCS_PREVIEWS_OPTIONS_CALLBACK option in your settings.

WAGTAILDOCS_PREVIEWS_OPTIONS_CALLBACK='mysite.utils.get_preview_options'

In the mysite.utils module, create a get_preview_options method.

def get_preview_options(document):
    return {
        'sizes': [300],
        'metadata': ['ocr']
    }

Here’s a coding session video building up to the released package.