PSDCovers

<p>Developed internally for our Adjustly theme, this plugin allows authors to link 2 html elements together as trigger and target.  When the trigger is clicked the target will immediately expand to reveal its content.</p>
<h4>Try the Demo</h4>
<p>If you’re interested in seeing what a default installation of Adjustly Collapse has to offer, have a look at some samples on our site.</p>
<p><a href="http://www.psdcovers.com/adjustly-collapse/" rel="nofollow ugc">http://www.psdcovers.com/adjustly-collapse/</a></p>
<h4>Usage</h4>
<p>The basic structure without any CSS bells and whistles looks like this:</p>
<pre><code><a class="aj-collapse" rel="myslidingcontent">trigger</a>
<div class="aj-hidden" id="myslidingcontent">target: this content is hidden by default</div>
</code></pre>
<p>In the example above, the trigger is an href element and the target is a div element.  Note that the target can be any element you choose.</p>
<h4>rel=”[id]”</h4>
<p>Each trigger and target pair must contain a common label so that the trigger knows which target to expand or collapse. The trigger rel tag must be the same name as the target’s id tag.  If you plan on having multiple collapsible elements in a page, post or theme then you will need to ensure that the rel and id tags are always unique for each trigger/target combo.</p>
<h4>Class Names</h4>
<ol>
<li>The trigger must always have the following class name: class=”aj-collapse”</li>
<li>The target can have either of 2 classes: class=”aj-hidden” will make the target collapsed by default while class=”aj-visible” will display the content normally but allow the viewer to collapse it.</li>
</ol>
<h4>Notes</h4>
<p>The trigger and target do not have to be next to each other.  The target can be at the opposite end of the article or you can place it within the trigger. Theme developers can use it to make widgets collapsible.</p>


Adjustly Collapse

Developed internally for our Adjustly theme, this plugin allows authors to link 2 html elements together as trigger and target.

Evan Herman

Matthieu S

<p><strong>Video Demo</strong></p>
<p><iframe loading="lazy" title="Expand Collapse Funk WordPress Plugin" width="750" height="422" src="https://www.youtube.com/embed/fiNUqZxFwNA?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></p>
<p><strong>Feautres</strong></p>
<ol>
<li>Beautifully simple UI</li>
<li>Easy to access custom tinyMCE button</li>
<li>Easily add images and YouTube video to hidden content area</li>
<li>Input direct links to images or YouTube videos</li>
<li>Quick placement of expand+collapse items</li>
<li>Use on pages and posts (or copy and paste the code to use in theme templates)</li>
<li>Use HTML markup inside the hidden content area</li>
<li>Mobile/Responsive Ready</li>
<li>Use in sidebar (inside of a ‘Text’ widget)</li>
<li>SEO friendly hidden content</li>
<li>Great Support</li>
</ol>
<p>If you want to include Expand+Collapse Funk you can use the following code anywhere in your Theme: (remember to swap out the Link and Hidden Content for your content)</p>
<pre><code><div class="exp-col-content-holder"><a class="expand-cnt-link" href="#">This Is The Link To Click</a>
    <div class="hidden-content">
        <p class="hiddenContentp">This is all of your hidden content. This will be invisible at first, but after clicking on the link above this will slide in.</p>
    </div>
</div>
</code></pre>
<p>Using Expand+Collapse Funk allows for very easy placement of collapseable content and a link to reveal the content. The expand and collapse functionality is widely<br />
used across the web to free up space on a page or to place semi-important content into posts, pages or into the sidebar. There is no limit to the length of the collapseable content. Easily include images,<br />
YouTube/Vimeo videos or anything else you could imagine.</p>
<p>I originally built this plugin for the marketing department at my full time job, so a simple UI and ease of use was kept in mind throughout development.</p>
<p>Have an idea, question, concern or found a bug?<a href="http://www.evan-herman.com/contact" rel="nofollow ugc"> Get In Contact With Me!</a></p>


Expand + Collapse Funk

Easily add expand and collapse functionality to any WordPress theme. No coding skills required! Beautifully simple UI. Save space with this plugin for …

Adjustly Collapse vs Expand + Collapse Funk