Portal Appearance

Overview

Each customer portal appearance is configurable. You can customize:

Logo
Banner
Footer

The Header color will be inherited from Jira.

Setting Up

Navigate to HelpDesk Settings → Customer Area → Portals → portal → Appearance

1. Set Up Logo

To set up a logo specify the link to the logo file in the Logo section. You can also add a link to the Portal main page to the logo.

Example

CODE

<a href="https://YOUR_JIRA_NAME/secure/hdportal!default.jspa"><img alt="ALT TEXT" src="FILE_PATH"></a>

To show your default Jira logo, copy the file path from System → Look and Feel → Logo (from the context menu).

2. Set Up Banner

To set up a Banner put the relevant html-code in the Banner section.

Example

CODE

<style>

.banner-img {
  position: relative;
  opacity: 1;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("https://images.pexels.com/photos/3631430/pexels-photo-3631430.jpeg");
  height: 200px;
}

.caption {
  position: absolute;
  left: 0;
  top: 43%;
  width: 100%;
  text-align: center;
  color: #000;
}

.caption span.border {
  background-color: #000000;
  color: #fff;
  padding: 10px 105px;
  font-size: 25px;
  letter-spacing: 10px;
}

</style>
<div class="banner-img">
  <div class="caption">
    <span class="border">SUPPORT FOR EVERYONE</span>
  </div>
</div>

3. Set Up Footer

To set up a footer put the relevant html-code in the Footer section. You can also add a link to some resources if required.

Example

CODE

<style>

.footer {
  background-color: black;
}
</style>

<div class="footer">

<p class="portal-descr" style="text-align: center;"><span style="text-align: center; color: rgb(255,255,255);">Powered by HelpDesk for JIRA</span></p>
</div>