{"id":383921,"date":"2026-10-15T02:36:52","date_gmt":"2026-10-15T02:36:52","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/themes-for-acf\/"},"modified":"2026-10-15T02:44:26","modified_gmt":"2026-10-15T02:44:26","slug":"easeful-themes-for-acf","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/easeful-themes-for-acf\/","author":14531079,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.0","stable_tag":"1.0.0","tested":"7.1.3","requires":"6.3","requires_php":"7.4","requires_plugins":null,"header_name":"Easeful Themes for ACF","header_author":"htmgarcia","header_description":"Add front-end design themes to Advanced Custom Fields groups. Pick a layout, reorder and toggle fields, and render your ACF content beautifully \u2014 no template code required. Works with ACF (free) and ACF PRO.","assets_banners_color":"abc3e9","last_updated":"2026-10-15 02:44:26","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"","header_author_uri":"https:\/\/profiles.wordpress.org\/htmgarcia\/","rating":0,"author_block_rating":0,"active_installs":0,"downloads":65,"num_ratings":0,"support_threads":1,"support_threads_resolved":1,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"htmgarcia","date":"2026-10-15 02:44:26","revision":3747524}},"upgrade_notice":{"1.0.0":"<p>Initial release.<\/p>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3747517,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3747517,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256},"icon.svg":{"filename":"icon.svg","revision":3747517,"resolution":false,"location":"assets","locale":false}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3747517,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3747517,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250},"banner.svg":{"filename":"banner.svg","revision":3747517,"resolution":false,"location":"assets","locale":false}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.0"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3747517,"resolution":"1","location":"assets","locale":"","width":765,"height":713},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3747517,"resolution":"2","location":"assets","locale":"","width":1248,"height":716},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3747517,"resolution":"3","location":"assets","locale":"","width":1440,"height":640},"screenshot-4.png":{"filename":"screenshot-4.png","revision":3747517,"resolution":"4","location":"assets","locale":"","width":1440,"height":900},"screenshot-5.png":{"filename":"screenshot-5.png","revision":3747517,"resolution":"5","location":"assets","locale":"","width":852,"height":822}},"screenshots":{"1":"Custom fields shown on a post automatically, laid out by a theme. No shortcode, no template editing, no code.","2":"The Design tab on a field group: pick a theme, drag fields into order, set how wide each one is, and show them on your site automatically or with a shortcode.","3":"The Themes page in the ACF menu, listing the built-in themes and your own.","4":"Editing your own theme: adjust spacing, borders, shadows, text and colors, with a live preview beside the settings.","5":"The live preview shows any theme on a light or dark page, with sample content or one of your own field groups."}},"plugin_section":[],"plugin_tags":[2211,2217,2010,4036,197499],"plugin_category":[59],"plugin_contributors":[186742],"plugin_business_model":[],"class_list":["post-383921","plugin","type-plugin","status-publish","hentry","plugin_tags-acf","plugin_tags-advanced-custom-fields","plugin_tags-custom-fields","plugin_tags-layout","plugin_tags-tailwind","plugin_category-utilities-and-tools","plugin_contributors-htmgarcia","plugin_committers-htmgarcia"],"banners":{"banner":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/banner-772x250.png?rev=3747517","banner_2x":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/banner-1544x500.png?rev=3747517","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/icon.svg?rev=3747517","icon":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/icon.svg?rev=3747517","icon_2x":false,"generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/screenshot-1.png?rev=3747517","caption":"Custom fields shown on a post automatically, laid out by a theme. No shortcode, no template editing, no code."},{"src":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/screenshot-2.png?rev=3747517","caption":"The Design tab on a field group: pick a theme, drag fields into order, set how wide each one is, and show them on your site automatically or with a shortcode."},{"src":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/screenshot-3.png?rev=3747517","caption":"The Themes page in the ACF menu, listing the built-in themes and your own."},{"src":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/screenshot-4.png?rev=3747517","caption":"Editing your own theme: adjust spacing, borders, shadows, text and colors, with a live preview beside the settings."},{"src":"https:\/\/ps.w.org\/easeful-themes-for-acf\/assets\/screenshot-5.png?rev=3747517","caption":"The live preview shows any theme on a light or dark page, with sample content or one of your own field groups."}],"raw_content":"<!--section=description-->\n<p><strong>Easeful Themes for ACF<\/strong> adds front-end <em>design themes<\/em> to your Advanced Custom Fields groups (free and PRO). Instead of hand-coding <code>the_field()<\/code> 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.<\/p>\n\n<p>A theme is a set of design settings \u2014 spacing, borders, corner radius, shadow, text size, label style and colors. Start from a built-in theme or create your own under <strong>ACF \u2192 Themes<\/strong>, with a live preview as you adjust it.<\/p>\n\n<h4>Features<\/h4>\n\n<ul>\n<li><strong>Theme editor<\/strong> \u2014 under <strong>ACF \u2192 Themes<\/strong>: create, edit, duplicate and delete themes, with a live preview on sample content (every field type) or on one of your own field groups.<\/li>\n<li><strong>Four built-in themes<\/strong> \u2014 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.<\/li>\n<li><strong>Per-group theme picker<\/strong> \u2014 in a new Design tab on the ACF field group edit screen.<\/li>\n<li><strong>Per-field width<\/strong> \u2014 full, half, third or quarter of the row, no CSS required.<\/li>\n<li><strong>Drag-and-drop field order<\/strong> \u2014 decide which fields show on the front end, in what order, and how wide each one is.<\/li>\n<li><strong>Automatic display<\/strong> \u2014 add a group to any post matching its Location rules with no shortcode: before the content, after it, or <em>between<\/em> 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).<\/li>\n<li><strong>Theme-overridable templates<\/strong> \u2014 copy any template into your active theme to fully customize the markup, the same pattern used by WooCommerce.<\/li>\n<li>Works with <strong>ACF (free)<\/strong> and <strong>ACF PRO<\/strong>, including repeater, group and flexible content fields.<\/li>\n<li><code>[easeful_themes_for_acf]<\/code> shortcode and <code>easeful_themes_for_acf_the_group()<\/code> \/ <code>easeful_themes_for_acf_get_group()<\/code> template tags.<\/li>\n<li>No external requests, no CDN assets \u2014 everything ships with the plugin.<\/li>\n<\/ul>\n\n<h4>How it works<\/h4>\n\n<ol>\n<li>Install and activate Easeful Themes for ACF alongside Advanced Custom Fields.<\/li>\n<li>Edit any ACF field group. A new <strong>Design<\/strong> tab appears in its Settings box.<\/li>\n<li>Choose a theme, and drag fields into the order you want \u2014 set each field's width and toggle any field off if you don't want it on the front end.<\/li>\n<li>To change how a theme looks, go to <strong>ACF \u2192 Themes<\/strong>. Built-in themes are read-only: duplicate one, adjust it with the live preview, and save.<\/li>\n<li><p>Render the group wherever you like:<\/p>\n\n<p>[easeful_themes_for_acf group=\"group_xxxxxxxxxxxxx\"]<\/p><\/li>\n<\/ol>\n\n<p>or in a template file:<\/p>\n\n<pre><code>&lt;?php easeful_themes_for_acf_the_group( 'group_xxxxxxxxxxxxx' ); ?&gt;\n<\/code><\/pre>\n\n<p>If no <code>post<\/code> \/ <code>post_id<\/code> is supplied, the current post in the loop is used. Add <code>theme=\"...\"<\/code> with a theme's key (shown on the Themes screen, e.g. <code>minimal<\/code>) to render with a different theme than the group's own.<\/p>\n\n<h4>Documentation<\/h4>\n\n<p>Step-by-step guides with screenshots, from picking a theme to customizing the markup, are in the <a href=\"https:\/\/htmgarcia.com\/docs-category\/easeful-themes-for-acf\/\">Easeful Themes for ACF documentation<\/a>. Most questions are answered there, so please check it before opening a support topic.<\/p>\n\n<h3>Credits<\/h3>\n\n<p>The theme editor's transparency strip in the color picker is <a href=\"https:\/\/github.com\/kallookoo\/wp-color-picker-alpha\">wp-color-picker-alpha<\/a> by Sergio (kallookoo), GPLv2 or later, included unmodified and unminified in <code>assets\/vendor\/wp-color-picker-alpha\/<\/code>.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Make sure <a href=\"https:\/\/wordpress.org\/plugins\/advanced-custom-fields\/\">Advanced Custom Fields<\/a> (or ACF PRO) is installed and active.<\/li>\n<li>Upload the <code>easeful-themes-for-acf<\/code> folder to <code>\/wp-content\/plugins\/<\/code>, or install it through the <strong>Plugins<\/strong> screen in WordPress.<\/li>\n<li>Activate <strong>Easeful Themes for ACF<\/strong> through the <strong>Plugins<\/strong> screen.<\/li>\n<li>Edit an ACF field group and pick its theme in the <strong>Design<\/strong> tab of its Settings box. Create or edit themes under <strong>ACF \u2192 Themes<\/strong>.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20this%20work%20without%20advanced%20custom%20fields%3F\"><h3>Does this work without Advanced Custom Fields?<\/h3><\/dt>\n<dd><p>No. Easeful Themes for ACF is an add-on for ACF and requires ACF (free) or ACF PRO to be installed and active. It will show an admin notice and stay dormant if ACF is missing.<\/p><\/dd>\n<dt id=\"does%20this%20work%20with%20acf%20field%20groups%20stored%20as%20local%20json%20or%20registered%20in%20php%3F\"><h3>Does this work with ACF field groups stored as local JSON or registered in PHP?<\/h3><\/dt>\n<dd><p>Rendering works for any field group ACF can resolve by its group key. The Design tab (theme and field order) appears on the field group's edit screen, which requires the group to exist in the database (ACF's normal \"sync\" step for JSON\/PHP-registered groups).<\/p><\/dd>\n<dt id=\"will%20this%20add%20unused%20css%20to%20my%20site%3F\"><h3>Will this add unused CSS to my site?<\/h3><\/dt>\n<dd><p>One small stylesheet (a few KB), scoped to the plugin's own <code>easeful-themes-for-acf<\/code> classes so it never touches the rest of your page, plus one line of CSS variables per theme. Both load on every front-end page rather than only where a group is rendered, since a themed group can appear from a template tag as well as a shortcode and there's no reliable way to know in advance which pages will use one.<\/p><\/dd>\n<dt id=\"can%20i%20customize%20the%20markup%3F\"><h3>Can I customize the markup?<\/h3><\/dt>\n<dd><p>Yes. Copy any file from <code>wp-content\/plugins\/easeful-themes-for-acf\/templates\/<\/code> into <code>wp-content\/themes\/your-theme\/easeful-themes-for-acf\/<\/code> (keeping the same sub-folders) and edit it \u2014 your copy takes priority automatically, whichever theme a group uses. Style your markup with the plugin's CSS variables (e.g. <code>var(--etfa-radius)<\/code>) so it still follows the theme settings.<\/p>\n\n<p>Rendered markup is escaped with the same tags and attributes WordPress allows in post content, plus <code>&lt;iframe&gt;<\/code> for embeds. If your copy outputs something beyond that \u2014 a <code>&lt;form&gt;<\/code>, inline SVG \u2014 allow it with the <code>easeful_themes_for_acf_allowed_html<\/code> filter, which receives and returns a <code>wp_kses()<\/code> allowed-HTML array:<\/p>\n\n<pre><code>add_filter( 'easeful_themes_for_acf_allowed_html', function ( $allowed ) { $allowed['form'] = array( 'action' =&gt; true, 'method' =&gt; true ); $allowed['input'] = array( 'type' =&gt; true, 'name' =&gt; true, 'value' =&gt; true ); return $allowed; } );\n<\/code><\/pre><\/dd>\n<dt id=\"does%20uninstalling%20the%20plugin%20delete%20my%20settings%3F\"><h3>Does uninstalling the plugin delete my settings?<\/h3><\/dt>\n<dd><p>No. Easeful Themes for ACF never deletes your themes or field group designs (theme choice, field order) when you uninstall it. Deactivating, deleting, or reinstalling the plugin leaves everything exactly as you configured it.<\/p><\/dd>\n<dt id=\"where%20can%20i%20get%20help%3F\"><h3>Where can I get help?<\/h3><\/dt>\n<dd><p>Start with the <a href=\"https:\/\/htmgarcia.com\/docs-category\/easeful-themes-for-acf\/\">documentation<\/a>: its step-by-step guides cover setting up a field group, themes, layouts, automatic display and customizing the markup. If your question isn't answered there, open a topic in the plugin's support forum on WordPress.org.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release: theme editor with live preview and four built-in themes, field group Design tab, drag-and-drop field order, automatic display, shortcode and template tags.<\/li>\n<\/ul>","raw_excerpt":"Give your Advanced Custom Fields groups a front-end design. Pick or create a theme, arrange the layout, and render your fields \u2014 no template code.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/383921","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=383921"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/htmgarcia"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=383921"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=383921"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=383921"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=383921"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=383921"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=383921"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}