Elementor Pro Tutorial

Create a webshop using Elementor Pro

Create Custom Post Types

Forms Tutorial

Header Tutorial

Create A Popup Header In Elementor Pro

Create A Footer In Elementor Pro

Create A Mega Menu In Elementor Pro

Important links

Sticky Header Background and Link Colors

/*Sticky Header background*/  
selector.elementor-sticky--effects{
background: #FFF;
}
/*Sticky Header Links and Icons*/
selector.elementor-sticky--effects a,
selector.elementor-sticky--effects i{
color: #000!important;   
}

Different Logo For The Sticky Header

/* Sticky Logo Invisible */
.sticky-logo {
 display: none;
}
/* Change Logos When Scrolling */
.elementor-sticky--effects .sticky-logo{
 display: inline-block;
}
.elementor-sticky--effects .static-logo{
 display: none;
}

Change Complete Header On Scroll

.sticky-header {
   top: -70px !important;
   z-index: -1;
   transition: top 1s ease !important;
}
.sticky-header.elementor-sticky--effects {
    top: 0 !important;
}

Menu Separator

.menu-item:not(:last-child) a {
border-right: 1px solid #B3B3B3;
padding:15px 3px 15px 3px;
}
.menu-item:last-child a {
padding:15px 3px 15px 3px;
}

Elementor Pro Tutorial

In this Elementor Pro tutorial, I want to share some code with you so you don’t have to rewrite it yourself.