Hello,
Unfortunately, your previous custom code created for the product does not fully allow the desired appearance to be achieved. To attempt to recreate the desired look, you need to:
1. Remove all your current code related to “product-element-bottom,” “wd-entities-title,” “.wd-product-cats,” and “price.”
2. Delete the custom code provided to you in previous messages (https://xtemos.com/forums/topic/shop-age-page-category/#post-606450).
3. Add the following custom code to the Global Custom CSS area located in Theme Settings.
.wd-product .product-element-bottom {
flex-direction: row;
flex-wrap: wrap;
}
.wd-product .product-element-bottom .wd-entities-title {
order: 0;
}
.wd-product .product-element-bottom .price {
order: 1;
}
.wd-product .product-element-bottom .wd-product-cats {
order: 2;
width: 100%;
}
.wd-product .product-element-bottom > * {
order: 3;
}
@media (max-width: 768px) {
.wd-product .product-element-bottom .price {
width: 100%;
}
}
If you follow all these steps, your product will look as follows on desktop (https://monosnap.com/file/pUx68y1qXJa1qcfSyBv5qiojua5Td5) and mobile (https://monosnap.com/file/hB99LWND0zKthgilibqBRpDBEpULRu).
Kind Regards
.
