Homepage › Community Forums › Epik Theme Support › Changing link color in Epik theme
I am using the Epik theme in the lighter gray color. I want to make links more visible because it is visually hard to distinguish the link color from other text color. How do I change the links to another color like blue or red and still keep the gray theme color?
Look for this in your css –
.epik-gray a {
color: #777;
}
Then you can change the color to whatever you want. If you wanted to keep the same colors you could increase the font-weight from 400 to 600 or 700.
I am using the black theme, but it appears the CSS is different for the black than all the others. What code would I need to change to adjust the link color using the black theme. The links just look like bold text. I need to make them stand out.
Thanks
@financialseo Have a link so I can check it out?
I replied to the other post here – https://appfinite.com/topic/mobile-responsiveness-no-longer-working-correctly/#post-9254
I made these same changes in my site, and the color changes aren’t working. Any help here? http://theabundantartisttest.com
I’d like all links on my site to display in #336699, instead of the black text color they display in now. Is there a single spot to change this in the CSS?
Yes, take a look around line 395 in your css and change the color like this –
a {
color: #336699;
font-weight: 400;
text-decoration: none;
}
Tried that before. Just tried it again. Didn’t work. Any other alternatives?
It’s working. You may just need to clear your browser cache by hitting your reload button on your browser. I can see the blue link color from the code I suggested above. Are you still not seeing the blue link? If not, where exactly do you have the link? So far I can see it on the homepage.
It’s working on the home page, and the post info, but not on the rest of the site (links from within the blog posts, Contact, etc)
Ok I see what you’re referring to. Take a look around line 4409 in your css and you’ll see the entry-content
code –
.entry-content a {
color: #000;
}
You can either remove this color (black) or add in your blue color code here. That would cover everything inside of the entry-content div, which is usually within the post/page content.
Let me know if that works.
Need help too.
All my links are displaying as 298305 and no matter what I change they remain green!
I removed that line and it worked. Thank you for the help!
@dcherry It’s coming from this code in your css –
a,
h2 a:hover {
color: #298305;
text-decoration: none;
}
If you change that code, then it will change the link colors. I’m not sure which line it is exactly since most of your css code is showing up on the same line (mixed together) – http://www.yourlifebetter.net/wp-content/themes/epik/style.css?ver=2.0.2 Did you manually do that to your style.css file, or are you using a plugin or something?
Hi Wes,
I would like to change the color of “welcome wide” widget into a different color then the “welcome feature” widget.
How can I split them up?
And is it possible to change the background of one widget into a picture, instead of all of the widget at once?
Thank you!
@Lonneke you can, but you’ll have to split the divs in your home.php file. Wes mentioned that here – https://appfinite.com/topic/how-can-i-add-extra-widget-sections-on-home/#post-9226
I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com
@Eric, thanks for your quick reply.
But where in home.php do i have to change this to seperate the welcome wide and the welcome features?
And how?
I’ve just bought the theme a few weeks ago. Don’t I have the latest version now?
I did the background change in the style sheet already. But thanks anyway.
Look for the widget areas that will look something like this –
/**
* Display widget content for the "Welcome-wide", "Welcome Feature 1", "Welcome Feature 2", and "Welcome Feature 3" sections.
*
*/
function epik_home_loop_helper_welcome() {
if ( is_active_sidebar( 'welcome-wide' ) || is_active_sidebar( 'welcome-feature-1' ) || is_active_sidebar( 'welcome-feature-2' ) || is_active_sidebar( 'welcome-feature-3' ) ) {
echo '<div class="welcome">';
genesis_widget_area( 'welcome-wide', array(
'before' => '<div class="welcome-wide"><div class="wrap">',
'after' => '</div></div>',
) );
echo '<div class="welcome-features"><div class="wrap">';
genesis_widget_area( 'welcome-feature-1', array(
'before' => '<div class="welcome-feature-1">',
'after' => '</div>',
) );
genesis_widget_area( 'welcome-feature-2', array(
'before' => '<div class="welcome-feature-2">',
'after' => '</div>',
) );
genesis_widget_area( 'welcome-feature-3', array(
'before' => '<div class="welcome-feature-3">',
'after' => '</div>',
) );
echo '</div><!-- end .wrap --></div><!-- end .welcome-features --></div><!-- end .welcome -->';
}
}
There is a new update coming soon that automatically does what you’re trying to do. Wes sent me the updated version but it’s still in beta so it’s not available just yet. The code above is what I just copied from the new version. If you haven’t made any other changes to your home file, try and replace your code with the code above. If I were you, I’d do it from FTP and not the WordPress editor just in case a mistake is made.
I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com