Woocommerce PHP WordPress
- SOLVED
I want to add exerpt and styling to my archieve page in exactly the same way as http://www.thisiswhyimbroke.com/
My page is http://79.170.40.234/newgcp.uk/
Answers (1)
Rempty answers:
Hello
add this code to your functions.php for test if show the excerpt
add_action( 'woocommerce_after_shop_loop_item_title', 'add_product_excerpt',1 );
function add_product_excerpt(){
echo '<div class="product_excerpt">';
echo get_the_excerpt();
echo '</div>';
}
suddy12007 comments:
Hi, yes the exerpt has been added
Rempty comments:
Add this css
.product_excerpt{
text-align:justify;
font-weight:normal;
margin-bottom:10px;
line-height:20px;
}
suddy12007 comments:
Brill,
just need the gap between the image and the exerpt tighter.
and
the same amount of exerpt (characters/words) as http://thisiswhyimbroke.com
but so that the Prices & Check it out buttons all remain at the same level on each product
Hope this makes sense
Rempty comments:
add this css to reduce the gap betwwen image and excerot
ul.products li.product img{
margin-bottom:5px!important;
}
About the excerpt length, you need to add the excerpt in the short description, and this must be done manually, if you read the excerpt
of the products http://thisiswhyimbroke.com, are completed paragraphs and wasn't cutted down.
suddy12007 comments:
No worries,
on http://thisiswhyimbroke.com the "check it out" button remains in the same position whether the exerpt is on 1 line or 4 lines. How can this be done?
Rempty comments:
For this you need to assing a min-height
.product_excerpt{
text-align:justify;
font-weight:normal;
margin-bottom:10px;
line-height:20px;
min-height:150px;
}
In mobile don't need set a min-height because you only show one per row, add this to your css too
@media only screen and (max-width: 767px) {
.product_excerpt{
min-height:inherit!important;
}
}
suddy12007 comments:
Hi,
min-height dosent seem to work?
Rempty comments:
Did you add the css? beacuse i can't find it
in the line 310 of your style.css add:
min-height:150px;
suddy12007 comments:
Sorry,
My fault, that works
Awesome.