Home › Forums › WoodMart support forum › Cart Widget – Add HTML Blocks in the Sidebar / or PHP
Cart Widget – Add HTML Blocks in the Sidebar / or PHP
- This topic has 6 replies, 2 voices, and was last updated 3 years, 11 months ago by Elise Noromit.
-
AuthorPosts
-
December 30, 2020 at 8:19 pm #254760
WebGuideParticipantHello XTEMOS-Team,
first of all, I would like to thank you for this excellent theme.
Please continue!To my questions:
1. The aim is to display a banner for secure payment in the shopping cart – sidebar cart. (See screenshot, i edited with photoshop) I built an HTML block with Elementor for this purpose, but I can’t make it visible. I just don’t have the knowledge of .php to do this.So far I have oriented myself to the following topics.
https://xtemos.com/forums/topic/html-block-in-php/
https://xtemos.com/forums/topic/add-html-block-in-the-cart-page/
https://xtemos.com/forums/search/shopping-cart-widget-footer/
https://xtemos.com/forums/topic/what-php-file-is-this-sidebar-cart/
https://xtemos.com/forums/topic/side-windows/
https://xtemos.com/forums/topic/enter-our-website-instagram-problem/However, I am not breaking down a complete code
Insert"content\themes\woodmart\inc\integrations\woocommerce\template-tags.php"
.I’m missing an essential part here.
(see Notepad Screenshot)Do you have a snippet to insert an HTML block right there? I can do the CSS myself! 😀
It would be enough for me if there is any possibility to insert a picture at this point, it doesnt matter if its a php snippet, css-code or something else. The picture need to be mobile optimized aswell.2. I would also like to display TAX and / or Shipping fee in the side cart – I assume it probably only works in the “template-tags.php” correct? How can i do it, you have a snippet here? (See screenshot)
Thank you very much in advance!
Attachments:
You must be logged in to view attached files.December 30, 2020 at 9:28 pm #254785
Elise NoromitMemberHello,
Thank you very much for choosing our theme and for contacting us.
You say you want to add the content in to the sidebar of the shopping cart. Please follow these steps:
1. Crate a custom Sidebar in Dashboard > Sidebars;
2. Configure the Shopping cart page to have the sidebar: https://xtemos.com/docs/woodmart/options-for-pages/
3. Create HTML block, add the content you need, perhaps you will need Raw HTML.
4. Then add WOODMART HTML Block widget to the custom sidebar in Appearance > widgets: https://xtemos.com/docs/woodmart/widgets/
Please let us know if you need further help.
Best Regards
December 31, 2020 at 11:29 am #254884
WebGuideParticipantHello, thanks for the quick reply.
I think you misunderstood me, it’s not about any sidebar but about the shopping cart sidebar. When I add any item to the cart, the “cart sidebar” appears, the background is slightly hidden and from there I can add the “cart”, immediately to the “checkout” or continue shopping.I know that I can add a sidebar with widgets at
https://woodmart.xtemos.com/cart/But it is about the floating AJAX shopping cart! (see screenshot “Screen1”)
This is for example in 95% of all demos preset it is aboutclass="cart-widget-side woodmart-cart-opened"
.
This can be activated/deactivated under.
Theme Settings -> Shop -> “Action after add to cart” (look at screenshot “Screen2”)Exactly this sidebar is not shown to me under “WordPress Dashboard -> Widgets”, so I can’t add HTML blocks there.
Now I’m looking for a way to insert my HTML block or an image there, as described above in the original post (please read through my first post again and look at the images for it, thanks!).
Best regrads.
Attachments:
You must be logged in to view attached files.December 31, 2020 at 6:54 pm #254960
Elise NoromitMemberHello,
Now I see, unfortunately, there is no option to add any content to this sidebar. I will check with our dev team if it is possible to customize, however, we do not promise, I will be able to give you the feedback on Jan 4.
Happy New Year!
January 4, 2021 at 9:44 am #255531
Elise NoromitMemberHello,
Please add this code to the functions.php of the child theme:
add_action( 'woocommerce_widget_shopping_cart_total', function(){ echo do_shortcode( '[html_block id="3008"]' ); }, 5 );
[html_block id="3008"]
insert your HTML block ID in this place.Best Regards
January 5, 2021 at 11:48 am #255872
WebGuideParticipantHello,
Thank you, it worked.
It took a lot of CSS code but now it looks like before! 😀Here is the code for Global CSS – Mobile optimized. (only for Elementor & if there is an image in the HTML block with size 150×65 – please adjust it yourself!)
.cart-widget-side .widget_shopping_cart .shopping-cart-widget-footer .elementor-widget-image .elementor-image img{margin-bottom:12px; margin-top: -31px; } .cart-widget-side .widget_shopping_cart .shopping-cart-widget-footer .amount{box-sizing: border-box; color: rgb(244, 165, 28); display: inline; font-family: Cabin, Arial, Helvetica, sans-serif; font-size: 18px; font-stretch: 100%; font-style: normal; font-variant-caps: normal; font-variant-east-asian: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-weight: 600; height: auto; line-height: 28px; text-rendering: optimizelegibility; text-size-adjust: 100%; unicode-bidi: isolate; width: auto; position:static; top:auto; right:auto; bottom:auto;} .cart-widget-side .widget_shopping_cart .shopping-cart-widget-footer strong{box-sizing: border-box; display: inline; font-size: 18px; text-transform: uppercase; color: #2D2A2A; box-sizing: border-box; display: inline; float: none; line-height: 25.2px; position: static; z-index: auto; margin-right: 52px; margin-top: 21px; margin-left: 25px; } @media screen and (max-width:1024px) {.cart-widget-side .widget_shopping_cart .shopping-cart-widget-footer strong{ margin-right: 30px; margin-top: 10px; margin-left: 20px; }}
Attachments:
You must be logged in to view attached files.January 5, 2021 at 6:23 pm #255992
Elise NoromitMemberHello,
I cannot catch your idea, what help do you need now? I cannot view your site now https://prnt.sc/wgxvw2
Best Regards
-
AuthorPosts
- You must be logged in to create new topics. Login / Register