[Resolved] Targeted hyperlink customization

[Rob]

Hi GP guys!

Loving the theme and currently working on the Mellow version.

I have customised my hyperlinks using the following CSS:

body:not(.blog):not(.search-results):not(.archive) .inside-article a {
text-decoration:none;
border-bottom: 1px solid #7bdcb5;
box-shadow: inset 0 -1.5px 0 #7bdcb5;
transition: background 0.1s cubic-bezier(.33,.66,.66,1);
}
body:not(.blog):not(.search-results):not(.archive).inside-article
a:hover {
text-decoration:none;
border-bottom:none;
box-shadow:none;
}

I am not sure if this is good CSS, but it does what I wanted, except I cannot seem to find a way to ensure is does not apply to the date and author (entry-meta?) and also hyperlinks in image captions.

Can you advise on the appropriate CSS that needs to be added to achieve this? The only other CSS I have added that may affect things is this to adjust the caption size:

.wp-block-image figcaption {
text-align: center;
font-size: 14px;
}

I realise that this is perhaps more of a coding question than something specific to GP, but if it’s an easy one to solve, I’d be grateful for any pointers!

Many thanks.

[David]

Hi there,

you could try this:

.single .entry-content a {
    text-decoration:none;
    border-bottom: 1px solid #7bdcb5;
    box-shadow: inset 0 -1.5px 0 #7bdcb5;
    transition: background 0.1s cubic-bezier(.33,.66,.66,1);
}    

.single .entry-content a:hover {
    text-decoration:none;
    border-bottom:none;
    box-shadow:none;
}

This will target <a> tags within the entry-content on single posts only

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Rob]

Superb, David – thank you. That solves the entry-meta problem.

However, I still have the hyperlinks in the image captions underlined. What do I need to do to exclude them from the customization and keep them with the default theme setting?

Regards,

Rob

[David]

Ok so add this to remove them from any captions:

.single .entry-content figcaption a {
    border: unset;
    box-shadow: unset;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Rob]

Thank you so much, David. Worked a treat!

I really appreciate you taking the time to sort this out for me.

Wish you a great day ahead!

Rob

[David]

You’re welcome – glad to be of help

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts