Directory / plugin

Easeful Themes for ACF

v1.0.0 · by htmgarcia

Give your Advanced Custom Fields groups a front-end design. Pick or create a theme, arrange the layout, and render your fields — no template code.

View on WordPress.org

About this plugin

Easeful Themes for ACF adds front-end design themes to your Advanced Custom Fields groups (free and PRO). Instead of hand-coding the_field() calls and CSS for every layout, you pick a theme and arrange the fields on the field group’s own edit screen, then render it anywhere with a shortcode or a single function call.

A theme is a set of design settings — spacing, borders, corner radius, shadow, text size, label style and colors. Start from a built-in theme or create your own under ACF Themes, with a live preview as you adjust it.

Features

  • Theme editor — under ACF Themes: create, edit, duplicate and delete themes, with a live preview on sample content (every field type) or on one of your own field groups.
  • Four built-in themes — Classic (light cards), Minimal (flat, bordered), Plain (no cards, just the fields and the space between them) and Midnight (dark). Duplicate one to make your own version.
  • Per-group theme picker — in a new Design tab on the ACF field group edit screen.
  • Per-field width — full, half, third or quarter of the row, no CSS required.
  • Drag-and-drop field order — decide which fields show on the front end, in what order, and how wide each one is.
  • Automatic display — add a group to any post matching its Location rules with no shortcode: before the content, after it, or between your fields, with the post content itself dragged into whatever spot in the field order you like (plain, or in a card like the fields around it).
  • Theme-overridable templates — copy any template into your active theme to fully customize the markup, the same pattern used by WooCommerce.
  • Works with ACF (free) and ACF PRO, including repeater, group and flexible content fields.
  • [easeful_themes_for_acf] shortcode and easeful_themes_for_acf_the_group() / easeful_themes_for_acf_get_group() template tags.
  • No external requests, no CDN assets — everything ships with the plugin.

How it works

  1. Install and activate Easeful Themes for ACF alongside Advanced Custom Fields.
  2. Edit any ACF field group. A new Design tab appears in its Settings box.
  3. Choose a theme, and drag fields into the order you want — set each field’s width and toggle any field off if you don’t want it on the front end.
  4. To change how a theme looks, go to ACF Themes. Built-in themes are read-only: duplicate one, adjust it with the live preview, and save.
  5. Render the group wherever you like:

    [easeful_themes_for_acf group=”group_xxxxxxxxxxxxx”]

or in a template file:

<?php easeful_themes_for_acf_the_group( 'group_xxxxxxxxxxxxx' ); ?>

If no post / post_id is supplied, the current post in the loop is used. Add theme="..." with a theme’s key (shown on the Themes screen, e.g. minimal) to render with a different theme than the group’s own.

Documentation

Step-by-step guides with screenshots, from picking a theme to customizing the markup, are in the Easeful Themes for ACF documentation. Most questions are answered there, so please check it before opening a support topic.

Credits

The theme editor’s transparency strip in the color picker is wp-color-picker-alpha by Sergio (kallookoo), GPLv2 or later, included unmodified and unminified in assets/vendor/wp-color-picker-alpha/.

Plugin tags