by Adam Preiser updated July 28, 2019

How To Add A Collapsible Text Area In WordPress


Share on facebook
Share on twitter
Share on linkedin

Do you have some text that you want to hide in WordPress, well in this video I show you how to add collapsible text.

Video Transcript

How-to Add A Collapsible Text Area In WordPress

in this episode am an attempt to do something that I don’t normally do in that is implement a solution live on my website without me having gone through it before recording so I look like I know what I’m doing so I am cleaning up some things that I don’t like about my website and what I do with these videos I take the audio and then I run him through a program called Dragon naturally speaking that will actually transcribed for me so I don’t have to do it now it’s not perfect but it’s about 99% accurate in the what I like to do is added as content into my posts so I put below is the raw on edited transcript and then I have all of this text now I don’t really think many people can read this I I really haven’t there more for Google so it can see more content on my blog posts however it yet just go so far down to get to where you would want to leave a comment I want to collapse it and so I know that some off-the-shelf themes will have a feature built in her you can expand and collapse the text area but I don’t have that surrogate little searching and I came up with this plug-in right here called collapse O-Matic normally I prefer to just add some code to accomplish what I want however in this case this plug-in looks pretty solid collapse O-Matic and just for the latest version which was only put out a couple months ago which means it’s actively being developed and it works there’s a lot of positive reviews I feel pretty comfortable installing this on my blog so many do this in real time so let’s highlight and copy the name into the clipboard and here is the actual post on my blog pulled up let’s go here and do a search so many go to plug-ins add new minute pace that mean right there click on search plug-ins and here it is of course so let’s click install now okay it’s downloaded let’s just activate the plug-in now let me while it’s activating let me go back over here so right here is the instructions I pretty much need to just take this little short code put it in my post and let’s even work someone a copy that into my clipboard okay so it is configured going to the settings just in case to see if there’s any particular settings see here there is an animation effect option I can add some custom CSS which of the later time and okay so let’s get all the level up they have a premium version I don’t think I’ll need that are so medical back here to my WordPress post and here it is worth says below is the raw unedited transcripts so let’s see him in a go into here minute paste and then let me copy this and put it here Mike that let me copy this and then delete it Melanie scroll all the way to the bottom and added right there so let’s see okay below let’s see inside a private want the text to change instead of below is the raw unedited text I would probably wanted to say click here click here for the clicker for the raw unedited transcripts of it, click on update and let’s see if it worked only to come back in and and remove this line if it did work I write such given a moments okay and I am going to refresh and let’s scroll down there is click here for the raw on edited transcript let’s you have than a click and there it is the transcript of a perfect so let’s do a little bit of quick cleanup what’s interesting why it’s just here might have to go in to code view right here let’s see are right so let me get rid of this C Oaks I think I need to remove that actually that and this okay that actually looks more like how it’s supposed to all case in LME click on update okay let’s do refresh on the front end other it is that’s actually perfect for me it’s all in this darker color there and there is the transcripts so now this is actually pretty awesome’s and I can go through NEC when you click through to my post it’s can be shorter to get to where the common area is yet the info is still there for Google so anyways if you want to have this feature added to your website it was so the plug-in which is called collapse O-Matic and the way you use it is you put this bit of text here you put your title and then that there and at the closing tag you put the/expand and you have collapsed the text there is probably lots other uses for questions and answers and things like that on the site but so far I’m liking it so anyways if you have a question about any particular plug-in or anything about WordPress for free to contact me.

My passion is making the best quality video tutorial online, for non-techies. When I am not behind the camera, I am usually helping out one of my YouTube subscribers.

Join The Conversation

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

  1. Extremely clear, helpful and works like a charm, thank you 🙂

  2. Quick question – when you ctrl +F on your page, does it automatically open that collapsed text for any keywords that you search that only appear within that collapsed section?

  3. Thank YOU Adam, for sharing this plugin.
    I have tried four different plugins and this one FINALLY gave me the results I was after.
    Pheeeew, what a relief!

Stay Up To Date

Enter your name and email for the lates news, updates, and tutorials.