Configure the look and feel

The Look and Feel screen allows you to configure your WHD screen with style sheets and logos. By applying a style sheet to your deployment, you can render the user interface, client interface, and company invoices with your corporate branding.

Add your company logo to the user interface

The Logo will display on the login page, the header of the Client interface, and at the top of e-mails sent from WHD.

  1. Locate a PNG or GIF image file for your logo.

    For the classic style sheet (CSS), the image should be 259 x 61 pixels. Otherwise, the image height should be 70 pixels or less.

  2. Log in to the WHD Administrator Console as an administrator.
  3. Click Setup > General > Look and Feel.

    The Look and Feel page displays.

  4. Click Add File and select the logo image file.

  5. Click Save.

    Your company logo displays in the Logo field.

    The Logo will display on the login page, the header of the Client interface, and at the top of e-mails sent from WHD.

Add your company logo to invoices

  1. Log in to the WHD Administrator Console as an administrator.
  2. Click Setup > Parts & Billing > Invoicing Options.

    Click the Logo tab.

  3. Click Choose File and select the logo image file.

  4. Click Upload.

    The Logo will display at the top of all invoices sent from WHD.

Install and apply a new style sheet template

  1. Click Style Sheet Gallery.

    Click the tooltip for details about rendering the style sheet.
  2. In the Web Help Desk (WHD) forum on THWACK, review the CSS template options.

    Click an option to review the template.

  3. At the bottom of the CSS template page, click the link to display the CSS code on your screen.

    For example:

    Click the down-arrow to download the file in ZIP format to your system.

  4. Copy the content of the CSS file to the clipboard.
  5. In the Client Style Sheet row, select Custom and click Edit CSS to open the CSS editor.

  6. Remove any existing content in the editor (if available).

  7. Paste the template code into the editor.
  8. Select Replace Default CSS and Compress.
  9. Click Update to refresh the panel with parameters from the new template.
  10. Review the new style sheet implementation at the bottom of the page.

  11. Adjust the Header, Help Desk Name, and remaining settings to suit your needs.

  12. Click Save to activate the new style sheet.