J. Duijvelshoff

<p>Simple and good accordion plugin providing 2 blocks: Accordion and Accordion-pane. Drag an Accordion block into your post, page or custom post type and hit the ‘Add pane’ button for as often as you need.</p>
<p>Features:</p>
<ul>
<li>Setting for ‘One at a time’. Only one pane within an accordion can be opened. Uncheck this to allow for all panes to be opened simultaneously.</li>
<li>Use ‘Tab’ key to focus panes and hit ‘Enter’ to open</li>
<li>Extensive Use of Accessability attributes</li>
<li>Optionally choose for HTML  and  tags. </li>
<li>Panes scroll into view when a previous pane gets closed</li>
<li>Adjust colors, margins and padding in the block editor</li>
<li>Add styling via css, css-vars or theme.json</li>
</ul>
<h3>Use</h3>
<p>Drag an Accordion block into a post or page or CPT and use the ‘Add pane’ button at the bottom of the block to add pane-blocks.</p>
<h3>styling</h3>
<p>At the root some basic styling variables are defined that can be overwritten by your theme. Some of these can be changed ad hoc by the user in de block-editor. These are:</p>
<pre><code>    --wp--custom--accordion--transition-time: 0.1s;
    --wp--custom--accordion--margin-top: 0px;
    --wp--custom--accordion--margin-right: 0px;
    --wp--custom--accordion--margin-bottom: 0.1em;
    --wp--custom--accordion--margin-left: 0px;
    --wp--custom--accordion--header-padding-top: 0.5em;
    --wp--custom--accordion--header-padding-right: 2em;
    --wp--custom--accordion--header-padding-bottom: 0.5em;
    --wp--custom--accordion--header-padding-left: 2em;
    --wp--custom--accordion--content-padding-top: 0.5em;
    --wp--custom--accordion--content-padding-right: 2em;
    --wp--custom--accordion--content-padding-bottom: 0.5em;
    --wp--custom--accordion--content-padding-left: 2em;
    --wp--custom--accordion--header--text-color: #ffffff;
    --wp--custom--accordion--header--background-color: #666666;
    --wp--custom--accordion--header--active-text-color: #ffffff;
    --wp--custom--accordion--header--active-background-color: #999999;
    --wp--custom--accordion--body--text-color: #ffffff;
    --wp--custom--accordion--body--background-color: #666666;
</code></pre>
<p>The default values can also be defined in the theme.json of your (child-) theme:</p>
<p>Add them to the theme.json like so:</p>
<pre><code>{
    "$schema": "https://schemas.wp.org/wp/6.7/theme.json",
    "version": 3,
    "settings": {
        "custom": {
            "accordion": {
                "transitionTime": "0.1s",
                "marginTop": "0px",
                "marginRight": "0px",
                "marginBottom": "0.1em",
                "marginLeft": "0px",
                "headerPaddingTop": "1em",
                "headerPaddingRight": "1em",
                "headerPaddingBottom": "1em",
                "headerPaddingLeft": "1em",
                "contentPaddingTop": "0.5em",
                "contentPaddingRight": "2em",
                "contentPaddingBottom": "0.5em",
                "contentPaddingLeft": "2em",
                "headerTextColor": "#ffffff",
                "headerBackgroundColor" : "#666666",
                "activeHeaderTextColor": "#ffffff"
                "activeHeaderBackgroundColor": "#999999",
                "bodyTextColor": "#000000",
                "bodyBackgroundColor" : "#ffffff",
            }
        }
    }
}<h3>Accessability</h3>The pane-headers have a tab-index. If the Enter-key is pressed while a pane-header has focus, a click-event is triggered on that pane-header thereby activating / opening it.
</code></pre>


Good Accordion

Wordpress accordion block. Simple, small and good.

HappyDevs

Nazrul Islam Nayan

Optemiz

Riajur Rahman

Azharul Islam Ashiq

<h4>Happy WooCommerce FAQs: The best solution for seamless WooCommerce FAQs and Ultimate Product FAQ Plugin</h4>
<p><strong>Happy WooCommerce FAQs</strong> is a feature-packed, flexible, and robust <strong>product FAQ</strong> plugin for WooCommerce. It might be your best shot if you want to increase sales by answering your customer’s most commonly asked questionnaires smartly.</p>
<p><a href="https://demo.happydevs.net/happyfaqs/product/beanie-with-logo/" rel="nofollow ugc">Demo</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/overview" rel="nofollow ugc">Documentation</a> | <a href="https://www.youtube.com/watch?v=CnsPBdgIbaU&list=PLqgTGQxEn_rZbnleeeuK18QJ984t6o3ZX&ab_channel=HappyDevs" rel="nofollow ugc">Video Tutorials</a> | <a href="https://happydevs.net/support" rel="nofollow ugc">Get Support</a></p>
<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/CnsPBdgIbaU?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<blockquote>
<p><strong>Upgrade to Happy FAQs PRO</strong><br />
  Upgrade to <a href="https://happydevs.net/happy-woocommerce-faqs-pro" rel="nofollow ugc">Happy FAQs PRO now</a> to get the priority e-mail support and gain an access to all the PRO features!</p>
<p>This advanced WooCommerce Question Answer plugin can skyrocket your sales and increase your business’s online visibility. Indeed, a tool that should not be missed for any product site.</p>
</blockquote>
<h3>⭐ TOP FEATURES</h3>
<p>Here’s a glimpse of the top features of this ultimate FAQ plugin for <a href="https://wordpress.org/plugins/woocommerce" rel="ugc"><strong>WooCommerce</strong></a>:</p>
<ul>
<li>Unlimited FAQs</li>
<li>FAQs by Product Categories</li>
<li>FAQs by Product Tags</li>
<li>AI FAQs Generator (since 1.7.0)</li>
<li>Individual product FAQ</li>
<li>Gutenberg Editor support</li>
<li>Classic Editor support</li>
<li>FAQ Post support</li>
<li>Product FAQ comment</li>
<li>Schema support</li>
<li>Sorting FAQs</li>
<li>Shortcode support</li>
<li>Custom style support</li>
<li>Fully responsive</li>
<li>FAQ block support</li>
<li>Media/Image support in FAQ answer</li>
<li>Adding content before and after the FAQ list</li>
<li>HTML content – write answers in HTML</li>
<li>Multiple Layout – standard templates for front view</li>
<li>WP Editor for HTML markup, supports WYSIWYG editor</li>
<li>WooCommerce compatible style for product information tab</li>
<li>FAQ layout preview</li>
<li>FAQ tab reorder setting</li>
<li>Show/hide FAQ answers on page load</li>
<li>Option of Expand/Collapse All FAQs</li>
<li>Polylang translations support</li>
<li>💎 Customer Asking Questions (PRO)</li>
<li>💎 Variation Product FAQs (PRO)</li>
<li>💎 More Beautiful FAQs Templates (PRO)</li>
<li>💎 Display in Product Pages [display on Product page] (PRO)</li>
<li>💎 Display in Archive Pages [display on Product Categories & Tags page] (PRO)</li>
<li>💎 Display in Shop Page (Shop Page FAQs) (PRO)</li>
<li>💎 Display in Cart Page (Cart Page FAQs) (PRO)</li>
<li>💎 Display in Checkout Page (Checkout Page FAQs) (PRO)</li>
<li>💎 DYNAMIC PRODUCT ATTRIBUTE (PRO)</li>
<li>💎 Global FAQS (PRO)</li>
<li>💎 RTL Support (PRO)</li>
<li>💎 SEARCH FAQs (PRO)</li>
<li>💎 Multi Column Support (PRO)</li>
<li>💎 Many More Features (PRO)</li>
</ul>
<p>Let’s explain these features one by one.</p>
<h3>♾️ UNLIMITED FAQS</h3>
<p>The <code>Happy WooCommerce FAQs</code> plugin allows you to add unlimited FAQs to your eCommerce store. It doesn’t matter how many products you have in your online store, this WooCommerce FAQ plugin got you covered. You can even add global FAQs for your products.</p>
<h3>🎨 INDIVIDUAL PRODUCT FAQ</h3>
<p>Every product is special. So, it’s very common for customers to have specific questions about specific products. As an owner, it’s your sole duty to convert those product visitors into probable buyers by answering their custom questions with this FAQ accordion plugin.</p>
<h3>🤖 SCHEMA SUPPORT</h3>
<p><a href="https://www.youtube.com/watch?v=K1X6mAVDbog" rel="nofollow ugc">Watch Video</a></p>
<p>Increasing search engine visibility is one of the best ways to grow your business. The better ranking you have, the more traffic you will get from the search engines. If you want to rank your product page, then you must use the FAQ schema.</p>
<h3>🗣️ FAQ COMMENT</h3>
<p>To enable comment support, please go through “<strong>Happy FAQs > Settings > Comment</strong>” and select enable. The comments and comment forms are fully customizable. Besides, you can also update the comment font, color, design, button styling, etc.</p>
<p>Customers or visitors can submit their comments to every product FAQ. After that, Admin can either approve or delete comments. The approved comments will be displayed on the front. This commenting feature helps you get customer feedback on your WooCommerce products and the product FAQs.</p>
<p><a href="https://happydevs.net/happy-woocommerce-faqs-pro" rel="nofollow ugc"><strong>Upgrade to PRO</strong></a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/overview/" rel="nofollow ugc"><strong>Documentation</strong></a> | <a href="https://wordpress.org/support/plugin/faq-for-woocommerce/" rel="ugc"><strong>Support</strong></a></p>
<h3>🔀 SORTING FAQS</h3>
<p>The Happy WooCommerce FAQs plugin works in a more advanced way than the other FAQ accordion plugins. This FAQ sorting feature might be a great example to support this statement.</p>
<p>Happy WooCommerce FAQs allows the users to sort the FAQs under different parameters like ‘<strong>order</strong>’ and ‘<strong>order_by</strong>’. You can also implement this sorting feature by using shortcodes. Check the following feature to learn about using the shortcode feature.</p>
<h3>🚀 SHORTCODE SUPPORT</h3>
<p>A smart representation of WooCommerce product FAQs impacts sales directly. That’s why you must display the product FAQs wherever needed. That’s why this WordPress FAQ plugin comes with the shortcode feature.</p>
<p><a href="https://happydevs.net/docs/faq-for-woocommerce/shortcodes/" rel="nofollow ugc">Read More</a></p>
<p>ℹ️ You can display <strong>all FAQs</strong> for a random product having FAQs with the default template:</p>
<pre><code>[ffw_template]
</code></pre>
<p>ℹ️ To <strong>display all FAQs for a specific product</strong>, use the following shortcode:</p>
<pre><code>[ffw_template id=20]
</code></pre>
<p>💡 Here, 20 is the product id. Replace it with your desired product id.</p>
<p>ℹ️ To <strong>display FAQs for specific FAQ categories</strong>, use the following shortcode:</p>
<pre><code>[ffw_template cat_ids="32, 33"]
</code></pre>
<p>💡 If the cat_ids exist, then the product id will be ignored. Here 32 & 33 are FAQ categories id. Please use the comma separator while inputting the data.</p>
<p>If you want to sort the product FAQs using shortcodes, you can do it by using ‘order’ and ‘order_by’ parameters.</p>
<p>The supported values for ‘order’ (Default Value: ‘ASC’)<br />
– ‘DESC’, ‘ASC’</p>
<p>The supported values for ‘order_by’ (Default Value: ‘ID’)<br />
– ‘ID’, ‘date’, ‘title’, ‘name’, ‘date’, ‘modified’, ‘comment_count’, ‘author’.</p>
<p>ℹ️ Use the shortcode below to display FAQs for a current product ID (for the single product page):</p>
<pre><code>[ffw_template dynamic_post=true]
</code></pre>
<p>💡 This shortcode is appropriate for single product pages.</p>
<p>ℹ️ Use the following shortcode to display all FAQs for a specific product with a specific template by this easy accordion FAQ plugin.</p>
<pre><code>[ffw_template template=1 id=20]
</code></pre>
<p>💡 Use the following template ids to show FAQs</p>
<ul>
<li>For Classic Template – 1</li>
<li>For Whitish Template – 2</li>
<li>For Trip Template – 3</li>
<li>For Pop Template – 4</li>
<li>For Basic Template – 5</li>
<li>For Glow Template (Pro) – 6</li>
<li>For Smart Template (Pro) – 7</li>
<li>For Wow Template (Pro) – 8</li>
<li>For Zoom Template (Pro) – 9</li>
</ul>
<h3>🎦 MEDIA/IMAGE SUPPORT IN FAQ ANSWER</h3>
<p>A picture is worth a thousand words. While answering the questions, you might need to use some images or videos to explain the answer better. To help you in this situation, <code>Happy WooCommerce FAQs</code> allows the insertion of digital media in the answers.</p>
<p>It not only helps to answer the questions better but also answers them more appropriately. You can insert every media file that is supported by WordPress.</p>
<h3>🎢 MULTIPLE LAYOUTS – STANDARD TEMPLATES FOR FRONT VIEW</h3>
<p>This Product FAQ for WooCommerce has five built-in templates to choose from. These are –</p>
<ul>
<li>Classic Template</li>
<li>Whitish Template</li>
<li>Trip Template</li>
<li>Pop Template</li>
<li>Basic Template (since 1.4.5)</li>
<li>Glow Template (Pro)</li>
<li>Smart Template (Pro)</li>
<li>Wow Template (Pro)</li>
<li>Zoom Template (Pro)</li>
</ul>
<h3>🎬 SHOW/HIDE FAQ ANSWERS ON PAGE LOAD</h3>
<p>By default, the product FAQs are listed just like a simple FAQ accordion style. If you want to read the answer to a specific question, you have to click on that question, and it will show the answer.</p>
<p>But, Happy WooCommerce FAQs is designed to offer something extra than others. So, you can set whether you want to show or hide the answers while the product page loads initially.</p>
<h3>👨‍💻 OPTION TO EXPAND/COLLAPSE ALL FAQS</h3>
<p>Besides controlling the FAQs visibility from the dashboard panel, the Happy WooCommerce FAQs manager plugin lets the customer control it from the front-end interface.</p>
<h3>⚡ Maximize the efficiency of your WooCommerce FAQ creation process</h3>
<p>You will get a lot of effort minimizing features from the free version of this WooCommerce faq accordion plugin. But you will definitely enjoy the pro version since it saves your time and resources more efficiently.</p>
<p>With <code>Happy WooCommerce FAQs Pro</code>, your sales will increase dramatically because it will enhance the standard of your WooCommerce products by making them more informative.</p>
<h3>Pro Features of <code>Happy WooCommerce FAQs</code>:</h3>
<h3>👕 FAQs by Product Categories</h3>
<p>Assign product categories to FAQs. It will minimize your time to connect FAQs with products.</p>
<h3>👕 FAQs by Product Tags</h3>
<p>Assign product tags to FAQs. It will minimize your time to connect FAQs with products.</p>
<h3>❓ Customer Asking Questions (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=OEhB1k8QSAk" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/customer-questions/how-to-manage-customer-questions/" rel="nofollow ugc">Read More</a></p>
<p>Feature to make customer capable to ask a question on product, shipping, payment, coupon, order etc.</p>
<h3>👟 Variation Product FAQs (PRO FEATURE)</h3>
<p>Easily create FAQs for variation products and easily engage with your customers by answering their variation queries about the child products.</p>
<h3>📑 More Beautiful Templates (PRO FEATURE)</h3>
<p>With premium FAQ templates, you can display standard product FAQs and boost your sales.</p>
<h3>👕 Display Location in Product Pages (PRO FEATURE)</h3>
<p>Display faqs anywhere on the product pages, it will give you the flexibility to adjust faqs with your design theme interface.</p>
<h3>🚪 Display in Archive Pages (PRO FEATURE)</h3>
<p>Display faqs on the product archive pages (product category and tag). Archive WooCommerce FAQs can be displayed for ecommerce customers.</p>
<h3>🟦 Display in Shop Page (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=H5zjhIxAnKE" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/display-faqs-in-shop-page/" rel="nofollow ugc">Read More</a></p>
<p>Display shop related faqs anywhere on the shop page, you may have shipping, payment, order, discount related FAQs to display in Shop page.</p>
<h3>🛒 Display in Cart Page (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=H5zjhIxAnKE" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/display-faqs-in-cart-page/" rel="nofollow ugc">Read More</a></p>
<p>Display cart related faqs anywhere on the cart page, you may have shipping, payment, order, discount related FAQs to display in Cart page.</p>
<h3>🛍️ Display in Checkout Page (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=H5zjhIxAnKE" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/display-faqs-in-checkout-page/" rel="nofollow ugc">Read More</a></p>
<p>Display checkout related faqs anywhere on the checkout page, you may have shipping, payment, order, discount related FAQs to display in Checkout page.</p>
<h3>⚛️ DYNAMIC PRODUCT ATTRIBUTE (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=Yli56iffP74" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/dynamic-product-attributes-pro/" rel="nofollow ugc">Read More</a></p>
<p>Effortlessly create dynamic FAQs for your WooCommerce store with Happy WooCommerce FAQs PRO. Use placeholders like {product_price} in your FAQ answers, and the assigned products will dynamically display their specific values.</p>
<p>This powerful feature saves time by generating product-specific responses without creating individual FAQs. Enhance your WooCommerce product FAQs with dynamic attributes for a seamless user experience.</p>
<h3>🌐 Global FAQs (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=cHjqwUfp3zA" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/global-faqs-pro" rel="nofollow ugc">Read More</a></p>
<p>Creating identical FAQs for all your <strong>WooCommerce</strong> products can be tedious. With <strong>Happy WooCommerce FAQs</strong>, you can streamline the process using the <strong>Global FAQs</strong> feature.</p>
<p>Set the same FAQ for your entire store effortlessly—just create it once and mark it as a Global FAQ. It will automatically appear in every product’s FAQ section, saving time and enhancing consistency across your online store.</p>
<h3>⬅️ RTL SUPPORT (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=vAKGJL51jYg" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/rtl-support-pro/" rel="nofollow ugc">Read More</a></p>
<p>Happy WooCommerce FAQs already supports several languages, but it transcends all boundaries with RTL support. RTL languages such as Arabic, Aramaic, Azeri, Hebrew, Kurdish, Persian, etc, are supported in Happy WooCommerce FAQs PRO.</p>
<h3>🔍 SEARCH FAQs (PRO FEATURE)</h3>
<p><a href="https://www.youtube.com/watch?v=_5kTNyDsP2s" rel="nofollow ugc">Watch Video</a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/search-box-pro/" rel="nofollow ugc">Read More</a></p>
<p>Happy WooCommerce FAQs is indeed one of the best WordPress accordion plugins for WooCommerce. You’ll be able to find the exact FAQ within seconds using this FAQ accordion tool.It offers a flexible search option for your WooCommerce product FAQs. The comprehensive search functionality in the FAQ area will allow you to search out the FAQ you are looking for.</p>
<h3>☲ MULTI-COLUMN SUPPORT (PRO FEATURE)</h3>
<p>Typically a FAQ section comes with a simple outlook that contains questions, answers, and a faq dropdown option. Using Happy WooCommerce FAQs PRO, you can generate FAQs with unique viewing experiences for the users. It allows you to personalize the FAQ area with Multi-column support.</p>
<p>Users can now see more FAQs and access them without even scrolling the screen. You can simply enable or disable multi-column FAQs using this amazing tool. For user convenience, this feature displays more FAQs inside a relatively compact viewing area.</p>
<p><a href="https://happydevs.net/happy-woocommerce-faqs-pro" rel="nofollow ugc"><strong>Upgrade to PRO</strong></a> | <a href="https://happydevs.net/docs/faq-for-woocommerce/overview/" rel="nofollow ugc"><strong>Documentation</strong></a> | <a href="https://wordpress.org/support/plugin/faq-for-woocommerce/" rel="ugc"><strong>Support</strong></a></p>
<p>💚 Satisfied with our Happy WooCommerce FAQs plugin?<br />
👉 <a href="https://www.linkedin.com/company/happydevsteam" rel="nofollow ugc"><strong>Join our LinkedIn Page</strong></a><br />
⭐ <a href="https://wordpress.org/support/plugin/faq-for-woocommerce/reviews/?filter=5" rel="ugc"><strong>Rate us on WordPress</strong></a> [Your Review, Our Inspiration]</p>


Happy WooCommerce FAQs – Ultimate Product FAQ Plugin


it's a very useful and attractive plugin for woocommerce product faq


verry usefull and attractive plugin,

WooCommerce Product FAQ Plugin and accordion plugin create FAQs with Google FAQ schema, AI Generator, Comment and customization support.

Good Accordion vs Happy WooCommerce FAQs – Ultimate Product FAQ Plugin