Helpcentrum Kolibri en Housenet Housenet Handleidingen

            Landingspagina bij website template Sjors

            Website template Sjors heeft één voorgedefinieerde lay-out voor een landingspagina. In dit artikel vind je aanvullende informatie over het gebruik van deze lay-out.

            Onderdelen landingspagina


            CSS

            De ladingspagina maakt gebruik van het CSS-bestand wat ook gebruikt wordt voor de normale website. Zo is het eenvoudig om snel de stijl van de normale website over te nemen.

            Logo en menu

            Deze landingspagina gebruikt het normale logo en menu van de website. Hierdoor is het voor de makelaar vrij eenvoudig om zelf een landingspagina toe te voegen. 

            Landing header (tekstblok 1)

            Hier is het mogelijk om een afbeelding te plaatsen die afwijkt per pagina. Hieronder de code die hiervoor gebruikt kan worden. De tekst kan door middel van de opties in het tekstblok gepositioneerd worden. 

            1. <div class="background lazy" data-bg="url(//hayweb.blob.core.windows.net/public/m54qnw/2-beta/slide2.jpg)" style="text-align: center;"></div>
              <div class="text" style="text-align: center;">
              <div class="container">
              <h3>{{organisation.name}}</h3>
              <h1>Hier komt de titel van je landingspagina</h1>
              <h4>De all-in verkoopmakelaar!</h4>
              <div class="cta-wrapper"><a class="btn btn-primary btn-lg" href="#">Ik wil een verkoopmakelaar</a></div>
              </div>
              </div>
             

            Landing subheader (teskstblok 2)

            Deze tekst verschijnt direct onder de header. Hier kan een extra alinea opgenomen worden (of andere elementen). Deze worden vormgegeven door het toevoegen van HTML. 

            Hoofdtekst

            Deze ruimte kan gevuld worden door middel van het hoofdartikel. Ook hier in kan HTML worden gebruikt om het blok vorm te geven. Let op! Dit blok is de enige die standaard een container bevat.

            Tekstblokken 3 tot en met 7

            Deze kunnen gevuld worden met HTML om de blokken vorm te geven. 

            Landing footer (tekstblok 8)

            Deze ruimte kan gevuld worden door middel van het tekstblok. Ook hier in kan HTML worden gebruikt om het blok vorm te geven.
            Alle blokken zullen de volledige breedte van de pagina benutten. Wil je dit niet dan zal je per blok een container toe moeten voegen. Zie als voorbeeld de HTML-code van de header. Alle blokken zijn te stylen via het customer stylesheet en hebben alle een aparte unieke classname. 

            Bijgewerkt: 05 Dec 2019 11:22 AM
            Nuttig?  
            Help ons met het verbeteren van dit artikel
            0 0