- This topic has 11 replies, 3 voices, and was last updated 4 years, 4 months ago by David.
-
AuthorPosts
-
September 24, 2019 at 1:35 pm #1018041Keshav
Hi,
I am using sider site library for my existing website dilsedeshi.com I want to setup imprint site library between same site for woocommerce.
How can i do this?
Please help.
Thanks,
KeshavSeptember 24, 2019 at 4:46 pm #1018156TomLead DeveloperLead DeveloperHi there,
It’s not possible to use two different sites on the same site, unfortunately.
If there are specific parts of Imprint that you want to use on your Sider site, we may be able to help.
Let us know 🙂
November 5, 2019 at 4:10 am #1053687KeshavThank you so much and I am sorry for too late reply.
This is my website dilsedeshi.com and this is the ecommmerce section https://www.dilsedeshi.com/dil-se-deshi-shop/.
I want to implement Imprint theme or apply only layout of imprint on ecommerce section. Is it possible. If yes then please suggest how to do it.
Thanks
November 5, 2019 at 4:47 am #1053729DavidStaffCustomer SupportHi there,
not sure how this will work with your current site, but you can try the following to style the Shop Archive only – the single product would probably mean removing some of the content you have displayed:
1. Create 2 x New Hook Elements
1.1 Hook 1:
Title: Shop Loop info wrap
Content:<!-- Open Wrap --> <div class="woo-loop-info-wrap">
Note: the editor may automatically add a
</div>
if so remove that.Hook: Custom Hook – in the field provided add:
woocommerce_shop_loop_item_title
Priority:9
Display Rules: Product Archives1.2 Hook 2:
Title: Shop Loop Info Wrap Close
Content:</div> <!-- close info wrap -->
Hook: Custom Hook – in the field provided add:
woocommerce_after_shop_loop_item
Priority:1
Display Rules: Product Archives2. Customizer > Layout > Woocommerce –> Shop – uncheck Display Short Description
3. Add this CSS:
/*-- Woocommerce Buttons --*/ /* Adjust padding and add border radius to buttons */ .woocommerce div.product form.cart .button, .woocommerce ul.products li.product .button { padding: 5px 10px; border-radius: 25px; } @media(max-width: 768px) { .woocommerce ul.products li.product .button { padding: 5px 0; } } /*-- Woocommerce Shop -- */ /* Staggered 3 and 4 column grid */ @media (min-width: 1024px) { .woocommerce ul.columns-3 li.product:nth-child(3n), .woocommerce ul.columns-3 li.product:nth-child(3n+1) { -webkit-transform: translateY(100px); transform: translateY(100px); } .woocommerce ul.columns-4 li.product:nth-child(2n), .woocommerce ul.columns-4 li.product:nth-child(2n+1) { -webkit-transform: translateY(100px); transform: translateY(100px); } } .woocommerce ul.products { margin-bottom: 150px; } /* Image border radius */ .woocommerce ul.products li.product a img { border-radius: 5px; } /* Title Price wrapper alignment */ .woo-loop-info-wrap { display: grid; grid-template-columns: 50% 50%; opacity: 0.25; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; margin-top: 0 !important; } .woo-loop-info-wrap .price { justify-self: end; font-size: 12px !important; font-weight: normal !important; } /* Style shop button hover effect */ @media (min-width: 769px) { .woocommerce ul.products li.product .button { position: absolute; bottom: 60px; right: 10px; margin: 0; font-size: 12px; opacity: 0; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .woocommerce ul.products li.product:hover .button, .woocommerce ul.products li.product:hover .woo-loop-info-wrap { opacity: 1; } .woocommerce ul.products li.product .button:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } .woocommerce a.button { -webkit-box-shadow: 0 0 15px 3px rgba(0, 0, 0, 0.2); box-shadow: 0 0 15px 3px rgba(0, 0, 0, 0.2); } }
November 5, 2019 at 5:38 am #1053759KeshavThanks for reply
All above steps implemented. but layout has been disturbed. How to fix layout and how to customize it?
Please check here: https://www.dilsedeshi.com/dil-se-deshi-shop/
November 5, 2019 at 9:06 am #1054064DavidStaffCustomer SupportHmmm…. few issues:
1. Imprint works with really short product titles so they fit on one line.
2. Only shows title and price.
3. Has a larger product image size set in Customizer > WoocommerceSo not sure it would work with your particular products
November 6, 2019 at 1:53 am #1054567KeshavThank you so much for you clear answer.
So now i will continue ecommerce on same website (https://www.dilsedeshi.com/dil-se-deshi-shop/)
Now I need some other help, I want to create shop page more attractive. So i want to know that how to customize particular page(Shop). Currently product placed into 2 columns but when i covert into 3 column page layout has been disturbed.
And i want increase related product in bottom of the product and i want to show products into my article so any plugin or short code are available for this?
One more thing cart is not update automatically, currently we need to update first.
Please help.
Thanks
November 6, 2019 at 6:39 am #1054785DavidStaffCustomer SupportCan you set it to 3 columns and ill take a look at the problem. And provide some guides for styling.
November 7, 2019 at 4:53 am #1055773KeshavUpdate. Please check: https://www.dilsedeshi.com/dil-se-deshi-shop/
Check related product tab also.
Thanks
November 7, 2019 at 5:12 am #1055801DavidStaffCustomer SupportTry adding this CSS to fix the columns issue:
.woocommerce ul.products li.product .woocommerce-LoopProduct-link h2, .woocommerce ul.products li.product .woocommerce-loop-category__title { word-break: break-all; }
November 7, 2019 at 5:25 am #1055814KeshavThank you so much.. Fixed
November 7, 2019 at 6:02 am #1055848DavidStaffCustomer SupportYou’re welcome
-
AuthorPosts
- You must be logged in to reply to this topic.