Theming FirstClass Web Services 12.1

Giving FirstClass an Identity
0.0 (0 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
7 students enrolled
Instructed by Stewart Lynch IT & Software / Other
Take This Course
  • Lectures 29
  • Length 2 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 2/2015 English

Course Description

In this course you will be taken through all of the steps required to theme, customize and brand your FirstClass Web Services module.

Give your FirstClass installation an identity.

  • Create a color palette
  • Modify Images
  • Add custom images to backgrounds
  • Modify CSS Colors
  • Create custom icons
  • Manage upgrades

Branding is Important

A strong brand begins with a thoughtfully executed and implemented visual identity.

The components of visual identity (logo, colour palette, typefaces and graphic elements) are the basic visual building blocks of a brand. Each element helps identify and differentiate an organization. When applied consistently, a well-executed identity will do more than identify, it will become synonymous with the values, mission and voice of the organization.

Of course, brands are not made overnight. The relationship an organization’s identity creates with the audience is the result of thoughtful and consistent application.

Consistency establishes familiarity – providing the audience with a comfortable reference point for hearing the organization’s message.

Content and Overview

If you are a FirstClass Administrator or Graphics Designer or Web Administrator for your organization then this is a course for you.

In this course you will build a theme for a fictional company and along the way learn the skills required to build a color palette, modify images and customize CSS to change the default FirstClass Theme into one that will better identify the Web Services install with our company.

There are 29 video lectures, each with accompanying resources or links to provide you with everything you need to customize your own site. You will start by learning how to configure a local copy of web services then jump right in by creating a color palette and base theme using jQuery Theme-Roller. You will use GIMP to customize graphics to match your theme and learn how to modify and test CSS colors using Chrome's developer tools.

Students completing this course will be ready to customize and give their own instances of FirstClass Web Services an identity.

What are the requirements?

  • Download and install a local copy of FirstClass Web Services for Macintosh, Linux or Windows.
  • fcws configuration to connect to your FirstClass Server will be covered in the course
  • Students should have a cursory knowledge of HTML and CSS and be able to manipulate graphics in a graphics editor

What am I going to get from this course?

  • Give their FirstClass Server an identity through theming and branding Web Services
  • Configure Web Services on a Mac, Windows or Linux box
  • Create and manage a color palette for your theme.
  • Modify sprite images using GIMP
  • Use Chrome developer tools to modify CSS
  • Add images to login and desktop screens
  • Harvest icons from a legacy FirstClass Server
  • Understand how to manage upgrades

Who is the target audience?

  • This course is meant for current FirstClass administrators or web administrators and designers

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Overview

A welcome and introduction to the course instructor


An overview of what you will learn to do in this course.

Section 2: Course Tools and Background Information

The instructor strongly recommends using Google Chrome as your default browser and as a result will be using it in all lectures. A number of useful, free Chrome plugins will be discussed.


Some knowledge of graphics programs like PhotoShop is desired, but not essential. In this course, the instructor will be using GIMP, a free Open Source graphics editor available for Macintosh, Windows and Linux.

GIMP can be downloaded from


A brief introduction to how the various clients connect to the FirstClass server and customization possibilities.


An introduction to the three different flavors of FirstClass Web Services (Macintosh, Windows and Linux) and how to configure it to connect to your FirstClass Server.


Windows uses a batch file to start FirstClass Web services while the Macintosh and Linux versions of fcws come with a utility called fcwsctl which allows you to quickly start, stop and check the status of your fcws server via the terminal. This lecture will show you how to start and stop the server and how to configure fcws on the Macintosh as it does not come preconfigured by default.

Section 3: FirstClass Web Services Themes

The default theme for fcws is 'firstclass' but a number of other themes are provide as examples. In this lecture you will learn how you can change the default theme.


In this lecture you will learn how to load an existing theme into jQuery-ui ThemeRoller and see which elements apply to the different content areas of the fcws interface.

Link to jQuery-ui ThemeRoller Site

Link to Sublime Text 3 Web Site


Generating a color palette to work from is one of the most important steps in customizing fcws. In this lecture you will discover some tools that can help you discover the right colors for your site.

Link to colorful web site

Color palette for AudioTronics


In this lecture we will begin customizing our fictional AudioTronics site by building and saving a color scheme in jQuery-ui ThemeRoller and applying it to our local instance of fcws.

AudioTronics Color Palette - Take 2,2c4804,4c810b,8fac6d,a2bc84,a4bc8c,acbc8f,c6d5b6,e8eee2,888888,faf2bd

Section 4: Modifying Graphics

In this lecture we will check out the images folder and discover which one can and should be modified and which ones can be left alone.


Change out the brand image to identify your instance of fcws with your company logo.


Two sprite images need to be modified to match the color scheme of your theme. In this lecture the instructor will show you how to use GIMP to modify the sprites.


Following up on modifying the sprite images, this lecture will complete the image modifications by looking at the other images that can be modified.

Section 5: Customizing CSS

A brief introduction to CSS and how you can use chrome's developer tools to modify CSS colors on the fly and see the changes in your fcws theme.


Learn about the custom.css file and how you can use it to permanently apply your color overrides to the fcws theme.


Begin your customization with the login form on the login page.


A continuation of modifying css for the root pages.


Use the Suggested CSS Changes.css file as a starting point for testing modifications to your theme.


Add a transparent graphic to the home screen.


Add a background color and graphic to the login page.

Section 6: Custom Icons

Learn the ideal format and size for a fcws icon and how to install on fcws.


If you have created icons for the legacy FirstClass desktop and web application, learn how you can extract these for use on fcws.


Install a shell script on Mac or Linux to retrieve a range of icons from your legacy FirstClass server.


Install Curl on Windows and use a batch script to retrieve a range of icons from your legacy FirstClass server.

Section 7: FirstClass GO Theme Application

Learn which of your theme elements apply to FirstClass GO, the mobile fcws client for iOS, Android and Windows mobile.


Learn how to add graphics to fcws that will change the FirstClass GO mobile login screen.

Section 8: Dealing with Upgrades

Learn how content is archived and restored when fcws goes through a minor or major upgrade.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

I have been a teacher, administrator, technology director and software developer for over 30 years. For 7 years I was a Senior Services Engineer for FirstClass/OpenText where I was responsible for developing and delivering instructional materials for the FirstClass product suite. I also created over 100 tutorial videos that are available on YouTube on the OTFirstClass YouTube channel.

I have a passion for learning and teaching and currently travel around the world teaching others how to develop software for use with the FirstClass platform.

Ready to start learning?
Take This Course