Elementor WooCommerce Menu Side Cart | Free

SdĂ­let
VloĆŸit
  • čas pƙidĂĄn 2. 07. 2024
  • Learn how to add the best menu side cart to your WooCommerce website using Caddy and Elementor.
    Get CSS Code: urielsoto.com/elementor-wooco...
    Plugins Used:
    Caddy Side Cart
    Elementor
    Hire Me:
    urielsoto.com/services/
    MY COURSES:
    🟣 Elementor Mobile Responsive Course
    bit.ly/elementormobile
    🟣 Start Your Own Website Business - Open For Enrollment Now:
    websiteagencycourse.com/
    PRODUCTS I USE FOR MY WEBSITES:
    🔮 Get Elementor Pro - My Favorite Page Builder
    bit.ly/urielelementorpro​​​​​​​​​
    🔮 My Hosting Provider - Try Siteground
    bit.ly/sitegroundsoto​​​​​​​​​ [Save 40%]
    🔮 WpRocket - Speed Up Your Website
    bit.ly/uswprocket
    🔮 My Wordpress Theme - Kadence Pro
    bit.ly/urielkadencetheme​​​​​​​​​
    🔮 Multi Step Checkout - Get More Sales
    bit.ly/checkoutwc​​​​​​​​​
    COMMUNITY & PRIVATE GROUPS:
    đŸ”” Join Our Facebook Community!
    bit.ly/urielsotofbgroup
    đŸ”” Join My Patreon & Get Design Downloads
    bit.ly/uspatreon
    CONTACT ME:
    My Website: urielsoto.com/​
    Facebook: / urielsotodev
    Linkedin: www.linkedin.com/in/uriel-sot...
    #elementor #woocommerce

Komentáƙe • 115

  • @wplearnonline628
    @wplearnonline628 Pƙed 3 lety +6

    This is insaneeeeeeeeeeeeeeeeeeeeeeeeeeeeeee, I'm so happy I found your channel man.

  • @selenefroehlich9138
    @selenefroehlich9138 Pƙed 3 lety

    thanks Uriel, I love the value you bring into your videos, they're awesome and stand out from the other youtubers, very well explained, thanks a lot!

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety +1

      Thank you so much. I really appreciate your nice comment. Just things I learn from building websites for my clients.

  • @indraizallrius1748
    @indraizallrius1748 Pƙed 3 lety +5

    Man! This thing is SICK!!
    Thanks for this information I barely knew it:)

  • @Xiaoxooooo
    @Xiaoxooooo Pƙed 3 lety +1

    Bro!! Thank you so much for this damnnnn this looking so good! So glad I found your channel! Subbed!

  • @officially_ama
    @officially_ama Pƙed 3 lety

    You're very talented, all your websites just look amazing.

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      Thank you but most of them are templates except for the websites you see me build in my videos haha.

  • @farhathameed5631
    @farhathameed5631 Pƙed 2 lety

    you are da man! this is awesome!!!

  • @kelaswordpressindonesia
    @kelaswordpressindonesia Pƙed 3 lety

    Thank you Uriel, very helpfull

  • @mohdsyahmisalim722
    @mohdsyahmisalim722 Pƙed 3 lety +1

    Thanks bro!

  • @konidoniravirr6580
    @konidoniravirr6580 Pƙed 3 lety

    just subscribed it! and guys ,this was trusted chanel

  • @user-ir7zz8yc4c
    @user-ir7zz8yc4c Pƙed měsĂ­cem

    thank you so much

  • @umairjawed8664
    @umairjawed8664 Pƙed 3 lety +1

    Seriously brother I have no words for you😭 it feels like you are listening the problems of my innocent heart who wants more from free theme 😂 and you always gave me the best solution for my website thanks alottttttt. This is seriously amazing đŸ˜­đŸ˜­â€ïžâ€ïžâ€ïž

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      Got you bro! That's what it's all about

  • @futurepilot5426
    @futurepilot5426 Pƙed 2 lety

    Thank you so much â€ïžđŸ„°â€ïžâ€ïžâ€ïžâ€ïžđŸ„°

  • @nudiesofc2058
    @nudiesofc2058 Pƙed 2 lety

    thankyou so much, its really helping me
    but, i have one question how to change the theme or color of the sidebar ?

  • @theofficial1150
    @theofficial1150 Pƙed 2 lety +2

    Hi Uriel, I just had a question. If I want to change the background color of the floating card icon, do you have any css code that would make me able to do that?

  • @asiuhakfhyaziuf3701
    @asiuhakfhyaziuf3701 Pƙed rokem +2

    Hello Uriel, thank you for tutorial, i was wondering, do you think it's possible to add it to the header without Elementor ? I want to stop using the elementor header feature for several reasons and having this cart instead of the original Woocommerce cart in my header would be perfect. Thank you !

  • @MadiliaSarwary
    @MadiliaSarwary Pƙed rokem

    Thanks dude

    • @ajwebhub
      @ajwebhub Pƙed rokem

      did you find it on elementor widgets?

  • @parvez4455
    @parvez4455 Pƙed rokem +2

    Hi Uriel, your video is so informative. I'm using the blocksy theme and this theme doesn't have the sliding sidecart feature. So to get this feature, I downloaded the sidecart plugin which works perfectly fine but is there a way where I can integrate the same features to my theme's icon in my header or move the floating cart icon altogether in my header menu as I do not want this icon to appear at the side. Could you please provide the css code snippet for the same which I can apply...thanks

  • @alexcb9941
    @alexcb9941 Pƙed 3 lety +2

    heyyy bro thanks a lot, but do you have a code or something to hide the bottom circle, and that it only apears at the top in the menu, thanks a lot

  • @sharanedap4573
    @sharanedap4573 Pƙed 2 lety +1

    I love it!
    Do you also have a video how you have put the search icon in your header?

    • @UrielSoto
      @UrielSoto  Pƙed 2 lety

      Yeah if you use the pro version it should be easy to add.

  • @iheachochristian807
    @iheachochristian807 Pƙed měsĂ­cem

    Good tutorial, I really enjoyed it. Pls regarding the functionalities, could you guide me through on how to achieve this: when someone buys 2 products and its added to the cart if he selects the 3rd product then he will be entitled for a discount instead of free shipping which you showed in your tutorial. I would appreciate if you could recommend any plugin that can handle this. Thanks

  • @brunocerretto2069
    @brunocerretto2069 Pƙed rokem

    Great, thanks!
    How can i change the icon?

  • @selenefroehlich9138
    @selenefroehlich9138 Pƙed 2 lety +2

    I figured it out guys, to hide the floating button: .cc-compass {display: none

  • @wolf101234567
    @wolf101234567 Pƙed 10 měsĂ­ci +1

    Hi Uriel, thank you for the video. can the font on the floating cart quantity bubble be changed to my theme font: Orbitron?

  • @cierraroach8624
    @cierraroach8624 Pƙed 3 měsĂ­ci

    How can I change the color of the progress bar from teal to black? Mine is not black like yours :(

  • @kimwold
    @kimwold Pƙed 3 lety

    Hi Uriel, how can I disable the "we think you might also like" suggestions in the cart...?

  • @nerhohq
    @nerhohq Pƙed 2 lety

    This is a fucking jackpot. Thanks a million Uriel

  • @abhisekhmallah2991
    @abhisekhmallah2991 Pƙed 2 měsĂ­ci

    i'm facing issue while add the caddy cart in the header please help me

  • @chusaq
    @chusaq Pƙed 3 měsĂ­ci

    When I search for caddy at elementary there is nothing find. Could you help me out. Other than that tanks a lot !

  • @nibuer
    @nibuer Pƙed 2 lety

    Quick question the cart gets disabled when you are in product description

  • @lifebygrind
    @lifebygrind Pƙed 4 měsĂ­ci

    Hi, everything works as it should, but there is one error with the icon. It is displayed normally only on the home page, store page, product page, etc., and it no longer works. a rectangle border is displayed instead of the icon. Anyone know what this could be about?

  • @KoeniginShop
    @KoeniginShop Pƙed rokem

    It's nice since the DEMO Version brakes the website, not been updated for a long now, I can by it if I can't test it!

  • @umairjawed8664
    @umairjawed8664 Pƙed 3 lety

    Can you please make one video for “My Account login button” which I can use on astra theme and on custom header? Please do one that as well

  • @azadehrazavi1651
    @azadehrazavi1651 Pƙed 3 lety

    thankssssss

  • @dragonslayergoblineater9048
    @dragonslayergoblineater9048 Pƙed 8 měsĂ­ci

    Goat

  • @stevensmek
    @stevensmek Pƙed 2 lety

    Good video ! I also use this plugin! but when i'm logged in the plugin stops working ... i don't know why ... if you have the solution i'm here

  • @user-wv9ed5ki5g
    @user-wv9ed5ki5g Pƙed měsĂ­cem

    Good tutorial. Please I need your advise. My goal is to have a pricing structure where if a customer selects three products in my woocommerce site at a cost of $395 each, any additional products added to the cart would trigger the new product selected price to change to $495 without affecting the price of the previous selected 3 product. Please could you guide me on how to achieve this or if you know any plugins that does this, let me know. Thanks

  • @dssamhassan
    @dssamhassan Pƙed 4 měsĂ­ci

    There is a possibility to translate the content of caddy cart to other language? thank you

  • @VidsofTalents
    @VidsofTalents Pƙed rokem

    Is it possible to change the language?

  • @andrealana5223
    @andrealana5223 Pƙed 2 lety

    Hola Uriel necesito tu ayuda me pasa como a alguien que comentĂł mĂĄs abajo en mi iphone y PC se ve perfecto pero en android el carrito sale totalmente desplazado hay alguna manera de solucionar?

  • @mahnoorsohail2550
    @mahnoorsohail2550 Pƙed 2 lety +1

    Hi, I am using elementor but the caddy widget isn't showing up in the widget panel. I am only seeing the floating button. I am not able to add cart to my header.

  • @websque3803
    @websque3803 Pƙed 3 lety

    Can you make a video who to create the slider that you use in your WooCommerce website

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      It's just a starter site from the Kadence theme :)

  • @arturo5050
    @arturo5050 Pƙed rokem

    Can we desativated the Floating Cart in Mobile with CSS, since take a lot of realstate on the screen ? Also, can we cahnge with CSS so in mobile doesnt take all the screen maybe only 90% of the creen realstate when click the cart button? Thanks

    • @mike.valera
      @mike.valera Pƙed 4 měsĂ­ci

      To hide on mobile:
      @media only screen and (max-width: 768px) {
      .cc-compass {
      display: none;
      }
      }
      To change the width you can use the .cc-window selector.

  • @farazahmad4269
    @farazahmad4269 Pƙed 2 lety

    Could someone tell me please What is the role of promo code option ...how to edit that section???

  • @karymahmed8519
    @karymahmed8519 Pƙed 2 lety +1

    Hey, thank you so much this is awesome. I have only one question. Is it possible that when someone clicks on add to card the card automatically pop-up?

  • @PandaPatser
    @PandaPatser Pƙed 5 měsĂ­ci

    hey, can you maybe help me to remove the element with the cart on the page

    • @mike.valera
      @mike.valera Pƙed 4 měsĂ­ci

      You can remove the floating cart icon with:
      .cc-compass {
      display: none;
      }

  • @dragonslayergoblineater9048
    @dragonslayergoblineater9048 Pƙed 8 měsĂ­ci

    How can I completely disable the floating cart icon

  • @ryanjd2826
    @ryanjd2826 Pƙed 7 měsĂ­ci

    Hi, it's weird because I cant find the caddy widget

    • @mike.valera
      @mike.valera Pƙed 4 měsĂ­ci

      Elementor doesn't make WordPress widgets searchable. You need to scrolll down to the "WordPress Widgets" section within the element area and you'd find "Caddy Cart" there.

  • @AmazonFinds716
    @AmazonFinds716 Pƙed 3 lety

    Oye bro, tengo problemas con el icono del carrito en el header, después de utilizar todo el CSS, en la versión escritorio queda perfecto, pero en la versión móvil no sirve, quisiera saber si podrías hacer uno que sea responsive!, o podrías mandarme el css?

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      Que pasa con el carrito en mobil? No pasa nada cuando le puchas el carrito?

  • @musafirdunia8192
    @musafirdunia8192 Pƙed 3 lety +2

    hi ilove your video.
    but can i remove the floating cart default in low right corner? i just want use it in my header. thank you so much!!

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      Yeah I think you would have to find the css class and a display: none

    • @musafirdunia8192
      @musafirdunia8192 Pƙed 3 lety +2

      woah im so glad that you replied. im beginner in css, can you guide me where to find the css class?

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety +1

      Shoot me a message on here. I'll try and send you a video urielsoto.com/help

    • @musafirdunia8192
      @musafirdunia8192 Pƙed 3 lety +2

      i alredy send a message, thanks! how nice you are :)

  • @Dr.Abasin
    @Dr.Abasin Pƙed 3 lety

    hey friend! how do you change the language of this manu cart ?

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      Use this method. czcams.com/video/nF48WikpoUw/video.html

  • @simonedelgreco8492
    @simonedelgreco8492 Pƙed 3 lety +1

    Hi, how can I delete the other cart icon? the one that appears below? Thanks

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety +1

      Watch the entire video please. I go over it.

    • @simonedelgreco8492
      @simonedelgreco8492 Pƙed 3 lety

      I've seen it in its entirety, but there's no part where you say how to remove the dot at the bottom of the page....
      What I have seen is only how to change the button at the top of the cart, not the circle at the bottom of the page

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      @@simonedelgreco8492 4:28

  • @dragonslayergoblineater9048
    @dragonslayergoblineater9048 Pƙed 8 měsĂ­ci

    How do I change where the checkout button links?

    • @dragonslayergoblineater9048
      @dragonslayergoblineater9048 Pƙed 8 měsĂ­ci +1

      Got it

    • @mike.valera
      @mike.valera Pƙed 4 měsĂ­ci

      For anyone else... This button is linked to whatever you have defined under WooCommerce Settings > Advanced > Page Setup

  • @alexcb9941
    @alexcb9941 Pƙed 3 lety +2

    hey can you answer how to quit the bottom circle of the bottom??

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety

      If you don't want the the side cart circle. Just make the css class display: none for that element

    • @alexcb9941
      @alexcb9941 Pƙed 3 lety

      @@UrielSoto no, I dont want to se anything in the botom, the circle, the cart, the number, anything, can you tell me a css to do it

    • @selenefroehlich9138
      @selenefroehlich9138 Pƙed 3 lety

      @@UrielSoto Hi Uriel, could you share the specific code for that please :)?

    • @alexcb9941
      @alexcb9941 Pƙed 3 lety

      @@selenefroehlich9138 he dont now, like 10 coments of the same thing and he dont answer ...

    • @alexcb9941
      @alexcb9941 Pƙed 3 lety

      Men can you answer?? It’s so complicate for you to understand?

  • @nongthambamuttamsingha2960

    Hi Uriel, what if I want to hide the caddy floating cart in mobile/tab version and show only in desktop. Any solution?

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety +1

      In the colemn advanced responsive settings hide it on mobile.

    • @nongthambamuttamsingha2960
      @nongthambamuttamsingha2960 Pƙed 3 lety +1

      @@UrielSoto Thanks for the reply. I was asking for the floating cart which shown on bottom right corner in mobile/tab screen, not the cart on top menu one. Is that possible by css? Hiding the cc compass class for mobile!

    • @selenefroehlich9138
      @selenefroehlich9138 Pƙed 3 lety

      @@nongthambamuttamsingha2960 yes, I would really like to know this, how to hide the floating cart at the bottom, since we're left with two cart icons, so that it doesn't get confusing, thanks :)

  • @SimsonC1906
    @SimsonC1906 Pƙed 2 lety

    hey i downloaded the plugin but i am unable to find it in Elementor widgets...Any advice?

    • @ajwebhub
      @ajwebhub Pƙed rokem

      same here

    • @caddysidecartpluginforwooc2665
      @caddysidecartpluginforwooc2665 Pƙed rokem

      Elementor is probably hiding WordPress widgets from appearing in the widget search. You can go to Elementor Settings > Experiments and disable that option and you should be able to pull it up after.

  • @justsnappy5534
    @justsnappy5534 Pƙed 3 lety +1

    Hello sir how to use elementor slider to add multiple URL

    • @UrielSoto
      @UrielSoto  Pƙed 3 lety +1

      You can't do that already?

    • @justsnappy5534
      @justsnappy5534 Pƙed 3 lety +1

      @@UrielSoto can you explain me sir

    • @justsnappy5534
      @justsnappy5534 Pƙed 3 lety +1

      @@UrielSoto Hello sir, we are saying how to add multiple links in the elementor carousel

  • @DeFreture
    @DeFreture Pƙed 2 lety

    Is there a way to get the link of the cart? I want to open it by clicking a button.

    • @UrielSoto
      @UrielSoto  Pƙed 2 lety

      Yeah i believe I go over it in the video.

    • @UrielSoto
      @UrielSoto  Pƙed 2 lety

      Yeah i believe I go over it in the video.

    • @DeFreture
      @DeFreture Pƙed 2 lety +1

      Can't find it. Would u mind telling me the way to get the link? Pls

  • @miljanmaksimovic3911
    @miljanmaksimovic3911 Pƙed rokem

    IF someone have this same thing but for shopify please send me! Thank you.

  • @gaming4K
    @gaming4K Pƙed rokem

    Ehh this whole thing is english thanks anyways but if i can't translate it i can't use it, that would ruin the user experience..

  • @sarusara7154
    @sarusara7154 Pƙed rokem

    Do not waste your time, You cannot add into header with using elementor for free version

    • @ajwebhub
      @ajwebhub Pƙed rokem

      i am using elementor pro version but still i am not able to find it on elementor widgets

  • @hamzanoor861
    @hamzanoor861 Pƙed rokem

    Hi bro
    After changing the floating cart icon it’ll only changed in home not changing in store or categories
    Only changes appears in home, account, about, contact us

    • @danny-00
      @danny-00 Pƙed rokem

      Did u fix It?

    • @mike.valera
      @mike.valera Pƙed 4 měsĂ­ci

      Sounds like a caching issue. Try clearing your cache.

  • @TiGERSTYLEsgnr
    @TiGERSTYLEsgnr Pƙed 2 lety

    hi Uriel, hope you are doing well. I have added this side cart to my website and I also have the floating chat icon which is being over lapped by side cart icon. is it possible to hide the side cart floating icon and only keep it in the header? Thank you.

    • @UrielSoto
      @UrielSoto  Pƙed 2 lety

      I guess you can find the css class for the side cart and do display: none

    • @TiGERSTYLEsgnr
      @TiGERSTYLEsgnr Pƙed 2 lety

      @@UrielSoto Thank you, it worked by adding " .cc-compass {
      display: none; " to custom CSS. I am new to codding, your video helped.