MrStar

<p><strong>MrStar Accordion Builder</strong> is a comprehensive WordPress plugin that makes it easy to create professional, responsive accordions without any coding. Whether you’re building FAQs, collapsible content sections, or dynamic post-based accordions, this plugin provides all the tools you need.</p>
<h4>Why Choose MrStar Accordion Builder?</h4>
<ul>
<li><strong>No Coding Required</strong> – Intuitive admin interface for creating and managing accordions</li>
<li><strong>Two Content Sources</strong> – Create accordions manually or dynamically from WordPress posts</li>
<li><strong>Flexible Styling</strong> – Per-accordion and global theme-based styling options</li>
<li><strong>Repeatable Fields</strong> – Add unlimited accordion items with titles and content</li>
<li><strong>Theme System</strong> – Create reusable accordion themes for consistent styling across your site</li>
<li><strong>Shortcode Support</strong> – Easy shortcode integration with full customization</li>
<li><strong>Lightweight</strong> – Optimized code with minimal dependencies</li>
<li><strong>Translation Ready</strong> – Fully localized for international audiences</li>
<li><strong>Multiple Instances</strong> – Use multiple accordions on the same page without conflicts</li>
</ul>
<h4>Key Features</h4>
<p><strong>1. Custom Post Type Management</strong><br />
Manage all your accordions from a dedicated admin interface. Organize, edit, and publish accordions just like regular posts.</p>
<p><strong>2. Two Accordion Source Options</strong><br />
* <strong>Manual Content</strong> – Create accordion items directly with titles and rich text content<br />
* <strong>Post-Based</strong> – Automatically generate accordions from WordPress posts with custom filtering and sorting</p>
<p><strong>3. Repeatable Accordion Items</strong><br />
Add unlimited accordion items to each accordion. Each item includes:<br />
* Custom title<br />
* Rich text content editor<br />
* Flexible organization with drag-and-drop sorting</p>
<p><strong>4. Advanced Theme System</strong><br />
* Create unlimited reusable themes<br />
* Apply themes to multiple accordions<br />
* Override theme settings per accordion<br />
* Consistent styling across your entire site</p>
<p><strong>5. Customization Options</strong><br />
* Choose between single and multiple open items (accordion or multi-collapse behavior)<br />
* Configure animation speed<br />
* Control which item opens first<br />
* Custom styling for icons and appearance<br />
* Per-accordion style overrides</p>
<p><strong>6. Responsive Design</strong><br />
Built with mobile-first design principles to ensure your accordions look great on all devices.</p>
<p><strong>7. Easy Shortcode Integration</strong><br />
Simple shortcode syntax: <code>[mrstar_accordion id="123"]</code><br />
Use multiple accordions on the same page without conflicts.</p>
<h4>Use Cases</h4>
<ul>
<li>Frequently Asked Questions (FAQs)</li>
<li>Product features and specifications</li>
<li>Pricing plans with feature lists</li>
<li>Service descriptions</li>
<li>Team member bios</li>
<li>Terms and conditions</li>
<li>Help documentation</li>
<li>Any collapsible content sections</li>
</ul>
<h3>Getting Started</h3>
<h4>Step 1: Create an Accordion</h4>
<ol>
<li>Navigate to <strong>Accordion > Add New</strong></li>
<li>Enter a title for your accordion</li>
<li>Click <strong>Publish</strong></li>
</ol>
<h4>Step 2: Add Accordion Items</h4>
<p>In the “Accordion Items” metabox:<br />
1. Click “Add Item”<br />
2. Enter the item title<br />
3. Add the content in the editor<br />
4. Drag to reorder items as needed<br />
5. Click <strong>Update</strong></p>
<h4>Step 3: Configure Settings</h4>
<ul>
<li>Select accordion <strong>Source</strong> (Manual Content or Posts)</li>
<li>Choose or create a <strong>Theme</strong></li>
<li>Set <strong>Accordion Behavior</strong> (single or multiple items open)</li>
<li>Adjust animation <strong>Speed</strong></li>
<li>Control which item opens <strong>first</strong></li>
</ul>
<h4>Step 4: Display Your Accordion</h4>
<p>Copy the shortcode from the “Accordion Shortcode” metabox and paste it into any:<br />
* Page<br />
* Post<br />
* Text widget<br />
* Custom page template</p>
<h4>Advanced: Using Post-Based Accordions</h4>
<ol>
<li>Select “Post-Based” as the source</li>
<li>Choose post type to display</li>
<li>Set up filters (categories, tags, authors)</li>
<li>Configure sorting options</li>
<li>Set pagination if needed</li>
</ol>
<h4>Advanced: Creating Custom Themes</h4>
<ol>
<li>Go to <strong>Accordion > Accordion Themes</strong></li>
<li>Click <strong>Add New</strong></li>
<li>Configure:
<ul>
<li>Default styling</li>
<li>Icon settings</li>
<li>Animation behavior</li>
</ul>
</li>
<li>Apply to multiple accordions for consistent design</li>
</ol>
<h3>Shortcode Reference</h3>
<h4>Basic Shortcode</h4>
<pre><code>[mrstar_accordion id="123"]
</code></pre>
<p><strong>Attributes:</strong><br />
* <code>id</code> (required) – The accordion post ID to display</p>
<h4>Example</h4>
<pre><code>[mrstar_accordion id="42"]
</code></pre>
<p>To find your accordion ID:<br />
1. Go to Accordion > All Accordions<br />
2. Copy the shortcode for the accordion you want from the table.</p>
<h3>Technical Details</h3>
<h4>Requirements</h4>
<ul>
<li>WordPress 6.0 or higher</li>
<li>PHP 7.2 or higher</li>
<li>Modern web browser (Chrome, Firefox, Safari, Edge)</li>
</ul>
<h4>Compatibility</h4>
<ul>
<li>Fully compatible with WordPress 6.0 and higher</li>
<li>Works with popular themes and page builders</li>
<li>Compatible with multisite installations</li>
</ul>
<h4>Performance</h4>
<ul>
<li>Lightweight and optimized for speed</li>
<li>Minimal database queries</li>
<li>Efficient CSS and JavaScript loading</li>
<li>Inline styles only when necessary</li>
</ul>
<h4>Security</h4>
<ul>
<li>Nonces for form security</li>
<li>Proper capability checks</li>
<li>Sanitized and escaped output</li>
<li>SQL injection prevention</li>
</ul>
<h3>Frequently Requested Features</h3>
<p>We’re always looking to improve MrStar Accordion Builder. Requested features include:<br />
* Custom animation effects<br />
* Advanced styling options<br />
* Integration with popular plugins<br />
* Additional content sources</p>
<p>Have a feature request? Post in the support forum!</p>
<ol>
<li>Admin: Create and manage accordions</li>
<li>Frontend: Example accordion display</li>
</ol>


MrStar Accordion Builder

Create professional, responsive accordions, collapsible content, and dynamic posts, no coding required.

itsdavidmorgan

Organic Themes

Jeff Milone

jqlee85

wordpresspagebuilder

<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/PwQJ5L0_oiM?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&start=13&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p>Organic Builder Widgets is a simple WordPress page builder plugin that provides a collection of 12 custom widgets to be used within the Customizer. The widgets are displayed as full-width content sections on any page. It transforms the native WordPress customizer into a free and easy page building solution. Unlike other page builders, our solution uses the familiar interface of the customizer and native functionality of widgets. Therefore, it’s a fast, intuitive, easy and secure. There are no shortcodes, no excessive options, no confusing interfaces, and no vendor lock-in. Additionally, the plugin is designed to work with virtually any theme! It’s an easy WordPress page building solution, as it was meant to be.</p>
<p>Display and arrange the custom widgets as content sections on any page — such as featured content slideshows, hero sections with background videos, testimonial sliders, team members, portfolios, feature icon lists, pricing tables, products, and more! Each widget features a variety of options for changing the background color, background image, display style and more! Use multiple of the same widgets, or as many different widgets as you like!</p>
<p>Additionally, the Builder Widgets plugin includes the Widget Area Block for the Gutenberg block editor. This custom block allows you to register multiple widget areas within any page or post using the block editor. As a result, blocks and traditional widgets can be used together to create dynamic page content!</p>
<p>Upgrade to <a href="https://organicthemes.com/builder/" title="Organic Builder Widgets Pro" rel="nofollow ugc">Organic Builder Widgets Pro</a> for only <strong>$39/yr</strong> and receive <strong>12 additional widgets</strong> and many more options for existing widgets, including options for changing fonts, layouts, custom heights and widths, adding filterable portfolios, blog pagination, and much more!</p>
<p>Organic Builder Widgets includes a new page template, that when applied, creates a new widget area on that page. This allows the WordPress Customizer to be used as a page builder by adding widgets as content sections to any page using the “Organic Custom” page template. Drag and drop the widgets into your desired order, and the Customizer will update in real-time to reflect your changes. Each widget includes basic styles and options, but will otherwise inherit styles from the active theme.</p>
<p><a href="https://organicthemes.com/demo/startup/widgets/" title="Live Widget Demos" rel="nofollow ugc">Live Demo</a></p>
<h4>Widgets Included</h4>
<ul>
<li><strong>Hero Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/hero-widget/" title="Hero Widget Example" rel="nofollow ugc">View Example</a> – A full browser height section with a background image, featured text and a call to action.</li>
<li><strong>Blog Posts Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/blog-widget/" title="Blog Widget Example" rel="nofollow ugc">View Example</a> – Display a section of blog posts from any category in a chosen layout.</li>
<li><strong>Content Slideshow Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/content-slideshow-widget/" title="Content Slideshow Widget Example" rel="nofollow ugc">View Example</a> – A full width slideshow of featured posts with background images.</li>
<li><strong>Feature List Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/feature-list-widget/" title="Feature List Widget Example" rel="nofollow ugc">View Example</a> – A list of features with icons displayed in multiple column layouts.</li>
<li><strong>Portfolio Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/portfolio-widget/" title="Portfolio Widget Example" rel="nofollow ugc">View Example</a> – A section of posts displayed as portfolio images in a masonry layout.</li>
<li><strong>Subpage Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/subpage-widget/" title="Subpage Widget Example" rel="nofollow ugc">View Example</a> – Display existing page content as a section within another page or use custom content.</li>
<li><strong>Team Members Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/team-widget/" title="Team Widget Example" rel="nofollow ugc">View Example</a> – A section of team members from a selected post category.</li>
<li><strong>Testimonials Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/testimonials-widget/" title="Testimonials Widget Example" rel="nofollow ugc">View Example</a> – A slideshow of testimonials from a selected category or custom post type.</li>
<li><strong>Profile Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/profile-widget/" title="Profile Widget Example" rel="nofollow ugc">View Example</a> – A personal profile widget with an image, bio and social media links.</li>
<li><strong>Pricing Table Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/pricing-table-widget/" title="Pricing Table Widget Example" rel="nofollow ugc">View Example</a> – Create a pricing table with a list of features and link to purchase.</li>
<li><strong>Featured Product Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/featured-product-widget/" title="Featured Product Widget Example" rel="nofollow ugc">View Example</a> – Display a product image with content and purchase link on the left or right.</li>
<li><strong>Featured Content Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/featured-content-widget/" title="Featured Content Widget Example" rel="nofollow ugc">View Example</a> – Custom content that can be grouped together with other featured content widgets.</li>
</ul>
<h4>Blocks Included</h4>
<ul>
<li><strong>Widget Area Block</strong> <a href="https://wordpress.org/plugins/organic-widget-area-block/" title="Widget Area Block" rel="ugc">View Block</a> – A Gutenberg block for creating custom widget areas within the block editor. As a result, blocks and widgets can be used together!</li>
</ul>
<p>In need of more blocks? Consider the <a href="https://organicthemes.com/blocks/" title="Organic Blocks Bundle" rel="nofollow ugc">Organic Blocks Bundle</a> plugin. It provides a growing collection of premium blocks for the Gutenberg editor.</p>
<h4>Pro Widgets</h4>
<p>The following widgets are only available by upgrading to the <a href="https://organicthemes.com/builder/" title="Organic Builder Widgets Pro" rel="nofollow ugc">Pro Version</a>:</p>
<ul>
<li><strong>Event Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/events-widget/" title="Event Widget Example" rel="nofollow ugc">View Example</a> – Display and manage a page section of upcoming events, perfect for musicians, speakers, entertainers, venues, and more.</li>
<li><strong>Business Info Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/business-info-widget/" title="Business Info Widget Example" rel="nofollow ugc">View Example</a> – A page section for displaying your business information including business hours, location, map, social links, and contact information.</li>
<li><strong>Image Slideshow Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/image-slideshow-widget/" title="Image Slideshow Widget Example" rel="nofollow ugc">View Example</a> – An image slideshow section with optional slide content and link.</li>
<li><strong>Split Content Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/split-content-widget/" title="Split Content Widget Example" rel="nofollow ugc">View Example</a> – Display a featured image and title on one side, and content on the other. Optionally flip tiles for variation.</li>
<li><strong>Toggle & Tabs Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/toggle-tabs-widget/" title="Toggle & Tabs Widget Example" rel="nofollow ugc">View Example</a> – Create toggle and tab sections, perfect for displaying FAQ’s, features, and documentation.</li>
<li><strong>Advanced Search Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/search-widget/" title="Advanced Search Widget Example" rel="nofollow ugc">View Example</a> – Display a featured search section, and choose to search within specific custom post types — great for listing sites.</li>
<li><strong>Food & Drink Menu Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/food-menu-widget/" title="Food & Drink Widget Example" rel="nofollow ugc">View Example</a> – Create as many food and drink menus as you want on any page — an excellent solution for restaurant and cafe websites.</li>
<li><strong>Client Login Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/login-widget/" title="Client Login Widget Example" rel="nofollow ugc">View Example</a> – Add a login form to any page, perfect for membership sites, client login sections, or landing pages.</li>
<li><strong>Audio Playlist Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/audio-playlist-widget/" title="Audio Playlist Widget Example" rel="nofollow ugc">View Example</a> – Display a beautifully styled audio playlist section on any page, a great solution for musician and podcast websites.</li>
<li><strong>Featured Video Widget</strong> <a href="https://organicthemes.com/demo/startup/widgets/featured-video-widget/" title="Featured Video Widget Example" rel="nofollow ugc">View Example</a> – Now you can easily showcase a promotional video section on any page of your website.</li>
<li><strong>Image Gallery Widget</strong> <a href="https://organicthemes.com/demo/startup/image-gallery-widget/" title="Image Gallery Widget Example" rel="nofollow ugc">View Example</a> – An improved image gallery widget that displays images within a beautiful masonry grid layout.</li>
<li><strong>Video Gallery Widget</strong> <a href="https://organicthemes.com/demo/startup/video-gallery-widget/" title="Video Gallery Widget Example" rel="nofollow ugc">View Example</a> – Display a gallery of multiple featured videos in a seamless masonry grid — perfect for vloggers and entertainers.</li>
</ul>
<h4>Reasons To Upgrade</h4>
<ul>
<li>12 Additional Widgets
<ul>
<li>Event Widget</li>
<li>Image Slideshow Widget</li>
<li>Business Info Widget</li>
<li>Split Content Widget</li>
<li>Toggle & Tabs Widget</li>
<li>Advanced Search Widget</li>
<li>Food & Drink Menu Widget</li>
<li>Client Login Widget</li>
<li>Audio Playlist Widget</li>
<li>Featured Video Widget</li>
<li>Image Gallery Widget</li>
<li>Video Gallery Widget</li>
</ul>
</li>
<li>Many More Options For Existing Widgets
<ul>
<li>Google Font Options</li>
<li>Additional Style Choices</li>
<li>Additional Background Options</li>
<li>Custom Widget Height And Width Options</li>
<li>Filterable Option For Portfolio Widget</li>
<li>Pagination Option For Blog Widget</li>
<li>Many More Options</li>
</ul>
</li>
<li>Support For Widgets From Popular Third Party Plugins – WooCommerce, Gravity Forms, Give, Easy Digital Downloads, MailChimp</li>
<li>Premium Customer Support From A Trusted Brand</li>
</ul>
<h4>Getting Started</h4>
<p>Follow the simple steps below to begin building a page with Organic Builder Widgets:</p>
<ol>
<li>Add a new page under <em>Pages > Add New</em>.</li>
<li>Apply the ‘Organic Custom’ page template within the Page Attributes.</li>
<li>Click the ‘Customize Page’ button.</li>
<li>Within the Customizer, Click the ‘Add a Widget’ button.</li>
<li>Begin adding Organic widgets to the page.</li>
</ol>


Organic Builder Widgets – Simple WordPress Page Builder

A simple WordPress page builder, Organic Builder Widgets provides a collection of 12 custom widgets to be used in the Customizer as content sections.

MrStar Accordion Builder vs Organic Builder Widgets – Simple WordPress Page Builder