FROM CACHE - de_header
Gelöst

Deactivate hover on my payment button

yasd
Tourist
10 0 4

hello shopify community,

I've been trying to figure out how to disable the hover-over effect myself through previous posts, but no luck.
Hopefully someone in the community can help.

I'd like to disable the hover-over effect on my payment button.   I use the Venture Theme.

Screenshot attached.

NORMAL :

yasd_1-1613288575184.png

WITH HOVER:

yasd_2-1613290121942.png

 

 

.shopify-payment-button {
@include flex(1);
.shopify-payment-button__button {
margin-top: 10px;
border-radius: 3px;
}

.shopify-payment-button__button--branded {
overflow: hidden;
min-height: 48px;
}

.shopify-payment-button__button--unbranded {
background-image:linear-gradient(90deg,#f72461,#c914ba)!important;
@extend .btn;
width: 100%;
margin-bottom: 10px;

&:hover {
background-color: $color-btn-secondary-accent-hover !important;
}
}

.shopify-payment-button__more-options {
margin: 16px 0 10px 0;
font-size: em($font-size-base - 2px);
color: $color-btn-secondary-accent;
text-decoration: underline;

&:hover {
color: $color-btn-secondary-accent-hover;
}
}

.product-form--payment-button & {
margin-bottom: 10px;
}
}

 

1 AKZEPTIERTE LÖSUNG
r8r
Shopify Expert
2555 327 940

Erfolg.

@yasd @tewe 

alright – so I get now what you mean … I assumed you were talking about the "default styling", i.e. unbranded Version of that button. However, what you are mentioning and want to change is behavior that's being caused by Shopify based on a number of aspects. You can read a lot about it on the Dynamic checkout buttons help-page:

Screenshot 2021-02-15 at 12.59.22.jpg

 

On the Brave-browser I can trigger different behaviors of the button depending on whether I browse to it using "shields up" or not.

I hope this helps!
Mario

PS: Since you posted in the German-language part of the board, I wondered if that was a purposeful decision or happened by accident.

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte

Lösung in ursprünglichem Beitrag anzeigen

11 ANTWORTEN 11

r8r
Shopify Expert
2555 327 940

Hi @yasd 

the easiest would probably be to just comment out the &:hover-blocks!

Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
yasd
Tourist
10 0 4

@r8r 

thx for your fast reply. 

Unfortunately it doesn't  work. I'm sorry.

Another Idea?

 

r8r
Shopify Expert
2555 327 940

then this isn’t the complete source code. Possibly the theme also manipulates it using JS. Giving us the link to your page makes this easier to analyze. 

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
yasd
Tourist
10 0 4

@r8r 

my shopname

https://trendsonly247.myshopify.com/

passwort: asheon

 

i would be happy to find a solution

Thank you. 

tewe
Shopify Partner
244 46 102

Hi @yasd,

your product page now looks like

Screenshot from 2021-02-15 09-33-22.png

Did you solve your problem or did you give up?

Regards
Thomas

• Was my reply helpful? Click Like to let me know!
• Was your question answered? Mark it as an Accepted Solution
• Check out our Price Updater App
yasd
Tourist
10 0 4

hi @tewe 

my product page looks still

yasd_0-1613379404546.png

I didn't solve my problem.

Do u have a idea?

 

tewe
Shopify Partner
244 46 102

Hi @yasd,

when I looked at some of your products it always looked like I reported above. Can you hint me to one of your products where I can see your problem?

Regards

Thomas

• Was my reply helpful? Click Like to let me know!
• Was your question answered? Mark it as an Accepted Solution
• Check out our Price Updater App
yasd
Tourist
10 0 4

@tewe 

strange 😕 

Please look in this (Test)-Product Page 

https://trendsonly247.myshopify.com/products/folding-pet-dog-carrier-pad-waterproof-dog-seat-bag-bas...

Its still looks like

yasd_0-1613381366548.png

 

tewe
Shopify Partner
244 46 102

Hi @yasd,

see below how I see your page. Really strange.

Regards
Thomas

 

Screenshot from 2021-02-15 10-44-15.png

• Was my reply helpful? Click Like to let me know!
• Was your question answered? Mark it as an Accepted Solution
• Check out our Price Updater App
r8r
Shopify Expert
2555 327 940

Erfolg.

@yasd @tewe 

alright – so I get now what you mean … I assumed you were talking about the "default styling", i.e. unbranded Version of that button. However, what you are mentioning and want to change is behavior that's being caused by Shopify based on a number of aspects. You can read a lot about it on the Dynamic checkout buttons help-page:

Screenshot 2021-02-15 at 12.59.22.jpg

 

On the Brave-browser I can trigger different behaviors of the button depending on whether I browse to it using "shields up" or not.

I hope this helps!
Mario

PS: Since you posted in the German-language part of the board, I wondered if that was a purposeful decision or happened by accident.

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
yasd
Tourist
10 0 4

Thanks a lot.

That help me so much.