Removing Bold Text From Shop Pay Instalments

Store Design
, ,
1

Hi,

I’ve recently enabled Shop Pay instalments on my site but the pricing for Shop Pay is showing as bold.

I can’t figure out how to remove this as CSS doesn’t seem to work unfortunately.

Dylan_Propeller_0-1674063376971.png
Dylan_Propeller_0-1674063376971.png1614×282 56.6 KB

Would really appreciate if someone could help!

Thanks in advance.

2

@Dylan_Propeller

Hello,

Please give me the store URL then i will help.

3

Hello @niraj_patel ,

Thanks for the response!

https://varianceobjects.com/products/ruby-medium-stone-studs

Here’s a link to a product page.

4

@Dylan_Propeller

its impossible think because the tag is present in HTML so don’t change the font-weight by css.

5

Hi [email removed]Dylan_Propeller,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid,

Step 3: Paste the below code at before or element of the file → Save

const interval=setInterval(()=>{
  const text=document.querySelector('shopify-payment-terms')
  if(text){
clearInterval(interval)
       text.shadowRoot.querySelector('#shopify-installments b').style.fontWeight='400'
  }
},1)
setTimeout(()=>{
  clearInterval(interval)
},10000)

PageFlyVictor_0-1674117923883.png
PageFlyVictor_0-1674117923883.png954×334 15.4 KB

Hope my solution works perfectly for you!

Best regards,

Victor | PageFly

6

Hey @PageFly-Victor

Thank you for the code you have provided!

Unfortunately, I have tried both before and with no luck:

Dylan_Propeller_0-1674119516850.png
Dylan_Propeller_0-1674119516850.png1562×590 68.2 KB

7

Hi @Dylan_Propeller ,
I see one error is 1 sign left “)”

PageFlyVictor_0-1674122396538.png
PageFlyVictor_0-1674122396538.png2128×1140 197 KB

8

Hey @PageFly-Victor ,

Thanks for spotting that!

Unfortunately, even after removing it doesn’t seem to work on the live site:

Dylan_Propeller_0-1674134948016.png
Dylan_Propeller_0-1674134948016.png1614×612 71.3 KB

9

Hi @Dylan_Propeller ,
You can try gain

 
          const interval=setInterval(()=>{
          const payment=document.querySelector('shopify-payment-terms')
          const text=payment.shadowRoot.querySelector('#shopify-installments b')
          console.log('text',text)
          if(text){
             clearInterval(interval)
             text.style.fontWeight='400'
          }
        },1)
        setTimeout(()=>{
          clearInterval(interval)
        },15000)
10

Thank you @PageFly-Victor

Amazing, this worked :raising_hands:

11

You are welcome. I’m glad when I can help you :heart_eyes: