-
AuthorPosts
-
April 20, 2017 at 8:46 am #780376
Hi everyone
We’re building our Enfold WordPresss site right now and do have a slight problem with link-colors.
Our page uses the Enfold 2017 Demo as template, we do like the feeling and the colors… downside of this template is that links are just black and if you hover over them, they get underlined.
For some reasons we had to change our font color to black and now you can not see any difference if a link is a link… you have to get your mouse over nearly every word to see if it’s a link or not.
Standard blue looks crappy and we’ve also tried other colors for links.. didn’t look well, as our site is white/black/grey.
Additionally, if we use elements with white black background, we have to change the color of the text to custom => white text. Now the links don’t even change if you hover over them…. how to perserve the hover/change color if you’re using custom colors in certain areas?
Any ideas which colors to use, that work?
PS: Sadly I can’t provide an example or link right now to the page
br
TOMApril 20, 2017 at 9:56 am #780404Hey TOM,
It would really be helpful if we can get a link to your page. If it’s really impossible, then perhaps a screenshot might help.
To set the hover/change color for custom colors in certain areas, you can add code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file. If, for example, you’ve set the class
black-background
for your areas with a dark or black background, you can use something like this:.black-background a {#white; } .black-background a:hover {text-decoration:underline; color: yellow;}
and then you can edit the color as you see fit.
Speaking of color options, you can check this article for tips: https://www.viget.com/articles/color-contrast. The article also mentions good tools you can use. You can also try this Stack Exchange thread: https://graphicdesign.stackexchange.com/questions/20258/colors-to-use-with-black-background
I hope that helps! Let me know if you need anything else.
Best regards,
SarahMay 19, 2017 at 11:10 am #796481Hi Sarah,
I have a similar issue to this on my site.I have tried entering the CSS but it doesnt seem to change the content. I have also tried customising the links in the Theme Options however this changes a lot of dropcaps and the like. I would just like to be able to make links across the site stand out.
Many Thanks
TomMay 19, 2017 at 1:08 pm #796555May 19, 2017 at 4:13 pm #796636Within the next on pages there are links but since the theme colour and the link colours are the same they do not stand out from the text.
Thanks
TomMay 20, 2017 at 6:04 am #796917Hi Tom,
I think you will have to add a class manually to the links since it’s difficult to target those specific links. Please try adding this to Quick CSS:
.tom-link-class { color:yellow !important; }
Then add the class to the links you want to stand out in your content:
<a href="http://yoursite.com/link" class="tom-link-class">Link text</a>
Best regards,
RikardMay 22, 2017 at 8:57 am #797466Hi Rikard,
Ok thanks, the site is 370 pages, many of which have these links so changing them manually is not on the agenda for now, I will have to leave it and have a think about it another time.
Tom
May 22, 2017 at 12:41 pm #797588 -
AuthorPosts
- You must be logged in to reply to this topic.