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

Create jQuery Read More button for showing large texts

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.

Autor: Dimitar Radev | Modified: April 22, 2019 at 9:51 pm


Leave a Reply to Steve Atkins Cancel 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

    Change The Color Of Wordpress Admin Dashboard Icon In The Menu

    How to change Dash icon color in WordPress admin menu with CSS?

    Change the default color for dash icon in the admin menu Probably you have this question when you create a Custom WordPress Theme …

    Add "Multi Select Checkbox to Contact Form 7

    How to add HTML elements to Contact Form 7 (Multi Select Checkbox)

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