Theming FirstClass Web Services 12.1
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
Wishlisted Wishlist

Please confirm that you want to add Theming FirstClass Web Services 12.1 to your Wishlist.

Add to Wishlist

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
Created by Stewart Lynch
Last updated 2/2015
Price: $50
30-Day Money-Back Guarantee
  • 2 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • 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
View Curriculum
  • 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

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.

Who is the target audience?
  • This course is meant for current FirstClass administrators or web administrators and designers
Students Who Viewed This Course Also Viewed
Curriculum For This Course
29 Lectures
2 Lectures 04:28

A welcome and introduction to the course instructor

Preview 01:09

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

Preview 03:19
Course Tools and Background Information
5 Lectures 19:13

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.

Preview 02:42

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

Preview 02:05

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

Preview 02:37

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.

Pick your Flavor

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.

Starting and Stopping fcws
FirstClass Web Services Themes
4 Lectures 20:42

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.

Changing 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

jQuery ThemeRoller and fcws

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

Picking your Color Palette

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

Creating your own Theme
Modifying Graphics
4 Lectures 17:28

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.

fcws Images

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

Modifying the brand.png

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.

Modifying Sprite Images

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

Modifying other images
Customizing CSS
7 Lectures 35:23

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.

Modifying CSS in the Browser

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

The custom.css Stylesheet

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

Customizing the Login Form

A continuation of modifying css for the root pages.

Customizing Root Pages

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

Using the Suggested CSS Changes.css file

Add a transparent graphic to the home screen.

Adding an image to the home screen

Add a background color and graphic to the login page.

Modify the Login Page
Custom Icons
4 Lectures 12:54

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

Custom PNG Icons

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

Extracting Legacy FirstClass Icons

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

Batch Icon Harvesting - Mac/Linux

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

Batch Icon Harvesting - Windows
FirstClass GO Theme Application
2 Lectures 08:09

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

What theme elements apply to FirstClass GO

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

Customizing the FirstClass GO login screen
Dealing with Upgrades
1 Lecture 07:59

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

The Upgrade Process and what to look for
About the Instructor
Stewart Lynch
0.0 Average rating
0 Reviews
7 Students
1 Course

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.