Return to previous page

Woocommerce skin - by marlinda - on WordPress WooCommerce support

This topic has 10 replies, 4 voices, and was last updated 10 years, 9 months ago ago by Robert Hall

marlinda

Participant

February 26, 2015 at 21:06

I’m trying to add a few characters from the short description to the woocommerce ess.grid skin. (below the title, above the price)

I don’t know if I’m doing it right… could you send me in the right direction please?

I’ve created a new skin (marked as favorite) and I’ve added excerpt. So far it seems right, doesn’t it?

But how do I start using my new skin? Sorry to bother you guys again. I’ve really tried to solved this myself but I’m stuck….

#45873 Copied

9 Answers

Eva Kemp

Participant

February 26, 2015 at 21:28

Hello,

Sorry, but your query is a bit unclear.
Please show us screenshots what you’re trying to achieve and provide links where the changes should be made.

Thank you.
Regards,
Eva Kemp.

#45884 Copied

marlinda

Participant

February 27, 2015 at 11:04

Hi Eva

True that was a bit unclear, sorry for that:)

I’ve attached an image that shows what I want to do. It’s the products page layout. I’ve tried to do it my self by using Ess. grid –> item skin editor but haven’t had any luck.

#46119 Copied
Brian Johnson

Member

February 27, 2015 at 11:51
Hello.
Please add this code into the custom.css file:

.products-grid .product-excerpt { display: block !important; }

With best regards
Brian Johnson
#46144 Copied
marlinda

Participant

February 28, 2015 at 06:17

Thank you, incredible how easy it is when you know how to do it:)

Would it also be possible to limit the text to only show 3 lines or 60 characters? And have the text to end with … to show that there is more.

It would also be nice if it would be possible to add some blank space between the text and the add to cart button, right now they are very close to each other.

#46340 Copied
Robert Hall

Participant

February 28, 2015 at 08:34
Hello,

To show 3 lines you can add this code:

.products-grid .product-excerpt{ height: 57px; overflow: hidden; }

Sorry, but it’s not possible to have “more” button in this case.
TO increse space between the text and the add to cart button please add this code into custom.css file:

.btn{ margin-top:10px; }

Regards,
Robert Hall.
#46346 Copied
marlinda

Participant

February 28, 2015 at 09:44

Thank you!

A combination of your answer and the previous answer worked:
.products-grid .product-excerpt {
height: 57px;
overflow: hidden;
display: block! important;
}

.btn{
margin-top:10px;
}

I don’t want to insert a “more” button, I just want the text to end with 3 dots (…) to show that there is more text. Because by having 3 lines it sometimes means that the text will be cut off.
Is that possible?

#46356 Copied

Robert Hall

Participant

February 28, 2015 at 10:17

Sorry, but we don’t have such feature in our theme.

Regards,
Robert Hall.

#46359 Copied

marlinda

Participant

February 28, 2015 at 10:25

Ok, thank you!

#46361 Copied

Robert Hall

Participant

February 28, 2015 at 10:34

You’re welcome!
If you have any questions please feel free to contact us.

Regards,
Robert Hall.

#46362 Copied
Viewing 10 results - 1 through 10 (of 10 total)