WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
CSS - Customization (3 posts)

  1. Angieatc
    Member
    Posted 1 year ago #

    I have a couple of questions regarding this plugin and the customization of it.

    Where I would find the code (I am not sure what it would be named) to do 2 things (using this site as an example http://babydeluxe.com/):

    1. Have the price on the tab on the product image and not under the product image on the shop page but not the individual item page (like the example link)?

    2. Have the price on the right and the sale price on the left? (I am assuming this is all CSS but want to make sure there isn't something I need to add. I used the CSS from this site to see I was doing it right but I get this: http://test1.strosgirldesigns.com/shop/ for the sale (please ignore the colors, I was using the code from the example to make sure I had the correct code).

    Also, is there a list of the CSS for the customization?

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

  2. mlddev
    Member
    Posted 1 year ago #

    For styling the price overlay banner thingy you can achieve that by editing your theme file CSS.

    The example site is styling the HTML element:
    <span class="price"> on the category page, and not the
    <span class="onsale">

    Since the "onsale" is already styled in a manner to hover over products with a set sale price, you will need to decide how you want to deal with that, by either hiding that through CSS, or removing it through your theme functions.php.

    You can also do 2. with CSS, something like this:

    .woocommerce ul.products li.product .price ins, .woocommerce-page ul.products li.product .price ins {
      background: none repeat scroll 0 0 transparent;
      float: left;
      margin-right: 3px;
    }
  3. Angieatc
    Member
    Posted 1 year ago #

    I figured it out. Your last bit of code worked. Now I just have to figure out why the sale banner/tag goes all the way across on the shop page.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.