Click Button to Change Image And Text Using Elementor - WordPress Elementor Pro Tutorial

Поделиться
HTML-код
  • Опубликовано: 12 дек 2024

Комментарии • 46

  • @diywebsitespro
    @diywebsitespro  Год назад +2

    Thank you so much for watching. Please do like and subscribe I really appreciate your support.🤩🤩

    • @SalphuricAcid
      @SalphuricAcid 4 месяца назад

      can we change the active button? if any one know please let me know right know ?... according to this code please?

  • @peyopeev2822
    @peyopeev2822 11 месяцев назад +4

    Great tutorial, thank you! In my case, I've changed the images with shortcodes that call different 3d models and it works perfectly!

    • @diywebsitespro
      @diywebsitespro  11 месяцев назад

      ahh amazing sounds great glad it helped and thank you for watching

  • @jamesblackwell4812
    @jamesblackwell4812 11 месяцев назад +2

    Great work on this! I loved every piece and was able to modify the layout to my liking on my website! I'm using the free version of Elementor and achieved my goal. Thanks a lot for this tutorial!

    • @diywebsitespro
      @diywebsitespro  10 месяцев назад

      glad it helped and thanks for watching

  • @jarwa212
    @jarwa212 Месяц назад

    Top tier content man! Thank you!! How do we make it autoplay? DO you have a code for that. Would be really grateful

  • @abiabangshorts6892
    @abiabangshorts6892 10 месяцев назад +1

    Thank you for the guide...I really helped myself

    • @diywebsitespro
      @diywebsitespro  8 месяцев назад

      amazing thanks for watching glad it helped

  • @PabloCastillo-wd3eg
    @PabloCastillo-wd3eg 4 месяца назад +2

    So helpful, thank you! How can you add a transition, like a simple fade, before the image or text appears?

    • @diywebsitespro
      @diywebsitespro  3 месяца назад

      hi thanks for watching I'm glad you found it useful. yes you should be able to add a fade with a simple few lines of code. I will have a look and see what I can do

    • @energiacreativa2251
      @energiacreativa2251 2 месяца назад

      need this too

  • @olgamarrincon1755
    @olgamarrincon1755 4 месяца назад +1

    Hi, i need help Instead of a button I want to use a lottie that in turn shows another lottie and a text inside a popup

  • @shankyulasimeon
    @shankyulasimeon Год назад +1

    I can't thank you enough.
    Please keep up the good work
    Thank you so much

    • @diywebsitespro
      @diywebsitespro  Год назад

      Amazing I am glad you are finding the videos useful. Thanks for watching there are plenty more to come.

  • @borisnieminen677
    @borisnieminen677 8 месяцев назад +1

    Thanks for this tutorial. How can we set this up where the elements under the control of button 1, for example, are already shown upon page load. Cheers

    • @diywebsitespro
      @diywebsitespro  8 месяцев назад

      hi thanks for watching do you just mean a 1 click button that scrolls through them

  • @SalphuricAcid
    @SalphuricAcid 4 месяца назад +1

    can we change the active button? if any one know please let me know right know ?... according to this code please

  • @SalphuricAcid
    @SalphuricAcid 4 месяца назад +1

    how to show one right column as defualt?

  • @nixa3899
    @nixa3899 Год назад +4

    Hey!
    How can I make the first button be immediately activated as soon as the page is entered without the need to click a button?
    Thanks in advance!

    • @diywebsitespro
      @diywebsitespro  Год назад +1

      hi really sorry I didn't see your post I will have a play about with the code to get it to open on load. sorry again and thanks for watching.

    • @mikilowe2765
      @mikilowe2765 Год назад +7

      I figured it out: Add the below code after "$(document).ready(function() { " in the javascript he gave us and it will default the selection to Button 1:
      $("#button1").ready(function() {
      $("#img1").show();
      $("#img2").hide();
      $("#img3").hide();
      $("#img4").hide();
      $("#img5").hide();
      });

    • @MrRetseem
      @MrRetseem Год назад +1

      @@mikilowe2765 Perfect, solution, thanks!

    • @SalphuricAcid
      @SalphuricAcid 4 месяца назад

      @@mikilowe2765 can we change the active button? if any one know please let me know right know ?... according to this code please

  • @leddisplayscreenmanufactur9135
    @leddisplayscreenmanufactur9135 Год назад +1

    It is very helpful. This tutorial is very helpful. I am currently facing a problem where every time I click a button, it automatically jumps to the top of the page. How can I solve this problem?

    • @diywebsitespro
      @diywebsitespro  Год назад

      Hi add the anchor widget and link it to the button this will keep it in place

  • @designbyfeliz
    @designbyfeliz Год назад +1

    This is great stuff!! New sub over here!

    • @diywebsitespro
      @diywebsitespro  Год назад

      I love a new subscriber. Thank you very much and for watching 😁

  • @NARMATHAS-cx4dp
    @NARMATHAS-cx4dp 8 месяцев назад +2

    How to set #img1 showing default, instead of clicking text 1 button??

    • @diywebsitespro
      @diywebsitespro  6 месяцев назад

      hi just change the the code from text to image

  • @riegaldutoit5792
    @riegaldutoit5792 Год назад +1

    Hello can you please make a tutorial on how to hide a tab in a specific page on astra theme

    • @diywebsitespro
      @diywebsitespro  Год назад

      I can yes. do you want it to show on click like in this video? I have Astra on this site.

  • @Tobadin
    @Tobadin 5 месяцев назад +1

    I can't find the code on your webpage - can you help me find it?

    • @diywebsitespro
      @diywebsitespro  2 месяца назад

      Its the Second Link down in the description.

  • @vw3005
    @vw3005 10 месяцев назад +1

    does it work with Elementor's CTA? It doesn't see to work with the button of the CTA widget.

  • @raphaelsousa2046
    @raphaelsousa2046 Год назад +1

    It works with embed videos?

  • @triryuzaki3573
    @triryuzaki3573 9 месяцев назад +1

    Why don't use Tab Widget instead?

    • @diywebsitespro
      @diywebsitespro  8 месяцев назад

      I don't think the tab widget was that good when i made this video

  • @FMLyrics
    @FMLyrics Год назад +1

    i tried it but it shows me all the images even they are hidden what could be the problem

    • @diywebsitespro
      @diywebsitespro  Год назад

      you may need to re add the code it works fine my end it maybe you have entered the wrong css class names

  • @mareks5070
    @mareks5070 Год назад +1

    can't see a code on your website... :(

    • @diywebsitespro
      @diywebsitespro  Год назад

      I am so sorry my Link has been updated
      please find the code below:
      diywebsitespro.com/click-button-to-change-image-and-text-using-elementor-code/

  • @bbbb-ii9kn
    @bbbb-ii9kn Год назад +1

    hello