How To Create A Mobile App Menu On Elementor

mobile app menu

https://youtu.be/7iJz3km-nwM Create Your Glass Effect Here: glassmorphism.com Mobile Section /*Mobile section*/ selector{ position: fixed; width: 100%; bottom: 0px; background: rgba( 0, 0, 0, 0.85 ); backdrop-filter: blur( 4px ); -webkit-backdrop-filter: blur( 4px ); } Icon Box selector{ background: rgba( 0, 0, 0, 0.35 ); border-radius: 10px; border: 1px solid rgba( 255, 255, 255, 0.18 ); […]

Create A Glass Flip Box On Elementor With CSS

elementor glass flip box

https://youtu.be/uTF3vlRlhqU Create Your Glass Effect Here: glassmorphism.com Front Side .elementor-flip-box__front{ background: rgba( 255, 255, 255, 0.20 ); backdrop-filter: blur( 3.0px ); -webkit-backdrop-filter: blur( 3.0px ); border-radius: 10px; border: 1px solid rgba( 255, 255, 255, 0.18 ); padding: 30px; } Back Side .elementor-flip-box__back{ background: rgba( 255, 255, 255, 0.20 ); backdrop-filter: blur( 3.0px ); -webkit-backdrop-filter: blur( […]

Add A Glass Effect To Your Header On Elementor

Glass

https://www.youtube.com/watch?v=7oLmhU-34N8 Create Your Glass Effect Here glassmorphism.com Elementor Pro Add this code in your header section CSS selector{ position: fixed; width: 100%; background: rgba( 255, 255, 255, 0.10 ); backdrop-filter: blur( 2.5px ); -webkit-backdrop-filter: blur( 2.5px ); } Free Version Of Elementor 1. Add this css class to header section css classes sticky-header 2. Add […]

Elementor Pro Single Product Page Tutorial | Custom Woocommerce Shop #2

maxresdefault

Make sure to watch my previews video to have a better understanding. Elementor Pro Shop Page Tutorial & Ele Custom Skin | Custom Woocommerce Shop #1 CSS: /* Product Gallery*/ .woocommerce div.product div.images img { display: block; width: 70%; height: auto; box-shadow: none; margin: auto; } .woocommerce div.product div.images .flex-control-thumbs { position: relative; margin: 50px […]

Elementor Pro Shop Page Tutorial & Ele Custom Skin | Custom Woocommerce Shop #1

Elementor Pro Shop Page Tutorial Ele Custom Skin Custom Woocommerce Shop

Download Images & Fonts: Download Now Plugins Used: Ele Custom Skin Advanced Custom Fields Product Info: CSS: .woocommerce div.product.elementor .quantity .qty { display: none; } #1 Leather Watch 42 MM, Silver New Model 2021 Price: $200   #2 Rose Gold Watch 43 MM, Rose Gold New Model 2020 Price: $400     #3 Silver Watch […]

Elementor WooCommerce Menu Side Cart

Elementor WooCommerce Menu Side Cart

CSS: /* Floating cart quantity bubble */ .cc-compass-count { background-color: #fe3b21; /* Bubble color */ } /* Floating cart icon */ .cc-compass .licon::before { font-family: “Font Awesome 5 Free”; font-weight: 900; content: “f07a”; font-size: 25px; /* Cart icon size */ } /* Header cart quantity bubble */ span.cc_cart_count { margin-left: -20px; margin-top: -20px; background-color: #fe3b21; […]

Elementor Pro Slider Widget Custom Styling

Elementor Pro Slider Widget Custom Styling

CSS: /*Box Slider*/ .swiper-slide-contents { background-color: #000000AD ; /* Box Color*/ padding: 100px 100px 100px 400px; } h3 { /* Slider Sub Heading*/ font-size: 25px; font-family: “Roboto”, Sans-serif; font-weight: 500; padding-bottom: 20px; } .eicon-chevron-right { background-color: white; /* Right Arrow Background Color*/ padding: 10px; margin-right: 20px; } .eicon-chevron-left { background-color: white; /* Left Arrow Background […]

How To Fix Custom Login Form Issues On WordPress Or Elementor

How To Fix Custom Login Form Issues On Wordpress Or Elementor

Disable WP Login PHP Code Paste code at the bottom of functions.php to disable WordPress login. // Disable wp login function custom_login_page() { $new_login_page_url = home_url( ‘/login/’ ); // new login page global $pagenow; if( $pagenow == “wp-login.php” && $_SERVER[‘REQUEST_METHOD’] == ‘GET’) { wp_redirect($new_login_page_url); exit; } } if(!is_user_logged_in()){ add_action(‘init’,’custom_login_page’); }