Blueprints

Blueprints are pre-designed content sections or even full pages of content. These can be used as starting points for structured content like landing pages, product pages, etc. Blueprints function as a “replace the placeholders” way to create content. They are a collection of one or more Elements with sample content and images in place.

You can also use Blueprints as demo pages which theme users can use to start a site with complete layouts made up of any combination of content and Elements.

Blueprints are organized into user-determined categories such as Headers, Landing Pages, Galleries, etc.

Using Blueprints¶

Like Elements, find a Blueprint you wish to use and drag-and-drop it into a Dropzone on a Fred-enabled page.

Creating Blueprints¶

Users with permissions to do so can save Blueprints and share them with others or keep them private so only their users can see them.

Use cases for private Blueprints include testing by theme creators (since they won’t be included in exported Themes), saving specific combinations and settings for Elements that only you will use, and end users currating frequently used Blueprints acros categories into a single location.

A more advanced use case is overriding default settings of commonly used Elements to match frequently changed settings like changing margins, padding or text-alignment.

Blueprint Screenshots¶

When creating a Blueprint, it will generate a screenshot image for you. However, you may wish to manually create your own screenshot as the libary used to build screen captures does not understand all CSS properties.

Full-page Blueprints¶

Complete Blueprints are a copy of an entire page of content. You create these from the front-end when Fred is enabled.

To create a complete Blueprint, click the Blueprints icon in the Fred sidebar, then choose an existing category from the top or create a new category for your Blueprints. Give your Blueprint a name and save

Partial Blueprints¶

Partial Blueprints are made from the overlapping, rounded-corner squares icon that appears when hovering/focusing an Element in the front-end. Click this Blueprint icon, choose a category, give it a name, and save.