qlboot - Documentation

(1) Syntax

Possible entries are e. g. (of course without '):

  • {'row}{'span6}Lorem ipsum ...{/span}{'span6}Lorem ipsum ...{/span}{/row}
  • {'row}{'span4}Lorem ipsum ...{/span}{'span8}Lorem ipsum ...{/span}{/row}
  • {'row}{'span8}Lorem ipsum ...{/span}{'span4}Lorem ipsum ...{/span}{/row}
  • {'row}{'span4}Lorem ipsum ...{/span}{'span4}Lorem ipsum ...{/span}{/row}{'span4}Lorem ipsum ...{/span}{/row}
  • {'row}{'span3}Lorem ipsum ...{/span}{'span3}Lorem ipsum ...{/span}{/row}{'span6}Lorem ipsum ...{/span}{/row}

Explanation: The sum of the numbers behind 'span' adds always up to 12, as the page itself is devided in 12 imaginary cols. The number tells you how much room the generated col will take, e. g. span6 = 6/12 = 0,5 page or; span2 = 2/12 = 1/6 page.

(2) Parameters

(2.1) Use styles:
If this setting is set to yes, the bootstrap framework will be called. If you already use a bootstrap template, set to no.

(2.2) Default
Default setting whether usual bootstrap rows (row-fluid) or flex system is used.

(2.2) Row settings (for straight bootstrap):

  • padding: Padding of div box
  • text-align: alignement of text, i. e. left, right, justify or center

(2.3) Flex settings (for flex boxes):

Alternatively you can use the flex version. For this add type="flex" within your tag.

  • padding: Padding of flex box
  • text-align: alignement of text, i. e. left, right, justify or center
  • mobile switch:
    integer, pixel width, when horizontal flex boxes will switch to vertical alignment

(2.4) Param setting / override within tag:

Within the row tags params can be overridden or be set; these params are:

  • type, values either "row-fluid" or "flex"
  • class, for setting css class
  • id, for setting css id
  • style, for setting additional css style commands

Here some examples:

  • {'row type="flex"}{'span6}Lorem ipsum ...{/span}{'span6}Lorem ipsum ...{/span}{/row}
  • {'row type="row-fluid"}{'span6}Lorem ipsum ...{/span}{'span6}Lorem ipsum ...{/span}{/row}
  • {'row id="someId" type="row-fluid"}{'span6}Lorem ipsum ...{/span}{'span6}Lorem ipsum ...{/span}{/row}
  • {'row class="someClass" style="background:red;"}{'span6}Lorem ipsum ...{/span}{'span6}Lorem ipsum ...{/span}{/row}