(Sub)pagina bewerken

1. Klik op de rode knop 'Beheer'.

2. Klik op 'Website' in het menu links en daarna op 'Pagina's'

3. Klik op het potloodje naast de pagina.

4. Bewerk de pagina en klik daarna op 'Opslaan'.

Subpagina (in)actief maken

Om een (sub)pagina (in)actief te maken, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen ( 1 tot 3 ).

4. Plaats de schakelaar 'Pagina actief?' op 'Nee'

Wanneer je een pagina inactief plaatst, kan niemand de pagina zien op de website. De pagina blijft opgeslagen in het systeem en kan dus op elk moment weer actief geplaatst worden.

Tip: Je kan de pagina ook onzichtbaar maken in het menu. De pagina kan dan wel nog terug gevonden worden met een verwijzing vanuit een andere pagina of via directe URL.

Tabel toevoegen

Aan de hand van een tabel kan je een heleboel gegevens toch op een overzichtelijke manier weergeven. Om een tabel toe te voegen aan je pagina, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen
(1 tot 3). Daarna volg je onderstaande stappen.

4. Maak een Excel-bestand met de informatie die je wenst weer te geven.

Voorbeeld: Kolom A: datum, Kolom B: tijdstip, Kolom C: thuisploeg, Kolom D: score, Kolom E: uitploeg

5. Kopieer en plak (dus niet toevoegen als bestand) de ingevulde cellen bij 'Paginainhoud'.

6. Plak onderstaande CSS-code bij “Eigen CSS-regels”. Dit zorgt voor de opmaak van de tabel.

table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 1em;
    border: 0;
}

table tr {
    border: 0;
    outline:0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    margin: 0;
    padding: 0;
}

table tbody tr:first-child td {
    border-top: 0;
}

table tbody td, .tablepress tfoot th {
    border-top: 1px solid #ddd;
}

table .tekst {
    color: #c01d04 ;
}

table td {
    text-align: center;
    padding: 8px;
}

Tekstkleur bewerken

Je kan aan de hand van het thema een tekstkleur instellen. Deze tekstkleur wordt toegepast op alle pagina's. Indien je toch een (stukje) tekst een andere kleur wenst te geven, dan kan je de tekstkleur wijzigen via de teksteditor. Om de tekstkleur te wijzigen, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen. (Stap 1 tot 3)

4. Selecteer de tekst en klik op het icoontje 'Tekstkleur' boven het tekstkader.

5. Klik op de kleur die je wenst te gebruiken.

Tip: Je kan ook de achtergrondkleur van tekst wijzigen. Op deze manier kan je stukken tekst uitlichten. Hiervoor selecteer je de tekst en klik je op het icoontje 'Achtergrondkleur' boven het tekstkader. Daarna kies je een kleur.

6. Klik op 'Opslaan' om de wijzigingen te bewaren.

Foto toevoegen

Indien je een afbeelding in de tekst wenst te plaatsen, dan kan dit zonder gebruik te maken van de fotoslider. Om een afbeelding toe te voegen aan een pagina, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen. (Stap 1 tot 3)

4. Klik op het icoontje 'Afbeelding' boven het tekstkader.

5. Klik op 'Kies bestand' en selecteer een afbeelding op je computer.

Tip: Klik op de afbeelding en neem de rechterhoek onderaan vast en sleep om de grootte van de afbeelding te wijzigen.

Tip: Klik op de afbeelding en daarna op 'Bewerk' om meer instellingen in te geven.

Indien je een link wilt toevoegen, dan geef je de URL in bij het tekstkader 'Link'.
Wanneer gebruikers klikken op de afbeelding, dan zullen ze doorverwezen worden naar deze link.

Indien je wenst dat de link in een nieuw tabblad wordt weergegeven, dan vink je de optie 'Open link in nieuw tabblad' aan.

Kies de positie van de afbeelding. Wil de dat de afbeelding links is uitgelijnd, rechts of gecentreerd?

Klik op 'Opslaan' om de wijzigingen bij de afbeelding te bewaren.

6. Klik op 'Opslaan' om de wijzigingen van de pagina te bewaren.

Video toevoegen

Om een video toe te voegen aan een pagina, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen. (Stap 1 tot 3)

4. Klik op het icoontje 'video' boven het tekstkader.

5. Geef de Embedded code in van het filmpje.

Youtube Bij een video op youtube kan je de embedded code gemakkelijk vinden bij de video. Hiervoor klik je eerst op 'Delen' onder de video.

Daarna vind je de code terug in het tabblad 'insluiten'. Kopieer deze code en plak de code in het tekstkader op Peepl.

Tip: Gevorderden kunnen in deze code de hoogte of breedte van de videoaanpassen in deze code door de width en height aan te passen.

6. Klik op 'invoegen'.

7. Klik op 'Opslaan' om de wijzigingen te bewaren.

Bestand toevoegen

Je kan heel gemakkelijk een document delen op je website. Hiervoor voeg je een document toe. Om een bestand toe te voegen aan een pagina, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen. (Stap 1 tot 3)

4. Klik op het icoontje 'Bestand toevoegen' boven het tekstkader.

5. Geef de naam in en klik op 'Bestand kiezen' om een bestand te selecteren op je computer.

Tip: Geef eerst de naam in en kies daarna het bestand.

Indien je meteen het bestand kiest op je computer, dan zal het bestand meteen geladen worden en kan je de naam niet meer ingeven. Je kan natuurlijk wel de link wijzigen.

Indien je geen naam ingeeft, dan zal de naam van het bestand als naam gebruikt worden.

Om de link naar het bestand te wijzigen, klik je op de naam. Daarna klik je op 'Bewerk'.

Wijzig de tekst of naam van de link en klik op 'Bewerk' om de wijzigingen te bewaren.

Opmerking: Indien je de URL van het bestand wijzigt, dan is het bestand niet meer raadpleegbaar.

Tip: De 'Tekst' is de tekst die zal verschijnen op de website. Als bezoekers klikken op deze tekst, dan kunnen ze het bestand raadplegen.

6. Klik op 'Opslaan' om de wijzigingen te bewaren.

Knop toevoegen

Om een knop met een link toe te voegen aan een pagina, ga je eerst de (sub)pagina bewerken. Hiervoor volg je bovenstaande stappen. (Stap 1 tot 3)

4. Klik op de HTML-tag van een tekstveld om de knop toe te voegen.

5. Kopieer de volgende code het veld:

<a href="link_pagina" class="btn btn-standard" style="background-color: #F05558 !important; border-color: #D84750 !important;">
<span style="color: #fff">naam_van_de_knop</span>
</a>

Pas de tekst aan naar wens:
link_pagina = link naar de webpagina. Die link volgt best dit formaat: https://www.peepl.be (bijvoorbeeld).
naam_van_de_knop = tekst in de knop
Tip: de grootte van de knop past zich automatisch aan aan de tekst erin.

background-color: #F05558 = hoofdkleur van de knop. Vervang #F05558 door het gewenste kleur.

border-color: #D84750 = kleur van de lijn rond de knop. Vervang #D84750 door de gewenste kleur

color: #fff = kleur van de tekst in de knop. Vervang #fff door de gewenste kleur.

Tip: klik hier om de kleurencode te vinden van de kleuren die je nodig hebt.

6. Klik opnieuw op <> om te controleren hoe je knop eruit ziet.

Voorbeeld

<a href="https://www.peepl.be" class="btn btn-standard" style="background-color: #14645a !important;border-color: #082824 !important;">
<span style="color: #d4f4f0">Lees hier meer</span>
</a>

7. Klik op 'Opslaan' om de wijzigingen te bewaren.