Intro Maak document template Datagroepen Voorbeeld uit bibliotheek Het scherm Verzorg de opmaak Stylesheets Paragraaf en koppen Hyperlink instellen Samenvoegcodes Tabellen Afbeelding toevoegen HTML-codes


Standaard opmaak voor jouw documenttemplates probeer je zoveel mogelijk vast te leggen in de stylesheet. Dat is handig omdat wijzigingen in de stylesheet automatisch in alle documenttemplates worden doorgevoerd. Uitzonderingen kun je in de tekst van een documenttemplate aangeven met behulp van HTML codes.

Kijk ook eens op deze sites:
  1. Wikipedia een lijst met HTML elementen.
  2. w3schools.

Tekst opmaak (inline):
<b>tekst</b>tekst
<strong>tekst</strong>tekst
<i>tekst</i>tekst
<i>tekst</u>tekst
<span style="color:red">tekst</span>

Met de span-code kun je een gedeelte van de tekst omklemmen en een andere opmaak geven.		tekst
<br>Enter, ga naar de volgende regel.
<hr>Horizontale lijn.

Tabel:
<table>Tabel
<thead>De titel van jouw tabel.
<tbody>De 'invulling' van jouw tabel. Dit zorgt o.a. voor de opmaak van je document, zoals vastgelegd in de stylesheet.
<th>Rij in de thead.
<tr>Rij in de tbody
<td>Kolom.
      <table>
        <tbody>
        </tbody>
        <tbody>
          <tr>
            <th>Naam:</th>
            <th>Functie:</th>

          </tr>
        </tbody>
        <tbody>
          <tr>
            <td>Simon</td>
            <td>Consultant</td>
          </tr>
          <tr>
            <td>Johanneke</td>
            <td>Teammanager</td>
          </tr>
        </tbody>
        <tbody>
        </tbody>
      </table>

De opmaak van de tabel wordt verzorgd door de stylesheet.
Indien nodig kun je extra opmaak meegeven aan bijvoorbeeld een cel. Dit doe je de <td> HTML-code. Maar, gebruik dit voor uitzonderingen, de standaard opmaakt leg je één keer vast in de stylesheet.
<td style="text-aling:right">
tekst wordt rechts uitgelijnd.
<td style="width:50%">De kolom krijgt een breedte van 50% op de pagina.
Let op: je moet nu ook bij 'table' de breedte aangeven.
<table style="width:100%">
Wanneer je geen opmaak in je tabel wilt start je de tabel met <table class="noborder"> ipv. <table>

Opsommings, genummerde lijsten:
Lijsten kun je maken met een 'unorded list' <ul> of met een 'ordered list' <ol>. In beide gevallen geef je 'list items' aan met de code <li>.
<ul>
          <li>Eerste item uit de lijst</li>
          <li>Tweede item uit de lijst</li>
</ul>
<ol>
        <li>Eerste item uit de lijst</li>
        <li>Tweede item uit de lijst</li>
</ol>

Page-break:
Met deze code kun je een 'page break' instellen. Daarmee zorg je dat er op een nieuwe pagina verder gegaan wordt.
<div style="page-break-after: always"><span style="display:none"></span></div>

Koppen:
Vergroot de leesbaarheid van je tekst met behulp van kopjes en de daarbij behorende witregel(s).
<h1>De hoofdtitel</h1>
<h2>Bijvoorbeeld de paragraaf</h2>
<h3>Subonderwerpen</h3>
<h4>Nog een titel</h4>

De opmaak wordt verzorgd door de stylesheet.
Gebruik de <h1> alleen voor het maken van kopjes/titels, niet om iets groot en vetgedrukt weer te geven. Daar kun je andere HTML-codes voor gebruiken.


Kopiëren van HTML code
Merk je dat jouw document-template niet helemaal naar behoren werkt? En heb je een document-template in jouw trainingsomgeving welke wel werkt?
Dan is het een optie om de HTML code van het document-template uit de trainingsomgeving te kopiëren en te plakken in jouw live omgeving document-template.

Hoe doe je dit?
Ga naar de trainingsomgeving en klik op jouw document-template dat je wilt kopiëren via Werkproces > document-template.
Ga naar tabblad editor. Je ziet nu de Editor verschijnen. Klik op het tabblad langs de Editor : < > html (zie het screenshot hieronder)

Screenshot

Ga nu met je muis op de code staan. Selecteer alle code (dit kan ook versneld met CTRL en A) en doe rechtermuisknop > kopiëren (dit kan ook versneld met CTRL en C).

Ga nu naar de live omgeving naar het document-template die je wilt bewerken via Werkproces > document-template
Ga naar tabblad Editor. Ga naar < >html en selecteer alles (CTRL en A) en delete. Nu plak je de andere code met rechtermuisknop en plakken (dit kan ook versneld met CTRL en V).
Klik op opslaan.

Bijgewerkt tot en met versie 86