Wordpress
How to set up and assign payments to multiple Stripe accounts in WooCommerce
How can I use Google Core Web Vitals to optimize my WordPress
Divi increases the speed of your visual layout
How to collapse and expand text at will within content in Wordpress
How to modify Astra theme settings for pages and posts in batch instead of one by one
How to organize meetings with Zoom video calls from a WordPress website
How to set a minimum and maximum order in your WooCommerce store
How to change the order of Divi submenu items
How to remove all Divi shortcodes when changing themes
How to auto link to WooCommerce product tabs from short description
How to remove JavaScript to reply to comments in WordPress if you don't need it
How to add a custom message when paying in WooCommerce according to the selected country
How to fix critical WordPress error
How to turn off the default animation on Divi image galleries
Has it ever happened to you that you have a very long text that you would like to only be displayed when you click on it? It happens to me constantly, both in blog posts and in the description of the products in some online stores.
And I'm not referring to the typical "Read more" or "Keep reading" link made with the "More" block (or the icon in the classic editor) or "Page break".
And I say that they are not valid because the "More" block has no effect within an entry or product and, although the page break does work in some cases, it does not work in WooCommerce products, for example.
In addition, the page break block generates an SEO problem, by creating new additional URLs, and requiring a page change, something that is not feasible in many situations, and never in an Ecommerce.
Another possibility would be to install a collection of blocks that includes the typical accordion effect, for example, but it will not work for you in all situations, and currently it is useless in the product editor, for example, since it still uses the classic editor.
So, looking for a solution that would serve me for all situations, I found the remedy that cures everything: Collapse-O-Matic.
This plugin is a marvel of WordPress science. Once installed you have a settings screen, totally recommended to visit, although normally you do not need to change anything for it to work.
And how it works? you will ask yourself.
Well, simple, to make a text contract and expand you just have to wrap it with a shortcode, like this:
[expand]Texto a mostrar contraído hasta que se haga clic para expandirlo[/expand]
And it is pure magic.
The best thing is that you can start and end the expandable text spanning several blocks.
When I save the changes, instead of the shortcode a little arrow appears in which, when I click, the text inside the shortcodes will be displayed.
And this is its most basic use, because you can customize the shortcodes to, for example, add a visible text before or after expanding or collapsing.
It would be like this:
[expand title="Mostrar más" swaptitle="Mostrar menos"]Texto a mostrar contraído hasta que se haga clic para expandirlo[/expand]
I highly recommend you go through the documentation page to see what you can do with a simple shortcode and a few modifiers, it is surprising.
By default the text appears collapsed, but it can be displayed expanded, and many more possibilities.
It is also interesting to know the theme settings page, as it has a lot of tags that you can use to modify the behavior of the plugin.
And the best thing is that it works with the block editor, the classic one, and in all types of content, also in the WooCommerce product description.
Date update on 2021-02-16. Date published on 2021-02-16. Category: Computer class Author: Oscar olg Fuente: ayudawp