De sectie schermvullend
Secties zijn de richtlijnen voor het framework van je pagina. Zo kun je meer invloed krijgen op de layout van je website. In deze tutorial leggen we je uit hoe de sectie schermvullend werkt.
Sectie toepassen
We gaan er in deze tutorial van uit dat je de basis kent van het indelen van een pagina en je weet hoe je een contentblok toevoegt. Heb je dit nog niet gedaan, en weet je niet hoe dit moet? Lees dan de Pagina indelen tutorial.
Het is een trend om je website een afbeelding (zoals hierboven) mee te geven die het volledige scherm vult en er een pakkende titel of uitdrukking op te plaatsen. Veel van onze websites maken al gebruik van de header carrousel, waar het mogelijk is een pakkend beeld met het logo en een slogan of naam van de club toe te voegen.
Nu hebben we bij het type van een sectie schermvullend toegevoegd, dit is een sectie wat er voor zorgt dat je content de volledige breedte van het scherm neemt. Deze optie kan je toepassen door een nieuwe sectie toe te voegen, of een al bestaande sectie aan te passen en het type te veranderen naar schermvullend.
Let op! Dit is alleen mogelijk op pagina's die geen gebruik maken van een pagina layout met zijbalken, deze stel je in bij de club-instellingen of je kiest ervoor om een template te pakken zonder zijbalken.
Het is een trend om je website een afbeelding (zoals hierboven) mee te geven die het volledige scherm vult en er een pakkende titel of uitdrukking op te plaatsen. Veel van onze websites maken al gebruik van de header carrousel, waar het mogelijk is een pakkend beeld met het logo en een slogan of naam van de club toe te voegen.
Nu hebben we bij het type van een sectie schermvullend toegevoegd, dit is een sectie wat er voor zorgt dat je content de volledige breedte van het scherm neemt. Deze optie kan je toepassen door een nieuwe sectie toe te voegen, of een al bestaande sectie aan te passen en het type te veranderen naar schermvullend.
Let op! Dit is alleen mogelijk op pagina's die geen gebruik maken van een pagina layout met zijbalken, deze stel je in bij de club-instellingen of je kiest ervoor om een template te pakken zonder zijbalken.
Content toepassen
Deze sectie zal het vaakst gebruikt worden om een afbeelding over de volledige breedte toe te voegen. Dit kun je doen door er een toe te voegen met het afbeelding contentblok, met het beamer contentblok of een Knop (met afbeelding).
Als je een schermvullend beeld toe wilt passen, zorg er dan voor dat je goede foto's maakt voor op je website die gemaakt zijn met een fototoestel en niet met je telefoon. De afbeeldingen moeten minimaal 1920px breed zijn om scherp getoond te worden. Als je een kleinere afbeelding toevoegt zal deze wazig en pixelig overkomen.
Houd ook rekening met de hoogte van je afbeelding/foto, onderaan de pagina wordt hier meer informatie over gegeven.
Bij het toevoegen van de content vul je de volgende gegevens in:
De meeste foto's die je met een fototoestel maakt zullen groter zijn dan 1920px en dan is het noodzakelijk om ze te schalen naar 1920px breed, zodat het bestand niet te groot is om het te kunnen uploaden in Club-assistent en het houdt de snelheid van je website goed. Dit kan je gemakkelijk doen met beeldbewerkingsprogramma's op je computer zoals Photoshop of met een resize programma op het internet.
Let op! als je bij het beamer blok de knoppen aan zet dan zal je afbeelding maar 1430px breed zijn ipv de 1920px.
Bij een beamer blok is de hoogte standaard 400px, bij het album blok weergave presentatie (met schuiven): 750px, afbeelding (vergrootte presentatie): eigen keuze in hoogte met een maximale hoogte van 750px. Houdt hier dus rekening mee als je een afbeelding aanpast of schaalt. Let wel op dat je bij het album blok geen foto's van verschillende hoogtes toevoegd, want dit zal niet mooi ogen en verspringt de content.
Als je nu afbeeldingen hebt toegevoegd kun je op het potloodje van de afbeelding klikken en dan krijg je links een voorvertoning van je afbeelding hoe deze getoont zal worden. Rechts zie je dan het formaat staan met de verhouding van de afbeelding. Voor het beamer blok is 19:4 standaard voor schermvullend van 1920x400 pixels.
Als je een schermvullend beeld toe wilt passen, zorg er dan voor dat je goede foto's maakt voor op je website die gemaakt zijn met een fototoestel en niet met je telefoon. De afbeeldingen moeten minimaal 1920px breed zijn om scherp getoond te worden. Als je een kleinere afbeelding toevoegt zal deze wazig en pixelig overkomen.
Houd ook rekening met de hoogte van je afbeelding/foto, onderaan de pagina wordt hier meer informatie over gegeven.
Bij het toevoegen van de content vul je de volgende gegevens in:
| Afbeelding | Klik op bestand kiezen om een afbeelding op je computer te zoeken. Zorg dat de afbeelding minimaal 1920px breed is en met de hoogte bepaal je zelf wat je wil laten zien. De afbeelding wordt vaak vanuit het midden geschaald. Het kan dus zijn dat er links en rechts delen van je afbeelding afgesneden worden op smallere schermen. Houd daar rekening mee bij het selecteren van afbeeldingen. Let op! in Club-assistent zijn geen bestanden te uploaden die groter zijn dan 10mb. |
| Afbeelding titel | Voeg hier de titel in van je afbeelding, dit is zodat google weet wat voor afbeelding je hebt toegevoegd. Deze titel wordt niet bij je afbeelding getoond. |
| Link naar url | Hier kan je linken naar een andere website of naar een pagina in je website. Als je alles invult wat achter het domein komt in de link (op deze website is dit bijvoorbeeld: support.club-assistent.nl/) linkt de website automatisch door naar een pagina van jou website (interne link). |
| Knop tekst/label | Vul hier de tekst in die je wilt tonen op de knop. |
| Tekst over Afbeelding (beamer) | Vul hier de gewenste tekst in die je nog over de afbeelding heen wilt hebben geschreven. |
De meeste foto's die je met een fototoestel maakt zullen groter zijn dan 1920px en dan is het noodzakelijk om ze te schalen naar 1920px breed, zodat het bestand niet te groot is om het te kunnen uploaden in Club-assistent en het houdt de snelheid van je website goed. Dit kan je gemakkelijk doen met beeldbewerkingsprogramma's op je computer zoals Photoshop of met een resize programma op het internet.
Let op! als je bij het beamer blok de knoppen aan zet dan zal je afbeelding maar 1430px breed zijn ipv de 1920px.
Bij een beamer blok is de hoogte standaard 400px, bij het album blok weergave presentatie (met schuiven): 750px, afbeelding (vergrootte presentatie): eigen keuze in hoogte met een maximale hoogte van 750px. Houdt hier dus rekening mee als je een afbeelding aanpast of schaalt. Let wel op dat je bij het album blok geen foto's van verschillende hoogtes toevoegd, want dit zal niet mooi ogen en verspringt de content.
Als je nu afbeeldingen hebt toegevoegd kun je op het potloodje van de afbeelding klikken en dan krijg je links een voorvertoning van je afbeelding hoe deze getoont zal worden. Rechts zie je dan het formaat staan met de verhouding van de afbeelding. Voor het beamer blok is 19:4 standaard voor schermvullend van 1920x400 pixels.