GiBi AddCSS is an extension for Joomla that you can use to quickly modify the style of your site.
It is created as a module so you can assign a style to some pages only (more about that later).
There exists a free version and a pro version with advanced features and support.
This quick start guide will help you understand the basic concepts and procedures.
Module creation and assignment
This extension will install as any other Joomla module; the installation process will create an empty instance of the module.
You may create as many instances of AddCSS as you want: this allows you to quickly set different styles for each page.
To assign the module, you can use Joomla module assignment system or any third-party extension.
We use and suggest Advanced Module Manager, from NoNumber, which gives you a lot of matching criteria to assign your module to.
The configuration options should be quite self-explanatory: let's see them anyway in details.
This section are related to the very basic features around which AddCSS was created.
- CSS filename. This option includes an additional CSS file which must be placed in the "css" folder of your active template.
- Style. This option is even quicker: just add some css style to be included in your page.
This section is about making easy and quick for you to do some of the most common style changes.
- Background. This lets you choose an image which will be used as page background. The chosen image will be set at 100% width so be careful about what image you select (more about that later).
The options in this area are only enabled for the PRO version, and let you bring into your document additional power :-)
- Bootstrap. You should already know about Twitter Bootstrap framework. If not, browse on the internet as soon as you can. This option includes an hosted version of Bootstrap into you page (thanks to http://www.bootstrapcdn.com).
- Google Font #1, #2 and #3. These options lets you include up to three Google Web Font by their name. Technically, there is no reason to stop at 3 fonts; but it's not reccomended to have more than 3 fonts in your document anyway.
Tips, tricks and traps
There a few things you need to know to avoid frustration in using this extension.
If you use basic "style inclusion" option, you need to know what CSS priority is.
Depending on the way you write a rule, it may get ignored because there is another, more specific rule in some other place in your site.
We usually get around it by writing very specific rule with lots of element IDs, and/or by using the !important directive.
What we really want you to understand is that a CSS rule may be ignored but this does not mean that AddCSS is broken.
If you get the PRO version you may ask for support in the forum and we will give suggestions.
But please do your homework before.
Additional css and fonts files
Adding more fonts and css files will probably make your site slower, because it has to download additional files.
AddCSS is a nice thing to have because it helps you add them only on the pages that really need them (we wrote a blog article about that).
But even with AddCSS, always use these options carefully.
- usually, you will use AddCSS only for some pages and/or for quick testing different styles
- if you use additional styles / fonts everywhere and always in your site, it may be worth considering a modification of your template
- do not add many additional fonts unless it's really necessary
- remember that you can use different AddCSS modules for different pages, so don't load everything within a single module
Apart from this quick start guide, users with an active subscription can request support via our support forum.
For any other information, like commercial requests, you may contact us from our contact page.