How to change HTML page title per page?


I know that the HTML title is defined in the Main Layout decorator. Below is the definition from the default template.

#if ($sitemeshPage.getProperty("page.spacename"))
  <title>$title - $sitemeshPage.getProperty("page.spacename") - #siteTitle()</title>
  <title>$title - #siteTitle()</title>

But I am looking for an easy way to change the HTML title per page. Ideally, a user could do it when editing a page.

Any ideas or recommendations of add-ons?

2 answers

1 accepted

2 votes
Accepted answer

You can create it as User Macro with parameter for page title. Then user can insert macro to page and change it.

## @param Title:title=Title|type=string|desc=Title
<script type="text/javascript">
	document.title = "$!paramTitle";

I hope this will work smile I didnt test it but it should work wink

I tried to add a UserMacro that has a param holding the HTML title, then I extented the if clause above to test whether the param is defined and set the title accordingly. It is not working. It looks like the param is not (yet) defined when it renders the HTML header section. Can you maybe provide a working example?

Davin Studer Community Champion Sep 26, 2014

You would probably want to put the user macro on the page, not in the decorator. The user macro could have a user defined parameter and then just take what the user puts in and change the html title via javascript.

Look at edit. Just add it like another macro :) If you want to use it with Title text in body, delete param and to the script put $body

Davin Studer Community Champion Sep 29, 2014

document.title = "@paramTitle"; should be ... document.title = "$!paramTitle";

Thank you David :) I wrote it on iPad :)

Davin Studer Community Champion Sep 29, 2014

Woah! Brave man ... coding on a tablet.

:D only watched Confluence Answers :).... hmmm some IDE on iPad.... :)

If you don't want to mangle with a mixture of Velocity and JavaScript code, you could do it with JavaScript only (in global HTML, as a user macro or in a plugin):

(function($) {
	function getHtmlTitle(pageTitle) {
		return pageTitle; // or do some logic here
	document.title = getHtmlTitle(AJS.params.pageTitle);


Suggest an answer

Log in or Sign up to answer
Community showcase
Posted Feb 06, 2019 in Confluence

Try out the new editing experience

Hi team, I’m Avinoam, a product manager on Confluence Cloud, and today I’m really excited to let the Community know that all customers can now try out the new editing experience and see some of the ...

926 views 47 7
Join discussion

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you