The Easiest Way to Create a Show More / View More Button in Elementor Without a Plugin - WordPress
The CSS required to do this is pinned 📌 to the top comment.
What I use to build amazing websites:
Elementor (the best WordPress page builder): https://be.elementor.com/visit/?bta=27702&nci=5383
Awesome, affordable hosting (the server your website needs to exist): https://www.hostinger.com/reialesa - use discount code 'REIALESA' to get an extra 10% off your purchase!
Elementor Global Settings Explained - How to Correctly Set up the Site Settings for a Great Workflow: https://youtu.be/Sya3k4Iduxs
Elementor Units Explained - How and When You Should Use PX, REM, EM, %, VH and VW: https://youtu.be/wKLXXE3Tq_c
🗞️ Subscribe to my newsletter: https://www.reialesa.com/newsletter/
A 'show more' button is a very simple way of adding content to your website without displaying it immediately. By revealing content when users press a button, they're still going to stay on the same page as opposed to being redirected elsewhere. It also makes designing things easier and it shows the content only to those who are really interested in it.
There's a very easy way create this kind of button in Elementor. We're going to use the new nested accordion widget and we're going to style it and change the way it works with some CSS. It is by far the easiest way to create this kind of button without using any additional plugins.
You can style the way it looks. You can place in any kind of content, from text, images, videos, products or even whole containers that include a large part of your page. You can name it anything you want - see more, read more, view more, show more or anything else. And, of course, we're going to make it fully responsive as well.
On top of all that, you can apply some simple motion effects to your content, that will make the whole effect even more dynamic and interesting.
#showmore #button #elementor
CHAPTERS:
00:00 - Intro
00:31 - Enabling the nested accordion widget
00:51 - Adding and preparing the accordion widget
02:42 - Styling the accordion widget
04:09 - Adding in the CSS
05:10 - Explaining and customizing the CSS
06:40 - Note regarding the CSS
07:53 - Explaining and customizing the CSS
11:58 - Making everything responsive
12:33 - Adjusting the CSS for the free version of Elementor
13:24 - Adding motion effects to your content
Get in touch:
https://www.reialesa.com/youtube/
Don’t be shy! Let me know what you’d like to see next, ask me anything related to design or just simply say hi.
Please note that some of the above are affiliate links, which means I earn a commission if you make a purchase, at no additional cost to you. Thank you very much if you decide to use them!
Видео The Easiest Way to Create a Show More / View More Button in Elementor Without a Plugin - WordPress канала Reialesa
What I use to build amazing websites:
Elementor (the best WordPress page builder): https://be.elementor.com/visit/?bta=27702&nci=5383
Awesome, affordable hosting (the server your website needs to exist): https://www.hostinger.com/reialesa - use discount code 'REIALESA' to get an extra 10% off your purchase!
Elementor Global Settings Explained - How to Correctly Set up the Site Settings for a Great Workflow: https://youtu.be/Sya3k4Iduxs
Elementor Units Explained - How and When You Should Use PX, REM, EM, %, VH and VW: https://youtu.be/wKLXXE3Tq_c
🗞️ Subscribe to my newsletter: https://www.reialesa.com/newsletter/
A 'show more' button is a very simple way of adding content to your website without displaying it immediately. By revealing content when users press a button, they're still going to stay on the same page as opposed to being redirected elsewhere. It also makes designing things easier and it shows the content only to those who are really interested in it.
There's a very easy way create this kind of button in Elementor. We're going to use the new nested accordion widget and we're going to style it and change the way it works with some CSS. It is by far the easiest way to create this kind of button without using any additional plugins.
You can style the way it looks. You can place in any kind of content, from text, images, videos, products or even whole containers that include a large part of your page. You can name it anything you want - see more, read more, view more, show more or anything else. And, of course, we're going to make it fully responsive as well.
On top of all that, you can apply some simple motion effects to your content, that will make the whole effect even more dynamic and interesting.
#showmore #button #elementor
CHAPTERS:
00:00 - Intro
00:31 - Enabling the nested accordion widget
00:51 - Adding and preparing the accordion widget
02:42 - Styling the accordion widget
04:09 - Adding in the CSS
05:10 - Explaining and customizing the CSS
06:40 - Note regarding the CSS
07:53 - Explaining and customizing the CSS
11:58 - Making everything responsive
12:33 - Adjusting the CSS for the free version of Elementor
13:24 - Adding motion effects to your content
Get in touch:
https://www.reialesa.com/youtube/
Don’t be shy! Let me know what you’d like to see next, ask me anything related to design or just simply say hi.
Please note that some of the above are affiliate links, which means I earn a commission if you make a purchase, at no additional cost to you. Thank you very much if you decide to use them!
Видео The Easiest Way to Create a Show More / View More Button in Elementor Without a Plugin - WordPress канала Reialesa
show more button in elementor view more button reveal more content on button click show more content when clicking a button elementor read more button wordpress show more wordpress read more open more content button elementor how to create a view more button elementor accordion widget elementor nested accordion elementor accordion using the accordion widget as a button elementor style the accordion to look like a button elementor accordion read more button
Комментарии отсутствуют
Информация о видео
9 июля 2024 г. 1:27:09
00:14:56
Другие видео канала