Add Icons To Your Elementor Form Fields With CSS

elementor icon form css

https://youtu.be/8qHZfpG2z-s Font Awesome fontawesome.com CSS Code /*placeholder spacing*/ selector form.elementor-form .elementor-field-group-email input, .elementor-field-group-name input, .elementor-field-group-phone input, .elementor-field-group-message textarea{ padding-left: 50px; } /*Icon box settings*/ selector form.elementor-form .elementor-field-group-email::after, .elementor-field-group-name::after, .elementor-field-group-phone::after, .elementor-field-group-message::after { position: absolute; left: 5px; top: 28px; bottom: 0px; width: 40px; height: 40px; background: #000; content: “”; z-index: 99; } /*Icon size & position settings*/ […]

Elementor Carousel & Slider Glass Effect

glass slider elementor

https://youtu.be/vhaJZw2d1E4 Create Your Glass Effect Here: glassmorphism.com Testimonial Carousel CSS .elementor-widget-testimonial-carousel .swiper-slide { 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 ); } Review Carousel CSS .elementor-widget-reviews .swiper-slide{ background: rgba( 255, 255, 255, 0.20 ); backdrop-filter: blur( 3.0px […]

Create A Portfolio Scroll Image Effect On Elementor | No Plugins | Javascript

elementor scroll image

https://www.youtube.com/watch?v=yDRD4PvCYrE CSS Classes: Image Class: website-img Box Container: website-box CSS: /* box container */ .website-box { height: 300px; overflow: hidden; } /* website image position */ .website-img img{ object-fit: contain; object-position: 0px 0px; transition: object-position 6s ease; } Javascript

Change Header, Button & Logo Background On Scroll With Elementor

maxresdefault

Javascript – Elementor Code: // Elementor Code // header color change on scroll Javascript – WP Code Snippets: // WP Code Snippets add_action( ‘wp_head’, function () { ?> CSS: /* Header Class: mainheader */ /* Logo Class: nav-logo */ /* Menu Text class: mainnav */ /* Button CTA Class: nav-cta */ /* Header Section */ […]

How To Exclude US States From Shipping On WooCommerce

How To Exclude US States From Shipping On WooCommerce

PHP Code: /** * Exclude these states */ add_filter( ‘woocommerce_states’, ‘custom_woocommerce_states’ ); function custom_woocommerce_states( $states ) { unset($states[‘US’][‘AK’]); return $states; }