QwikZite.Net - QwikZite Users Manual

QwikZite Users Manual

QwikZite.Net: knowledge and support network for QZ users

Introduction

QwikZite at a glance

Access procedures

General functions

Menu Sitestyle

Menu Sitestyle input fields

Menu Page

Menu Button

Menu News

Menu Link

Menu Foto

Menu File

Menu Topic

Menu Defaults

Structure of the site

Working with sitestyles

Working with buttons

Limitations of the web

Working with fonts

Working with colors

Working with images

Working with backgrounds

Working with sizes

Working with HTML

Working with webtext

The first steps

Explanatory notes to the input fields

Quick menu:
- by moving the mouse pointer over the image, the area names become visible;
- by clicking in an area you can quickly navigate to the explanatory notes of the area concerned;
- by clicking on the icons in the right column of the table you will return to the quick menu.


ID & WORKING TITLE
ID:	The ID (identification number of the sitestyle) is automatically generated.
Working title:	The working title is not visible at the frontend. At the backend the sitestyles are listed in alphabetic order of working title.

SITE AREA
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.
Color of hand-made links:	Color of hyperlinks, if not yet visited. See also Working with colors and Palette of safe colors.
Color of hand-made links (visited):	Color of hyperlinks, after having been visited. See also Working with colors and Palette of safe colors.
Color of hand-made links (active):	Color of hyperlinks at the moment that they are selected by the visitor. See also Working with colors and Palette of safe colors.

TOP AREA
Height:	Height of the area in pixels. Entering the value 0 will make the TOP AREA non-existent. The subareas of the TOP AREA will automatically have the same height. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

LOGO LEFT AREA
Width:	Width of the area in pixels. Entering the value 0 will make the LOGO LEFT AREA non-existent. The width of the LOGO LEFT AREA doesn't necessarily need to correspond with the width of the TOP DIVIDER MOST LEFT or BUTTON AREA. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Logo (image):	Version 1.09: The image is automatically resized to height and width of the LOGO LEFT AREA. Version 1.10: The image is displayed in real size, horizontally and vertically centered in the LOGO LEFT AREA. See also Working with images.
URL:	By entering an URL, the LOGO (image) will become a hyperlink. Enter the URL, including: http:// in case of a web location, e.g. http://www.qwikzite.com mailto: in case of an email address, e.g. mailto:info@qwikzite.com
Text:	If you like, you can enter a text, e.g. name and address. The text is only visible at the frontend if nó LOGO (image) is entered.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

TOP AREA LEFT DIVIDER
Width:	Width of the area in pixels. Entering the value 0 will make the TOP AREA LEFT DIVIDER non-existent. The width of the TOP AREA LEFT DIVIDER doesn't necessarily need to correspond with the width of the TOP DIVIDER LEFT or LEFT DIVIDER. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TITLE AREA
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.
Title image:	Input of a title image makes page titles no longer visible. Version 1.09: The image is automatically resized to height and width of the TITLE AREA. Version 1.10: The image is displayed in real size, horizontally and vertically centered in the TITLE AREA. See also Working with images. Tip: If you want to suppress the display of page titles without displaying a specific title image, you can do that by entering a transparent image as title image. You can download such an invisible image here: clear.gif.
URL:	By entering an URL, the TITLE IMAGE will become a hyperlink. Enter the URL, including: http:// in case of a web location, e.g. http://www.qwikzite.com mailto: in case of an email address, e.g. mailto:info@qwikzite.com

TOP AREA RIGHT DIVIDER
Width:	Width of the area in pixels. Entering the value 0 will make the TOP AREA RIGHT DIVIDER non-existent. The width of the TOP AREA RIGHT DIVIDER doesn't necessarily need to correspond with the width of the TOP DIVIDER RIGHT or RIGHT DIVIDER. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

LOGO RIGHT AREA
Width:	Width of the area in pixels. Entering the value 0 will make the LOGO RIGHT AREA non-existent. The width of the LOGO RIGHT AREA doesn't necessarily need to correspond with the width of the TOP DIVIDER MOST RIGHT or NEWS AREA. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Logo (image):	Version 1.09: The image is automatically resized to height and width of the LOGO RIGHT AREA. Version 1.10: The image is displayed in real size, horizontally and vertically centered in the LOGO RIGHT AREA. See also Working with images.
URL:	By entering an URL, the LOGO (image) will become a hyperlink. Enter the URL, including: http:// in case of a web location, e.g. http://www.qwikzite.com mailto: in case of an email address, e.g. mailto:info@qwikzite.com
Text:	If you like, you can enter a text, e.g. name and address. The text is only visible at the frontend if nó LOGO (image) is entered. Tip: This is a suitable field to enter a horizontal navigation bar, as applied in this online manual. It can be done in a relatively simple way, by including a series of internal hyperlinks in the text.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

TOP DIVIDER AREA
Height:	Height of the area in pixels. Entering the value 0 will make the TOP DIVIDER AREA non-existent. The subareas of the TOP DIVIDER AREA will automatically have the same height. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TOP DIVIDER MOST LEFT
Width:	Width of the area in pixels. Entering the value 0 will make the TOP DIVIDER MOST LEFT non-existent. The width of the TOP DIVIDER MOST LEFT doesn't necessarily need to correspond with the width of the LOGO LEFT AREA or BUTTON AREA. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TOP DIVIDER LEFT
Width:	Width of the area in pixels. Entering the value 0 will make the TOP DIVIDER LEFT non-existent. The width of the TOP DIVIDER LEFT doesn't necessarily need to correspond with the width of the TOP AREA LEFT DIVIDER or LEFT DIVIDER. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TOP DIVIDER MIDDLE
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TOP DIVIDER RIGHT
Width:	Width of the area in pixels. Entering the value 0 will make the TOP DIVIDER RIGHT non-existent. The width of the TOP DIVIDER RIGHT doesn't necessarily need to correspond with the width of the TOP AREA RIGHT DIVIDER or RIGHT DIVIDER. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

TOP DIVIDER MOST RIGHT
Width:	Width of the area in pixels. Entering the value 0 will make the TOP DIVIDER MOST RIGHT non-existent. The width of the TOP DIVIDER MOST RIGHT doesn't necessarily need to correspond with the width of the LOGO RIGHT AREA or NEWS AREA. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

MAIN AREA
Height:	Height of the area in pixels. The height value shall be the minimum height; if the area content is getting larger, the area height will automatically adapt. Entering the value 0 will make the MAIN AREA non-existent. The subareas of the MAIN AREA will automatically have the same height. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

BUTTON AREA
Width:	Width of the area in pixels. Entering the value 0 will make the BUTTON AREA non-existent. The width of the BUTTON AREA doesn't necessarily need to correspond with the width of the LOGO LEFT AREA or TOP DIVIDER MOST LEFT. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

BUTTONS (BUTTON UP)	BUTTON UP (state of the buttons while not pressed) contents is aligned left in de BUTTON AREA.
Height:	Height of the BUTTON UP in pixels. The height value shall be the minimum height; if the content is getting larger, e.g. a long button text jumping to a next line, the BUTTON UP height will automatically adapt. The minimal value is 1. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.
Image befóre button-text:	Small image to be shown befóre the button-text (e.g. an arrow, bullet or small logo). See also Working with images.
Image áfter button-text:	Small image to be shown áfter the button-text (e.g. an arrow, bullet or small logo). See also Working with images.

BUTTONS (BUTTON DOWN)	BUTTON UP (state of the pressed/active button) contents is aligned right in de BUTTON AREA.
Height:	Height of the BUTTON DOWN in pixels. The height value shall be the minimum height; if the content is getting larger, e.g. a long button text jumping to a next line, the BUTTON DOWN height will automatically adapt. The minimal value is 1. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.
Image befóre button-text:	Small image to be shown befóre the button-text (e.g. an arrow, bullet or small logo). See also Working with images.
Image áfter button-text:	Small image to be shown áfter the button-text (e.g. an arrow, bullet or small logo). See also Working with images.

LEFT DIVIDER
Width:	Width of the area in pixels. Entering the value 0 will make the LEFT DIVIDER non-existent. The width of the LEFT DIVIDER doesn't necessarily need to correspond with the width of the TOP AREA LEFT DIVIDER or TOP DIVIDER LEFT. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

CONTENT AREA
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

TEXT AREA
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.

LINK AREA
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	See Working with colors and Palette of safe colors.
Font face (link):	The link titels are the true links in the LINK AREA, and are automatically displayed in 'bold'. If you want to make more distinction between link title and short link text, you can enter here a different font face for the link title. Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size (link):	Font size of the link titles. Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color (link):	Font color of the link titles. See Working with colors and Palette of safe colors.

RIGHT DIVIDER
Width:	Width of the area in pixels. Entering the value 0 will make the RIGHT DIVIDER non-existent. The width of the RIGHT DIVIDER doesn't necessarily need to correspond with the width of the TOP AREA RIGHT DIVIDER or TOP DIVIDER RIGHT. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.

NEWS AREA
Width:	Width of the area in pixels. Entering the value 0 will make the NEWS AREA non-existent. The width of the NEWS AREA doesn't necessarily need to correspond with the width of the LOGO RIGHT AREA or TOP DIVIDER MOST RIGHT. See also Working with sizes.
Background color:	Not visible if a background image is entered, unless parts of that image are transparent. See also Working with colors and Palette of safe colors.
Background image:	Image is shown in true size, repeated or partly. See also Working with backgrounds.
Font face:	This font face will be applied to all elements of the news item: The 'header' (title) of the news item is automatically displayed in 'bold'. The short text of the news item is displayed in default font style. The 'read more' text is displayed in default font style. The 'header' and 'read more' can be given deviating font properties in input fields following beneath. Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size:	This font size will be applied to all elements of the news item. Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color:	This font color will be applied to all elements of the news item. See Working with colors and Palette of safe colors.
Font face (header):	Font face of the title of the news item, if you want to deviate from the default NEWS AREA font face. Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size (header):	Font size of the title of the news item, if you want to deviate from the default NEWS AREA font size. Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color (header):	Font color of the title of the news item, if you want to deviate from the default NEWS AREA font color. See Working with colors and Palette of safe colors.
Read more:	Text automatically displayed as hyperlink beneath the short version of each news item, to refer to the long version. The text is only displayed if a long version is available. E.g.: Read more .... The same text is displayed in the list on the NEWS PAGE, behind the news page titles. Tip: In the 'Defaults' menu, a default 'read more' text can be defined for the whole site. In any sitestyle and in any page you can deviate from this default setting. See also Menu 'News'.
Font face (read more):	Font face of the 'read more' text, if you want to deviate from the default NEWS AREA font face. Provide multiple alternatives, e.g. Verdana, Arial, Helvetica, sans-serif See also Working with fonts and Text samples of common webfonts.
Font size (read more):	Font size of the 'read more' text, if you want to deviate from the default NEWS AREA font size. Permitted sizes: 1 - 7 See also Text samples of common webfonts.
Font color (read more):	Font color of the 'read more' text, if you want to deviate from the default NEWS AREA font color. See Working with colors and Palette of safe colors.
Maximum number of news items (short version):	The (maximum) number of news items (short version) to be displayed in the NEWS AREA, for preventing (too) long pages. Entering the value 0 will display áll items. Tip: In the 'Defaults' menu, a default number can be defined for the whole site. In any sitestyle and in any page you can deviate from this default setting. See also Menu 'News'.

NEWS PAGE	The NEWS PAGE is the page where the long versions of the news items are displayed. The style of the news page is identical to the style of a normal page.
Page title:	Title of the newspage. Tip: In the 'Defaults' menu, a default news page title can be defined for the whole site. In any sitestyle and in any page you can deviate from this default setting. See also Menu 'News'.
Maximum number of news items (long version):	The (maximum) number of news items (long version) to be fully displayed on the NEWS PAGE. Beneath these full versions, the titles of the other items will be displayed in a clickable list. To prevent (too) long pages: try to find a good balance between the number and length of the items. Entering the value 0 will display áll items. Tip: In the 'Defaults' menu, a default number can be defined for the whole site. In any sitestyle and in any page you can deviate from this default setting. See also Menu 'News'.

Developed with QwikZite (version 1.12)