Support Center

From Cerberus Helpdesk Wiki

Jump to: navigation, search

Contents

Overview

The Cerb4 Support Center (SC) is the public face of your helpdesk. While your staff logs into the private helpdesk, your community and customers can use the Support Center for things like searching your knowledgebase and opening new tickets. You can create any number of Support Centers to serve different sub-communities (based on brand, product, language, region, etc).

Our most important design consideration with the Support Center was to make it simple to configure and deploy them. Rather than being a separate application that shares the database, the Support Center is simply one file that you can upload to any server (supporting PHP4 or PHP5) -- you don't have to host the portal on the same server as your helpdesk. In most cases, when you upgrade your helpdesk files the Support Center functionality will automatically be updated everywhere.

This design has a cost of 'hack' flexibility (you can't directly edit code when you deploy copies of the Support Center), but the upside is anybody can deploy public support portals to existing websites without programming knowledge. For people with programming experience, who have a very specific vision for their public support interface, the Web-API is a better option.

As of 4.2, the Support Center also supports plugins. Anyone can create and share new modules for the Support Center menu (e.g. chat, licenses, billing history).

Installation

Installing a new Support Center is incredibly easy:

  • Log in to your helpdesk as a superuser.
  • Click 'helpdesk setup' in the top right.
  • Select the 'Community Portals' tab. (If it doesn't exist, click 'Features & Plugins' and enable 'Cerberus Helpdesk: Community Portals').
    Image:c4wiki_sc_communities.png
  • Add a new Community if an applicable one doesn't exist already. Even though by default the Support Center is the only Community Portal, new types of portals can be developed (bug tracking, surveys, etc). A Community groups several portals together to make management easier. At WebGroup Media we define our communities as each website (Cerb4.com, PortSensor.com). As an aside, the websites at http://www.cerb4.com and http://www.portsensor.com are actually Community Portals developed as Cerb4 plugins just like the Support Center.
  • After selecting your Community, select 'Support Center' from the 'Add a New Community Portal' dropdown. Click 'Save Changes'.
  • Customize your new Support Center. This is covered in more detail below.
  • Copy the index.php and .htaccess files to your webserver from the 'Installation' section at the bottom.

You can see our official Support Center in action at: http://www.cerberusweb.com/support/

Modules

  • Home: A welcome page that allows custom HTML content. You can use this as a start-page for self help to direct visitors to all your resources.
  • Announcements: Displays all your RSS feeds (e.g. wiki changes, forum posts, blog posts, Twitter)
  • Knowledgebase: Provides public browsing of selected Knowledgebase topics.
  • Open Ticket: Allows visitors to open new tickets.
  • Ticket History: Allows visitors to browse their past + current tickets.
  • Registration: Allows visitors to register a support account. Support Center functionality can be configured to require login, and if you offer paid support you can hide public registration to ensure only paid customers have access.
  • My Account: Allows visitors to update their basic account information.
  • ...and more: The Devblocks framework in Cerb4 allows you to expose any other information you want to the Support Center on a per-portal basis.

Configuration

Branding

  • Portal Name: A nickname given to this portal to distinguish it from other Support Centers.
  • URL to Logo: The URL of a logo to display at the top of this Support Center.
  • Page Title: The title to display in the browser for this Support Center.
  • Style CSS: Stylesheet customization for this Support Center. This is explained in the next section below.
  • Footer HTML: The content to show at the bottom of the Support Center. Typically this displays additional contact information and links.
    Image:c4wiki_sc_branding.png

Styles

The Support Center uses a simple stylesheet for fonts and colors. Each portal can have its own color scheme to match your particular brand or corporate identity.

If you view the source of your Support Center in your browser, you will find the stylesheet at a relative path similar to: /support/resource/usermeet.core/css/sc/default.css

For example, you can view the stylesheet from our public Support Center: http://www.cerberusweb.com/support/resource/usermeet.core/css/sc/default.css

Using standard CSS syntax you can override any of these styles to personalize your Support Center.

Below are several examples for popular color schemes. You can enter these into the 'Style CSS' section when editing your Support Center:

Blue

/* Blue */
H1 { color: rgb(8,90,173); }
TABLE.sidebar { width:220px; border: 1px solid rgb(8,90,173); }
TABLE.sidebar TH { background-color: rgb(8,90,173); }
TABLE.sidebar TD A { color: rgb(7,39,115); }
Image:c4wiki_scskin_blue.png

Green

/* Green */
H1 { color: rgb(8,173,30); }
TABLE.sidebar { width:220px; border: 1px solid rgb(8,120,30); }
TABLE.sidebar TH { background-color: rgb(7,173,30); }
TABLE.sidebar TD A { color: rgb(7,120,30); }
Image:c4wiki_scskin_green.png

Orange

/* Orange */
H1 { color: rgb(255,93,45); }
TABLE.sidebar { width:220px; border: 1px solid rgb(248,139,0); }
TABLE.sidebar TH { background-color: rgb(248,139,0); }
TABLE.sidebar TD A { color: rgb(60,60,60); }
Image:c4wiki_scskin_orange.png

Red (Fire Engine)

/* Fire Engine Red */
H1 { color: rgb(206,22,32); }
TABLE.sidebar { width:220px; border: 1px solid rgb(206,22,32); }
TABLE.sidebar TH { background-color: rgb(206,22,32); }
TABLE.sidebar TD A { color: rgb(60,60,60); }
Image:c4wiki_scskin_red.png

Red-Violet

/* Red-Violet */
H1 { color: rgb(173,8,90); }
TABLE.sidebar { width:220px; border: 1px solid rgb(173,8,90); }
TABLE.sidebar TH { background-color: rgb(173,8,90); }
TABLE.sidebar TD A { color: rgb(60,60,60); }
TABLE.sidebar TD A.selected { text-decoration:none; color: rgb(153,8,90); }
Image:c4wiki_scskin_redviolet.png
Personal tools