FROM CACHE - en_header

AfterPay Placement on Product Page

Solved
Mish4109
New Member
5 0 0

Can someone tell me how to place the AfterPay info beside my price on the product page? I am using the Prestige Theme

this is what I have

Mish4109_0-1645033703519.png

 

 

 

This is what I want

Mish4109_1-1645033703559.png

 

 

@m1guelrod

Accepted Solution (1)

Accepted Solutions
AvadaCommerce
Shopify Partner
3873 834 735

This is an accepted solution.

Hi @Mish4109 ,

 

sorry for replying late.

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss->paste below code at the bottom of the file:

.ProductMeta__PriceList {
    display: inline-block !important;
}

.template-product .afterpay-paragraph {
    width: calc(100% - 55px);
    display: inline-block;
    padding-left: 20px;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

View solution in original post

Replies 5 (5)
AvadaCommerce
Shopify Partner
3873 834 735

Hi @Mish4109 ,

 

Please share your store URL and if your store is password protected then please provide password too.

So that we can help you.

Thank you.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

Mish4109
New Member
5 0 0
AvadaCommerce
Shopify Partner
3873 834 735

This is an accepted solution.

Hi @Mish4109 ,

 

sorry for replying late.

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss->paste below code at the bottom of the file:

.ProductMeta__PriceList {
    display: inline-block !important;
}

.template-product .afterpay-paragraph {
    width: calc(100% - 55px);
    display: inline-block;
    padding-left: 20px;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

Mish4109
New Member
5 0 0

Could you tell me where I can edit the code to reduce the .afterpay_logo?

AvadaCommerce
Shopify Partner
3873 834 735

Hi @Mish4109 ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss->paste below code at the bottom of the file:

.template-product .afterpay-paragraph img {
    max-width: 70px !important;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE