Miguel Useche

This plugin provides a widget and a filter to display a collapsible archive list in your sidebar or posts using the JS JS library.
<h4>Features</h4>
<ol>
<li>Support for Gutenberg blocks. Add it to any FSE theme or Gutenberg compatible theme.</li>
<li>Display a collapsed list of your archives to reduce space.</li>
<li>Uses vanilla JS to add effects and to be compatible with all browsers.</li>
<li>Select your expand/collapse symbol and date format.</li>
<li>Support for archive filters.</li>
<li>Auto expands current/select year from posts.</li>
<li>Select the categories to exclude</li>
<li>Multiple instances support.</li>
<li>Shortcode support [JsArchiveList]</li>
<li>Generates valid HTML code.</li>
<li>Supports multiple languages.</li>
<li>Compatible with most JS cache and minify plugins.</li>
<li>And more to come…</li>
</ol>
<h3>Configuration</h3>
<ul>
<li>Title: title of the widget.</li>
<li>Trigger Symbol: characters to be displayed as bullet.</li>
<li>Effect: Effect to use.</li>
<li>Month Format: month’s display format of the month.</li>
<li>Expand: when to expand the content of the list.</li>
<li>Hide years from before: older years will be hidden under a link. To save space in the page on old sites.</li>
<li>Show days inside month list: group posts by day.</li>
<li>Show number of posts: display how many post are published in the year or in the month.</li>
<li>Show only posts from selected category: show only posts from the selected category when visiting a category page.</li>
<li>Only expand/reduce by clicking the symbol: select if animations start when click the link or just the bullet.</li>
<li>Only expand one at the same time: select if you want to have only one expanded at the same time.</li>
<li>Show posts under months: show post’s title under months.</li>
<li>Show post date next to post title: show post’s date next to post title.</li>
<li>Sort posts by: select how to sort the posts under months.</li>
<li>Include or Exclude categories: Select the categories to include or exclude.</li>
</ul>

JS Archive List

Useful

A JS widget (can be used in posts) for displaying an archive list with some effects.

kateapp29

Easy Expand helps you create sleek and responsive collapsible sections for your WordPress site. Whether you want to hide lengthy text, organize FAQs, or simplify navigation, this plugin is perfect for enhancing user experience.
Easy Expand is your ultimate solution for creating dynamic and interactive content on your WordPress site. By introducing collapsible sections, you can easily transform bulky pages into clean, organized, and user-friendly experiences. With just a few simple steps, this plugin empowers both casual users and seasoned developers to enhance the functionality and aesthetics of their websites.
With a straightforward <code>[expand]</code> shortcode, you can wrap any content (even other shortcodes) into an expanding/collapsing element. Users can click to reveal or hide content effortlessly, making your site clean and interactive.
Why choose Easy Expand? 
– Perfect for FAQs: Organize answers into collapsible sections for easy navigation. 
– Enhance mobile usability: Avoid clutter and show only what matters on small screens. 
– Flexible customization: Tailor colors, fonts, and styles to match your site design.
<h3>Key Features</h3>
<ul>
<li>Streamlined Shortcode Integration: Wrap any content within the <code>[expand]</code> shortcode and instantly create an interactive, collapsible section. You can even nest other shortcodes, giving you unparalleled flexibility.</li>
<li>Perfect for Various Use Cases:
<ul>
<li>Organize FAQs to streamline user navigation.</li>
<li>Hide lengthy articles or reports while keeping them accessible.</li>
<li>Create collapsible navigation menus for a modern UI.</li>
<li>Add spoiler tags to keep surprises intact for readers.</li>
</ul>
</li>
<li>Responsive Design: Designed with mobile-first principles, the plugin ensures collapsible sections work flawlessly on any device. Avoid screen clutter and let users focus on what matters.</li>
<li>Customizable Appearance: Match the look and feel of your site effortlessly. Adjust fonts, colors, and styles with your theme’s CSS or other customization tools.</li>
</ul>
<h3>Why Developers Love Easy Expand</h3>
<ul>
<li>Flexible Content Handling: Supports plain text, HTML, and even other nested shortcodes within collapsible sections.</li>
<li>Lightweight and Efficient: Easy Expand is built to minimize impact on load times and server performance, even for content-heavy pages.</li>
<li>Developer-Friendly Customization: Use hooks and filters to tweak the functionality and integrate seamlessly with custom themes or third-party plugins.</li>
<li>Extendable for Advanced Use Cases: From dynamic data loading to AJAX-based content display, developers can build upon Easy Expand to meet advanced project requirements.</li>
</ul>
<h3>How It Elevates Your Website</h3>
<ol>
<li>Boost User Engagement: Create intuitive interfaces that make users want to explore more.</li>
<li>Improve Accessibility: Enable users to reveal or hide content based on their needs, making your site more inclusive.</li>
<li>Simplify Navigation: Group related content, making pages more readable and structured.</li>
</ol>
By combining functionality with user-friendly design, Easy Expand helps your WordPress site stand out from the crowd. Whether you’re a blogger looking for simplicity or a developer building custom solutions, Easy Expand delivers the flexibility and performance you need.
<h3>Where to Use Easy Expand</h3>
Here’s a list of where and how you can effectively use the Easy Expand plugin to maximize the potential of your WordPress website:
<ol>
<li>
FAQs Pages
<ul>
<li>Organize frequently asked questions into collapsible sections, allowing users to quickly find answers without scrolling through long lists. </li>
<li>Example: <code>[expand title="What is your refund policy?"]We offer a full refund within 30 days of purchase.[/expand]</code></li>
</ul>
</li>
<li>
Blog Posts
<ul>
<li>Hide lengthy content like tutorials, recipes, or spoilers. Readers can reveal additional details only when needed. </li>
<li>Example: <code>[expand title="Step-by-Step Instructions"]Here’s the detailed guide to follow…[/expand]</code></li>
</ul>
</li>
<li>
Portfolios
<ul>
<li>Display project descriptions, client testimonials, or technical details in collapsible sections to keep your portfolio clean and professional. </li>
<li>Example: <code>[expand title="Project Details"]We developed a custom solution for the client using…[/expand]</code></li>
</ul>
</li>
<li>
E-commerce Stores
<ul>
<li>Add collapsible product descriptions, specifications, or FAQs to product pages for a better user experience. </li>
<li>Example: <code>[expand title="Technical Specifications"]This product includes…[/expand]</code></li>
</ul>
</li>
<li>
Landing Pages
<ul>
<li>Make marketing pages more interactive by hiding additional details until the user chooses to reveal them. </li>
<li>Example: <code>[expand title="Learn More About Our Services"]We specialize in…[/expand]</code></li>
</ul>
</li>
<li>
Educational Websites
<ul>
<li>Present course materials, quizzes, or explanations in collapsible sections to improve navigation for students. </li>
<li>Example: <code>[expand title="Chapter Summary"]This chapter covers…[/expand]</code></li>
</ul>
</li>
<li>
Documentation Pages
<ul>
<li>Organize technical documentation into manageable sections, making it easier for users to find and focus on specific topics. </li>
<li>Example: <code>[expand title="API Details"]Here are the parameters for our API…[/expand]</code></li>
</ul>
</li>
<li>
Event Schedules
<ul>
<li>Display detailed agendas, speaker bios, or session descriptions without cluttering the page. </li>
<li>Example: <code>[expand title="Session 1: Keynote Address"]Speaker: John Doe. Time: 10 AM.[/expand]</code></li>
</ul>
</li>
<li>
Membership Sites
<ul>
<li>Offer premium or hidden content only accessible upon user interaction, adding a touch of exclusivity. </li>
<li>Example: <code>[expand title="Exclusive Tips"]These are reserved for our premium members…[/expand]</code></li>
</ul>
</li>
<li>
Online Forums or Communities
<ul>
<li>Use collapsible sections for hiding large blocks of text, like rules, resources, or instructions for members. </li>
<li>Example: <code>[expand title="Forum Guidelines"]Please follow these rules to maintain a healthy discussion…[/expand]</code></li>
</ul>
</li>
<li>
Creative Writing Websites
<ul>
<li>Add interactive storytelling elements, such as hiding alternate endings, author notes, or character profiles. </li>
<li>Example: <code>[expand title="Spoiler Alert"]The story takes an unexpected twist…[/expand]</code></li>
</ul>
</li>
</ol>
and etc.

Easy Expand

Make your content dynamic with Easy Expand! Add interactive collapsible sections to any page or post with just a simple shortcode.

JS Archive List vs Easy Expand