Styling a single page with CSS

Harley Flanagan June 26, 2012

Hi!

I thought i've already read something about the possibility to customize even single pages.
Unfortunately a can't find the info anymore if i am not even wrong at all.

So here's the humble question:

- Is there a possibility to style single or special pages in Confluence Wiki (Version 4.0)?
- Where can i find documentation on this special topic?

What i want to achieve:

In my case i would like to place a background picture into the Blog-Summary-Page. But i can't find any special page IDs or something to let this happen.

Now i created a DIV-Container inkl. ID within the custom HTML-Section. But of course this picture shows up on every wiki-page now when i don't have something unique to connect with.
Or is this something I need to solve via Javascript? (hopefully not ^^)

thanks in advance
(sorry for my buggy english)

3 answers

2 votes
Davin Studer
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.
May 5, 2017

An easier way would be to add the html macro to your page and then you can put in some CSS only for that page. Be default the HTML macro is turned off, so you would need to enable it.

1 vote
Steffen Heller
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.
April 6, 2014

@KP11:

Use {span} or {div} macro, define a background colour and put the one word inside the macro.

0 votes
Deleted user July 1, 2012

I've never seen docs that relate to styling a single page like that (which is not to say they don't exist, just that I've never seen them :)

You can certainly create CSS that works over an entire space - https://confluence.atlassian.com/display/DOC/Styling+Confluence+with+CSS

You could also edit all the stylesheets that Confluence uses and insert some special stuff of your own, but

(a) they're cascading stylesheets and are really complex

(b) you absolutely need to know what you're doing before you attempt anything like that

(c) do it in a test version, not your production wiki

(d) you need to have access to the server where they're stored -- (edited note): Sorry, just noticed that you're talking about On Demand - you won't be able to do any of that stuff. My bad!

Harley Flanagan July 4, 2012

Hi, just for people that might search for the same question.

I solved my question above with Javascript in the html head section.

		<SCRIPT type="text/javascript">
			<!-- 
			URL = document.URL;
			list = URL.split('/');
			candidate = list[list.length-1].split('.')[0];
			
			if (candidate == 'yourdesireduniquewordinyoururladressbar') {
				document.write('HelloWorld');
				document.write('<link rel="stylesheet" type="text/css" href="yourstlye.css">');
			}
			
			
			
			-->
		</SCRIPT>

the script is looking for a unique keyword in the addressbar. if its there your css will be loaded.

as for single pages.. depends on your user-rights.. you can insert a html-macro within the page.

Like # people like this
KP11
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.
February 27, 2014

Is there code to just highlight the background of one word in the sentence?

Peter J. Kootsookos July 28, 2014

One minor speeling errur [sic] : "yourstlye" --> "yourstyle". Otherwise, nice script!

Like # people like this

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events