Hallo. De inhoud van ons blog is voor uw gemak automatisch vertaald. Onze excuses voor de mogelijk slechte vertaling.

A Comprehensive Guide to Uw Ecwid Store Design

Mrt 22, 2017 by Qetzal, Hoofd Product
A Comprehensive Guide to Uw Ecwid Store Design
Gepost Mar 22, 2017 by Qetzal, Hoofd Product

De Ecwid winkel is gemaakt op een zodanige wijze dat het mogelijk is om deze toe te voegen aan elke website en beginnen met de verkoop elk type product in een mum van tijd. De storefront past zich automatisch aan zowel desktop en mobiele apparaten, en de winkel ziet er geweldig uit op elk scherm.

Het maken van uw winkel een natuurlijk onderdeel van uw website geeft de indruk van een professionele. Je zou willen naar de winkel ontwerp te veranderen om te passen bij uw website stijl en de specifieke behoeften van uw specifieke bedrijf. Dat kan worden bereikt door een aantal middelen, van volledig geautomatiseerde instellingen op maat gemaakt thema's.

De meeste daarvan zijn vermeld in Control Panel Instellingen Ontwerp. Op die pagina, U kunt uw ontwerp te beheren, en in dit bericht, we zullen u vertellen hoe u het meeste van te maken.

We brak alle mogelijke aanpassingen aan uw Ecwid store design in drie niveaus volgens de vereiste vaardigheden en middelen, van snel en gemakkelijk te diepere en complexere.

Niveau 1: Snel en eenvoudig

Snel en eenvoudig

zonder inspanning, snelle wijzigingen. Niets dan klikken op de knoppen nodig.

Voordat je begint te denken van de veranderingen in het ontwerp, Hier is het goede nieuws: Ecwid bouwt automatisch in het milieu en ziet er als een natuurlijk onderdeel van uw website of een sociaal pagina. Je hoeft niet aan een codering te doen voor dat - alles werkt prima.

Daarnaast, Er zijn eenvoudige manieren om het uiterlijk van uw winkel aan te passen en het gevoel om je missie zonder extra inspanning.

1. Te verkopen op een Ecwid Starter Site als u niet beschikt over een website

De Starter Site is een gratis-pagina website met een online winkel die Ecwid biedt voor gratis wanneer u uw Ecwid account aan te maken.

Ecwid starter website

Spreken van het ontwerp, de Starter site is gebouwd met kant en klare blokken (de omslagafbeelding, logo, online winkel, sectie "Over ons", klanten feedback, en contacten) die je kunt activeren en deactiveren, bewerken, en aan te passen aan uw bedrijf. Het enige dat kan praktisch worden gedaan in momenten met je eigen handen.

Zo, als je niet beschikt over een website te verkopen op hebben, Dit is een zeer eenvoudige manier om te beginnen met online verkopen op een goed uitziende webpagina gratis.

Deze stap-voor-stap handleiding wordt uitgelegd hoe u uw Starter Site ontwerpen: Het aanpassen van Uw Starter Site Van Scratch tot Eerste Koop

2. Gemakkelijk ontwerp maatwerk voor degenen die al een website

Als je al hebt een website, Ecwid nog steeds probleemloos integreren met deze, wat het ook is gebouwd op: WordPress, Adobe Muse, Wix, Joomla, of een ander platform. Hier is wat u kunt doen om uw winkel er nog beter uitzien.

Stap 1: Gebruik een bijpassende thema voor uw site builder

Om uw website te ontwerpen, kun je gewoon kiezen uit tientallen thema's beschikbaar voor aankoop. De Ecwid winkel is compatibel met de meeste van hen.

Hier is een snelle gids van plaatsen op het web waar u een ander thema voor uw site builder kunt vinden.

Voor WordPress websites

Ook, niet missen op de collectie van de beste gratis WordPress thema's voor e-commerce websites.

Voor Adobe Muse websites

Voor Joomla websites

Voor Squarespace websites

Voor Wix websites, is het nog gemakkelijker: surfen op het thema zonder dat daarbij www.wix.com.

Opmerking: Ecwid + Wix handelaren kunnen overeenkomen met de kleuren van hun website en op te slaan in de applicatie-instellingen Ecwid Wix.

instellingen Wix en Ecwid kleur

Ecwid store design instellingen op Wix websites

Stap 2: Enable Color Adaptive Mode

Als u een nieuwe Ecwid winkel te openen en voeg deze toe aan uw website, Ecwid zal automagisch de winkel kleuren aan uw website stijl. Deze functie heet Color Adaptive Mode. Het is een zeer eenvoudige manier om uw winkel een natuurlijk onderdeel van uw website.

Als u al te verkopen met Ecwid, Kleur Adaptive Mode wordt niet standaard ingeschakeld, maar u kunt het inschakelen op de Ontwerp pagina:

Ecwid Color Adaptive Mode

Wat als je voeg uw Ecwid winkel om verschillende websites? Met Color Adaptive Mode ingeschakeld, de winkel kleuren aanpassen aan elk van hen. Uw winkel zal er natuurlijk uitzien in elke website omgeving, het maakt niet uit of het nu wit, zwart, of groen.

Deze functie is beschikbaar voor de meeste handelaren Ecwid. Als u vragen hebt of hulp bij Color Adaptive Mode nodig, neem dan contact op met onze klantenservice.

3. Speel met snelle weergave-instellingen

Wanneer u online te verkopen met Ecwid, is het mogelijk om Ecwid storefront elementen in een paar klikken of uit te schakelen. Bijvoorbeeld, degenen die met de hand gemaakte producten te verkopen in enkele exemplaren vaak de voorkeur aan het veld hoeveelheid verbergen.

Je zou willen om onnodige elementen te verbergen of te wijzigen de miniaturen grootte - de verschijning gedeelte van uw ontwerp pagina zal volledig laat je het doet.

Weergave-instellingen

Niveau 2: Avonturier

Avonturier
Voor mensen zonder technische kennis die op zoek zijn naar diepere veranderingen in het ontwerp en hebben tijd voor een kleine reis.

U hebt uw winkel opgezet en hebben al keek om zich heen. Nu begin je aan de noodzaak van een persoonlijk tintje te voelen: het zou kunnen worden gebrandmerkt kleuren voor de knoppen, teksten, en achtergrond, unieke iconen, of geheel nieuwe elementen. Echter, je hebt geen idee over het coderen.

Geen zorgen: op dit niveau, Wij hebben de tools die u zullen helpen de doelstellingen te boven te bereiken zonder speciale kennis verzameld. Laten we eens een kijkje op deze.

1. Gebruik apps uit de App Market Ecwid voor store design

De Ecwid Markt App tellingen 100+ apps om u te helpen met analytics, promotie, verzendkosten, en meer. U vindt er ook apps voor storefront maatwerk en ontwerp. We nemen een kijkje op twee apps voor het wijzigen van uw thema kleuren zonder codering hebben: Store Designer en Decorateur.

Store Designer

Store Designer is een app waarmee je snel opzetten van kleuren voor de knoppen, tekst, en achtergrond.

De preview-modus laat je spelen met kleuren zoveel als je wilt voordat het publiceren van uw perfecte ontwerp om de storefront.

Store Designer

Store Designer-interface

De app kost $4.99 en biedt een gratis proefperiode week.

Decorateur

Decorateur is een alternatief voor designer store.

Decorateur kunt u het ontwerp van bijna elk element in uw storefront veranderen. Er is een Quick Start-modus voor beginnende gebruikers om het ontwerp van de belangrijkste aspecten van een storefront en een Full-instellingen voor ervaren gebruikers snel veranderen. Het aanpassen van uw storefront kosten $27, en je kunt het uiterlijk bekijken voordat het maken van een aankoop op uw computer alleen.

Decorateur

decorateur-interface

Al met al, Deze app heeft een aantal volledig gratis tools, zodat je kunt spelen met je ontwerp en poets look van uw winkel.

Zowel de decorateur en Store Designer zijn beschikbaar op alle betaalde Ecwid plannen, evenals de rest van de App Market apps.

2. Copy-paste direct tweaks van Knowledge Base

Ecwid Knowledge Base moet antwoorden op de meeste vragen een Ecwid opslageigenaar misschien. Wij zijn voortdurend op het toevoegen van nieuwe artikelen hier met de meest gestelde tips en kant-en-klare oplossingen.

Avonturiers kunnen diverse vinden aanwijzingen op storefront maatwerk; bijvoorbeeld,

het veranderen van lettertypen in de winkel of het toevoegen van een zoekvak.

De meeste van deze instructies af te breken om te kopiëren-plakken van een stukje code in uw CSS thema.

U kunt uw CSS thema's in beheer Control Panel Instellingen Ontwerp.

Het proces gaat als volgt: bijvoorbeeld, Als u wilt uw cart icon veranderen, ga naar je Instellingen → Ontwerp, maak een nieuwe CSS thema, toevoegen een stukje code, sla de wijzigingen op, en het thema activeren.

CSS thema's management Ecwid

Je moet alle verdere wijzigingen aan dit thema toe te voegen - slechts één thema tegelijk actief zijn, dus het heeft om alle wijzigingen die u wilt uw winkel te brengen omvatten.

3. Copy-paste kant en klare CSS thema's

Als u wilt opvallen met uw winkel thema, U kunt ook kiezen uit tientallen kant en klare thema's op Thematizr.com.

Thematizr

Er zijn verschillende thema's op Thematizr.com die geen codering kennis vereisen en kan worden geïnstalleerd met een eenvoudige copy-plakken in uw CSS thema

Vergeet niet dat u wijzigingen kunt aanbrengen in uw CSS thema's in Control Panel Instellingen Ontwerp.

4. Bestel een aangepast thema ontwikkeling

Als u een thema dat uw wensen zou voldoen niet kunt vinden, Een andere optie is verwijzing van de ontwikkeling van een CSS thema dat zal alleen worden gebouwd voor u. Een aangepast thema betekent veel meer dan alleen een verandering van kleuren en laat je dieper maatwerk, e.g. een geheel andere orde van de blokken op uw product pagina.

Kant en klare thema's en thema ontwikkeling zijn beschikbaar voor alle Ecwid handelaren.

S_Ecwid_201_Cover

Ecwid 201: Neem Uw Ecwid Slaan naar het Volgende Niveau

Een diepgaande uitleg over hoe je naar de winkel te veranderen vormgeving met CSS

Gelieve een geldig e-mailadres in te geven

Door het invoeren van uw e-mail ontvangt u wekelijks Ecwid blog updates en middelen om u te helpen bouwen van uw succesvolle e-commerce bedrijf.

Niveau 3: Veteraan

Veteraan
zware maatwerk: compleet veranderingen in uw winkel kijken. Hallo, code.

Soms dieper veranderingen van de winkel blik vereist: wilt u misschien een drop-down menu, een andere lay-out van het product pagina-elementen, of een aangepaste ontwerp van de knoppen.

Voor de tech-savvy handelaren of degenen die een ontwikkelaar in hun squad, is er een mogelijkheid om wijzigingen van dat type te brengen en zelfs om hun Ecwid winkel te transformeren onherkenbaar met de hulp van aangepaste CSS thema's of Ecwid API.

1. Maak van een self-made CSS theme

Wilt u uw winkel te ontwerpen op uw eigen, overwegen om uw eigen CSS thema.

Een CSS thema is een set van regels die het uiterlijk van elk element in de winkel bepaalt (de grootte, vorm, kleur, en op een pagina).

Maak aangepaste CSS thema

Maak je eigen CSS thema's in Instellingen → Ontwerp

Er is een gids in de Ecwid Knowledge Base waarin wordt uitgelegd hoe je je eigen CSS thema te maken en instructies voor het veranderen van specifieke elementen.

Merk op dat je nodig hebt om een ​​goed begrip van HTML en CSS hebben, dus als deze twee woorden onbekend geluid, je moet bereid zijn om wat tijd te besteden aan het verwerven van de nodige vaardigheden om een ​​thema uit het niets creëren.

Vergeet niet dat als je worstelt met je Ecwid store design, je kunt altijd vragen aan de Ecwid customer care team om hulp. Of het is nog steeds mogelijk om veroordeling van de ontwikkeling op maat van uw eigen CSS thema.

2. Gebruik de Ecwid Javascript API om Ecwid storefront functies uit te breiden

Dit deel is vooral voor ontwikkelaars. Weet je wat anders uw Ecwid storefront zou kunnen verbeteren? het verkrijgen van de Ecwid Javascript API.

Bijvoorbeeld, kunt u een nieuwe CSS thema of een app te bouwen, en verkopen op de Ecwid App Market. De Ecwid Javascript API kunt u de storefront blik volledig te veranderen, het brengen van veranderingen zo diep als je nodig hebt.

Als u klaar bent om te beginnen, gelieve inschrijven op onze pagina voor ontwikkelaars.

***

Lees ook: Hoe Ontwerp Product Categorie Foto ' s Die Uw Klanten niet Kunt Weerstaan aan te Klikken

About The Author
Qetzal is Head of Product at Ecwid. He loves to create new things to make people's lives easier.

Stay up to date!

Get free e-commerce tips, news and inspiring ideas delivered directly to your inbox

Lees ook