New Color for Links

  • I want to change all of my links, including hyperlinks, to a bright pink color. You can see that the color around my Instagram button is that shade, but I don’t know how to make the rest of my links match to give my blog a more effeminate vibe.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

  • Hello katehal1.

    Thank you for contacting us and for using our theme. We appreciate it.

    This piece of CSS should make all link in that pink colour unless they are targeted by some more directed CSS.
    Please add this to Appearance -> Customize -> Additional CSS:

    a {
	color: #d93175;
}

    Hope this helps but if you have any additional questions, feel free to ask.

    Kind regards.

    Thread Starter katehal1

    (@katehal1)

    Is there a way to change the button color as well? This didn’t help with my menus or any buttons. (I really need to learn more about CSS)

    Well, yes, some CSS knowledge always comes handy, and it is not that complicated to learn either. ??

    This CSS should take care of the Main Menu and buttons:

    .sidebar-column .widget input[type="submit"], .footer-row-columns .widget input[type="submit"] {
	background-color: #d93175;
}
.navbar-default .navbar-nav > li > a {
	color: #d93175;
}
.dropdown-menu > li > a, .sub-menu > li > a {
	color: #d93175;
}
.btn-dark {
	background-color: #d93175;
	border-color: #d93175;
}

    Hope this helps.

    Kind regards.

    Thread Starter katehal1

    (@katehal1)

    It’s almost perfect! Now to figure out why they’re still orange(ish) when highlighted! I appreciate all your help so much!

    If you want to remove all orange(ish) color on link hover you need to add this style:

    a:hover, a:visited, a:active, a:focus,
.sidebar-column .widget ul a:focus, 
.sidebar-column .widget ul a:hover, 
.footer-row-columns .widget ul a:focus, 
.footer-row-columns .widget ul a:hover,
.navbar-default .navbar-nav>.current_page_item>a, 
.navbar-default .navbar-nav>.current_page_item>a:hover, 
.navbar-default .navbar-nav>.current_page_item>a:focus, 
.navbar-default .navbar-nav>.current-menu-parent>a, 
.navbar-default .navbar-nav>.current-menu-parent>a:hover, 
.navbar-default .navbar-nav>.current-menu-parent>a:focus, 
.navbar-default .navbar-nav>.active>a, 
.navbar-default .navbar-nav>.active>a:hover, 
.navbar-default .navbar-nav>.active>a:focus, 
.navbar-default .navbar-nav>.open>a, 
.navbar-default .navbar-nav>.open>a:hover, 
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>li>a:focus, 
.navbar-default .navbar-nav>li>a:hover {
    color: #d93175;
}

    Hope that helps.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘New Color for Links’ is closed to new replies.

Tags