Forums

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

How do I modify CSS for a single Confluence Cloud page?

JimmyVanAU
Rising Star
Rising Star
Rising Stars are recognized for providing high-quality answers to other users. Rising Stars receive a certificate of achievement and are on the path to becoming Community Leaders.
November 9, 2016

I'm trying to draft brand guidelines and ideally would like the page to be stylised in the recommended font styling. I'm using Confluence Cloud, and have noted that CSS is generally not allowed, according to https://confluence.atlassian.com/confcloud/restricted-functions-in-confluence-cloud-734070955.html.

However, I have noticed that if I use the default {style} macro and add:

body {
    font-family: "Open Sans", sans-serif;
}
.wiki-content, .wiki-content p, .wiki-content table, .wiki-content tr, .wiki-content td, .wiki-content th, .wiki-content ol, .wiki-content ul, .wiki-content li {
    font-family: "Open Sans", sans-serif;
}
h1 {
	font-weight: 300;
}
.monospace {
    font-family: "Roboto Mono", monospace;
}

and at the beginning I import the following font:

https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Mono, so:

2222.png

and

1111.png

then the preview looks beautiful:

3333.png

As soon as one saves though, it returns back to normal.

4444.png

Does anyone know why this is happening/does anyone know how else to insert CSS?

1 answer

1 accepted

2 votes
Answer accepted
Stephen Deutsch
Rising Star
Rising Star
Rising Stars are recognized for providing high-quality answers to other users. Rising Stars receive a certificate of achievement and are on the path to becoming Community Leaders.
November 11, 2016

Hi Jimmy,

It appears that the Confluence Macro parser engine converts all quotation marks (") to html quote strings ("), which aren't read properly by the browser. I tried removing the quotes around all of the font names, and it appeared to work, at least in Chrome. It's not ideal but maybe it will work for you too.

JimmyVanAU
Rising Star
Rising Star
Rising Stars are recognized for providing high-quality answers to other users. Rising Stars receive a certificate of achievement and are on the path to becoming Community Leaders.
November 13, 2016

Works like a charm in both Firefox and Chrome smile Thanks!

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events