WordPress.org

Support

Support » Plugins and Hacks » WooCommerce » Need help with styling product page

Need help with styling product page

  • 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/

Viewing 7 replies - 1 through 7 (of 7 total)
  • 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…

    Roy Ho

    @splashingpixelscom

    Mark, you have to wear your bottle cap glasses to read that… 🙂

    @molinnov – varktech knows his stuff!

    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?

    Roy Ho

    @splashingpixelscom

    @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.

    @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.

    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/

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

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Need help with styling product page’ is closed to new replies.
Skip to toolbar