Glass Effect in Elementor | Glassmorphism 🔥

แชร์
ฝัง
  • เผยแพร่เมื่อ 23 ธ.ค. 2024

ความคิดเห็น • 109

  • @jimfahaddigital
    @jimfahaddigital  2 ปีที่แล้ว +2

    🔥Download Exclusive Elementor Templates: kitpapa.com 🔥

  • @DigitoPreneurs
    @DigitoPreneurs ปีที่แล้ว +1

    🤩🤩🤩 You're a true master of your craft. I watch all your videos

  • @FotografiaRuiz
    @FotografiaRuiz 2 ปีที่แล้ว +3

    No me funciona el código, no desenfoca la imagen. Me dice que no reconoce la propiedad y tengo elementor pro.

  • @AlbuquerqueVitor
    @AlbuquerqueVitor ปีที่แล้ว +1

    Amazing, thanks for sharing! Hugs from Brazil

  • @dominiquempundu621
    @dominiquempundu621 7 หลายเดือนก่อน

    HI Jim F, thank you for your amazing tutorial. Please advise what plug must we use for this Glassmorphism Elementor ?

  • @times_preserved
    @times_preserved ปีที่แล้ว +1

    I really like this particular tutorial and how you made it so simple to understand and learn. Great job.😊

  • @julianbona
    @julianbona ปีที่แล้ว

    Excellent Tutorial, Thanks Jim. The glass effect is not working in safari browsers, did you know why?? Maybe webkit ?

  • @Boldogsagtar
    @Boldogsagtar 5 หลายเดือนก่อน

    Amazing. Thank you! Greetings from Hungary!

  • @PixieBobCo
    @PixieBobCo 3 ปีที่แล้ว +4

    Wow! Great tutorial. Implemented it on my website and love it.

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว +3

      Thank you so much for sharing your experience! I really appreciate it! 😇

  • @faisalahmed7-k6e
    @faisalahmed7-k6e 6 วันที่ผ่านมา

    You must change your channel name as Elementor Superman. Awesome Work.

  • @catiagraciele9484
    @catiagraciele9484 2 ปีที่แล้ว

    this channel is the best

  • @Demandoor
    @Demandoor ปีที่แล้ว

    Thanks for your inspiring Videos, I am your biggest Fan!!!

  • @PhilipeNoBrasil
    @PhilipeNoBrasil 2 ปีที่แล้ว

    Hello, im Philipp from Germany. Thanks for the great tutorial. I currently have my first client as a web designer and am trying to make the website stand out from the crowd. :)
    Please keep up the good work.

  • @philnance2543
    @philnance2543 6 หลายเดือนก่อน

    When I apply the blur Custom CCS it does not work? I have the flex box enabled and I'm trying to not have to disable it due to having a lot of content in the flex box formats. Any Thoughts?

  • @detroixdigital8310
    @detroixdigital8310 2 ปีที่แล้ว +1

    Great tutorial Jim! I have some friends in Cairo and noticed your accent sounds similar to theirs! You wouldn't happen to be Egyptian, would you?

    • @64mo22
      @64mo22 ปีที่แล้ว

      😂😂 he doesn't even sound close to Egyptian

  • @frankstone
    @frankstone 3 ปีที่แล้ว +1

    Outstanding! I just subscribed & rang the bell. THANK you for the great tutorial.

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว

      Thank you so much for your appreciation 😇😇

  • @kellypfleiger4168
    @kellypfleiger4168 3 ปีที่แล้ว +1

    This CSS is not supported in Firefox... Or does someone know how to make it work?

  • @FirstTheyIgnoreYou
    @FirstTheyIgnoreYou 4 หลายเดือนก่อน

    Awesome Video! Thank you very much! 🥰

  • @claravalente9855
    @claravalente9855 10 หลายเดือนก่อน

    Amazing, it helped me a lot, thank you so much :)

  • @joaopaulocardosoantunes8472
    @joaopaulocardosoantunes8472 2 ปีที่แล้ว +2

    Thank you so much for being so detailed and for the great content!

  • @aldy_uhaa
    @aldy_uhaa 3 ปีที่แล้ว +1

    Dude this blurry effect doesn't work at safari browser, do you have another way to fix it?

  • @hueseyinu2264
    @hueseyinu2264 3 ปีที่แล้ว

    Thanks for the great tutorial! Unfortunately it doesn't work with Firefox 😞 Is there a workaround for it?

  • @tutupkaleng
    @tutupkaleng ปีที่แล้ว

    thank you sir for the tutorial 😁

  • @henchnerd9404
    @henchnerd9404 ปีที่แล้ว

    looks great, thanks for the template, how do i get the template onto my locally hosted site though? what are the steps?

  • @Sony_Music_India_
    @Sony_Music_India_ ปีที่แล้ว

    Custom code for blur effect is not working

  • @jcarlin596
    @jcarlin596 2 ปีที่แล้ว

    I really enjoy your teaching style. Great video

  • @MrLegendofnaruto
    @MrLegendofnaruto ปีที่แล้ว

    can u use carousel for this?

  • @thewebmaster-pro
    @thewebmaster-pro ปีที่แล้ว

    Hello and thank you! Are you planning an update with the container feature?

    • @OAGMedia
      @OAGMedia 11 หลายเดือนก่อน

      just copy it according to sections ..works perfectly fine with containers :) i just did it today

  • @WordGirlPhotoEdits
    @WordGirlPhotoEdits 3 ปีที่แล้ว +1

    Excellent video!!! Very easy to understand and follow along! Thank you!

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว

      Thank you so much for your appreciation 😇😇😇

  • @webshades
    @webshades 3 ปีที่แล้ว +1

    Thank you very much for such a lovely section creating tips.👍

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว +1

      My pleasure! Thank you so much for your appreciation! 😇😇

  • @raghuramjc2798
    @raghuramjc2798 2 ปีที่แล้ว

    I appreciate all your tutorials. Nice of you for sharing such tips. On this tutorial, I am using the free version of Elementor and with the addon plugin, I have the custom CSS. When I use the CSS, it is not recognizing "Backdrop - filter" code and gives a warning "Unknown property". What is the reason?

    • @capputhesiamese9707
      @capputhesiamese9707 ปีที่แล้ว +1

      The backdrop-filter property is not supported by all browser change to this instead
      selector {
      -webkit-backdrop-filter: blur(5px);
      backdrop-filter: blur(5px);
      }

  • @Isa-dq4jw
    @Isa-dq4jw 2 ปีที่แล้ว

    Thank you very much. It s really nice ! When you put CSS in elementor pro, it s in a child theme ? Or not necessary ? Thank you from France 🙏😊

  • @ahmadgupta1168
    @ahmadgupta1168 2 ปีที่แล้ว

    Excellent tutorial

  • @faisalahmed7-k6e
    @faisalahmed7-k6e 5 วันที่ผ่านมา

    i am not getting the template in my email.

  • @rehmankureshi
    @rehmankureshi 3 ปีที่แล้ว

    brother can we add support for this tutorial for firefox and safari browsers..becasue on chrome it works fine but and on firefox and safari by default the backdrop effect doesnt show...for firefox i found that we need to enable the backdrop-filter from about:config natively firefox dont support the backdrop-filter command and safari as well.

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว +1

      I see. That's the limitation! I've not found any prefix for those browsers as well :(
      Probably soon we'll get support for these new css3/4 properties!

    • @rehmankureshi
      @rehmankureshi 3 ปีที่แล้ว

      @@jimfahaddigital i hope they add the support for Firefox and other browsers as well. one thing bro same thing happened with the horizontal scroll bar tutorial Firefox and safari wasnt showing the gradient scroll bar but i was able to add support in these browsers by using this css and i tried the same with backdrop-filter but somehow i was not able to :(
      @supports (scrollbar-color: #32B7B6 #425389){
      *{
      scrollbar-color: #32B7B6 #425389;
      scrollbar-width: auto;
      }
      }

  • @hervemottet1358
    @hervemottet1358 3 ปีที่แล้ว

    Thank Mister Fahad the best of the best really

  • @farhanpexxer1047
    @farhanpexxer1047 2 ปีที่แล้ว

    Template file not working anymore can you please provide a new link?

  • @dennish3926
    @dennish3926 3 ปีที่แล้ว

    Greate videos greetings from Germany

  • @aldy_uhaa
    @aldy_uhaa 3 ปีที่แล้ว

    Dude would you want to recheck that that effect currently doesn't work on iphone browser like safari? Or do you have another css codes instead? Just in case this blurry transparent effect can work normal on iphone tho...

    • @kyulol3235
      @kyulol3235 3 ปีที่แล้ว

      Thé solution proposed don't work on safari, try this instead of the blur

  • @acetechgraphics
    @acetechgraphics 11 หลายเดือนก่อน

    Nice, but can you provide me .Jason file of this Pricing Table?

  • @clementyo4526
    @clementyo4526 3 ปีที่แล้ว

    Cool tutorial 🙏👍😁

  • @Suvro-rp9wb
    @Suvro-rp9wb 3 ปีที่แล้ว

    awesome ! I always follow you.

  • @InsightBoxTV
    @InsightBoxTV 3 ปีที่แล้ว

    Great tutorial 👍👌❤

  • @NOALNOM
    @NOALNOM 3 ปีที่แล้ว

    - Hello Jim thanks for the amazing tutorial! How can the glass effect be apply on a svg ? it's that possible? Best Regards

    • @cameron9695rhysd
      @cameron9695rhysd 3 ปีที่แล้ว

      It’s easier to design an svg icon using something like figma or adobe xd and apply a background blur to the fill

  • @yuriykabanets7665
    @yuriykabanets7665 2 ปีที่แล้ว

    Cool!

  • @KlauZ0
    @KlauZ0 2 ปีที่แล้ว

    Thanks a lot for your hard work and desire to share with newbies like me ! Many appreciations and always like from me !

    • @jimfahaddigital
      @jimfahaddigital  2 ปีที่แล้ว

      So nice of you!! Means a lot!!! Thank you so much for supporting and understanding! 😍

  • @abirraihan9094
    @abirraihan9094 ปีที่แล้ว

    love brother from bangladesh

    • @jimfahaddigital
      @jimfahaddigital  ปีที่แล้ว

      Take love brother ❤️❤️🔥🔥🔥

    • @abirraihan9094
      @abirraihan9094 ปีที่แล้ว

      @@jimfahaddigital Same brother♥

  • @gourroychowdhury7667
    @gourroychowdhury7667 ปีที่แล้ว

    you are awesome

  • @agenciaopenideadigital4174
    @agenciaopenideadigital4174 2 ปีที่แล้ว

    thank you so much

  • @jamesdavis8731
    @jamesdavis8731 3 ปีที่แล้ว

    I gave this a thumbs up, even though this backdrop-filter effect is not supported well in many browsers. It does not work in Firefox and others. It works well in Chrome. Is there a way around this?

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว

      I'll create a tutorial soon on this topic - "How to support modern CSSs on most of the browsers"! Thank you!!

  • @GrowingIsKnowing
    @GrowingIsKnowing 3 ปีที่แล้ว

    Awesome, thanks from your new subbie! I know this is gonna look so good on the site i'm building for my client

  • @mohamedsayed3775
    @mohamedsayed3775 ปีที่แล้ว

    very good

  • @RenderingX
    @RenderingX 10 หลายเดือนก่อน

    the only thing is that does not display on safari mobile

  • @niloy0.1k
    @niloy0.1k 7 หลายเดือนก่อน

    Hello Jim vai, Please create a video tutorial for the Elementor Infinite image shine hover effect

  • @Barnicle8
    @Barnicle8 2 ปีที่แล้ว

    Unfortunately it also blurs behind the card being animated

    • @Barnicle8
      @Barnicle8 2 ปีที่แล้ว

      I fixed it by animating the outer column instead of the inner column

  • @cidhorta8705
    @cidhorta8705 ปีที่แล้ว

    Great tutorial but I sent my email to download the Template you used in the tutorial without success.
    Please fix it.

  • @nimitagarwal3632
    @nimitagarwal3632 ปีที่แล้ว

    hey Jim your video was awesome and very helpful but I want 6 cards. Just like in your video you have shown the tutorial for 3 cards I want to do it for 6 cards. Can you please help me on this.

  • @yo80090
    @yo80090 ปีที่แล้ว

    Hi, I entered my email on your website to get the but I am not getting the t emplate could you send it to me?

  • @shortbreakhub3862
    @shortbreakhub3862 3 ปีที่แล้ว

    Thank you👍🏻

  • @abulhasnatmdtarek4902
    @abulhasnatmdtarek4902 3 ปีที่แล้ว

    Bro eita ki elementor or pro use korcen?

  • @greentrading
    @greentrading ปีที่แล้ว

    Thankyou sir

  • @masaodihasan
    @masaodihasan 3 ปีที่แล้ว

    Good work bro

  • @Marco-br2cx
    @Marco-br2cx 3 ปีที่แล้ว

    Great!

  • @TheTeliane
    @TheTeliane 3 ปีที่แล้ว

    Thanks You

  • @DELAISAIT
    @DELAISAIT 2 ปีที่แล้ว

    Спасибо !!!

  • @26Uncle
    @26Uncle 3 ปีที่แล้ว

    execellent

  • @CyberImpact7
    @CyberImpact7 2 ปีที่แล้ว

    its not working for me

    • @CyberImpact7
      @CyberImpact7 2 ปีที่แล้ว

      oh its working but not in mozzila firefox, just use chrome! The best channel on youtube lol

  • @computerexpartc2436
    @computerexpartc2436 3 ปีที่แล้ว

    Grandpa you show without coding it will be good for everyone

    • @jimfahaddigital
      @jimfahaddigital  3 ปีที่แล้ว

      That's not possible!! If Elementor doesn't provide the built-in option, how could you do that without Custom Code? Can you explain?? Thanks!!
      Even, I'm providing the Code snippets for FREE! I'm not sure what else someone could expect for FREE!! Surprised!!

  • @bySterling
    @bySterling 2 ปีที่แล้ว

    We wish you would sell your amazing custom designs so we could download the full awesomeness after purchase!$

    • @jimfahaddigital
      @jimfahaddigital  2 ปีที่แล้ว +1

      Thanks man! Actually I'm preparing everything for sell. Probably all will be available from next month!

    • @bySterling
      @bySterling 2 ปีที่แล้ว

      @@jimfahaddigital SO great to hear sir! 🙌🏻🎉💻⚡️👏🏻

  • @shabanabegum5248
    @shabanabegum5248 ปีที่แล้ว +2

    u should say it first that this method is for pro elementor users don't waste time of others

  • @Sony_Music_India_
    @Sony_Music_India_ ปีที่แล้ว

    Guide me please

  • @abhiverma8481
    @abhiverma8481 3 ปีที่แล้ว

    Bc

  • @mubeenrahman_codname
    @mubeenrahman_codname 3 ปีที่แล้ว

    i hope you dont take it the wrong way . i like youre videos but it would be much easier to listen to you if you didnt force that accent on yourself , its sounds bad and also the air from your mouth hits the mic quite hard so maybe a pop filter would be useful

    • @mubeenrahman_codname
      @mubeenrahman_codname 3 ปีที่แล้ว

      i hope i did not sound like an asshole i like your tutorials

  • @attilalazar5790
    @attilalazar5790 2 ปีที่แล้ว

    Hallo bro, i need to ask you something. can you contact me?

  • @hereiamagain267
    @hereiamagain267 ปีที่แล้ว

    Hey Jim, just follow you and I thought it was free Elementor 🤣 I just want to test and try if it'ss good. but just still consider to buy elementor pro as I'm trying to design Website. But I just want to try this one. Didn't plan do other yet 🥲

    • @hereiamagain267
      @hereiamagain267 ปีที่แล้ว

      But it's so good work. even I can just 80% (without glasses effect) I learned a lots from clips!

  • @shamsuzzamanimon1200
    @shamsuzzamanimon1200 3 ปีที่แล้ว

    thanks a lot ❤️❤️