Lightweight Accordion
Lightweight Accordion plugin for WordPress allows you to add collapse elements to posts using a Gutenberg block or a shortcode (via classic editor). By using the details HTML tag and a few lines of CSS this allows for a javascript-free accordion for minimum page load. Extremely Lightweight (<1kb): Without using Javascript the plugin uses the native details HTML tag and a few lines of code for almost no impact on front-end. Customizable: Options include customizing the HTML tag used for the accordion title, open by default, borders, colors, and accordion grouping (auto-close others when one opens). Shortcode Usage examples Here are a few examples of using the accordion plugin with shortcodes. [lightweight-accordion title="My Accordion"]My Content[/lightweight-accordion] Additionally you can display the accordion open on load with the accordion_open option. [lightweight-accordion title="My Accordion" accordion_open=true]My Content[/lightweight-accordion] You can also change the html tag wrapping the title of the accordion using the title_tag option. [lightweight-accordion title="My Accordion" title_tag="h3"]My Content[/lightweight-accordion] If you want to include FAQ schema you can add the schema option and set it to faq. [lightweight-accordion title="What is your return policy?" schema="faq"]You have 1 week to return your items[/lightweight-accordion] If you’d like put a border around the content of the accordion you can use the “bordered” attribute. [lightweight-accordion title="Bordered Content" bordered=true]My Content[/lightweight-accordion] If you want accordions to auto-close when another opens (exclusive accordion), use the “group” attribute with the same value on each accordion. [lightweight-accordion title="Question 1" group="faq"]Answer 1[/lightweight-accordion] [lightweight-accordion title="Question 2" group="faq"]Answer 2[/lightweight-accordion] [lightweight-accordion title="Question 3" group="faq"]Answer 3[/lightweight-accordion] If you’d like to swap the default triangle marker for a chevron or plus/minus icon (optionally on the right side of the title) use the “icon” and “icon_position” attributes. [lightweight-accordion title="My Accordion" icon="chevron" icon_position="right"]My Content[/lightweight-accordion] Shortcode Options Here is the full listing of shortcode options. Additionally all of these options are accessible when using the Gutenberg block. title (Required Default: null) The title of your accordion will be displayed at the top for users to click. A good example would be to include a user’s question so they could click it for more details. content (Required Default: null) Content that will go into your accordion element. title_tag (Default: “span”) This sets the html tag that wraps the title in the accordion summary. Useful if you want to make it a heading tag for SEO purposes. accordion_open (Default: false) Set this to true if you want your accordion to be open by default. bordered (Default: false) Set this to true if you want a border around the accordion content. title_text_color (Default: false) Set this to a hex value or CSS color to change the color of the accordion title text. title_background_color (Default: false) Set this to a hex value or CSS color to change the color of the accordion title text. schema (Default: false) Set this to faq if you’d like FAQ schema to be included. class (Default: false) Used to add a custom class to the parent container of the accordion. anchor (Default: null) Adds the value as an ID to the accordion div as an anchor. autop (Default: true) By default the shortcode will wrap text in a ‘p’ tag. Set this to false if you’d like this disabled for the specific accordion. group (Default: false) Set this to a group name to make accordions with the same group auto-close when another opens. Uses the native HTML details name attribute for zero JavaScript overhead. icon (Default: false) Set this to “chevron”, “plus”, or “none” to replace the default triangle marker. The chevron rotates and the plus becomes a minus when the accordion opens. icon_position (Default: false) Set this to “right” to display the chevron or plus icon on the right side of the accordion title. Additional Details If you’d like to remove the “lightweight-accordion.css” from being enqueued on your site use the filter below. It’s recommend you style the accordion yourself if you use this filter. add_filter('lightweight_accordion_include_frontend_stylesheet', '__return_false' ); If you’d like to remove the “lightweight-accordion/editor-styles.css” from being enqueued in the admin area of your site you can use the filter below. add_filter('lightweight_accordion_include_admin_stylesheet', '__return_false' ); If you’d like to remove processing of shortcodes in accordion content you can use this filter. add_filter('lightweight_accordion_process_shortcodes', '__return_false' ); If you’d like to use inline Microdata for FAQ schema you can use this filter. (Not recommended) add_filter('lightweight_accordion_output_microdata', '__return_true' ); If you’d like to force “lightweight-accordion.css” to load on all of your site you can use this filter. By default the plugin will detect if the block or shortcode is used and enqueue the CSS. add_filter('lightweight_accordion_always_include_frontend_stylesheet', '__return_true' ); When a page contains an accordion a tiny inline script is added to the footer that automatically opens accordions targeted by a URL hash (for example a link to an accordion’s anchor). If you’d like to disable this you can use the filter below. add_filter('lightweight_accordion_anchor_script', '__return_false' );
Top keywords
- accordion39×4.31%
- title23×2.54%
- lightweight-accordion21×2.32%
- default20×2.21%
- filter13×1.44%
- content11×1.22%
- false10×1.11%
- set10×1.11%
- tag10×1.11%
- add9×1.00%
- default false9×1.00%
- faq9×1.00%
My Social Feeds – bring your social content into WordPress
Show your latest Instagram posts, TikTok videos, Pinterest pins, and Twitter timeline right on your website – and keep it fresh automatically. Demos | Pricing | Documentation Why My Social Feeds? My Social Feeds is a powerful Gutenberg block plugin that lets you embed social media feeds on your WordPress website. Display Instagram posts, TikTok videos, Pinterest pins, and Twitter timelines with full control over layout, design, and behavior – columns, gaps, colors, profiles, buttons, popups, and more. Setup is simple: add your social access token where required, customize the layout from the block sidebar, and you’re ready to go. Each network gets its own dedicated block, so you can mix and match feeds anywhere the block editor works. Free Features Instagram Feed: Layout Control: Columns, row gap, and column gap settings, plus number of displayed items. Profile Options: Show/hide profile with adjustable profile image size. Interactive Elements: Show/hide Load More, Caption, and Follow buttons; open gallery item links in a new tab. Styling: Background color, border, and padding settings. Image Effects: Rotate in, rotate out, shine, zoom in, zoom out. Performance: Cache time configuration. TikTok Feed: Easy Authorization: Authorize, remove authorization, and clear cache in a click. Profile Display: Show/hide profile image, name, share button, info count, and biography, with alignment, color, background, and padding controls. Video Layout: Column control, column/row gaps, and device-based feed-per-page settings. Video Popup: Lightbox with slider and thumbnails; loads 9 videos by default with a styled Load More button. Pinterest Pins: Flexible Display: Show/hide profile, pins, image, name, about, follower count, pin count, and Follow button. Aspect Ratios: 16:9, 4:3, 1:1, 3:4, and portrait 9:16. Responsive Layout: Adjustable columns with slider or manual input, plus column and row gap control. Lightbox: Enable/disable with controls for Info Bar, Zoom In/Out, Slide Show, Thumbs, and Close. Full Styling: Profile background, image overlay, typography, colors, hover colors, padding, and borders. Twitter: Timeline Embed: Add a Twitter timeline with height, width, scrolling, and theme options. Buttons: Add Follow and Tweet buttons with color, background, font size, and padding styling. Pro Version – More Layouts & Deeper Control Upgrade to My Social Feeds Pro for advanced layouts and fine-grained customization. Pro features include: Instagram: Popup modal feed details, name and biography in the profile area, footer Follow button, hashtag removal from captions, and full color control. TikTok: Default, Slider, and Masonry layouts, videos-per-page control, overlay like/share/view counts, “View on TikTok” button, cache time control, and complete typography and color settings. Pinterest: Default, Masonry, Slider, and Justified layouts, image ratio control, extra lightbox controls (Toggle 1:1, Rotate, Flip), and typography for every element. Twitter: Hide timeline header/footer, timeline language translation, latest Twitter icon support, custom Tweet button text, hashtag support, and embedding of specific tweets and tweet videos. How to Use Install and activate the My Social Feeds plugin. Add the My Social Feeds block from the “Widgets” category in Gutenberg. Connect your feed (add an access token where required). Customize settings from the right sidebar. Publish – your social feed is live! Use Cases Creators & Influencers: Showcase your latest TikTok videos and Instagram posts on your own site. Brands & Shops: Build social proof with live feeds and Follow buttons. Bloggers: Keep pages fresh with your Twitter timeline and Pinterest boards. Agencies: Embed client social content with layout and branding control. Did you like this plugin or have suggestions? Send feedback Check Out Our Plugins 🔥 b Blocks – https://bblockswp.com 🔥 HTML5 Audio Player – https://bplugins.com/products/html5-audio-player 🔥 HTML5 Video Player – https://bplugins.com/products/html5-video-player 🔥 PDF Poster – https://bplugins.com/products/pdf-poster 🔥 StreamCast – https://bplugins.com/products/streamcast-radio-player 🔥 3D Viewer – https://bplugins.com/products/3d-viewer Source Code You can find the source code, report bugs, and contribute to the development of this plugin on our GitHub repository: My Social Feeds on GitHub Third-party Libraries @fancyapps/ui (Fancybox & Carousel) Used for: Lightbox popup, carousel slider, and thumbnail navigation Version: 5.0.36 Source: https://fancyapps.com/ License: Fancyapps UI License License URI: https://fancyapps.com/pricing/ bpl-tools Source / GitHub: https://github.com/bPlugins/bpl-tools License: GPL-2.0-or-later – https://www.gnu.org/licenses/gpl-2.0.html Purpose: Shared utility library providing admin dashboard components and common Gutenberg editor controls. External Services: The library may connect to bPlugins, WordPress.org, and Freemius services for product data and checkout functionality. See full details: https://github.com/bPlugins/bpl-tools#external-requests–why-they-are-made Freemius Lite SDK Source: https://bplugins.com/ GitHub: https://github.com/bPlugins/freemius-lite-sdk License: GPL-2.0-or-later – https://www.gnu.org/licenses/gpl-2.0.html Purpose: Provides an opt-in consent form for usage tracking and analytics to help improve the plugin. No data is sent before explicit user consent. External Services: Communicates with api.bplugins.com (activation events) and wp.freemius.com (opt-in processing) only after user opt-in. See bPlugins Privacy Policy and Freemius Privacy Policy.