Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Table of Contents

XTRF platform allows you to add your company logo, favicon, custom background, and colors to the Home, Vendor, and Client Portals.

Add your logo

To add your company logo to the, perform the following steps:

  1. Sign in to the XTRF Home Portal.

  2. Go to the (blue star) Configuration menu > General Configuration > Branding > Logo tab.

  3. Hover over the Custom logo card.

  4. Click the Select File … button that appears on the Custom logo card, and upload a PNG or JPEG file from your local machine.

  5. To display the logo publicly, switch to the Custom logo option with the radio button. The changes will be saved automatically.

Logo image requirements:

  • 1920 x 1080 pixels

  • PNG or JPG format.

The logo will be later resized to fit certain fields in the sign-in screens and the top left-hand corner of the Portals (200 x 50 pixels).


Customize the XTRF’s sign-in background

  1. Go to the (blue star) Configuration menu > General Configuration > Branding section.

  2. Go to the desired Portal tab.

  3. Scroll down to the Background card.

  4. Hover over the Custom background card.

  5. Click the Select File … button that appears on the Custom background card, and upload a PNG or JPEG file from your local machine.

  6. To apply the selected background, switch to the Custom backgroundoption with the radio button. The changes will be saved automatically.

Background image requirements:

  • 1920 x 1080 pixels

  • PNG or JPG format.

The background field in XTRF has a 16:9 aspect ratio.


Customize the XTRF’s favicon

  1. Go to the (blue star) Configuration menu > General Configuration > Branding section.

  2. Go to the desired Portal tab.

  3. Scroll down to the Favicon card.

  4. Click the Select File … button that appears on the Custom favicon card, and upload a PNG, JPEG, SVG, or ICO file from your local machine.

  5. To display the new favicon publicly, switch to the Custom favicon option with the radio button. The changes will be saved automatically.

Favicon image requirements:

  • min. 96 x 96 pixels

  • PNG, JPEG, SVG, or ICO format.

The favicon in XTRF has a 1:1 aspect ratio.


Customize the XTRF’s colors

You can change the colors of the following elements:

Home Portal

Vendor Portal

Client Portal

Top navigation menu bar

  • Background color

  • Search bar color

  • Font color

  • Background color

  • Font color

  • Background color

  • Buttons color

  • Font color

Main menu

  • Background color

  • Font color

  • Background color

  • Font color

Main components (buttons, checkboxes, calendar tiles, etc.)

  • Primary color

  • Tabs color

  • Font color

  • Primary color

  • Tabs color

  • Font color

  • Primary color

  • Tabs color

  • Font color

To change the colors, perform the following steps:

  1. Go to the (blue star) Configuration menu > General Configuration > Branding section.

  2. Go to the desired Portal tab.

  3. Scroll down to the Colors card.

  4. Click on the color buttons for specific design elements and select the desired color. You can also use the HEX color code.

  5. For some elements, you can also set the hover effects. Click on the color button, then go to the Hover tab.

    1. Click on the Lighten or Darken option.

    2. Use the percent bar to adjust the effect.

  6. Click on the Preview button in the Colors card top right-hand corner to check how the new colors and effects will look on the selected portal.

  7. Click the Set Colors button to confirm the changes.

  8. Click the Back to default button to restore the default portal colors.

Panel
panelIconId1f4a1
panelIcon:bulb:
panelIconText💡
bgColor#E3FCEF

To check what elements will be affected by the color changes on the selected portal, click the Learn More link on the Color card.