Elementen zijn de bouwstenen van jouw websitemaker website. In dit artikel zullen wij het "Knop" element toelichten.
Waar kan ik het Knop element vinden?
Hoe plaats ik het Knop element?
Wat kan ik doen met het Knop element?
Waar kan ik het Knop element vinden?
Het "Knop" element is te vinden in het "Elementen" menu, in de linkerbalk van je websitemaker bij de +. Je kan hem terugvinden onder de categorie "Basis" óf het zoekveld gebruiken.
Hoe plaats ik het Knop element?
Je kan het "Knop" element plaatsen door deze te slepen naar de gewenste plek. Simpel dus!
Wat kan ik doen met het Knop element?
Het bewerken van elementen verdelen we meestal in twee aparte categorieën. Zo kan je de inhoud van een element bewerken, maar ook het ontwerp. Zowel de inhoud als het ontwerp van een element kan je aanpassen door simpelweg op het element te klikken in je websitemaker.
Inhoud Bewerken
In de bovenstaande afbeelding zie je terug wat je kan instellen binnen het inhoud venster. Via het invulveld "Tekst op knop" kunnen we de tekst wijzigen die zichtbaar is op de knop. In dit geval heet onze knop dus "Nieuwe knop".
Nadat je jouw nieuwe knop een naam hebt gegeven, moeten we ook nog een functionaliteit verbinden aan de knop.
Je kan de knop laten doorverwijzen naar een "Bestaande pagina" op je website, dit kan ook een store pagina zijn mits je het MijnWebshop pakket hebt. Je kunt de knop dan naar een categorie pagina of een product naar keuze verwijzen. Het kan natuurlijk voorkomen dat jij je bezoekers via een knop naar een andere website wilt leiden. In dit geval kan je gebruik maken van de "Webadres" optie. Wil je de knop liever gebruiken om een "Pop-up" te openen, of bezoekers naar een "Anker" te sturen? Dan is dit ook mogelijk!
Je kan het Knop element ook gebruiken om nog meer interactie te creëren met bezoekers van jouw website. Zo kan je bezoekers naar een "Blogpost" laten gaan, je laten mailen via de "E-mailadres" optie, of zelfs laten bellen via de "Bel ons" optie.
Tot slot kan je ook via "Bestand voor downloaden" je bezoekers een bestand laten downloaden.
Ontwerp Bewerken
In de bovenstaande afbeelding zie je enkele instellingen terug die het ontwerp venster jouw knop te bieden heeft.
Via "Lay-out" kan je de vorm van je knop wijzigen. Zo kan je kiezen voor een platte rechthoekige knop, maar ook ovale knoppen óf knoppen met een extra icoontje vallen binnen de mogelijkheden!
Bij "Knopstijl" kan je het formaat van jouw knop wijzigen. Pas hier de Breedte of Hoogte van je knop aan. Wil je graag de verhoudingen van je knop bewaren terwijl je de breedte of hoogte van je knop aanpast? Zet dan de "Verhouding bewaren" schuifknop aan.
Bij het "Achtergrond" gedeelte kunnen we de knop een Kleur of Afbeelding meegeven. Ook kunnen we de knop hier een "Rand" geven.
Via "Achtergrondkleur aanwijzen" kan je ervoor zorgen dat de knop een andere kleur krijgt wanneer een bezoeker met zijn muis over knop heen gaat. Hetzelfde kan je doen voor de Randkleur (Let op! Dit werkt dus niet op Tablet of Mobiel. Je hebt hier immers normaliter geen muis op aangesloten).
De waarde van "Afgeronde hoeken" kan je aanpassen om de vorm van je knop te wijzigen. Zo krijg je bijvoorbeeld bij "0px" een rechthoek en bij "50px" een ovale pil zoals in de afbeeldingen hierboven.
Door de "Schaduw" schuifknop aan te zetten, krijg je een schaduweffect rondom je knop. Hierdoor lijkt het net alsof hij 3D is!
Klik op het tabje "Knoptekst" om de mogelijkheden voor de tekst van je knop te weergeven.
Je kan hier het lettertype, lettergrootte en de kleur van je knoptekst wijzigen.
De B, U en I knopjes stellen je in staat de tekst in je knop dik, onderstreept óf schuin te drukken.
Ook kan je de uitlijning van de tekst én de tekstrichting wijzigen.
Daarnaast kan je nog wijzigingen doorvoeren voor wanneer een bezoeker over je knop heen navigeert met zijn of haar muis (Let op! Dit werkt dus niet op Tablet of Mobiel. Je hebt hier immers normaliter geen muis op aangesloten).
"Zwevend" kan je aanzetten om jouw knop altijd zichtbaar te maken. Deze kan je dan in één van de hoeken van je website plaatsen. Handig voor "Contact" knoppen!
Via "Animatie" kan je de knop laten bewegen. Zo kan je een "Trigger" kiezen, dit is de oorzaak voor het bewegen (Bijvoorbeeld het laden van de pagina) en een "Animatie", wat dus de daadwerkelijke animatie van de knop bepaalt.
"Ruimten" kan je gebruiken om de ruimten in én rondom je knop aan te passen.
Wil je binnen de kaders van je knop meer ruimte creëren? Pas dan de waarden in het binnenste vierkantje in.
Wil je meer ruimte rondom de knop creëren? Pas dan de waarden in het buitenste vierkantje aan.
