I need different link colors for my design for the footer as for the content of the website. Which code can I use to change only the footer links (active/hover/visited)?
Thanks a lot
I need different link colors for my design for the footer as for the content of the website. Which code can I use to change only the footer links (active/hover/visited)?
Thanks a lot
Hello Dani,
I have checked your licenses page for the site URLs. It appears that you are using the Pro theme. If you are more interested in having control over all aspects of the footer I suggest that you consider the Footer builder in the Pro theme and you can use various elements to create a custom footer including the full control of your footer links.
Kindly check the Elements section of our documentation to learn more on which elements you can use on Pro Header/Footer builders.
Thank you.
Sorry but in the Documentation i don’t find a Information about this specific quest. Where in Pro i find the Option to change the link color’s jutst for the footer?
Hello Dani,
Sorry for your inconvenience, are you using custom footer using Pro Header/Footer builder. In case if you are using Navigation inline element to display links in the footer, go to footer—>select -->Navigation inline—>Top links -->Text Color–>Set Color from here.
In case if you are using the different elements to display the footer link please let us know with you Page URL and marking screenshot so that we can guide you peropely.
Hope it helps
Thanks
Thanks i don’t have a Menu link is just a mailto-link see at the screenshot
The mailto-link should be white as the other text in the footer.
Thanks a lot for your help
@gra_gra_grafik, it would be the same process whether it’s a button, text, or anything else. Inspect the Element you’re trying to update, find it’s Color control for that appropriate line of text, and you can update it in the builder as demonstrated by @prakash_s above.
If this still does not help to point you in the right direction, please supply us with a live link to your webpage so that we can take a look at things live and help provide more contextual assistance.
Thanks!
Ok i put where you offerd the link color white but nothing change
This Item its just a normal Mailto Link
The Theme Options Color is stronger than the rest
Now what i can do?
Hi Dani,
Now we understand what you are trying to accomplish. Regretfully there is no setting for the links that appear in the footer. All link colors can be adjusted in the Pro > Theme Options > Typography > Site Links. And it turns out that you are inserting a simple link in a Text element. The color picker of the text element will only work for the text will not affect the mailto link in it because the link will still get styled using the global settings. Two change the color of this simple link that you have added can be done in two ways:
#1:
Please use a text element and a button element. The text element is for the address and the button element will be for your link. So that it will not look like a button, you will have to remove the margin, padding, borders, and shadows. Use the button element’s Text Format option to select the link color of the mailto link.
#2:
You need to use the Google Chrome Developer Toolbar to check the live HTML code and find which CSS selector and element you need to use. For the footer container, it uses x-colophon
class and the <a>
tag for the link. Therefore, a custom CSS like this can change the link color as an example:
.x-colophon a{
color: red;
}
.x-colophon a:hover{
color: blue;
}
You need to add CSS code into Pro > Theme Options > Global CSS and now your footer links will have different colors. Feel free to make adjustments to the example code above as you need. Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:
Intro to CSS - https://goo.gl/mFuWQT
How to get CSS selectors - https://goo.gl/BmoH39
Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa
CSS Media Queries - https://goo.gl/L3ZHNg
Best Regards.
Thank you for the detailed answer!
Hi Dani,
You’re welcome and it’s our pleasure to help you. If you have any other concerns regarding our theme features, feel free to reach us.
Thank you.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.