Hello,
To truncate a short description with the button on a single product page, there is no option in the theme settings available for that. Please follow this guide and configure it: https://www.businessbloomer.com/woocommerce-truncate-short-description-with-read-more-toggle/
To change the style as per your screenshot, Try to add the following custom css code in Theme Settings > Custom CSS. Change the code as per your requirements to adjust the layout.
.single-product .cart {
background: #f5f3ff;
padding: 20px;
border-radius: 16px;
}
div.quantity input[type="number"] {
font-size: 18px;
}
.single_add_to_cart_button {
background-color: #6c5ce7 !important; /* Purple button */
color: white !important;
font-size: 18px;
padding: 14px 26px;
border-radius: 30px;
}
div.quantity input[type="button"] {
background-color:#9E9E9E;
color: blue;
}
body .single_add_to_cart_button:before {
content: "\f105";
font-family: "woodmart-font";
opacity: 1;
width: 42px;
height: 45px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
margin-top: 3px;
margin-left: 5px;
transition: all .3s ease;
}
Best Regards,
.
