Tuesday 22nd August, 2017    Search:
      Not logged in
List of Tags

in the use by the Build-a system


See Build-a.com/ts/weblogs for more examples

These are details of everything that is possible using the system, which generally is anything you can think of. If we do not provide a suitable Tag then you can drop into HTML by employing the [html] Tag and then write html until you are finished and then employ [/html] to end that choice

List of Tags

Plug-in Tags
aphorism
bbcnews
date
email
saying
streetmap
usercount
weather

Plug-in Forms Tags
emailform
loginform

Box, Table & Iframe Tags
box
cell
hr
iframe
row
table

Text Alignment & Positioning Tags
blink
bold or b
center or centre
italic or i
justify
left
marquee
pre
right
sub
sup
ticker
tt
underline or u

Text Enhancement Tags
color or colour
face
font
nobr
size
spanstyle
style

Page or Data Transfer Tags
download
link
window

Image Related Tags
area
flash
image
map
thumbnail

List Related Tags
bulletted or bulleted
droplist
item
list numbered
list or list bulletted or list bulleted
numbered
selection

Coding Related Tags
code
comment
html
jump
label
loggedin
notloggedin
toc

OpeningParams & ContentClosing

Plug-in Tags

[aphorism]
A random aphorism and its author is chosen from the database and displayed. The editor can choose font characteristics before this tag. The aphorism is actually displayed inside an iframe 
[date param]
coded string - which contains the characters that are either interpreted or displayed
h = hour
m = minute
s = second
d = day (number)
D = day (ordinal)
e = day name (short)
E = day name (long)
n = month (number)
N = month name (short)
O = month name (long)
y = year (short) - 2 digits
Y = year (long) - 4 digits
other characters including spaces - are displayed
Notes
Spaces and the cases of characters are significant.
A leading zero before those parameters that are numbers will force those numbers less than ten to have a leading zero.
BST, or GMT or UT can be used as text strings because none of these characters are in the list of those that will be interpreted.
This defines the content and format of the date and time presentation. The editor can choose the font characteristics before this tag
 
[saying params]A random saying is chosen from the client's database and displayed. The editor can choose the font characteristics before this tag
This is more fully explained in its own page of documentation
 
[bbcnews]An area is created that contains a clickable tickertape of the current BBC news - and some links to other news areas. Having clicked, the user is taken to the BBC news web site 
[weather]An area is created that contains a clickable summary of the weather in ten cities around the UK. Having clicked, the user is taken to another web site with all the UK and world weather information 
[email param]to="email address" - of intended recipient
These Tags usually surround the name of the recipient as a 'link' for a user to click on to send an email to that person. The user's default email service is invoked to handle the email message.
Example: [email to="chris@build-a.com"]Chris Taylor[/email] - Chris Taylor - would send an email to me!
[/email]
[streetmap params]postcode="- postcode" - in its two parts, of the relevant address e.g. HP16 0BE
title="address text" - this text is shown at the top of the map - e.g. We are at 102-104 High Street, Great Missenden, Bucks
These Tags usually surround the postcode of the address as a 'window link' for a user to click on to see the StreetMap.co.uk map of the immediate area of that postcode in another window.
[/streetmap]
[usercount]This tag gives the count, starting from the beginning, of unique visitors to the site. The count is not incremented when a user re-logs in as they are not unique the second time in – the system ‘lays’ a cookie on the user’s site which is checked when that user connects. This tag just returns a number that you can format however you wish. However, sites with cookies turned off count as a new visitor every time they look at a page - such as the search engine 'bots'. 

Plug-in Forms Tags
[emailform params]email="email address" - of intended recipient in your company.
Note that this can be a groupname of a group of email addresses (or multiple email addresses and/or groupnames separated by commas))
rows="number" - of rows to be used to allow input into the simple message area
color or colour - name or hex number of the colour of the text on the outside of the form
form="input form name" - displays the multi-field form specfied and sends all the completed data rather than just a simple message to the email address(es) - all the row and column sizes are dictated by the form data, any row data specified as a parameter is ignored
This shows an email form requesting the name & email address of the sender (supplied if they are logged in) and a message area to be completed by the user or multiple fields if this is specified with a form. The email is sent to the address stipulated by the parameter - usually someone at the client who can deal with the problem or suggestion or request
Note: The form, if used, is an input form that is named and maintained using the site editing features
 
[loginform]The system will display a page for the user to login, register or change their password 

Box, Table & Iframe Tags
[box params]face="name of font face" - see the notes below
color=" or colour="hex number"
size="number of 'pt' or 'em' or text" - see the notes below
class="name of style" - predefined style detailing font face, size and colour and other characteristics
width="number of pixels or %"
height="number of pixels or %"
padding="number of pixels"
spacing="number of pixels"
border-style="name" - see the separate note on border-styles below
border-size="number of pixels"
border-color="hex number"
background="hex number or imagename"
This defines the characteristics of the box - which is really a single row, single cell table
[/box]
[table params]face="name of font face" - see the notes below
color=" or colour="hex number"
size="number of 'pt' or 'em' or text" - see the notes below
class="name of style" - predefined style detailing font face, size and colour and other characteristics
width="number of pixels or %"
height="number of pixels or %"
padding="number of pixels"
spacing="number of pixels"
border="0 (off) or 1 (on)" - 1 turns on the internal borders around cells
border-style="name" - see the separate note on border-styles below
border-size="number of pixels"
border-color="hex number"
background="hex number or imagename"
This defines the characteristics of the table which contains rows and cells
[/table]
[row params]height="number of pixels or %"
rowspan="number of rows"
background="hex number or imagename" - overrides any table setting
This defines the characteristics of the row
[/row]
[cell params]width="number of pixels or %"
height="number of pixels or %" - overrides any row setting
align="left, right or center" - horizontal alignment
valign="top, bottom, middle or baseline" - vertical alignment
rowspan="number of rows"
colspan="number of columns"
background="hex number or imagename" - overrides any row or table setting
This defines the characteristics of the cell
[/cell]
[iframe params]page="full url, path and filename of the web page wanted, preceded by http://"
width="number of pixels or %" - use 100% to fill the body section width (except the padding - which you can turn off by specifying a local stylesheet called .bodyCell with padding: 0px )
height="number of pixels or %" - use a figure that will effectively fill the screen depth remembering the heading area, or 100% to reflect the orginal web page depth
This displays the entire web page selectd within the confines of the body section
 
[hr params]width="number of pixels or %"
height="number of pixels"
This defines a horizontal line of a specified width and height
 

Text Alignment & Positioning Tags
[justify]This displays the contained text and objects aligned in a justified manner - both the right edge and the left edge are vertical and parallel and the contents are microspaced to make them fit correctly[/justify]
[center] or [centre]This displays the contained text and objects be aligned in the center[/center] or [/centre]
[left]This displays the contained text and objects be aligned to the left[/left]
[right]This displays the contained text and objects be aligned to the right[/right]
[sub]This displays the contained text as a subscript[/sub]
[sup]This displays the contained text as a superscript[/sup]
[bold] or [b]This displays the contained text in a bold style[/bold] or [/b]
[underline] or [u]This displays the contained text underlined[/underline] or [/u]
[italic] or [i]This displays the contained text in an italic style[/italic] or [/i]
[blink]the text contained is displayed blinking (but only in Netscape). The editor can choose font characteristics before this tag[/blink]
[marquee]the text contained is displayed in a scrolling format. The editor can choose font characteristics before this tag and also, using a box, can constrain the width[/marquee]
[ticker]the text contained is displayed in a teleprinter format. The editor can choose font characteristics before this tag and also, using a box, can constrain the width[/ticker]
[tt]This displays the contained text in a mono-spaced font (Courier) without formatting - omitting linefeeds that may be in the original[/tt]
[pre]This displays the contained text in a mono-spaced font (Courier) without formatting - includng linefeeds and spaces in the original[/pre]

Text Enhancement Tags
Stylesheets generally are recommended to apply to blocks of text that should share some common attributes.

You can see all the dozens of variety of property options that aome browsers allow to be specified in stylesheets on the w3c.org (World Wide Web Consortium's page).

This can be a little complex for many but you can use the simple face, size and color tags - or the combined tag called font where all three attributes can be set on-the-fly.
[style param]stylesheet name - name of selected stylesheet
Most suitable for Titles and Subtitles. This displays the contained text using the named stylesheet within a DIV statement and so produces some white space above the contained text and a blank line under the contained text. These stylesheets are either ones like 'title' and 'subtitle' (which may have been supplied to you) or names of others that you added in the main stylesheet for the site or in the additional style sheet on the page
[/style]
[spanstyle param]stylesheet name - name of selected stylesheet
Most suitable for applying text formatting to part of a paragraph or sentence. This displays the contained text using the named stylesheet within a SPAN statement and applies the stylesheet formatting commends on the contained text without separating it from its implied position. These stylesheets are either ones like 'title' and 'subtitle' (which may have been supplied to you) or names of others that you have added in the main stylesheet for the site or in the additional style sheet on the page. Note we normally supply special stylesheets - like: dropcap (can be used to make the leading capital letter of a paragraph be twice as tall as normal and descend into the line below) - to give you special effects
[/spanstyle]
[font params]face="name of font face" - see the notes below
size="number of 'pt' or 'em' or text" - see the notes below
color=" or colour="hex number or color name"
This displays the contained text in the face, size & color specified
Note: Closing this Tag will close the effect of all the font related Tags
[/font]
[face param]name of font face - see the notes below
This displays the contained text in the face specified
Note: Closing this Tag will close the effect of all the font related Tags
[/face]
[size param]number of 'pt' or 'em' or text - see the notes below
This displays the contained text in the size specified
Note: Closing this Tag will close the effect of all the font related Tags
[/size]
[color param] or [colour param]hex number or color name
This displays the contained text in the color specified
Note: Closing this Tag will close the effect of all the font related Tags
[/color] or [/colour]
[nobr]This forces the contained text to be displayed without line breaks, so the browser cannot decide arbitarily to split the text over several lines
[/nobr]

Page or Data Transfer Tags
[link params]page="full URL or name" of any page in the system
The contained descriptive text is highlighted to allow the user to click their mouse button here.
The full URL name is used as a link to another system which will replace the current system - users have to use their browser's back button to get back to here. If the parameter is another page name in the current system then the current page is replaced by the page indicated - this may invoke changes in the logo, the heading and/or the menu as well.
[/link]
[window params]page="full URL or name" of any page in the system
plain="yes" to remove the buttons, address bar, status bar, etc of the new window.
width="width of window" in pixels
height="height of window" in pixels
top="position of window" in pixels from the top of the screen
left="position of window" in pixels from the left of the screen
The contained descriptive text is highlighted to allow the user to click their mouse button here.
The full URL name is used as a link to another system but in a new version of the browser. If the parameter is another page name in the current system then a new version of the browser is invoked with the page indicated being shown. Users have to close their browser to get back to here.
[/window]
[download params]file="full URL or name" of any file in the system
The contained text - usually a description of what is to be downloaded - is highlighted to allow the user to click their mouse button here.
The full URL path and filename (preceded by http://) is used as the source of information for the users to download. If a simple filename is used the information is found in the client's 'images' directory and is downloaded to the user
[/download]

Image Related Tags
[map params]name="name of map data" - This name is used as the usemap name in the Image Tag to reference the named Areas (see the Area Tag below) which themselves must be contained with these opening and closing Map Tags.
[/map]
[area params]shape="name of shape" - shapes can be rect (for retangle), circle (for circle) or poly (for polygon).You can use default to mean the entire image area. If areas overlap the last to be specified takes priority.
coords="coordinates" - The number and order of values depends on the shape being defined. Possible combinations:
rect: left-x, top-y, right-x, bottom-y.
circle: center-x, center-y, radius. Note. When the radius value is a percentage value, user agents calculate the final radius value based on the associated object's width and height. The radius should be the smaller value of the two.
poly: x1, y1, x2, y2, ..., xN, yN. The first x and y coordinate pair and the last should be the same to close the polygon. When these coordinate values are not the same, user agents will infer an additional coordinate pair to close the polygon.
Coordinates are relative to the top, left corner of the object. All values are lengths. All values are separated by commas.
link="path and filename - or page name"
OR
window="path and filename - or page name" - the page name of the page on the site or a full url path and filename (with the leading http://) of the destination after the user clicks in the specific area.
These assign link or window commands to specified areas on the imagemap - the commands may be click activities or be invoked by making the mouse hover over the specific parts of the image
This defines an area on the - to be specified image - that will respond to the user's mouse clicks or movements
[/area]
[image params]width="number of pixels"
height="number of pixels"
align="alignment" - left or right
text="text" - this text is displayed when the mouse hovers over the image
usemap="mapname" - this makes use of a previously introduced imagemap of the name - mapname - that assigns link or window commands to specified areas on the imagemap. The commands may be click activities or may be invoked by making the mouse hover over the specific parts of the image
file="path and filename" - the path and filenmae are the route to the image file relative to the client's own images directory on the site or a full url (with the leading http://) of an image elsewhere on the web
This displays the specified image, but note that the image will be squashed or stretched to fit the specified width and height - if both are specified
 
[thumbnail params]width="number of pixels" - of the thumbnail
height="number of pixels" - of the thumbnail
text="text" - this text is displayed when the mouse hovers over the image
quality="number" - the quality is measured as 1 (very poor) to 100 (very good) and affects the quality of the thumbnail image.
top="number" - this is the top position, in pixels, of the window that will be launched when the thumbnail is clicked on
left="number" - this is the left position, in pixels, of the window that will be launched when the thumbnail is clicked on
file="path and filename" - the path and filename are the route to the original image file relative to the client's own images directory on the site or a full url (with the leading http://) of an image elsewhere on the web (a maximum 500kb image is permitted)
crop="x1,y1-x2,y2” or “x1%,y1%-x2%,y2% - this defines a rectangle as pixel positions or percentage positions of the top-left and bottom-right corners of a rectangle on the original image
align=”left - (or right or center or centre) – Adjacent text will flow to the right of or the left of the thumbnail image (centre makes the text be above and below the image)
page=”path&name - this will make the thumbnail link to that page rather than to the larger image of itself. This enable the thumbnail image to be generated as normal but call a full page window of the desired content. A full page means there is no ‘furniture’ to allow access to the location bar or menus that normally surround a window.

Another variant is to say page=”none” – so the main image is used just as an thumbnail image without linking to anything else – this is just a quick way to have a small sized image without having to worry what size the original is.

Tip: If you want the thumbnail image to launch a ‘window’ in the conventional way you can use the thumbnail like you would an image with the command surrounded by [window page=”somewhere”][thumbnail page=”none” …][/window] construct (with the page parameter in the thumbnail set to ‘none’)

This displays a thumbnail image of the specified image, but note that the image will be squashed or stretched to fit the specified width and height - if both are specified. When the user clicks on the image they will see a new window launched with the larger original image displayed.

This tag will show as an image but clicking on it will show the larger image in a new window starting at (top,left). The thumbnail image will have been generated and stored (in a database table) with the path & name of the main image, together with the other information that defines the size, border, shadow etc. The thumbnail image specified is looked up first and used if it exists, else it is generated and stored then used.

If the path and filename are to an image obtained from off our system then it will be checked to be less than 500kb before we permit that image to be thumbnailed by us.
 
[flash params]width="number of pixels"
height="number of pixels"
align="alignment" - left or right only
file="path and filename" - the path is the path and name of the flash image file relative to the client's own images directory on the site or a full url (with the leading http://) of a flash image elsewhere
This displays the specified flash image
 

List Related Tags
[droplist params]list="List of titles separated by a delimiter"
delimeter="any single character except quotes" - to act as the separator between titles
This displays each one of the contained texts in a drop-down list - selecting one has no particular value but this allows a long list to be included without using much space on the screen
 
[selection params]list="List of titles and <website addresses> separated by a delimiter"- the web addresses have to be enclosed in '<' and '>' and you must use http:// before the website address
delimeter="any single character except quotes" - to act as the separator between titles
This displays each one of the contained texts in a drop-down list - selecting one and pressing the Go button will transfer control into a new window and will run the indicated website
 
[list style="styleparams"] or
[list bulletted style="styleparams"]
or
[list bulleted style="styleparams"]
The styleparams can be anything relevant or omitted - here you might want to specify the margin-left (which affects the positioning of the contained text lines) or the font-style, font-family, color (US spelling only!) etc
The contained lines starting with the [item] tag will be displayed as a bulletted list of entries
[/list]
[list numbered style="styleparams"]The styleparams can be anything relevant or omitted - here you might want to specify the margin-left (which affects the positioning of the contained text lines) or the font-style, font-family, color (US spelling only!) etc
The contained lines starting with the [item] tag will be displayed as a numbered list of entries
[/list]
[bulletted style="styleparams"] or [bulleted style="styleparams"]The styleparams can be anything relevant or omitted - here you might want to specify the margin-left (which affects the positioning of the contained text lines) or the font-style, font-family, color (US spelling only!) etc
The contained lines starting with the [item] tag will be displayed as a bulletted list of entries
[/bulletted] or [/bulleted]
[numbered style="styleparams"]The styleparams can be anything relevant or omitted - here you might want to specify the margin-left (which affects the positioning of the contained text lines) or the font-style, font-family, color (US spelling only!) etc
The contained lines starting with the [item] tag will be displayed as a numbered list of entries
[/numbered]
[item]Each line, within the opening and closing [bulletted] or [bulleted] or[numbered] tags, will be presented in a list 

Coding Related Tags
[code]This displays all the contained text including tags[/code]
[comment]anything - including other tags - can be contained here - so it can be used to exclude certain lines of code[/comment]
[loggedin]anything contained is only executed for those who are logged in[/loggedin]
[notloggedin]anything contained is only executed for those who are not logged in[/notloggedin]
[html]If you cannot find a suitable Tag here but you know you can create a particular construct in HTML directly, then using this pair of tags around your code allows you to switch into HTML (with all the angled brackets <>) to achieve your requirements.[/html]
[label params]name="target name" - name of the label
title="title name" - text to be shown if the 'name' is not adequate for the toc tag
This labels the target for a jump tag or toc tag
OR
groupname="group name" - name of a group to bring together the other labels in the toc tag
 
[jump param]text name - of the label to be jumped to
This highlights the text, contained between the opening and closing tags, as a reference. Clicking on the reference jumps to the position in the page occupied by the corresponding label parameter
[/jump]
[toc param]sorted="yes or no" - directive for the sorting option
This creates an active list of references to all the text positions that have been marked by the label tags in this page. This shows each of the text 'titles' (or if not there, the 'names') that were used in each of the label tags in this page. The special label tags with a 'groupname' present are used to separate the labels into groups. These groups will be sorted alphabetically or not, as directed by the 'sorted' parameter
 

NOTES

Font faces are normally a list, separated by commas, of exact spellings of font faces - such as Arial or Verdana, "Comic Sans MS", Courier - for instance (note the use of uppercase letters where needed and the use of the double quote symbols around names containing spaces - when used inside a double quoted style tag you can use the single quote instead).

The fonts are accessed in sequence from left to right; any character not present in a particular font face will be represented by a suitable character in the next named font face.

--------------o--------------

There are a vast number of style parameters that can be employed when the tag allows styleparams - some of these will only work with some browsers - so be careful.

Examples of these include:
margin-left: 15px;
margin-top: 5px;
font-family: Arial; or font-family: 'Arial Black';
font-style: italic;
color: blue;

You can get the full and very extensive list from the w3c.org website

--------------o--------------

Font sizes are normally measured in points - pt - or in Ems - em.

You can also show text in the form of xx-small, x-small, small, medium, large, x-large, xx-large. Relative sizes smaller or larger can also be used.

--------------o--------------

Border-styles can be one of:-
  • none No border. This value forces the computed value of 'border-width' to be '0'.
  • hidden Same as 'none', except in terms of border conflict resolution for table elements.
  • dotted The border is a series of dots.
  • dashed The border is a series of short line segments.
  • solid The border is a single line segment.
  • double The border is two solid lines. The sum of the two lines and the space between them equals the value of 'border-width'.
  • groove The border looks as though it were carved into the canvas.
  • ridge The opposite of 'groove': the border looks as though it were coming out of the canvas.
  • inset The border makes the entire box look as though it were embedded in the canvas.
  • outset The opposite of 'inset': the border makes the entire box look as though it were coming out of the canvas.
Build-a ServicesSite authors: Nightingale Services