Docs

[Nikhil Ravishanker]

Hi,

I’d like to know if it is within the scope of the support you offer to help me with an issue I’m facing.
There’s basically a lot of paragraphs within pages on my site that I’d like to condense by having only a couple of lines visible, and the rest hidden. A link that says ‘know more’ or ‘read more’ should then display the remaining text without going to a different page.

I hope I’ve explained my issue.

Thank you so much, in advance!

[Friech]

Hi There,

Thanks for writing in! While that is outside the scope of support we can offer, I could point you in the right direction with the understanding that it would ultimately be your responsibility to take it from here.

Use something like this for your paragraph

<div id="clickme">
  Click here
</div>
<div id="lorem" style="display: none;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>

And then add this on your Global Custom JavaScript on Customizer.

(function($) {
   $( "#clickme" ).click(function() {
  $( "#lorem" ).toggle( "slow", function() {
  });
});
})(jQuery);

Hope it helps, Cheers!

[Nikhil Ravishanker]

Thanks for your assistance!
You guys are great 🙂

[Rahul]

Glad we could help you.

If you still have any issues with the them, let us know. We’d be happy to assist you with everything.

Thanks for using the X theme.

[Author]

Posts