Openstad
  • Introductie
  • Projectmanagement
    • Algemene kaders
    • Participatieprocessen
      • Voorkeurspeiling
      • Wedstrijd
      • Participatief begroten
  • Digitale tools
    • OpenStad CMS basis
      • Inloggen
      • De bouwstenen
      • Live in-page editing
      • Bewerkmodus (Draft)
      • Versiebeheer
    • Participatieprocessen
      • Voorkeurspeiling
      • Wedstrijd
      • Participatief begroten
    • How-to's
      • Nieuwe site aanmaken
      • Nieuwe pagina's toevoegen
      • Pagina's vullen
      • Inzendingen uploaden
      • Inzendingen weergeven
      • Filteren en categoriseren van inzendingen
      • Likes verzamelen
      • Reacties en argumenten
      • Interactieve kaart
      • Polygonen
      • Newsletter
      • Moderatie
      • Unieke stemcodes
      • Stemmen
      • Gebruikersbeheer
      • Gebruikers anonimiseren per website
      • Inzendingen exporteren en importeren
      • Vormgeving & logo aanpassen
      • E-mail notificaties
    • Widgets referentie
      • Accordeon
      • Agenda
      • Arguments
      • Columns
      • Slider
      • Counter
      • Date countdown bar
      • Ideas map
      • Ideeën op een kaart (Kaart applicatie)
      • iFrame
      • Image
      • Info bar
      • Link or button
      • List
      • Like
      • Location
      • Participatory budgeting
      • Keuzewijzer
      • Keuzewijzer resultaten
      • Rich text
      • Resource admin buttons
      • Resource overview
      • Resource form
      • Resource representation
      • Resource raw widget
      • Resource image
      • Speech bubble
      • Share widgets
      • Title
      • User remove form
      • Video upload
      • Video 3d party
      • Vorige volgende knoppen
    • Algemeen
      • Terminologie
      • Waarschuwingen
      • Adminpanel
      • Adminpanel (beta)/React admin
      • Page Settings
      • OpenStad hoofdmenu
        • Tags
        • Global
        • Open palette
        • Clear cache
        • Pages
        • Users
        • Images
        • Files
        • Workflow
        • Logout
      • Styles for the container
      • Interactieve kaart thema iconen
      • Inzendingen (ideas)
      • Artikelen (articles)
      • Gebruikers (users)
      • Authenticatie methodes
      • Rollen
      • URL's
      • Testen
      • Raw
      • Resources
  • Technical documentation (English)
    • Architecture
    • Getting started
    • Deploying to production
      • Kubernetes
      • Installing on Digital ocean with Kubernetes
      • Backups
      • Deploying a custom image
    • Frontend: CMS
      • Apostrophe CMS
      • The Openstad version of ApostropheCMS
      • Using openstad-components
      • Configuration
    • Frontend: Components
      • Use and configuration
      • Publishing
      • Components
        • Choices Guide
        • Ideas On Map
    • Api
      • Site
      • Idea
      • Argument
      • Vote
      • Article
      • Newsletter Signup
      • User
      • Auth
      • Resource & Data permissions
      • Pagination and search
      • Email settings
      • Database migrations
      • API configuration
    • oAuth2
      • Oauth2 configuration
    • Management panel
      • Management Panel configuration
    • Image server
    • Contributing & versioning
    • Git flow
    • Roadmap
Powered by GitBook
On this page
  • Configuratie-opties
  • Basic
  • Toggle section
  • Styling
  • Advanced
  • Tabs
  • Info
  1. Digitale tools
  2. Widgets referentie

Columns

PreviousArgumentsNextSlider

Last updated 3 years ago

Columns is een widget om secties en kolommen te creëren.

Je maakt natuurlijk al columns bij het , maar je kan ook kolommen binnen kolommen maken. Daarmee kan je de pagina precies opmaken zoals je wilt.

Configuratie-opties

Basic

  • Columns: selecteer hoe je deze sectie wilt indelen. Let op: sommige widgets hebben een specifieke column indeling nodig. Indien dit het geval is wordt het benoemd bij de omschrijving van de widget.

Toggle section

  • Show section as toggle-section:

    • No - het is niet open en dicht te klappen.

    • Yes - het is wel open en dicht te klappen (hiermee lijkt het op een accordeon).

      • Title of the toggle-section: welk titel er boven aan de uitklapbare balk staat

      • Toggle-section open by default?: Indien yes, staat deze sectie automatisch open en kunnen gebruikers het dichtklappen. Indien nee, staat deze sectie niet automatisch open en kunnen gebruikers het dus openklappen.

      • Show toggle-section on mobile only: Hiermee kun je instellen dat het aan/uitklap functie alleen voor mobiele gebruikers is. Soms wil je een pagina anders inrichten voor gebruikers op mobiel, want die zien meer informatie geconcentreerd op een kleinere scherm. Met toggle sections kan hun ervaring prettiger worden.

Styling

  • Background color and background image: Hiermee kun je instellen of je een achtergrond foto of kleur wilt gebruiken voor je sectie.

Advanced

  • Margin type:

  • HTML ID:

  • HTML class:

Tabs

  • Tabs: met tabs kun je tabbladen aanbrengen in je column.

    • Edit tabs > Title: vul hier de titel in van je tabblad

    • Area name: Geef ieder tabblad een nieuwe area, oplopend. Dus als je 3 tabs gaat gebruiken, gebruik dan area 1, 2, en 3.

Info

  • Toggle arrow color: selecteer hiermee welke kleur het pijltje is waarmee je een sectie open- en dichtklapt.

Voorbeeld toggle section

Styles for the container: Deze module beschikt over de standaard CSS styling mogelijkheden, zie

Voorbeeld tabbladen
styles for the container.
In dit filmpje zie je hoe je kolommen toevoegt als widget binnen bestaande kolommen
vullen van een pagina