Forums

Articles
Create
cancel
Showing results for 
Search instead for 
Did you mean: 

How do I change the link color in the pdf export?

Debbie Augusteyn June 18, 2013

I am tying to set up a pdf stylesheet and want to change the color of hyperlinks to red. I have added the code below to the stylesheet but it has no effect. How can I change the hyperlink color.

.wiki-content a, .wiki-content a:link, .wiki-content a:visited, .wiki-content a:focus, .wiki-content a:hover, .wiki-content a:active {
color: #D21034!important;
}

2 answers

1 accepted

0 votes
Answer accepted
David at David Simpson Apps
Atlassian Partner
June 18, 2013

Try something simpler, e.g.

 

a {
    color: hotpink !important;
}

Likely the wrapping div.wiki-content is omitted from the PDF view.

Edit: Added the !important override for support in Confluence Cloud PDF exports

Debbie Augusteyn June 19, 2013

Thanks David - this worked.

David at David Simpson Apps
Atlassian Partner
June 19, 2013

Great. If it worked, mark it as answered ;)

1 vote
Ralph Bolton
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
August 12, 2020

I couldn't get the colour to change to anything other than the default black. I was able to add some text decoration to at least underline the hyperlinks though:

a {
text-decoration: underline;
}
W. Oosting
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
September 18, 2020

I second this notion (using Confluence cloud edition).

The following has no effect:

a
{
    color: hotpink;
}

but this does have an effect:

a {
text-decoration: underline;
}

It feels like a Confluence bug in the interpretation of the CSS style sheet and/or that color specifically is overruled somewhere later in the process.

Thom Castermans
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
September 18, 2020

It looks indeed like the color is set somewhere else, but adding `!important` will make the declaration stick. In other words, this works:

a {
color: hotpink !important;
}

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events