Show your look, show your feel. Make your Plus+ design perfect! 🎨

Al jouw Plus+ apps en addons hebben natuurlijk een gelikt design nodig, jij wilt deze in jouw huisstijl verwerken. In plaats van elke app of addon apart te stylen maakt Plus+ gebruik van algemene design instellingen, zo kan jij al jouw apps en addons universeel designen. Alles staat meteen perfect! ✅

Al jouw algemene styling, heel handig natuurlijk! Wat doen deze settings?
​Branding 🎨
Wat is de primaire kleur van je branding/huisstijl, deze zou je moeten invoeren bij accent kleur. Dat is je primaire, dus belangrijkste kleur!
Wil je ronde hoeken gebruiken voor bijv. vensters, backgrounds, etc. Geef een ruk aan de hiervoor bestemde slider, hoe hoger het getal hoe meer rondingen. 0px is geen rondingen. Standaard is 6px.

Gamification ✔️
Gamification is eigenlijk een simpel woord voor het aantrekkelijker en leuker maken van bijvoorbeeld de invulvelden. Als je een veld invuld komt er altijd een "vinkje" of een "kruisje" bij te staan. Deze zijn dus te stylen! Vul hier dus de kleurcodes in voor een "Negatieve" melding en de kleurcode voor de "Positieve" meldingen.

Berichtgeving 🔔
Deze instelling bestaat voor de meldingen in je webshop, als je bijvoorbeeld een item aan je winkelwagentje toevoegt. Deze settings zijn voornamelijk belangrijk bij de addon "Alerts". De kleuren voor je Alerts kan je hier toevoegen. Tevens kan je een achtergrondkleur kiezen om de melding nog opvallender te maken!

Al jouw instellingen voor alle teksten binnen de addons en apps van Plus+!
​

Titels ✒️
Dit zijn de instellingen voor de titels in alle Plus+ apps en Addons. Welk lettertype moeten de titels krijgen, welke dikte moeten deze titels meekrijgen en welke kleur?
Hoofdlettergebruik heeft verschillende opties, wil je dat de titels standaard zijn, dus alleen met een hoofdletter bij het eerst woord, moeten alle letters in hoofdletters weergegeven worden of moet elk nieuw woord met een hoofdletter beginnen?

Geavanceerd:
​

Onder de geavanceerde opties kan je de tekst grootte van jouw titels bepalen voor zowel desktop als mobiel, dit kan voor H1 t/m H6.

Body 📋
Body staat voor jouw algemene (platte) tekst, dit zijn eigenlijk de normale tekst grootte van jouw apps en addons. Welk lettertype moet de body krijgen (via Google Fonts), welke dikte moeten de tekst hebben, wat moet de tekstg grootte voor zowel mobiel als desktop zijn en in welke kleur mag deze tekst weergegeven worden?
​Het kan natuurlijk altijd voorkomen dat je een eigen lettertype hebt die niet standaard in de Google Fonts library staat. Is dit het geval? Neem dan via een ticket contact op met onze support. Zij kunnen er voor zorgen dat jouw lettertype compatible word met alle Plus+ Addons en Apps!

Algemeen 📝

Onder de algemene setting kan je de kleuren voor je linkjes instellen. Welke kleur zouden dit moeten zijn?
Daarnaast kan je de regelafstand van je teksten bewerken, dit is dus hoeveel witruimte er tussen jouw body teksten moeten staan.

Algemeen 📝
​

Bij de algemene button settings kan je de tekstgrootte voor de tekst in de buttons aanpassen. Dit kan zowel voor mobiel als desktop. Ook kan je hier het hoofdlettergebruik aanpassen, deze heeft verschillende opties, wil je dat de titels standaard zijn, dus alleen met een hoofdletter bij het eerst woord, moeten alle letters in hoofdletters weergegeven worden of moet elk nieuw woord met een hoofdletter beginnen?
​Ook kan je de rondingen van de buttons aanpassen. Wil je een rechthoekige button, zet de slider dan helemaal naar links, wil je een pil vormige button? Zet de slider dan helemaal naar rechts.

Call to action buttons 🆕

De call to action buttons zijn de buttons die een actie oproepen, bijvoorbeeld de "in winkelwagen" knop. Dit zijn eigenlijk de meest bepalende buttons in je webshop, zorg dus dat deze knoppen er het meest uitspringen. Tip: Gebruik geen kleur die in je huisstijl voorkomt, zodat hij er meer uit "popped"!
​Bepaal hier de achtgrond-, rand- en tekstkleuren van de button, tevens kan je een schaduw meegeven aan de button.
Schaduwen moeten ingevoerd worden op de volgende manier:
"-1px 4px 10px 0 rgba(0, 0, 0, 0.08)"
De eerste 4 getallen (-1px 4px 10px 0) staan voor de afstand van de schaduw. Je kan altijd spelen met de instellingen. Zorg dat er altijd 4 getallen zijn! Is het getal 0? Dan hoef je er geen px achter te zetten.

De volgende term die je ziet is rgba(0, 0, 0, 0.08), dit is de kleur voor jouw schaduw. De afkorting RGBA staat voor Red, Green, Blue en Alpha. Alpha staat in de webtermen voor "doorzichtigheid". Zorg dat dit getal altijd onder de 1 is! Om een RGBA kleur te kiezen kan je gebruik maken van de volgende "Color picker": https://rgbacolorpicker.com/

Tevens kan je de tekstdikte en de hoogte van de button bepalen.

Normale buttons 🆑
Uiteraard heb je natuurlijk ook jouw normale buttons, deze staan los van de Call to Action buttons. Dit zijn dus jouw algemene buttons. Deze worden onder andere gebruikt voor het aanmaken van accounts, versturen, wachtwoord aanmaken, etc.
​De instellingen hiervoor werken hetzelfde als de hierboven genoemde "Call to action" buttons.

Invoervelden ✍️

Natuurlijk zijn er binnen onze apps en addons wat formulieren die de klant kan invullen, bijvoorbeeld bij de product helpdesk addon. Bij deze instellingen kan je de styling voor de invoer en selectievelden aanpassen.
​Welke kleur moet de tekst in het invoerveld krijgen, welke kleur moet de achtergrond krijgen, welke kleur mag de rand hiervan hebben? En natuurlijk de hoogte van het veld? Mag die hoog of laag?
Daarnaast kan je de achtergrondkleur van het veld aanpassen als de invoer "geldig" is, dus ingevuld. Ook kan je uitgeschakelde invoervelden een kleur meegeven.

Checkboxes ✅

Dit betreft de opmaak van de aanvink velden en eventuele radio buttons. Radio buttons zijn de ronde keuze vakjes, bijvoorbeeld de keuze geslacht. De checkboxes zijn de vierkante vakjes om aan te vinken, bijvoorbeeld akkoord voor algemene voorwaarde. Stel hier de kleuren in voor het vakje en voor het "vinkje".