Divi Theme Create An Animated ICON LIST

Описание: How to create an icon list that animated every 10 seconds using the Divi Theme. In this video we will be showing how to create this feature using some CSS Code (Below). Today we will be demonstrating how to create
this feature using the Divi Blurb Module and Divi Code Module.
So follow along with this video to see how to do this with your site.

In this video we will cover:

Adding A Divi Blurb Module.
Duplicating The Divi Blurb Module.
Adding A CSS Class Name.
Extending Module Styles.
Adding A Divi Code Module.
Adding The CSS Code.
Blending Image And Gradient Backgrounds.

Join us in this series of videos where we explore the fantastic effects you can achieve with the Divi theme. With its versatile modules and effects, you can create eye-catching visuals that enhance the look and user experience of your website.

Using animated icons in web design offers numerous benefits that enhance the overall user experience. Firstly, animated icons catch the user's attention and add a dynamic element to the design, making it more engaging and visually appealing. They can effectively convey information or actions through motion, improving usability and navigation. Secondly, animated icons provide a level of interactivity and playfulness, creating a memorable and enjoyable browsing experience. They can enhance storytelling and communicate ideas in a concise and visually compelling way. Additionally, animated icons can help guide users' attention and draw focus to specific elements on the webpage. Overall, they contribute to a more immersive and effective web design.

THEMES AND PLUGINS USED IN THESE VIDEOS:

Try out the Divi theme: https://bit.ly/TryDiviNow

Divi Supreme Modules Pro Plugin 10% Off: https://bit.ly/DiviSupremeCoupon

Divi Supreme Modules Light Plugin: https://bit.ly/SupremeFreeVersion


MY YOUTUBE PLAYLISTS:

Divi Supreme Modules Playlist:    / watch  
v=ZAO2MH0dQtk&list=PLqabIl8dx2wo8rcs-fkk5tnBDyHthjiLw

Playlist page for more videos on this:    / system22net  

Full Ecommerce Site Build Playlist:    / watch  
v=rNhjGUsnC3E&list=PLqabIl8dx2wq6ySkW_gPjiPrufojD4la9

Contact Form With File Upload Video:    • Divi Theme Contact Form With File Upload 👍👍👍  

Divi 4 Theme Create An Ecommerce Store In One Hour:    • Divi 4 Theme Create An Ecommerce Store In ...  

Check out our playlist page for more videos on this:    / system22net  

Sub:    / @system22  

Don't forget to drop any questions below, I will do my best to answer or make a video demo for you!


MY BLOG

https://web-design-and-tech-tips.com


CSS CODE USED TODAY

.iconan2 .et-pb-icon {
animation: listspin 10s infinite !important;
}
@keyframes listspin {
0% { transform:rotate(0)}
25% { transform:rotate(0)}
50% { transform:rotate(360deg)}
75% { transform:rotate(360deg)}
100% { transform:rotate(0)}
}

CHAPTERS

00:00 Introduction
00:56 Adding A Divi Blurb Module.
03:44 Duplicating The Divi Blurb Module.
04:33 Adding A CSS Class Name.
04:55 Extending Module Styles.
06:00 Adding A Divi Code Module.
06:20 Adding The CSS Code.
11:02 Blending Image And Gradient Backgrounds.

RECOMMENDED PLAYLISTS

Elementor Ecommerce Store:    • Elementor Ecommerce Store Woocommerce Inst...  

Divi Snippets:    • Divi 4 Snippets Divi Theme Overview 👍  

Divi 4 Ecommerce Store:    • Divi 4 Ecommerce Store Theme Setup And Ove...  

Bootstrap 4 Basics:    • Bootstrap 4 Basics Index Page and External...  

Elementor:    • Elementor Wordpress Builder Install And Ov...  

WordPress Tips:    • Wordpress 2020 Theme Customize The Page Ti...  


Subscribe:    / @system22  

Disclaimer: Some of these links are affiliate links where I'll earn a small commission if you make a purchase at no additional cost to you.

#YouTubeTips #WebDesignTips #FreeWebDesignTutorials #BuildYourOwnWebsite #Divi #Elementor