By using Elementorforum.com’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Unofficial Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor


    Join us!
elementor official

Question Collapsible content text and images

G

geroidogf

New Member
Hi
I'm using Astra as my theme with Elementor. I'm trying to create a collapsible section to save on long text areas on my page. It's easy enough to create a collapsible text area with an additional plugin but for the life of me I can't find anything that will allow me create a text area, put an image alongside it, a download button underneath and allow me to collapse everything bar the heading and a few lines of the text.

So typically I would create a Section, place a header in that section, place a text area below the header, an image to the right of the text area and a button below those.

I want only the header and say 5 lines of the text area to show, the remainder hidden along with the image and button only to slide open when the user clicks 'Read More'.

Accordian won't allow me to place anything other than text in it, toggle the same. Any ideas or plugins to recommend?

Thanks
 
elementor official
G

geroidogf

New Member
Thanks for the info. That is interesting but unfortunately doesn't do the job I require. I want text and images together in a section which I can hide and then reveal when I unfold. It seems that this Jettricks plugon 'unfold' option just allows text to be added which is the same as most 'Read More' plugins. I require the text, image and a button to be hidden until the used clicks 'Read More', for example. Any ideas???
 
elementor official
markdaps

markdaps

New Member
The content does use the HTML Editor, so you can add images and text etc but may be limited for what you need.

Added it quickly to my test page so you can see (only set for desktop so probably not right on mobile etc) -> wirralbiz.co.uk/the-test-page/

You could possibly use JavaScript. As an example -> w3schools.com/howto/howto_js_read_more.asp
 
elementor official
G

geroidogf

New Member
Thanks again for the effort. I was surprised to be unable to find a plugin for this idea. Seems a basic idea that a lot of designers would like but as you see, even in paid plugins it's not available. Thanks for your input but I guess a compromise is on the cards.
 
elementor official
markdaps

markdaps

New Member
I'll have a look myself tomorrow.

All that is needed is the section height to be changed when a button action occurs.

Using JS, we can change the css of a class / ID for the section height when a user performs an action.

Probably something available for it already, just not stumbled across it yet.

Have seen this request a few times this week already in various forums.
 
elementor official
markdaps

markdaps

New Member
Thanks. I appreciate that. Not a coder myself but know a little.
I've made an EM widget for this.

Will finish it off today and fully test the BETA tomorrow.

I'll send you a download link when it's completed.
 
elementor official
elementor official
Top