How to use Elementor’s Hotspot Widget

Поділитися
Вставка
  • Опубліковано 5 лис 2024

КОМЕНТАРІ • 141

  • @kalashbansal2979
    @kalashbansal2979 3 роки тому +9

    Hey Rino
    To customize it more you can create a template and can add that template code to text editor. This will require minimal code with lots of features 😊

  • @ganeshunnam550
    @ganeshunnam550 3 роки тому +16

    making a basic CSS video would help us lot to make some simple changes like adding the button here as shown.
    As always you're on point in explaining things.
    Waiting for more on CrocoBlock series 😅

  • @jonathanpratama611
    @jonathanpratama611 2 роки тому +1

    awesome tutorial

  • @henstradesign4802
    @henstradesign4802 2 роки тому +2

    It would be nice if sliders could support this hotspot feature as well. Great tutorial as usual Rino!

  • @miikayak
    @miikayak 2 роки тому

    I know css basics but a video from you to freshen it up would be great

  • @joannapraises
    @joannapraises Рік тому

    Another super helpful video, the only thing is that the tooltip is by default showing and the option to only show it as you hover or click is now only PRO... that makes it totally unuseful... thanks anyways Rino, the folks with PRO can still take advantage of your superb tutorial.

  • @davidwalls2304
    @davidwalls2304 3 роки тому +7

    Hey Rino, I enjoyed the video. I'm not sure if I will ever use the Hotspot widget that much, however, the CSS discussion is very interesting. I would enjoy a short CSS video in the near future.

    • @MD_jadaan
      @MD_jadaan 3 роки тому

      Yeah you should make a video like that will help so much develop design methods

  • @muddyshirt
    @muddyshirt 3 роки тому

    You're back!!!
    I was so worried that you disappeared...
    Love your videos 10000%

  • @adesinaoluwasanmi5793
    @adesinaoluwasanmi5793 2 роки тому

    This video brought me so much joy. Thanks for your quick but powerful and rich tips. I really hope elementor pro brings Its price down a bit

  • @Boltage23
    @Boltage23 3 роки тому

    You produce content of excellent quality. Greetings from Brazil.

  • @omranalkhleefalhamad6756
    @omranalkhleefalhamad6756 3 роки тому +1

    thx for the video , this was really beneficial .
    I don't know about the CSS basics themselves , but making a videos on how we can use and add them for different elementor widgets would be really helpful .
    for example I don't know exactly how you used the Chrome developer tool to find the class , and if this can work with every widget , and why you did not add the code for the whole website or on the widget itself using advanced > custom css
    Else I am about to finish my first Woocommerce website , your playlist was really helpful . But you said that you are working on a more advanced Woo website using crocoblock , so I am really waiting for that .

  • @ar_dani_
    @ar_dani_ 3 роки тому +6

    Your demo website it's 💯🔝
    I would like the speedart for its design

  • @JJWIZWARL
    @JJWIZWARL 3 роки тому

    Love this would love a basic CSS code vid

  • @wo0tGAMING
    @wo0tGAMING 3 роки тому

    thanks for the video!
    I was wondering If you could make a video about how you handle SEO / which plugins you use to do that

  • @johnravi3887
    @johnravi3887 2 роки тому

    Hi,
    It was a very insightful video! I have been using Elementor for some time, and I was unaware of this feature. I appreciate you sharing this amazing resource with the viewers. I loved your version of this feature, and I am looking forward to applying it to my sister’s website. Thanks a lot for sharing this tutorial, it is very easy to follow, and will help me achieve the same effect for my project as well.

  • @trevorpiggottmusic
    @trevorpiggottmusic 2 роки тому

    great video - is there any way to increase the size of the hotspot icon? They feel a little small, thanks!

  • @werbekueche
    @werbekueche 3 роки тому

    Hey Rino, that's why I think you totally rock! Elementor rolls out a new widget video. Me thinking: 'Ah that's pretty good, let's have a try.' - Rino: 'hold my coffee, let's do it better...' :-D really great work, thank you for the additional css design options!

    • @rinodeboer
      @rinodeboer  3 роки тому +1

      Hahah. Love your comment

    • @werbekueche
      @werbekueche 3 роки тому

      @@rinodeboer your welcome :-) Many greetings from Germany!

  • @edgarmiguelfolio
    @edgarmiguelfolio 3 роки тому

    Keep posting these videos. You really helping a lot of people. And knowledge should be really spread and not keep for ourselves.. very nice thumbs up 👍

  • @football.lover123
    @football.lover123 3 роки тому

    I learn elementor from you so please upload more videos about elementor and its features

  • @frankstone
    @frankstone 3 роки тому

    Thank you for this GREAT tutorial. These were tips that I know I'll be using. YES.... I would love to learn more CSS tips!

  • @barbarasantos2551
    @barbarasantos2551 3 роки тому

    This is a great tutorial!! I'd love to know more about CSS.
    Looking forward to your next tutorials ✨

  • @TheSabatuer
    @TheSabatuer 4 місяці тому

    Sad to see you didn't test how it behaves when the view port changes! I'm running into the issue where the pin points move around when the window width changes, is that the case with you? how do you make the pins stick to their location on any screen size?

  • @VividAstral
    @VividAstral 3 роки тому

    The explanation is super easy and fun as always.

  • @Azharrazakhan
    @Azharrazakhan 3 роки тому

    another great and helpful video thanks buddy. i have a question.
    how to make drop down button In WordPress????

  • @enzoscifo81
    @enzoscifo81 2 місяці тому

    Thanks Rino, very nice 3 years later

  • @tabithao.abiola7540
    @tabithao.abiola7540 3 роки тому

    Brilliant! Really helpful.
    A different request though. For a purchasing page but not entire site would you advise to set up the ecommerce on a subdomain?

  • @CristianFontes
    @CristianFontes 3 роки тому +1

    Hey Rino, thanks for the tips!
    I know my question escapes a lot from your video, but see if you can help me...
    See this situation using the Jet Engine please: If I want to search the house with two tabs "I want to buy" and "I want to rent" where in each of the things a type select + location + Apply button for the "reload page"
    How can I fix the option "purchase" or "rent" plus the select filters to appear correctly on the results page? (You would have to create two separate pages for each "Apply Button")
    How would the "Listing Grid" configuration look like, since I leave the "Tax Query" fixed, I can't apply the filters on the page.
    Sorry for the translation, i am Brazilian... Thank you very much!

  • @gordonbrownlee4436
    @gordonbrownlee4436 3 роки тому

    Another great video - everything clear and easy

  • @swaminawale7386
    @swaminawale7386 3 роки тому

    Glassmorphism is awesome and has great trends. Windows 11 also using these glassmorphic effects

  • @loth4015
    @loth4015 7 місяців тому

    Can you also say where you usually get these nice product images from?

  • @lanamiro8443
    @lanamiro8443 3 роки тому

    Super easy to customize, thanks for the tutorial!

  • @marketing4eng
    @marketing4eng Рік тому

    Hi Rino this video is great! can you show how to keep the proportions when dealing with responsive views for this Hotspot?

  • @dots560
    @dots560 3 роки тому +1

    Informative video as always. Thank you for putting out these useful videos.
    I don't know if I could bother you with something though... is there a way I could trigger a popup when hovering a button instead of clicking?
    Thanks either ways.

  • @mdanas7481
    @mdanas7481 3 роки тому

    yes, we want a video about basic CSS

  • @integrateur
    @integrateur 3 роки тому

    Question, why do you use the Custom Code feature and not the Custom CSS space in Site Settings for your CSS?
    Also semantically wise it makes no sense to have a link on a . IMO you're better off using a regular anchor with a class to style it etc.

  • @football.lover123
    @football.lover123 3 роки тому

    Your content is very very good bro keep it up and please upload more videos about elementor

  • @reasqns4236
    @reasqns4236 3 роки тому +1

    Hey Rino, is it better than the crocoblock hotspot?

  • @manjaveca985
    @manjaveca985 3 роки тому +1

    Please Rino make a course about designing

  • @annevandenbosch5309
    @annevandenbosch5309 3 роки тому

    Jaaaa een basics css video! Dank voor de tutorials :)

  • @ronyew1758
    @ronyew1758 3 роки тому +1

    Hi Rino, Kindly make a video about basic CSS. Appreciate your effort :D Thanks

  • @CarlosHernandez-vn8lk
    @CarlosHernandez-vn8lk 3 роки тому

    Hi! rino! Thanks so much for this! Actually, I am putting this in my website at this moment! Thanks so much! I would love to learn about CSS! I love your work! Thanks for sharing SO MUCH!

  • @ThEDaiLyMAtE
    @ThEDaiLyMAtE 3 роки тому +2

    Is there any option to add view counter in post?

  • @naglevente
    @naglevente 3 роки тому

    we need to know how to edit Product Photo's like this!

  • @thesocialnest
    @thesocialnest 3 роки тому

    Love to watch your videos, Love from INDIA

  • @mobilidilillo
    @mobilidilillo 2 роки тому +1

    Hello, I'm going crazy, but how do you put hotspots on a video instead of an image? I would like to make my site interactive with videos and hotspots. I'm afraid that with Elementor I can't ... I ask for help.

  • @anosromanee-conti7960
    @anosromanee-conti7960 3 роки тому

    can you teach how to make a wireframe? or the basics of Xd the layouts of xd and stuff..

  • @summerlight9243
    @summerlight9243 2 роки тому +1

    yes, please make a basic video about CSS :)

  • @techwolfcave
    @techwolfcave 3 роки тому

    You videos are really helpful and amazing. 🥳

  • @Vraagheteenchristen
    @Vraagheteenchristen 2 роки тому

    ik ga dit zeker gebruiken bedankt voor je uitleg

  • @factology9130
    @factology9130 3 роки тому

    Love the way you describe things. Can you please make a video on how to hover icon with CSS? Plz ☺️

    • @alphaghost_wd6460
      @alphaghost_wd6460 2 роки тому

      You can use// :hover // after the class
      Example
      .i:hover {width:100px; bla bla bla }

  • @LeonGames
    @LeonGames 3 роки тому +2

    Nice video Rino, cool new feature!
    Why did you post the css in the website header and not in the custom CSS in the advanced tab? For the example it wouldn't really matter but for a bigger website with lots of custom CSS I would try to limit the code overall. Could still do it with the code editor but would limit it to one page.
    Love to hear your idea on this.

  • @pixelnthings
    @pixelnthings 3 роки тому

    that part 😂😂😂....I really enjoy watching your videos..

  • @AadityaSharmas
    @AadityaSharmas 3 роки тому

    Hi I love your videos. I have a question I'm web designer and need to buy a laptop can you tell me I go with mac or windows? And any model you suggest me?? Sorry for the off topic

  • @rafaatashour
    @rafaatashour 3 роки тому

    as always great tutorial, your tutorial help me a lot with building my website, i wonder is it possible top make the first top news bigger than the other with Elementor ??

  • @gracedim6976
    @gracedim6976 2 роки тому

    Nice tutorial,you are really amazing

  • @vivax-metrotecheurope6477
    @vivax-metrotecheurope6477 4 місяці тому

    Hey Rino, I am looking for 3D models you can spin in combination with hotspots. Is this possible with Elementor or any other plugin etc.? Thanks

  • @juanbravo4168
    @juanbravo4168 3 роки тому

    absolutely love your videos! keep up the good work!

  • @tipdrB
    @tipdrB Рік тому

    Thanks so much for this tutorial. Great!!

  • @aravindasandun7450
    @aravindasandun7450 3 роки тому

    I would like to see tutorial about DIVI future . 🙂

  • @Heisenberg_0721
    @Heisenberg_0721 Рік тому

    Can you do a video explaining a bit more about the custom code feature on elementor? Isn't it clear to me how this works on the site. If this can it be applied to specific content only, or if it will apply to all site

  • @AlexOhrndorf
    @AlexOhrndorf 2 роки тому

    Yes please, more about CSS!!! :)

  • @arturohernandez6823
    @arturohernandez6823 3 роки тому

    Yesss on the CSS video!!!

  • @kevinlefournis6293
    @kevinlefournis6293 3 роки тому

    Very good explain, nice tricks thanks 🙏🏻

  • @lancelillie628
    @lancelillie628 2 роки тому

    A CSS video would be great😉

  • @12ovos
    @12ovos 3 роки тому

    Thanks, great tutorial!
    And I'd love to watch some CSS videos!

  • @bilalakbar3234
    @bilalakbar3234 3 роки тому

    Can we use image instead of text in hotspot? Maybe to highlight or show enlarger image of specific part of the product?

  • @JohanHandoko
    @JohanHandoko 2 роки тому

    Hi, I am from Indonesia,thank you for the tutorial, I have a question, how can I set the font size in tooltip content for mobile version? Can we set a different size font for mobile and desktop?

  • @BryanDevsCoding
    @BryanDevsCoding Рік тому

    Hi, may I if your using 24" or what size of monitor your using for designing do you have recommendation?

  • @Who.Said.Photography
    @Who.Said.Photography 3 роки тому

    Awesome - just Awesome - help me a ton!

  • @saucydee1
    @saucydee1 2 роки тому

    Do you have a video explaining how you optimized a hotspot widget for mobile? I'm struggling to get the tooltip box to show up in the right place and not go off the screen. :-/

  • @izakniemann5734
    @izakniemann5734 3 роки тому

    Great video - thank you.

  • @mohamadtayaran1980
    @mohamadtayaran1980 3 роки тому

    You are unique my friend

  • @vinculonorte
    @vinculonorte 3 роки тому

    Hi Rino, I have a a question. Why are you using this Elementor Code spot instead of the appearance - custom - CSS wordpress tab? Just to understand :) Have a nice day

  • @DonDaniellllll
    @DonDaniellllll 3 роки тому

    Hey Rino. I'm still waiting your video about your site that was hacked, and what you did to protect all of yours website now, something like a security plugin.

    • @rinodeboer
      @rinodeboer  3 роки тому

      Yes! Sorry. Haven’t had the time yet. And I’m on my vacation right now.

  • @python8789
    @python8789 3 роки тому

    I wonder that if there is a G-spot beside Hotspot?

  • @RaMGoN
    @RaMGoN 3 роки тому

    Thanks Rino, great tutorial!. A question: Why not aggregate code css in css of widgt hotspot? This way the code does not lod in all pages of web, only in page with widget

  • @aleksanderru5639
    @aleksanderru5639 2 роки тому

    very cool content about elementor!

  • @priscilasierragrajeda2685
    @priscilasierragrajeda2685 2 роки тому

    Love it. Thank you

  • @stormtrooper4157
    @stormtrooper4157 3 роки тому

    Do you have plans on to do jet engine listing grid post order tutorial?

    • @rinodeboer
      @rinodeboer  3 роки тому

      What do you mean with post order tutorial?

  • @szaboedmond1011
    @szaboedmond1011 3 роки тому

    Hey Rino, I am a hobby wp website builder with not so much design capabilities. One of my most difficult choices are fonts and font combinations. Could you make a video about the importance of fonts and how to chose them wisely?

  • @sophiesu8308
    @sophiesu8308 3 роки тому

    Super cool. I appreciate 😄😄😄

  • @israisland
    @israisland 2 роки тому

    This is AMAZING

  • @adamashley6219
    @adamashley6219 3 роки тому

    Please drop css/html tutorial!

  • @miguelitosolis1999xd
    @miguelitosolis1999xd 3 роки тому

    Good stuff man! Thank you

  • @benjaminbrmes
    @benjaminbrmes 3 роки тому

    Very good video again, thanks à lot !

  • @hammadshahzad8994
    @hammadshahzad8994 3 роки тому

    Is it for elementor pro or simple elementor?

  • @alvarez958
    @alvarez958 Рік тому

    I do like better adding the BRRRR 🤣🤣🤣🤣 Thank again for this tuto !!!

  • @Joseph_009
    @Joseph_009 3 роки тому

    I can't add new theme builder ?
    "the following error occurred processing request connecting to the library failed"
    How I can solve it ?

  • @johnmauger718
    @johnmauger718 2 роки тому

    For some reason putting the code in made my text blurry as well as the background :/ any thoughts?

  • @JustAn0therSoul
    @JustAn0therSoul 3 роки тому +1

    Can you make a Video about how to find clients? :D

  • @honestview
    @honestview 3 роки тому

    4:38 if you upload an SVG it changes all the icons to said SVG.
    If you add a new HotSpot it will and set a different SVG it will overwrite all hotspots, do you know how to avoid that and have different custom images per hotspot?

  • @ab_dalwa
    @ab_dalwa 3 роки тому

    Nice video 😊

  • @CLaTiXDZN
    @CLaTiXDZN 3 роки тому

    Hey Rino, when i activate the code for the blurry BG, the bg turns blurry but the text in the front is also turning blurry. Is their a fix that only the bg will be effected because the text is not really readable?
    Great Video as always

  • @mohamadhannan453
    @mohamadhannan453 2 роки тому

    can you share the images you use in your video

  • @ZJlearning
    @ZJlearning 3 роки тому

    Hey Rino, now that Siteground is only allowed in selected countries, what hosting provider do you recommend as your No. 1

    • @chibbledorf
      @chibbledorf 3 роки тому

      Why is siteground only allowed in certain countries?

    • @ZJlearning
      @ZJlearning 3 роки тому

      @@chibbledorf They made some changes last year and now they are not offered in all the countries

    • @rinodeboer
      @rinodeboer  3 роки тому +1

      Very good question. Will think about this when I am back from vacation!

  • @KillahManjaro
    @KillahManjaro 2 роки тому

    Good stuff!!

  • @emanuelbagirathi4750
    @emanuelbagirathi4750 3 роки тому

    Anyway to make a Elementor webpage password protected with free tools?????

  • @rafaellatwina1710
    @rafaellatwina1710 2 роки тому

    thank you!!

  • @krakAbottle
    @krakAbottle 3 місяці тому

    great video\

  • @matiaskatz8729
    @matiaskatz8729 Рік тому

    pero como haces para que sea responsive con la version mobile o tablet?