CMS Development

JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi,

 

I changed the color of the button on the subscription preference page. The color pink is right in overall preview. See the screenshot:

Screenshot 2023-09-18 at 11.28.01.png

However, if I access from here, the color is still default color: red and purple. The color doesn't even change when I apply this page in live mode. Could anyone help on this issue please?

Screenshot 2023-09-18 at 11.29.02.png

Screenshot 2023-09-18 at 11.30.45.png

 

Thanks a lot! 

1 Soluciones aceptada
GRajput
Solución
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

The button color on the system page isn't displayed as it was set up

resolver

Hi @JFAN5 

Thanks for sharing the page link. So I found the class which has the button background color. Now you can add these line of CSS to give your custom color:-

.button, .button:visited, .btn-primary, .btn-primary:visited, .hs-button, .hs-button:visited {
background-color: #EC9BAE;
}

 

On Hover:-

.button:hover, .button:focus, .btn-primary:hover, .btn-primary:focus, .hs-button:hover, .hs-button:focus {
background-color: #78C7CB;
}

 

If it still doesn't work then add !important after the color hex code like this:-  background-color#EC9BAE !important; .

 

Hope this will helps you out. Please mark it as Solution Accepted & Upvote to help other Community member.
Thanks!




Gaurav Rajput
Director, MarTech( Growth Natives)

Book a meeting


Ver la solución en mensaje original publicado

0 Me gusta
9 Respuestas 9
JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi @GRajput ,

 

Thank you so much! It works finally!

 

Best,

0 Me gusta
JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi Gaurav,

 

Thanks for your reply. Then what could I do to have the button color in pink please?

GRajput
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

The button color on the system page isn't displayed as it was set up

resolver

Hi @JFAN5 

I understand your question but their is nothing wrong here. I hope this will help you , this is Because when you preview your template then it shows the initial value  of the CSS property which is set in the theme but when you change the color from content editor then the initial value gets updated on the page level not at theme level. So it doesn't matter which color you choose for you button in content editor, it will not change the initial value in theme.

 

Hope this will helps you out. Please mark it as Solution Accepted & Upvote to help other Community member.
Thanks!




Gaurav Rajput
Director, MarTech( Growth Natives)

Book a meeting


JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi @GRajput ,

 

Thanks again for your response. In order to make the button colour change, what should I do please? I'm really confused. 

 

Best,

 

GRajput
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

The button color on the system page isn't displayed as it was set up

resolver

Hi @JFAN5 

So to change the button color you can do it from content editor or you can use CSS to do it. If you can share your page link then I can help you with the CSS. 

 

Thanks!




Gaurav Rajput
Director, MarTech( Growth Natives)

Book a meeting


JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi @GRajput ,

 

I changed the button color in the content editor but it didn't work. 

Preview link: https://app-eu1.hubspot.com/design-previewer/25855288/code/76980587708

Design manager link: https://app-eu1.hubspot.com/design-manager/25855288/code/76980587708?tfid=76289810146

Theme editor link: https://app-eu1.hubspot.com/theme-editor/25855288/edit/FreeFlex%20child?testmode=true

 

The button color that I'd like to have:

background color: EC9BAE

background hover color: 78C7CB

 

Thanks,

GRajput
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

The button color on the system page isn't displayed as it was set up

resolver

Hi @JFAN5 

 

I don't need the preview, design manager or theme link because to open those links I would need access of your portal. Please provide the page link for that you need to publish the page and in settings you will find that page url. If by any reason you are unable to publish the page then you can Book a meeting and me or my team will help you out.

 

Thanks!




Gaurav Rajput
Director, MarTech( Growth Natives)

Book a meeting


JFAN5
Participante

The button color on the system page isn't displayed as it was set up

resolver

Hi,@GRajput 

 

I was not clear about that before. Is this one?: https://hs-25855288.s.hubspotemail-eu1.net/hs/manage-preferences/unsubscribe?languagePreference=fr&d...

 

Thanks,

 

 

 

GRajput
Solución
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

The button color on the system page isn't displayed as it was set up

resolver

Hi @JFAN5 

Thanks for sharing the page link. So I found the class which has the button background color. Now you can add these line of CSS to give your custom color:-

.button, .button:visited, .btn-primary, .btn-primary:visited, .hs-button, .hs-button:visited {
background-color: #EC9BAE;
}

 

On Hover:-

.button:hover, .button:focus, .btn-primary:hover, .btn-primary:focus, .hs-button:hover, .hs-button:focus {
background-color: #78C7CB;
}

 

If it still doesn't work then add !important after the color hex code like this:-  background-color#EC9BAE !important; .

 

Hope this will helps you out. Please mark it as Solution Accepted & Upvote to help other Community member.
Thanks!




Gaurav Rajput
Director, MarTech( Growth Natives)

Book a meeting


0 Me gusta