Del

Guide: advanced customization


The Ensemble Folder

The Ensemble FolderEnsemble is your website´s resource area. It contains data files you can use to extend or modify design and functionality for your website, and is also a storage space for global objects like your logo, FavIcon and Widgets.

Anything you put in Ensemble is not published in your site hierarchy, is not searchable, and will not be indexed by Google (unless you change or delete the robots.txt file in your website root).

Active files in Ensemble are linked to their respective switches in FirstMagic Preferences, and can be opened directly from there.



  • CustomCSS is for Skin development; use it to build and store a customized layout if you want to write it by hand. It comes with examples ready to use.
  • Services is for all your HTML include files - code that can change or extend your website´s capabiities.
  • logo_example.png is the FirstMagic logo - you can replace it with your own.
  • favicon.ico is your favicon file (the tiny logo in the browser´s address bar) - you can replace it with your own.
  • SiteWidgets stores all your Website Footer Widgets.
  • SignWidgets stores all your Digital Signs Footer Widgets.
CustomCSS

CustomCSS holds the stylesheets that is activated if you select CustomCSS as the FirstMagic Skin in Preferences > SkinDesigner. Else, they do not do anything. You can use these files to design your own FirstMagic Skin if you want to go further than what can be done with the built-in SkinDesigner. There really is no limit to what kind of layout you can create here.

CSS is a standard language for building web layouts. Any professional web designer will know what to do with these files, and can help you produce a custom Skin. No FirstClass know-how is needed at all for this task.

Styles.css defines the layout and design of the website.

Mobilestyles.css defines the layout and design for handheld devices.

Signstyles.css defines the layout and design for Digital Signs.

The first time you open any of these files, they will contain a working, exenstively commented example. This is a Starter Kit to let you familiarize yourself with FirstMagic CSS tags. It is recommended that you make a copy for later reference before doing any changes.

Note that if you follow the principles documented in the code, your finished Skin will work together with the SkinDesigner (allowing you to use the SkinDesigner to move elements around on the page and turn them on/off). This can be disregarded if you are not planning on using such features.

To install a third party Skin, simply remove everything in Ensemble > CustomCSS and replace it with your new Skin resources. Specificially, drag the contents of a Skin folder from your hard drive into this container.

Services

Services: contains include files you switch on in FirstMagic Preferences. They are used to insert third-party content, or to extend the website functionality and layout in other ways.

Two of them are special - Homepagefooter and Homepageheader: these are normal FirstClass Documents. The others are HTML includes.

By utilizing the Services Includes, you can extend the website in all kinds of ways - by adding banner ads, Google Ads, inline ads, extra content sidebars, headers or footers, custom menus, or third-party services of any kind.

Services files Overview

Homepageheader adds an extra content area just below the Top Menu on the Homepage. You do not need to use code here, but can fill it with regular FirstClass content.

Homepagefooter adds an extra content area to the bottom of the Homepage. You do not need to use code here.

websiteheader.inc adds a HTML area over (or behind) the logo area on all pages. It is the perfect spot to insert banner ad code.

websitebottom.inc adds a HTML area to the bottom of all pages.

websitewing.inc: adds a HTML area that generates a column to the right of all pages. It has a max-width of 180 pixels.

customsidebar.inc: adds a HTML area  to the top of your regular sidebar.

Ensembleterms.inc: is for language customizations: it replaces the default website terms if you activate it in the language field on Tab 1 in FM Preferences.

Meta.inc is for metadata: it will insert code between <head></head> in the website rendering templates. This is for stuff like meta tags or javascripts that third-party services needs to output in that location - not for anything that would be visible on your website.

SiteWidgets

Any Widget placed here becomes available in your Web Page Footers. You can turn all Widgets  on/off at once in FM Preferences [Advanced Options], and you can also turn each Widget on/off individually by double-clicking it and unchecking the Active Checbox in it´s configuration panel.

SignWidgets

Like SiteWidgets, but for your Digital Signs.