Opmaak

U kunt zelf de opmaak van uw webwinkel naar uw eigen stijl bepalen. Op de "Opmaak" pagina kunt u alle kleuren instellen van uw webwinkel. Ook kunt u op de achtergrond een afbeelding of een patroon plaatsen, of het een kleur geven. Zo heeft u altijd een eigen unieke stijl. Om de "Opmaak" pagina overzichtelijk te houden hebben we deze opgedeeld in koppen. Onder elke kop kunt u kleuren selecteren via de Kleurenkiezer. Als u de RGB kleurcode weet, kunt u deze ook in het tekstveld invoeren zonder een hekje (#).

Wanneer u een onderdeel geen kleur geeft wordt deze transparant. Bij een transparant onderdeel wordt de achtergrond kleur of afbeelding van het onderdeel erachter weergegeven.

1. Algemeen

Onder de kop "Algemeen" kunt u de algemene kleuren van uw webwinkel aanpassen.

1.1 Tekst kleur

Als eerst wordt er om de "Tekst kleur" gevraagd. Selecteer hier de kleur voor alle teksten in uw webwinkel. De kleuren van de koppen worden onder een andere kop ingesteld.

1.2 Container kleur

De "Container" is de rode achtergrond van uw website zoals weergegeven op de afbeelding hieronder. De kleur voor de container kunt u hier kiezen. Het is ook mogelijk om de container transparant te maken door geen kleurcode in te vullen en het veld leeg te laten.

Shopotheek container achtergrond kleur

De container wordt weergegeven door het rode gedeelte.

1.3 Accent kleur

De "Accent kleur" wordt gebruikt voor knoppen en kopteksten. Wanneer u uw muis beweegt over bepaalde gebieden, zoals producten, veranderen de kleuren naar de "Accent kleur".

Shopotheek accent kleur

Alle accenten zijn in het rood weergegeven.

1.4 Randen kleur

Sommige onderdelen van de webwinkel hebben dunne lijnen eromheen, bijv. het "Linker menu". Deze heeft in de afbeelding een dunne grijze lijn. De kleur van deze randen kunt u hier kiezen.

Shopotheek randen kleur

Alle randen zijn in het rood weergegeven.

1.5 Linker menu achtergrond kleur

Ook de achtergrond kleur van het "Linker menu" kunt u instellen. Alles binnen de dunne lijnen van het "Linker menu" zal de kleur krijgen die u selecteert.

Shopotheek linkermenu achtergrond kleur

Het linker menu wordt in het rood weergegeven.

1.6 Content achtergrond kleur

De "Content achtergrond kleur" keuze is er voor webwinkels die de "container" transparant hebben. Zo blijven de teksten aan de rechterkant leesbaar wanneer u een afbeelding als achtergrond heeft geselecteerd. Laat dit tekst veld leeg als u geen achtergrond afbeelding heeft en een container kleur heeft ingevuld.

Shopotheek content achtergrond kleur

De content wordt weergegeven door het rode gedeelte.

2. Achtergrond

Om uw webwinkel wat meer stijl te geven kunt u kiezen voor een achtergrond. Dit kan zowel een kleur als een afbeelding zijn.

2.1 Afbeelding

U kunt als achtergrond een afbeelding selecteren. Dit kan een grote foto zijn maar ook een patroon dat zichzelf kan herhalen. Selecteer de afbeelding door op de knop te drukken.

2.2 Afbeelding positie

Wanneer u als achtergrond een afbeelding heeft geplaatst kunt u kiezen of de afbeelding tijdens het scrollen naar beneden meebeweegt of niet. Als u voor een "Vaste" afbeelding kiest zal de achtergrond afbeelding niet mee naar beneden scrollen maar vast blijven staan. Wanneer u kiest voor een "Vrije" afbeelding zal de achtergrond afbeelding meebewegen tijdens het scrollen.

2.3 Afbeelding herhalen

Wanneer u kiest voor een achtergrond afbeelding kunt u deze herhalen. U heeft de mogelijkheid om de afbeelding horizontaal te herhalen. Hierdoor zal de afbeelding horizontaal naast elkaar herhaald worden. Dit zelfde geldt voor verticaal, de afbeelding zal dan verticaal herhaald worden. Wanneer u kiest voor beide dan zal het zowel horizontaal als verticaal herhaald worden. Deze optie is bedoeld voor patronen. Zo kunnen patroon afbeeldingen zichzelf herhalen.

2.4 Achtergrond kleur

U kunt de achtergrond ook voorzien van een achtergrond kleur. Zelfs als u een achtergrond afbeelding heeft is het handig om een achtergrond kleur te kiezen. Wanneer uw afbeelding kleiner is dan het scherm van uw bezoeker, zal de achtergrond kleur getoond worden.

3. Topmenu

Om het navigeren overzichtelijk te houden is er bovenaan een Topmenu geplaatst. Hier staan belangrijke pagina's van uw webwinkel. Tevens is de winkelwagen knop hierin geplaatst.

3.1 Topmenu achtergrond kleur

Bovenaan de website bevindt zich het "Topmenu". In de afbeelding is deze rood. Hierin staan de pagina's en uw winkelwagen. Dit menu kunt u een achtergrond kleur geven.

Shopotheek topmenu achtergrond kleur

Het topmenu wordt weergegeven door het rode gedeelte.

3.2 Tekst kleur

Ook de tekst binnen het "Topmenu" kunt u een kleur geven. Alleen de kleur van de tekst binnen het "Topmenu" zal gewijzigd worden.

De header is de ruimte waar u uw logo kunt plaatsen. Deze bevindt zich onder het "Topmenu". Hier kunt u een logo of banner plaatsen. Deze zal altijd linken naar uw voorpagina.

4.1 Achtergrond kleur

De "Header" is het gedeelte waar het logo zich bevindt (onder het Topmenu). Het logo dat u hier plaatst kan in de volledige breedte van de header zijn. De hoogte van de Header groeit automatisch mee. Wanneer uw logo niet de volledige breedte heeft of transparant is, kunt u de header opvullen met een kleur. Als u hier geen kleur wenst, haalt u de kleurcode weg en laat u dit veld leeg.

Shopotheek header achtergrond kleur

De header wordt weergegeven door het rode gedeelte.

5. Categorie menu

Het "1.2.5 Categorie menu" bevindt zich direct onder de "Header". Hierin zitten al uw (sub)categorieën.

5.1 Achtergrond kleur

Het "Categorie menu" heeft een achtergrond kleur wat u zelf kunt kiezen. De achtergrond kleur die u kiest voor het "Categorie menu" heeft een licht verloop van licht naar donker. U kunt hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen..

Shopotheek header categoriemenu achtergrond kleur

De achtergrond kleur van het categorie menu wordt weergegeven door het rode gedeelte.

5.2 Achtergrond kleur mouseover

Wanneer u uw muis over de een categorie in het "Categorie menu" beweegt krijgt de categorie een aparte kleur. U kunt voor de mouseover hier een kleur kiezen door op de kleurenkiezer te klikken en een kleur te kiezen of een kleurcode in te vullen.

Shopotheek categoriemenu achtergrond hoverkleur

De mouseover van het categorie menu wordt weergegeven door het rode gedeelte.

5.3 Tekst kleur

De tekst kleur van het categorie menu kunt u zelf selecteren. Zorg ervoor dat u een kleur kiest die goed te lezen is op de achtergrond kleur. U kunt hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

5.4 Tekst kleur mouseover

Wanneer u uw muis over een categorie beweegt in het "Categorie menu" is het mogelijk dat de tekst kleur niet goed is gecombineerd met de mouseover van de achtergrond kleur. Daarom is het mogelijk om de tekst kleur bij de mouseover een aparte kleur te geven. U kunt deze ook leeg laten. Dan zal de tekst kleur bij de mouseover niet veranderen. Wanneer u ervoor kiest om toch een aparte kleur hiervoor te selecteren kunt u hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

6. Diashow

De "Diashow" is de slider waarin u meerdere afbeeldingen kunt plaatsen. Ook hiervan kunt u de kleuren zelf aanpassen. U kunt door de "Diashow" navigeren door middel van de "Thumbs" Deze Thumbs hebben drie statussen, namelijk: inactief, mouseover en actief.

Inactief is de status wanneer de dia niet weergegeven wordt.

Mouseover is de status wanneer u met uw muis eroverheen beweegt.

Actief is de status wanneer de dia wordt weergegeven of als u erop klikt. De kleur van de actieve Thumb wordt bepaald bij kop 1.3 Accent kleur.

6.1 Achtergrond kleur

Wanneer u transparante afbeeldingen gebruikt (.PNG extensie) dan is het handig om de achtergrond kleur van de diashow zelf te kunnen bepalen. U kunt hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Shopotheek diashow achtergrond kleur

De achtergrond kleur van de diashow wordt weergegeven door het rode gedeelte.

6.2 Thumb inactief kleur

Onder de "Diashow" bevinden zich de knoppen (Thumbs) waarmee u de gewenste dia kunt weergeven. U kunt voor de inactieve Thumbs hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Shopotheek thumb inactief kleur

De inactieve thumbs worden weergegeven door het rode gedeelte.

6.3 Thumb mouseover

Onder de "Diashow" bevinden zich de knoppen (Thumbs) waarmee u de gewenste dia kunt weergeven. De "Thumb mouseover" kleur verschijnt zodra u de muis over de Thumbs beweegt. U kunt voor de mouseover hier een kleur kiezen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Shopotheek thumb hover kleur

De thumb mouseover wordt weergegeven door het rode gedeelte.

7. Product

De producten worden op de voor- en (sub)categoriepagina's naast elkaar weergegeven. Dit noemen we de "Product displays". U kunt de kleuren van deze Product displays aanpassen.

7.1 Achtergrond kleur

Als u de Product displays een achtergrond kleur wilt geven kunt u dat hier doen. U kunt de Product display hier een achtergrond kleur geven door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Shopotheek product display achtergrond kleur

De product display achtergrond kleur is in de afbeelding rood.

7.2 Titel kleur

De titels van de producten in de Product display hebben standaard dezelfde kleur als de "Accent kleur". Deze is te vinden onder kop 1.3 Accent kleur. U kunt de titel hier een eigen kleur geven door op de kleurenkiezer te klikken en een kleur te kiezen of een kleurcode in te vullen.

Shopotheek producttitel kleur

De titel kleur wordt weergegeven door het rode gedeelte.

Onderaan uw webwinkel bevindt zich de footer. Hierin staan links naar de Algemene voorwaarden en de Klantenservice. Hiervan kunt u de achtergrond kleur en de tekst kleur aanpassen

8.1 Achtergrond kleur

De achtergrond kleur heeft standaard de zelfde kleur als het "Topmenu". Als u deze wilt veranderen kunt u dit hier doen. U kunt de achtergrond kleur wijzigen door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Shopotheek footer achtergrond kleur

Footer achtergrond kleur wordt weergegeven door het rode gedeelte.

8.2 Tekst kleur

Net zoals in het "Topmenu" is het belangrijk dat de bezoekers de teksten in de "Footer" goed kunnen lezen. Daarom kunt u gemakkelijk de kleur van de teksten in de "Footer" aanpassen. U kunt de tekst kleur hier een eigen kleur geven door op de kleurenkiezer te klikken of een kleurcode in te vullen.

Naar boven