The Clutch WordPress plugin connects your Clutch project to a WordPress site. This lets you use preconfigured templates to pull in WordPress data to your pages.
Setting Up Your WordPress Project
Creating Your WordPress Project in Clutch
- Log into your Clutch account and click New Project.
- Choose WordPress as your project type, give your project a name (e.g., "My Restaurant Site"), and click Create Project.
- Your new project workspace will open with a blank canvas.
Configuring Your WordPress Setup
For local development, we recommend using Local by WP Engine:
- Download and install Local.
- Launch Local, click Create a new site and name it (e.g., "My Restaurant Site").
- Use the default environment settings.
- Enter your WordPress username, password, and email, then complete the setup.
- Once the site is running, click WP Admin to access your dashboard.
Alternatively, you can connect to an existing hosted WordPress site.
Installing the Clutch Plugin
- Download the Clutch WordPress plugin as a
.zipfile from this link.
- In your WordPress admin dashboard, go to Plugins > Add New.
- Click Upload Plugin, choose the downloaded
.zipfile, and activate the plugin.
Connecting Clutch to Your WordPress Site
- In your Clutch workspace, look for the WordPress icon with a red dot in the top-right corner.
- Click the icon and enter your WordPress site URL (e.g.,
my-restaurant-site.local).
- Once the connection is successful, the red dot will turn green.
Using the Plugin
Selecting a Template
Each page in Clutch has a Template setting in the Properties Panel. This setting determines which WordPress data is pulled into the page. Available template options include:
- None - No WordPress data is loaded.
- Front Page – Loads data from your site’s front page.
- Search – Pulls in search results.
- 404 – Provides data for a "Not Found" page.
- Author – Displays author-specific data.
- Posts – Loads data for blog posts.
- Pages – Loads data for static pages.
- Media – Loads data for media items like images and videos.
- Categories – Pulls in data for categories.
- Tags – Pulls in data for tags.
When you select a template, the plugin automatically sets a predefined path for the page and makes the associated data available as variables in the Bind menu.
Configuring Template Settings
Some templates offer configuration options that let you control what data is loaded and how the page’s path is set up. You can choose from three modes:
- Archive: Provides data for all items of the selected content type (for example, all posts or all pages). Use this option when you want to show a complete list of a particular content category.
- Specific: Lets you pick one particular item (such as a specific post, page, media item, or tag). This mode provides data only for the chosen item.
- Any: Creates a dynamic page path (e.g.,
/post/[slug]or/tag/[slug]), where[slug]is replaced with the actual slug of the item. A Default slug field is also available to prefill the page path with a specific item slug when you select the page in the composition tree.
Binding WordPress Data
After selecting and configuring a template, the relevant WordPress data becomes available as variables. You can bind this data to elements on your page to make it dynamic.
- Accessing the Bind Menu:
- Hover over any field in the Properties Panel. A green badge will appear in the top left corner of the field.
- Click the badge to open the Bind menu.
- Binding Data:
- In the Bind menu, select the variables under the Page category.
- Choose the appropriate variable to dynamically populate content on your page.