Elementor 3D Image Carousel/Slider with Text (Coverflow Effect) | 3D Carousel WordPress Plugin

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

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

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

    Hi,
    What an amazing share! I really love your videos, I have been learning a lot from them. I think this effect will be a great addition to a project I have been working on. I am trying to design a website for a photographer client, and this carousel will be an ideal design for it. I really appreciate you sharing this method, and I will be following the process to add this beautiful effect to my next project. Thanks a lot for sharing such an amazing video, it was a great watch!

  • @Jebesniper
    @Jebesniper 9 หลายเดือนก่อน

    Your channel is gold to webdesign dude. thanks a lot for your work! Appreciate :)

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

    how do i change the active class in my carousel? Do you have a video explaining or would you customize as a freelancer?

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

    Hello, thank you for the video. I've added the Javascript code at the end but my text doesn't show up. I've followed it exactly how you've done it. Could you give me some advice?

  • @jimrocky
    @jimrocky 22 วันที่ผ่านมา

    After publishing the page, some elements appear misaligned and don't display correctly in the Elementor back-end editor. However, the front-end view still loads properly.

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

    Thanks, but sir if you went to add button, not working, he made or active only last button, sir how to solve?

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

    Hello, I like your videos and products very much. I wish you continued success. I did the function in this video, but I want to do it more than one on the same page. but the slider at the bottom does not work while the top one works. how can I fix this.

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

      i struggle with the same issue, i wish to use multiple but only one will work and controll al the others, i tried changing the cssclasses names and the names in the HTML but so far no succes...

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

      Okay, I'll try to change the code snippet so it'll support multiple sliders in the same page

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

      @@MakeDreamWebsite that would be amazing, thanks in advance, also your work is amazing, this Chanel is a real life safer thanks a lot for your work ;D

  • @denblossom
    @denblossom 9 หลายเดือนก่อน

    Thank you so much for sharing your content, it has helped me a lot. I only have a problem in the mobile responsive, the images don't appear, everything works but the carousel is empty, do you know what could I do?

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    Hi, amazing video
    but in my version of elementor the media carousel is replaced by image carousel which didnt have the coverflow skin, does it has to be elementor pro to get this effects? Thank you!

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

    Hi, awesome tutorial, I only have one question: In my version of Elementor, the custom positioning tab is not available, it's there a special mode that is needed to unblock it?. Thank you.

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

      You can find it somewhere inside the Advanced tab. It may changed it's location because of Elementor updates...

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

      @@MakeDreamWebsite Thank you for the answer, I confirmed it has changed position in the later version, and now it's not a separate flap anymore, it's in Layout >Width >Custom.

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

    Please help me, I'm a beginner at this, the video doesn't turn out exactly as it is, I think I've followed all the steps, when I put a slider in the carousel the image is lowered, covering the text that should accompany the carousel. Can you help me please?

  • @prathambhawsar1024
    @prathambhawsar1024 5 หลายเดือนก่อน +1

    Hey I have followed all instructions and it seems to work in elementor editor but when i see the page live the text is not appearing.. Any solutions?

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

      Do you use the new flexbox container?

    • @prathambhawsar1024
      @prathambhawsar1024 5 หลายเดือนก่อน +1

      @@MakeDreamWebsite yes.. i am building the website using flexbox container but yesterday i tried to do this using sections on different wordpress installation ... I created that section there in a template (Its working fine there) but when i exported and imported that template on my main website its working fine in a template but on main page where i want to use the text is changing automatically without interaction.. and Autoplay is off in media carousal... Do you know what might be the issue?

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

      ​@@prathambhawsar1024 Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    Thank you very much for responding, and can you let me know when you modify the code and also if you can upload it to also buy the template. thank you so much

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    Hello sir, the code for the writing is not working anymore with the new container boxes. Can you fix it please? I really need it for my website I appreciate all your work, you are the best on youtube for doing that. Kind regards.

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

      Yes, I'll update the code snippet so it will work with the new flexbox version as well.

    • @lecrafteur99videos
      @lecrafteur99videos หลายเดือนก่อน +1

      @@MakeDreamWebsite Thanks sir, i'm looking forward to this solution. Keep up your good work, i really appreciate what you do!

    • @SaranAli-j9x
      @SaranAli-j9x หลายเดือนก่อน

      @@lecrafteur99videos i have the solution

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

      @@SaranAli-j9x Can you share please?

    • @SaranAli-j9x
      @SaranAli-j9x หลายเดือนก่อน

      @@lecrafteur99videos i'll upload a video of it and also the code of it on my channel tomorrow so kindly wait till then thanks

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

    Hi, I'm trying to create a similar carousel, but I'm having trouble with the custom css style class selector .swiper-container {
    padding-top: 5px;
    padding-bottom: 50px;
    } does not work. I've tried custom css in the elementor and on the apperance page, but I think the class may have changed to something else, maybe you know what name it has or how to fix the padding problem in another way.

    • @lindroid8694
      @lindroid8694 3 หลายเดือนก่อน

      Just type .swiper

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    Hi, thank you for the gran video!
    I have a question, because when i preview the carousel i can see it just fine, but when i open it in another computer the images do not show. Do you happen to know what could be the problem?
    Thank you in advance

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

    Very Nice. 3d Coverflow Team Slider for WordPress

  • @AyoubTazi-h7u
    @AyoubTazi-h7u ปีที่แล้ว

    Thank you for this tutorial great working Done i have make it in my client website he like it

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

    I tried to follow this amazing tutorial briefly, step by step made it 2 times to make sure everything was correct. Well unfortunately either its outdated or i am doing something wrong. As the text below the images is just changing itself and not on use input while changing the pictures. I have done step by step literally. Is there something wrong or an update came that ruined it? I would love it to work for me, but after doing it twice - still doesnt work the text just changes itself after few seconds.

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

      this might be the problem/ and solution, press on your media carousel, go to additional options, turn off auto play, hope this works.

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

      Getting Same issue... Did you find out the solution?

  • @Webvision-e4r
    @Webvision-e4r ปีที่แล้ว

    amazing video once again! does it still work on the flex container?

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

  • @konion
    @konion 9 หลายเดือนก่อน

    Hello!
    I don't understand why the code is not working. My question is: how does the script determine which text block to display on the screen? They differ only in ID, right?

    • @MakeDreamWebsite
      @MakeDreamWebsite  9 หลายเดือนก่อน

      May be you do some mistake. The text block will show serial-wise, means the first one is for the first slide, 2nd one is for the 2nd slide and so on...

    • @konion
      @konion 9 หลายเดือนก่อน

      @@MakeDreamWebsite In the new version of Elementor, there is no 'data-swiper-slide-index' attribute in the carousel. And your code doesn't work

    • @MakeDreamWebsite
      @MakeDreamWebsite  9 หลายเดือนก่อน +1

      Okay, I'll have a look

    • @konion
      @konion 9 หลายเดือนก่อน

      @@MakeDreamWebsite I understand the issue. Different modes of this slider display different content in the containers. Thank you.

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

      @@konion Can you share the updated code?

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

    Many thanks for this amazing video, it worked great when added 3 images and 3 text but when I tried adding 4 images and 4 text , its only reading 3 text and omitting the last text, what would be the issue?

  •  2 ปีที่แล้ว

    Sir, thank you for this tutorial and the code you gave us. Everything is working properly. Do you know how to make the central image, the image in focus, a little bigger.

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

      You need to do it with custom CSS, not possible with default Elementor options.

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

    Greetings, I followed the tutorial step by step but it doesn't work for me, the only thing different is that I am using the container to put the texts.
    Can you help me please?
    Thank you so much.

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

      Yes, for container it may not work properly. I'll update the code snippet so that it'll be compatible with container too.

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

      @@MakeDreamWebsite Hey! Did you updated the code? I need this for a project urgently

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

      @@prathambhawsar1024 Hi brother, did you find any solutions for that? The code is still not updated and, as did you, i really need that code cause that caroussel would be so perfect for my project

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

      @@lecrafteur99videos Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    Amazing work! Did you also develop the same code for the new updates of Elementor that use 'containers' instead of 'columns'/sections? Please let me know about it. Thanks a lot

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

      No, I haven't made it yet!

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

      @@MakeDreamWebsite Do you have the code now? Would love to use it for my website!

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

      @@mirconieberg5680 you can tweak the code to work for containers. On the container advanced tab, add a css class, let's say, "text-section". Then change the code where it says ".elementor-inner-section" to ".text-section", remember to do it to for the JS code. That worked perfectly for me

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

    I have tried many times to make it.
    In my version of elementor, inner section widjet is missing

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

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

    You are An Amazing Rare Gem. Thank You.

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

    This effect can be done with the Testimonial Carousel widget, which does not have a coverflow option in the skin function?

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

      No, it can't be done in that way...

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

      @@MakeDreamWebsite 🤕Thanks for your answer. Your work is amazing!

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

    sir, why in my website, the text is not show
    and if the text is show, text is not changing if i slides
    i’ve been 5x times replay your video and precisely follow up your step by step

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

    Sir one more thing, 3D Media Carousal is present in Elementor PRO. What if we don't have PRO version?

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

      Yes! I forget to mention that. To create this kind of 3D carousel you have to have Elementor Pro. But, you can also create normal Image Carousel in Elementor Free version.

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

    hi there, any ideas how to remove the shadowing in css ?

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

    How can I change carrousel pagination to small image, make this small images look like the large image in the carousel, and have it appear below the text?

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

      Use a media carousel widget and set the Skin to Slideshow

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

    Gracias por el tutorial! 👏👏👏❤️❤️❤️

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

    Hello Sir! You are Amazing. Sir make a video to add popup template. For example I want to give Restaurant Menu in PopUp Box rather than page. Can you help me with that?

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

    Hello, thank you very much for your amazing video, i tried it and it worked , but when i duplicated it, the words are not showing, i also tried doing it from beging and the words still are mot showing.

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

      I got it. I'll modify the code to support it for multiple sliders. I'll let you know when it's done.

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

      Thank you very much, that would be amazing !!

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

      @@MakeDreamWebsite Hello any update of the code so far would be a great help

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

      @@MakeDreamWebsite any updates on this?

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

      i woud love to see an update on this...

  • @wonderlandinalice111
    @wonderlandinalice111 2 หลายเดือนก่อน

    The 'Inner Section' widget has been phased out in Elementor Pro, and the code doesn't work with the new 'Containers' widget. Unfortunately, that makes this tutorial useless:((

    • @MakeDreamWebsite
      @MakeDreamWebsite  2 หลายเดือนก่อน

      Okay, I’ll update the code snippet soon so if you also use container instead of section or inner section then it will also work for that.

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

      @@MakeDreamWebsite Did you find the new code? I need it I have the same issue

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

      Did you get any solutions?

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

    • @wonderlandinalice111
      @wonderlandinalice111 หลายเดือนก่อน +1

      @@MakeDreamWebsite Awesome! Thank you so much 🙏

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

    hello bro
    there is a problem if the slider section is given another section above it then the slider-text section cannot be synchronized with the slider section. Guess why? is there any solution?
    thanks

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

      I got it. I need to update the code snippet

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

      I have the same issue. Is the code snippet updated?

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

    Hello my friend ,, its amazing ,, but it doesn't work for me ,, after i paste the html code nothing happens with the text.. i only have 3 images on the carrousel

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

      Do you work on the new flexbox container?

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

      @@MakeDreamWebsite its deactivated.. i used inner section just like in your video,, it all works well until i add the html to the slider ,, the text doesnt change

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

      i even tried your other vertical card carousel and nothing happens ,i get the same issue

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

      @@gilleslionnetvalenti4286 You can email me your page link

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

      @@MakeDreamWebsite I have the same problem... I think everything is how it should be, but just don't work after adding HTML

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

    It feels good to watch the video. But I can't solve some problems.
    I used 10 pictures and 10 texts. But the text does not change as soon as you click on the arrow. It's just changing over time.

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

      this problem solved. Thanks a lot.

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

      @@samsurrahmansaiel9103 😇

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

      @samsur Rahman Saiel: Even I have same issue, could you please tell how did you fix this?

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

      @@sindhujayakumar9163 Sorry for late response.
      I didn't use anything extra. You better watch the video. Do as shown in the video.
      The reason I had problems was that I didn't work like the video at first.
      Then if it doesn't work properly. tell me I will help you directly.
      Thanks

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

    Sir i am getting 403 error when i try to update. This happens after i add the html code above the slider. Any idea what might be causing it, or how i can fix it?

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

      Can you email me your page link so I can find out the issue...

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

    this need elementer pro ? my media carousel is locked .

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

      Yes, this carousel is available in Elementor Pro...

  • @WEBstudio-ss
    @WEBstudio-ss ปีที่แล้ว

    Почему не открываеться Ваш сайт?

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

      Можете попробовать еще раз?

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

    Doesnt work with buttons.

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

    Using that much code in WordPress isn't preferable, it effect massively when it comes to speed up your website

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

      Actually under the hood, inside any of the WordPress website, there are a bunch of code. So, when you load a normal WordPress page (without even any extra custom code of Elementor) already a bunch of code are running behind which you can't see. So, adding this tiny pieces of code isn't a big deal for the performance. It's like adding a cup of water in the ocean.

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

    How to give specific text to specific image

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

      Here you can give different text for different images. You can see, after changing the slides the text is also changing to that image specific text. From the navigator view, you can see 5 different inner sections for 5 different images.

  • @SafwanP-x5x
    @SafwanP-x5x 2 หลายเดือนก่อน

    The text is not appearing

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

      Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?

  • @afvro9142
    @afvro9142 26 วันที่ผ่านมา

    thank you so much for this vedio

  • @SaranAli-j9x
    @SaranAli-j9x หลายเดือนก่อน

    You've done good so far but the code wasn't working cuz of the new flexbox so i edited the code and is working now. i can help with the code text on my gmail mentioned on my channel

    • @Imperialsolutions-p7m
      @Imperialsolutions-p7m หลายเดือนก่อน

      @SaranAli-j9x thanks for the template it was worth the money

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

      @@Imperialsolutions-p7m Hi, now you can follow the same process also with flexbox container. I have just updated the code snippet according to that and add it to my website. Can you please copy paste it again while doing it with flexbox container?