How to create jQuery driven “Read More” button for displaying large content blocks

How to create jQuery driven “Read More” button for displaying large content blocks

Hiding long content sections is something which sometimes is necessary to make a design look a bit better instead of having a ton of text on your home or category page. Below you is the code that makes this possible. It creates a jQuery driven Show More button which pretty much shows the hidden content and Hide button to hide it back again.



Something important: In the jQuery script you can control the visible height percent from “var hidePercent”, just change it to what you see fit.

Tags: ✓
Autor: Dimitar Radev | Modified: September 20, 2018 at 9:50 pm | Category: jQuery


Leave a Reply

Your email address will not be published. Required fields are marked *

  • Steve Atkins says:

    This is absolutely Fabulous. The code work like a charm without any problem. I got a question. How we can add some animation when we click on the button Show more and Show Less? In the Demo Link here
    https://www.wp-snipp.ninja/#less-more
    I want to add some CSS Animations Effects on click.
    Thanks

  • Advertising

    Related posts

    How to add HTML elements to Contact Form 7 (Select Multiple)

    You can place HTML form elements in Contact Form 7 plugin form editor. Yes, that is correct 🙂 The example shows multi-select checkboxes …

    Add Path to your custom js folder and javascript file

    How to add path to js folder in your WordPress template If you want to add custom path to your js folder just …