KompoZer 0.8 pre-release -
Stylesheets (Section 4 of user Guide)
This edition is based on KompoZer 0.8b1
Editing CSS files
Using CSS editor
Prior to version 0.8 KompoZer always started a CSS file with the comment line
/* Generated by KompoZer */
From version 0.8 that has changed. There is no comment line and, what is more, if you edit the CSS file using an external editor to add comments these will be removed if you later make changes to the file using the CSS editor.
Using text editor
Apart from the CSS editor KompoZer 0.8 adds a text editor which can be used to edit CSS files manually. Those who have a good knowledge of the CSS language may like this feature, it allows unrestricted editing so you can reformat and comment the file to make maintenance easier. The only limitation is that, if you later open the file using the CSS editor, all the comments will be stripped out and all formatting will be restored to the default state.
To use this editor, in the Site Manager select a view that includes CSS stylesheets and double-click the name of the stylesheet.
The content of the stylesheet will appear in a new tab in the main window as shown in figure 1.
Figure 1
Once opened, the file may be edited like any other text file.
To save the file do not click the save button. (If you do so an Alert window will open and, if you click OK, the file will be converted to HTML which is something you do not want.) Instead just close the window (using the red X) and you are presented with an option to save.
After making changes to a stylesheet remember that, to see the effect in any open HTML file which links to it, you have to revert the html file.
Remember this is just a text editor. It does not do any checking on the accuracy of the code but this can be an advantage because it allows you to enter code that is out of the scope of KompoZer's CSS editor. This includes the parts of CSS2 which are not covered and also of course CSS3. It is also possible to reformat or comment the file as you prefer as in the example in the figure.
Figure 2
Using an external editor
Alternatively while still in this text editor the external editor remains available (via the HTML button). If you choose to use this the external text editor will open. This may give you a better environment in which to edit. It can include for instance line numbering and context colour as illustrated in Fig 2 using Notepad++ [Ref 1].
Notepad++ usefully colours comments, selectors, properties and values differently but otherwise just acts as a text editor.
As already mentioned KompoZer may be set to use any external editor you choose. See Preferences (9) for the method.
An editor which you may like to use is Komodo Edit [Ref 2]. This is also available free of charge and like Notepad++ provides selective colouring, as illustrated in Figure 3, but it also offers additional advantages.
Figure 3
- Provides syntax colouring
- Supports CSS2 and at least some of CSS3
- Has code completion guides for selectors, and properties
- Checks values for validity
- Marks invalid rules and offers hints for corrections
- Offers comprehensive find and replace
Thus, while you obviously need to know more about CSS than you do to use KompoZer's built-in CSS editor, you don't have to have complete competence in CSS and you are probably guaranteed equally valid CSS using either method.
Remember that, while these editors allow you to reformat and comment stylesheets, if you edit any stylesheet using the built-in CSS editor all comments will be stripped and formating restored to the default.
