How to Customize Composition Tab using HTML Macro

Summary

This KB requires the Confluence instance to enable the HTML Macro. Enabling these macros will open your Confluence site to cross-site scripting attacks. Do not enable them unless you trust all your users!

You are able to customize the tabs and cloaks using the Composition Setup macro.  However, there are certain limitations such as font style, size and etc.  This can be achieved using the HTML macro.  The following is a sample of customized Composition's tab:

Cause

The Composition Setup has certain limits on customizing tabs.

Workaround

Add an HTML macro on the confluence page and add the following:

<style>
.aui-tabs.horizontal-tabs>.tabs-menu>.menu-item.active-tab a {font-family:Lucida Console; font-style: italic; background-color: lightblue; font-size: 20px;}
.aui-tabs.horizontal-tabs>.tabs-menu>.menu-item a {font-family: verdana; background-color:#F30289; color:white; font-size: 20px;}
</style>