Archived topic
How do I use two site library at same wordpress
11 replies · Started by Keshav on September 24, 2019
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,
Keshav
Hi 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 :)
Thank 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
Hi 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 Archives
1.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 Archives
2. 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);
}
}
Thanks 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/
Hmmm.... 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 > Woocommerce
So not sure it would work with your particular products
Thank 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
Can you set it to 3 columns and ill take a look at the problem. And provide some guides for styling.
Update. Please check: https://www.dilsedeshi.com/dil-se-deshi-shop/
Check related product tab also.
Thanks
Try 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;
}
Thank you so much.. Fixed
You're welcome