I actually have two questions now that the screen shot will show. The original question is how to change the button font size like shown in the two orange buttons in the screen shot. I need it to be able to increase that font size to at least 17. Second question is. when I look at the website n a mobile device, the words "beautiful experiences" doesnt adjust and goes off screen. I do not want to adjust the size because I like how it looks on desktop, but how do I get the font to auto adjust to fit the screen for mobile? Thanks
To change the font size of the buttons, please go to Salient > General Settings > CSS/Script Related and enter the following code under the "Custom CSS Code" section:
1) You can change the navigation text size in the Salient Options Panel. Just go to Salient > Typography > Navigation & Page Header and change the font size in the Navigation Font section. As for the logo size you Can change that by going to Salient > Header Navigation > Logo & General Styling and specify your desired height in the Logo Height section.
2) The hyperlinks can be customized with some custom CSS.
3) To fix the text going off the screen, please enter the following code:
@media only screen and (max-width: 790px){ .wpb_text_column.wpb_content_element.wpb_animate_when_almost_visible.wpb_bottom-to-top.bottom-to-top.animated.wpb_start_animation h1{ font-size: 58px!important; letter-spacing: 6px!important; } }
I hope this helps. Please feel free to contact us if you have any further questions.
Please send links to pages where you want the color of the hyperlink changed and we'll write up the custom CSS. It would be helpful if you could identify, with maybe the aid of a screenshot, the ones you want changed.
I did it myself, I do have another issue. Please see if I have properly linked the google analytics script. I do not know where to put the tracking code in so I have only put in the script.
I keep trying to change the font size for the large button from 14 to 17 and bold it. The style sheet wont let me save the change. Thanks!
Hey there,
Thanks for reaching in,
Please send us an indicated screenshot and a link on your website so can send you some CSS for whats possible.
Regards
I actually have two questions now that the screen shot will show. The original question is how to change the button font size like shown in the two orange buttons in the screen shot. I need it to be able to increase that font size to at least 17. Second question is. when I look at the website n a mobile device, the words "beautiful experiences" doesnt adjust and goes off screen. I do not want to adjust the size because I like how it looks on desktop, but how do I get the font to auto adjust to fit the screen for mobile? Thanks
Hi there,
Thank you for getting back to us.
To change the font size of the buttons, please go to Salient > General Settings > CSS/Script Related and enter the following code under the "Custom CSS Code" section:
.nectar-button.extra-color-gradient-1.large{font-size: 17px!important;
font-weight: bold!important;
}
a.nectar-button.large.regular.extra-color-gradient-1.wpb_animate_when_almost_visible.wpb_fadeIn.fadeIn.animated.wpb_start_animation{
padding-left: 10px!important;
padding-right: 10px!important;
}
To fix the heading line going off the screen, you can use this code:
@media only screen and (max-width:420px){.heading-line h1{
font-size: 38px!important;
}
}
I hope this helps. Please feel free to contact us if you have any further questions.
Best Regards.
2 more questions:
1. how do I increase the overall size of the navigation text and the logo as well.
2. I want to customize the hyperlink color in different cases around the site so that it doesnt clash with the colors around it
3. the "peak wellness lifestyle" test is going off the screen on mobile, please tell me how to fix that
said i had 2 questions when i had 3, sorry ;)
Hi there,
Thank you for getting back to us.
1) You can change the navigation text size in the Salient Options Panel. Just go to Salient > Typography > Navigation & Page Header and change the font size in the Navigation Font section. As for the logo size you Can change that by going to Salient > Header Navigation > Logo & General Styling and specify your desired height in the Logo Height section.
2) The hyperlinks can be customized with some custom CSS.
3) To fix the text going off the screen, please enter the following code:
@media only screen and (max-width: 790px){.wpb_text_column.wpb_content_element.wpb_animate_when_almost_visible.wpb_bottom-to-top.bottom-to-top.animated.wpb_start_animation h1{
font-size: 58px!important;
letter-spacing: 6px!important;
}
}
I hope this helps. Please feel free to contact us if you have any further questions.
Best Regards.
please provide an example css that would communicate with your stylesheet to change the hyperlink color because I do not have this information
Hi there,
Thank you for getting back to us.
Please send links to pages where you want the color of the hyperlink changed and we'll write up the custom CSS. It would be helpful if you could identify, with maybe the aid of a screenshot, the ones you want changed.
Hope to hear from you soon.
Best Regards.
I did it myself, I do have another issue. Please see if I have properly linked the google analytics script. I do not know where to put the tracking code in so I have only put in the script.
Hi there,
Thank you for getting back to us.
Please take a look at the following article that will guide you on using Google Analytics: https://themenectar.ticksy.com//article/8264/
I hope this helps. Please feel free to contact us if you have any further questions.
Best Regards.