WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
Need help with styling product page (8 posts)

  1. molinnov
    Member
    Posted 9 months ago #

    This is the main product page on my site, where it lists all the product-categories:
    http://www.mol-innov.com/new/products/

    I'm using "woocommerce customizer" plugin to create the columns, and I added a code that removes the thumbnails, but I would like to be able to list these categories without any spaces below each.

    And also how can I increase the width of each column so that the words aren't cut-off like they are right now?

    I'm thinking the file that affects these changes is theme/warp/css/base.css, right?

    If so, which elements should I change and what changes should I make?

    Any help would be appreciated. Thanks.

    http://wordpress.org/plugins/woocommerce/

  2. vark
    Member
    Posted 9 months ago #

    hiya,
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product you can increase the width to say... width: 27.05%; .
    BTW, i find the font very hard to read, even magnified...

  3. Roy Ho
    Member
    Posted 9 months ago #

    Mark, you have to wear your bottle cap glasses to read that... :)

    @molinnov - varktech knows his stuff!

  4. molinnov
    Member
    Posted 9 months ago #

    Thanks a lot for replying!

    I increased the font, but now some of the text is going on top of other text. How can I make each word wrap and stay inside its own cell? I tried adding "word-wrap:break-word;" but it didn't work.
    http://www.mol-innov.com/new/products/

    Any ideas?

  5. Roy Ho
    Member
    Posted 9 months ago #

    @molinnov - that is because in your CSS somewhere you have line-height set to 1px for your h3 tags. Not really sure why it is set to 1px. You need to change that to something like 1.5em instead of 1px.

  6. vark
    Member
    Posted 9 months ago #

    @molinnov,
    What he said! ... but you kinda missed my comment about the chosen font. It works as a font for large titles, but for data, it's really, really unreadable.

  7. molinnov
    Member
    Posted 9 months ago #

    Thanks guys. Do you mean it's the color that is hard to see? Ok, I think I fixed it but it's only appearing in chrome, not firefox. I added "h3 {color: #00C;}" to theme/css/base.css but I can't really figure out the best way to fix the color. How does it look now? http://www.mol-innov.com/new/products/

  8. vark
    Member
    Posted 9 months ago #

    @molinnov,
    font-family: "Yanone Kaffeesatz Thin"; in any size less than ... 24px ... or so
    ... is ... not ... readable ... (imho)

Reply

You must log in to post.

About this Plugin

About this Topic