Okay
  Public Ticket #847169
Customize Slashed Price Loo and Express Checkout
Closed

Comments

  •  1
    Mannix started the conversation
    July 31, 2016 at 12:37pm

    Hello,

    I would like to customize some bits of details on the Aurum template:
    1. Express Checkout - I already installed and activated WooCommerce's WooCommerce Quick Buy and I would like to implement it on the Product Items Page as another option and not just the Buy button. Is this doable?
    2. Slashed Price - Can you help out customizing the slash on the old price to be diagonal and not just horizontally straight? (Right to Left diagonal line)

    Can this be done? Thanks in advance!

  • [deleted] replied
    August 1, 2016 at 5:56pm

    Hi Mannix,

    1. I am not sure how that quick buy button works. Does it appear in the single product page when you activate any other theme?
    Also if you can ask the plugin developer to provide necessary information how can this included in single product page.

    2. Actually this is not possible and we don't offer customization, but I will give you the code this time so you can create an idea how this can be achieved:

    .woocommerce .shop-item .item-info .price>del, 
    .woocommerce .shop-item .item-info .woocs_price_code>del {
        position: relative;
        text-decoration: none !important;
    }

    .woocommerce .shop-item .item-info .price>del:before, 
    .woocommerce .shop-item .item-info .woocs_price_code>del:before {
        content: '';
        width: 80%;
        height: 1px;
        left: 10px;
        top: 50%;
        margin-top: 1px;
        background: #888;
        position: absolute;
        transform: rotate(20deg);
    }

    To apply Custom CSS, on WP admin panel menu click Custom CSS link (as shown here).

    The result should be like this:


    (view large version)

  •  1
    Mannix replied
    August 2, 2016 at 2:08pm

    Hi Arlind,

    1. I got the Express Checkout done. Thanks for the advise.

    2. I've done what you instructed but it did not take effect for some reason. I've tried putting "!important" tags on each attributes and also I've tried placing it on aurum.css directly and on style.css but no effect still. Can you help me with this?

  • [deleted] replied
    August 3, 2016 at 11:24am

    Hi Mannix,

    1. Great to hear that!

    2. Sure, just send me your WP credentials and I will apply that CSS for you.

    Make sure to choose "Private Reply" when you send us sensitive information!

  •   Mannix replied privately
  •  1,558
    Laborator replied
    August 8, 2016 at 12:24pm

    Hi Mannix,

    Use this CSS also for the Single Shop Page:

    .shop-item-single .item-info.summary .price del {
  color: transparent;
}


.shop-item-single .item-info.summary .price del .woocommerce-Price-amount.amount {
  position: relative;
}

.shop-item-single .item-info.summary .price del .woocommerce-Price-amount.amount:before { 
    content: '';
    width: 80%;
    height: 1px;
    left: 10px;
    top: 50%;
    margin-top: 1px;
    background: #888;
    position: absolute;
    transform: rotate(20deg);
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •   Mannix replied privately
  •  1,558
    Laborator replied
    August 9, 2016 at 11:07am

    Hi Mannix,

    Use this for the Homepage:

    .shop .shop-item .item-info .price>del, 
.woocommerce .shop-item .item-info .price>del {
    text-decoration: none;
}

.shop .shop-item .item-info .price>del {
  position: relative;
}

.shop .shop-item .item-info .price>del:before {
    content: '';
    width: 80%;
    height: 1px;
    left: 10px;
    top: 50%;
    margin-top: 1px;
    background: #888;
    position: absolute;
    transform: rotate(20deg);
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  1
    Mannix replied
    August 9, 2016 at 5:12pm

    Hello,

    This did it. Thank you!