Webflow Setup Guide

We have recorded a complete walkthrough of the Placid setup for you, to get your automation up and running!

If you have any troubles you need extra help with, just ask. We’re happy to help!

Step 1 - Create a template for your images

Placid templates are a bit like cloze text: You design a basic layout, and decide which elements should be filled dynamically from the content in your Webflow fields.

We can f.ex. use your post headlines and featured images.

Placid template elements

Watch Video

Step 2 - Connect your Webflow site

We need to connect to your Webflow site to access your content and write your images back into your fields.

In the settings, click on Connect to Webflow. Connect your account and choose the site you’re creating images for.

Watch Video

Step 3 - Create an action to set up your automation

Actions are the actual automation processes. You will have to set up one action per collection and template you want to use.

After choosing your collection, you can map your Webflow fields to your template’s elements. This defines which content we will use to generate your images.

You can also define the field we’ll send your image to, and the interval in which we will repeat the action. Choose between manual or repeated actions that create images for every new content piece.

Watch Video

Step 4 - Run your automation

After creating your action, you can run it to generate images for all your collection items.

Per default, running an action will only send images to empty fields, so we won’t overwrite existing images. But you can manually choose the option Run & Overwrite to force Placid to delete your old images.

Test run: A test run shows you what exactly would happen if you run it, but it won’t send images to Webflow.

Watch Video

Optional: Setup your images as Open Graph images in Webflow

If you created Open Graph images with Placid, you can make Webflow set them easily so Facebook, LinkedIn & Co will pick them up.

You can set them under Pages > „Collection Name“ Template Settings > Open Graph Settings

Webflow Collection Open Graph Settings

Choose the field you’re sending your generated images to as your Open Graph Image.