Changing Links w/out Changing Accent Color

Homepage Community Forums Aspire Theme Support Changing Links w/out Changing Accent Color

Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #21538
    mrimpossible
    Customer

      Hi –

      I set the accent color to #012549 because it looks great on teh homepage.

      The problem is i think the rest of the posts also inherit this color for the links – and against black text, the #012549 doesn’t show up well.

      Is there a way that I can 1) Change the link accent color to be lighter blue or 2) change it so that the background goes to #012549 on hover (and turn text to white) rather than just have the text go dark blue?

      #21550
      Wes
      Moderator

        Can you post a link to the pages where this is happening?

        The color you set in the Customizer is supposed to automatically become the default color of the entire theme (like a Theme Color/Skin selector). But if you have certain parts of the site you want to change (like a widget area on the homepage, or any other section of the site) we can add in some custom code that overrides it.

        Just let me know what color and which section you want the links to be changed in and I can show you how to do it.

        #21553
        mrimpossible
        Customer

          Hey Wes,

          For example on this page – https://impossible.org/wedohardstuff/

          There’s several links in the body area, but you can’t really see any of them – none of them stand out – because what looks good on the front page looks really similar to black if there’s not a lot of it (impossible.org).

          I’d like to have them at least be blue-underlined before clicking and then maybe something on the hover?

          #21558
          Wes
          Moderator

            To make them stand out in the content you can add an underline like this –

            a {
                text-decoration: underline;
            }

            And you can also make the links bold by adding a font-weight (500, 600, or 700) –

            a {
                font-weight: 500;
            }

            Or you can do both.

            If you want to change the hover color, look around line 190 in your CSS or search for this –

            a:hover,
            a:focus {
                color: #333;
                text-decoration: none;
            }
          Viewing 4 posts - 1 through 4 (of 4 total)
          • You must be logged in to reply to this topic.