How to move Jira Data Center announcement banner to the top of the page
Platform Notice: Data Center Only - This article only applies to Atlassian products on the Data Center platform.
Note that this KB was created for the Data Center version of the product. Data Center KBs for non-Data-Center-specific features may also work for Server versions of the product, however they have not been tested. Support for Server* products ended on February 15th 2024. If you are running a Server product, you can visit the Atlassian Server end of support announcement to review your migration options.
*Except Fisheye and Crucible
Summary
In Jira Data Center, the announcement banner is placed below the menu bar, while in Confluence it is placed above it.
While a minor change, some customers might wish to have the UI behave the same in both tools.
Solution
This solution is not supported by Atlassian and is provided "as is". Verify in a test environment before applying to production.
Navigate to Administration > System > Announcement Banner
Add this snippet to the announcement banner text:
1 2 3 4 5<script> ab = document.getElementById("announcement-banner"); header = document.getElementById("header"); header.before(ab); </script>
For more advanced examples of customizing Jira using the announcement banner, check How to customize Jira with JavaScript and CSS.
Was this helpful?