Maxime Culea

<p>To use ACF Beautiful Flexible, simply activate the plugin to improve the ACF flexible UI. By default, it uses random images, but the idea is to customize them by adding your own.</p>
<h4>Image convention</h4>
<ul>
<li>The size of image should be 366×150 or bigger 732×300.</li>
<li>They should be named based on the flexible key (<code>push_2_light</code>) with no underscores but dashes (<code>push-2-light.[extension]</code>).</li>
<li>The following extensions will be resolved in that order: <code>.jpg</code>, <code>.jpeg</code>, <code>.png</code> and <code>.gif</code>.</li>
</ul>
<h4>Where images should be situated</h4>
<p>They should more likely be situated into your theme <code>wp-content\themes\my-theme\assets\acf-beautiful-flexible\</code>. But if you have a child-theme and added images into it, these will overwrite those from parent-theme.<br />
The following directories will be solved according to order: plugin’s folder, child theme’s folder, theme’s folder.</p>
<p>Also note that you can filter this path to gather all your images into a same folder :<br />
    add_filter( ‘acf_beautiful_flexible.images_path’, $path );</p>
<p>Finally, you could filter all images like this :<br />
    add_filter( ‘acf_beautiful_flexible.images’, $images );</p>
<h4>About ACF Beautiful Flexible</h4>
<p>I, <a href="https://profiles.wordpress.org/MaximeCulea" rel="nofollow ugc">Maxime Culea</a>, have created this plugin which I only maintain. I do not guarantee some free support. Also, thank others listed in the <a href="https://github.com/MaximeCulea/acf-beautiful-flexible/blob/main/CREDITS.md" rel="nofollow ugc">credits</a>.</p>
<p>Consider reporting an <a href="https://wordpress.org/support/plugin/acf-beautiful-flexible/" rel="ugc">issue</a> and be patient.<br />
Any code suggestions? I am on <a href="https://github.com/maximeculea/acf-beautiful-flexible" rel="nofollow ugc">GitHub</a> as well!</p>


ACF Beautiful Flexible

ACF Beautiful Flexible: Transform ACF's flexible layouts list into a beautiful popup.

UX Design Experts

<p><strong>Advanced Gallery & Repeater Fields for ACF</strong> supercharges Advanced Custom Fields with two powerful field types that include built-in frontend display options. No coding required!</p>
<h4>Enhanced Gallery Field</h4>
<p>Transform your image galleries with professional layouts – no coding needed!</p>
<p><strong>Available Layouts:</strong><br />
* <strong>Grid</strong> – Responsive grid with customizable columns (1-6)<br />
* <strong>Masonry</strong> – Pinterest-style masonry layout<br />
* <strong>Carousel/Slider</strong> – Touch-enabled slider with autoplay, arrows, and dots<br />
* <strong>Justified</strong> – Flickr-style justified rows with perfect alignment<br />
* <strong>Lightbox</strong> – Built-in lightbox modal with thumbnails, keyboard navigation, and swipe support</p>
<p><strong>Gallery Features:</strong><br />
* WordPress Media Library integration<br />
* Drag & drop image reordering<br />
* Configurable image sizes<br />
* Lazy loading for performance<br />
* Caption support<br />
* Touch/swipe gestures<br />
* Keyboard navigation<br />
* Fully responsive</p>
<h4>📋 Enhanced Repeater Field</h4>
<p>Create beautiful repeating content sections with pre-built templates.</p>
<p>** Works with ACF Free & Pro!** – No ACF Pro required for admin editing.</p>
<p><strong>Available Layouts:</strong><br />
* <strong>List</strong> – Clean, simple list format<br />
* <strong>Grid/Cards</strong> – Modern card-based grid with images, titles, and CTAs<br />
* <strong>Table</strong> – Organized data table format<br />
* <strong>Accordion</strong> – Collapsible panels with ARIA accessibility<br />
* <strong>Tabs</strong> – Horizontal or vertical tabbed interface<br />
* <strong>Timeline</strong> – Vertical timeline with dates and markers</p>
<p><strong>Repeater Features:</strong><br />
* Visual admin interface (no ACF Pro needed!)<br />
* Add, remove, duplicate, and reorder rows<br />
* Field mapping for titles, content, images, links, and dates<br />
* ARIA accessibility support<br />
* Keyboard navigation<br />
* Responsive layouts<br />
* Customizable styling</p>
<h4>Key Features</h4>
<ul>
<li><strong>Works with ACF Free!</strong> – Both fields fully functional with free ACF</li>
<li><strong>Zero Coding</strong> – Configure everything in field settings</li>
<li><strong>Auto-Rendering</strong> – Use standard <code>the_field()</code> or <code>get_field()</code></li>
<li><strong>Fully Responsive</strong> – Mobile-friendly layouts</li>
<li><strong>Fast Performance</strong> – Optimized CSS and JS</li>
<li><strong>Accessible</strong> – ARIA labels and keyboard navigation</li>
<li><strong>WP All Import Compatible</strong> – Bulk import data from CSV/XML</li>
<li><strong>Developer Friendly</strong> – Helper functions and CSS variables for customization</li>
<li><strong>SEO Optimized</strong> – Semantic HTML markup</li>
<li><strong>Translation Ready</strong> – Full i18n support</li>
</ul>
<h4>Perfect For</h4>
<ul>
<li>Photography portfolios</li>
<li>Product galleries</li>
<li>Team member listings</li>
<li>Testimonials</li>
<li>FAQs</li>
<li>Services showcases</li>
<li>Timeline histories</li>
<li>Feature comparisons</li>
<li>And much more!</li>
</ul>
<h4>WP All Import Compatibility</h4>
<p>Fully compatible with WP All Import Pro and the ACF Add-On:<br />
* Enhanced Gallery: Import comma-separated image IDs or URLs<br />
* Enhanced Repeater: Import JSON or serialized data<br />
* Automatic field type mapping<br />
* Bulk data migration support</p>
<h4>Usage Examples</h4>
<p><strong>Basic Usage:</strong></p>
<pre><code><?php
// Auto-renders based on field settings
the_field('my_gallery');
?>
</code></pre>
<p><strong>Helper Functions:</strong></p>
<pre><code><?php
// Manual rendering with full control
echo agrfuxd_render_enhanced_gallery('gallery_field', get_the_ID());
echo agrfuxd_render_enhanced_repeater('repeater_field', get_the_ID());
?>
</code></pre>
<p><strong>Custom Styling:</strong></p>
<pre><code>:root {
    --agrfuxd-columns: 4;
    --agrfuxd-gap: 20px;
    --agrfuxd-primary: #0073aa;
    --agrfuxd-radius: 10px;
}
</code></pre>
<h4>Browser Support</h4>
<ul>
<li>Chrome (latest)</li>
<li>Firefox (latest)</li>
<li>Safari (latest)</li>
<li>Edge (latest)</li>
<li>Mobile browsers (iOS Safari, Chrome Mobile)</li>
</ul>
<h3>Developer Documentation</h3>
<h4>Helper Functions</h4>
<p><strong>agrfuxd_render_enhanced_gallery( $field_name, $post_id )</strong><br />
Manually render an Enhanced Gallery field with its configured layout.</p>
<p>Parameters:<br />
* <code>$field_name</code> (string) – The field name or key<br />
* <code>$post_id</code> (int|null) – Post ID (defaults to current post)</p>
<p>Returns: (string) HTML output</p>
<p><strong>agrfuxd_render_enhanced_repeater( $field_name, $post_id )</strong><br />
Manually render an Enhanced Repeater field with its configured layout.</p>
<p>Parameters:<br />
* <code>$field_name</code> (string) – The field name or key<br />
* <code>$post_id</code> (int|null) – Post ID (defaults to current post)</p>
<p>Returns: (string) HTML output</p>
<h4>CSS Variables</h4>
<p>The plugin uses CSS custom properties for easy theming:</p>
<pre><code>:root {
    /* Layout */
    --agrfuxd-columns: 3;
    --agrfuxd-gap: 20px;

    /* Colors */
    --agrfuxd-primary: #2271b1;
    --agrfuxd-text: #1e1e1e;
    --agrfuxd-border: #ddd;
    --agrfuxd-bg: #f9f9f9;

    /* Design */
    --agrfuxd-radius: 8px;
    --agrfuxd-shadow: 0 2px 8px rgba(0,0,0,0.1);

    /* Transitions */
    --agrfuxd-transition: 0.3s ease;
}
</code></pre>
<h4>CSS Classes</h4>
<ul>
<li><code>.agrfuxd-gallery</code> – Gallery wrapper</li>
<li><code>.agrfuxd-gallery-grid</code> – Grid layout</li>
<li><code>.agrfuxd-gallery-masonry</code> – Masonry layout</li>
<li><code>.agrfuxd-gallery-carousel</code> – Carousel layout</li>
<li><code>.agrfuxd-repeater</code> – Repeater wrapper</li>
<li><code>.agrfuxd-repeater-grid</code> – Grid/cards layout</li>
<li><code>.agrfuxd-accordion</code> – Accordion layout</li>
<li><code>.agrfuxd-tabs</code> – Tabs layout</li>
<li><code>.agrfuxd-repeater-timeline</code> – Timeline layout</li>
</ul>
<h3>Privacy Policy</h3>
<p>This plugin does not collect, store, or transmit any user data. All content is stored locally in your WordPress database using standard ACF methods.</p>
<h3>Credits</h3>
<p>Developed by <a href="https://uxdesignexperts.com" rel="nofollow ugc">UXD Experts</a> – WordPress experts specializing in user experience and custom development.</p>


Advanced Gallery & Repeater Fields for ACF

Advanced ACF fields with built-in layouts. Works with free ACF! Gallery & Repeater fields with masonry, carousel, lightbox & more.

ACF Beautiful Flexible vs Advanced Gallery & Repeater Fields for ACF