How to change HTML page title per page?

Hi,

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>
#else
  <title>$title - #siteTitle()</title>
#end

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

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";
</script>

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);

}(jQuery))

Suggest an answer

Log in or Sign up to answer
Atlassian Community Anniversary

Happy Anniversary, Atlassian Community!

This community is celebrating its one-year anniversary and Atlassian co-founder Mike Cannon-Brookes has all the feels.

Read more
Community showcase
Kesha Thillainayagam
Posted Apr 13, 2018 in Confluence

We want to hear how your non-technical teams are using Confluence!

Hi Community! Kesha (kay-sha) from the Confluence marketing team here! Can you share stories with us on how your non-technical (think Marketing, Sales, HR, legal, etc.) teams are using Confluen...

2,945 views 27 12
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