Entwicklung eines professionellen Webshops für Charlie & Paulchen

Charlie & Paulchen ist ein deutscher Hersteller für Stempel, Stanzformen und Bastelbedarf. Für eine bessere Web-Performance führte PERIMETRIK® eine Migration des ehemaligen ePagesShop zu WooCommerce durch und entwickelte einen professionellen, neuen Online-Shop mit integriertem Blog.

Neues Design mit leichten Pastell-Tönen

Für das neue Design von Charlie & Paulchen verwendete PERIMETRIK® leichte Pastelltöne und mixte großflächige Elemente mit bildschirmfüllenden Fotos. Auf der Startseite wurde ein Parallax-Effekt verwendet, um verschiedenen Sektionen mehr Tiefe zu verleihen.

Als kleine Besonderheit implementierte PERIMETRIK® im Header einen dynamischen Logo-Wechsel. Dieser wird beim Scrollen aktiviert und sorgt für einen Wechsel zwischen zwei verschiedenen Charlie & Paulchen Logos.

Referenzen Bilder Template

Die leichten Pastelltöne der Website harmonieren hervorragend mit den anschaulichen Produktfotos. Auf der Startseite werden Produkt-Highlights und Beststeller themenbasiert angepriesen.

Referenzen Bilder Template

Die übersichtliche Menüstrukturierung leitet den Kauf-Interessenten gezielt zum Wunschprodukt.

Klare Struktur und benutzerfreundliche Menüführung

Um eine sinnvolle Verbindung von Webshop und Blog zu schaffen, entwickelte PERIMETRIK® eine neue Menüstruktur mit verschiedenen Produktkategorien sowie dem Menüpunkt „Inspirationen“, hinter dem sich der Blog verbirgt. Dieser zeigt unter dem Namen „Inspirationen“ Beiträge und Bastelideen in Form von Blogartikeln. Beim Klick auf eine der Produktkategorien im Menü, werden dem User mithilfe von Mega-Menüs weitere Unterkategorien in mehreren Ebenen angezeigt. Dadurch erhält der Nutzer sofort einen guten Gesamtüberblick über das Sortiment.

Zusätzlich befinden sich folgende Menüpunkte im Meta-Menü: Homestory, Kontakt & Hilfe, Rechtliches, Bezahlung & Versand. Die direkte Anmeldung zum Account und den Warenkorb integrierte PERIMETRIK® ebenfalls im Meta-Menü.

International aufgestellt durch Mehrsprachigkeit mit WPML

Damit die Betreiber von Charlie & Paulchen den internationalen Markt erobern können, richtete PERIMETRIK® Ihnen das Mehrsprachen-PlugIn WPML ein. Mit diesem können alle Seiten und Inhalte für weitere Sprachen übersetzt werden. Per Sprachumschaltung im Header kann der User die dann die passende Sprachversion auswählen.

Referenzen Bilder Template

Anhand der Sprachumschaltung lässt sich einfach zwischen den Sprachversionen DE (Deutsch) und EN (Englisch) wechseln.

Referenzen Bilder Template

Unter dem Menüpunkt „Inspirationen“ gelangt der Benutzer in den Blog, auf dem ihn viele interessante Bastel-Tipps, Anleitungen und mehr erwarten.

Blog als integriertes Marketinginstrument

Bisher betrieb das Team von Charlie & Paulchen seinen Blog getrennt vom ehemaligen ePages-Shop. Dies führte zu einem hohen Arbeitsaufwand und erschwerte dem Nutzer den Überblick.

PERIMETRIK® band den Blog in die neue Website ein und machte ihn somit zum zentralen Marketing-Tool: In der Beitragsübersicht werden alle Blogeinträge nun mit Bild, Titel, Datum, sowie einem kurzen Textauszug dargestellt. Neben der Übersicht wurde eine Seitenleiste mit passenden Themen und Anlässen integriert. Einzelne Artikel dienen jetzt als potenzielle Landing-Pages und sorgen somit für eine verbesserte Auffindbarkeit bei Google. Durch die Verknüpfung von Blog-Beiträgen und Produkten im Shop wird zudem die Kaufbereitschaft angeregt.

Produktauflistung nach Kategorien

Da Charlie und Paulchen über ein umfangreiches Produkt-Sortiment verfügt, wurden sinnvolle Kategorien erstellt, z.B. für Bundles, Stanzen, Stempel, Papiere usw. Im Menü kann der Kunde anhand des passenden Menüpunkts die gewünschte Kategorie auswählen.

Zur übersichtlichen Produktdarstellung entwickelte PERIMETRIK® ein Raster, in dem immer drei Produkte pro Reihe angezeigt werden. Der User kann auswählen, ob er 12, 24 oder 48 Produkte pro Seite angezeigt bekommen möchte Zur Darstellung der Produkte auf weiteren Seiten richtete PERIMETRIK® eine Paginierung ein.

Die Produktanzeige der einzelnen Produkte besteht aus einen Thumbnail (Produktfoto), Titel, Bewertung in Form von Sternchen, Preisangabe, Marke, Verfügbarkeit und Bestellmengenauswahl. Per Klick auf den zugehörigen Button landet das Produkt im Warenkorb. Auf der Warenkorb-Seite werden alle Produkte gesammelt und können dann über den Button „Zur Kasse“ bestellt werden.

Aufgrund der drei-spaltigen Produktanzeige ist rechts neben der Produktliste noch ausreichend Platz für eine Sidebar. Diese integrierte PERIMETRIK® fest im Shop, sodass sie auf allen Produktseiten angezeigt wird. Die Sidebar beinhaltet ein Suchfeld, Produkt-Neuheiten, die dynamisch nach Erstellungsdatum angezeigt werden und ein Menü mit allen verfügbaren Produktkategorien für die weitere Suche und Inspiration beim Stöbern.

Referenzen Bilder Template

Wählt der Benutzer die gewünschte Produktkategorie aus, werden ihm passende Produkte anschaulich aufgelistet. Anhand einer Bread Crumb Navigation oberhalb der Produktliste kann der seinen Klickpfad nachverfolgen und gelangt auf Wunsch zurück in die Hauptkategorie.

Referenzen Bilder Template

Per Klick auf das Produktbild wird dem Käufer eine vergrößerte Ansicht bzw. detaillierte Ausschnitte des Produktes angezeigt. Anhand der Produkt-Tabs „Beschreibung“, „zusätzliche Informationen“ und „Bewertungen“ kann er sich umfangreich über sein Wunschprodukt informieren.

Informative Produkt-Detailseite

Für jedes Produkt legte PERIMETRIK® eine Detailseite mit Thumbnail, Titel, Bewertung und Preisangabe an. Anhand der Tabs „Beschreibung“und „Zusätzliche Informationen“ erhält er weitere Infos zum Produkt. Unter dem Tab „Bewertungen“ kann der Besteller über ein Kontaktformular selbst eine Bewertung abgeben.

Ebenso wie auf der Produktübersicht lässt sich auch auf der Prosuktdetailseite die Bestellmenge festlegen und das Produkt kann über den Button „In den Warenkorb“ dort abgelegt werden. Die Anzahl aller im Warenkorb abgelegten Produkte wird automatisch im kleinen Einkaufskorb-Icon im Header angezeigt. Zudem befindet sich eine Übersicht aller Produkte, die im Warenkorb angelegt wurden in der Sidebar. So hat der Einkäufer beim „Weitershoppen“ seine Produktauswahl stets im Blick und muss die Shopseite, auf der er sich gerade befindet, zum Abgleich seines Warenkorbs-Inhalts nicht verlassen.

Warenkorb

Im Warenkorb werden alle ausgewählten Produkte für den Kunden aufgelistet. Wird ein Artikel im Shop per Button „in den Warenkorb“ eingepackt, gelangt der Käufer direkt auf die Warenkorb-Seite und kann dort alle Informationen zu Preis, Versand und Bestellart einsehen. Per Klick auf den Button „Weiter einkaufen“ kann er seinen Shopping-Vorgang fortsetzen. Anhand des Buttons „Weiter zur Kasse“ gelangt der Käufer zum Checkout.

Referenzen Bilder Template

Der Warenkorb ist per Klick auf das passende Symbol im Header (kleiner Einkaufswagen) jederzeit zu erreichen.

Referenzen Bilder Template

Im professionellen Bestellformular kann der Käufer seine Kundendaten für die Bestellung eingeben. Die Datenübertragung findet natürlich verschlüsselt statt. Darunter werden alle verfügbaren Zahlungsarten angezeigt.

Checkout mit professionellem Bestellformular

Um die Bestellung im Checkout abzuschließen, entwickelte PERIMETRIK® ein professionelles Formular. Der Käufer gibt seine Daten hier in die dafür vorgesehen Felder ein. Pflichtfelder sind mit einem roten Sternchen gekennzeichnet.

Die Datenübertragung findet selbstverständlich verschlüsselt statt. Möchte sich der Kunde im Shop registrieren, kann er ein Häkchen in der Checkbox „Ein Kundenkonto eröffnen“ setzen. In diesem Falle braucht er seine Daten nicht bei jeder Bestellung neu angeben.

Unterhalb der persönlichen Daten, kann die gewünschte Zahlungsart ausgewählt werden. Diese kann ​per Vorkasse, Sofortüberweisung, Kreditkarte oder PayPal getätigt werden. PERIMETRIK® richtete zu den jeweiligen Zahlungsanbietern eine passende Schnittstelle ein. So wird der Käufer beispielsweise für eine Zahlung mit PayPal direkt auf die entsprechende Seite weitergeleitet.

Sind alle Angaben vollständig wird per Klick auf den Button „Jetzt kaufen“ die Bestellung aufgegeben. Dies wird dem Kunden wird auf der Seite mit dem Satz „Vielen Dank für Ihre Bestellung“ bestätigt. Zudem erhält er eine Bestellbestätigung per E-Mail.

 

Weitere Features der Website

PERIMETRIK® ergänzte folgende Erweiterungen im neuen Charlie & Paulchen Shop, um die Produktbearbeitung zu erleichtern, die Bestellabläufe zu optimieren und Sicherheit zu gewährleisten.

Offener Warenkorb

Charlie & Paulchen stellte fest, dass Kunden oftmals nachfragten, ob sie Produkte einer offenen Bestellung hinzuzufügen können. Zur Vereinfachung entwickelte PERIMETRIK® ein Tool, welches diesen Prozess in die Webseite einbindet. Kunden können nun ihrer noch unversendeten Bestellung weitere Artikel hinzufügen und zusätzliche Versandkosten sparen.

Bulk-editing

PERIMETRIK® stellte angesichts des großen Sortiments von Charlie & Paulchen ein Tool bereit, welches die Bearbeitung von vielen Produkten gleichzeitig vereinfacht. So können beispielsweise Preise oder andere Informationen einer Kategorie im Warenangebot verändert werden.

Table Rate Shipping Tools

Da Charlie & Paulchen oftmals mit ungewöhnlichen Liefergößen arbeitet, wurde ein  sogenanntes Table Rate Shipping Tool integriert. Versandinformationen werden anhand von hinterlegten Daten errechnet und dem Kunden beim Check-out genannt. Diese Daten werden ebenfalls an Charlie & Paulchen weitergeleitet.

Wasserzeichen-Tool

Da die Geschäftsführung von Charlie & Paulchen oftmals feststellte, dass Bilder ihrer Webseite ungewollt kopiert und auf fremden Webseiten genutzt wurden, stellte PERIMETRIK® ein Wasserzeichen-Tool zur Verfügung. Es implementiert automatisch Wasserzeichen in verwendete Bilder. Auf diese Weise soll Produktpiraterie eingedämmt werden.

Fazit:

Durch den Wechsel von ePages zu WooCommerce hat Carlie & Paulchen einen modernen und benutzerfreundlichen Webshop erhalten. PERIMETRIK® gelang es viele praktische Shop-Features zu kombinieren und die große Auswahl an Produkten übersichtlich neu zu kategorisieren, sodass der User sich gut zurechtfindet. Durch die Integration des Blogs mit vielen neuen Ideen und Anregungen passend zu den Produkten wird außerdem die Kauflust gesteigert.

Weitere Projekte für Kunde: Charlie & Paulchen, Sprockhövel

Unsere Lösungen für dieses Projekt:

In diesem Projekt konnten wir auf einige bewährte Lösungen zurückgreifen:

Automatische Bildoptimierung

Unsere Methode optimiert Fotos schon beim Upload, dabei werden große Bilder automatisch beschnitten und komprimiert. Zudem können ggf. die Templates optimiert werden, so dass Bilder in „passender“ Größe ausgegeben werden.

Bestellformular

Sicher und benutzerfreundlich: Wir erstellen Ihnen professionelle Bestellformulare für Ihren WooCommerce Shop.

Blog

Nahezu jede Unternehmens-Website profitiert von einem integrierten Blog. PERIMETRIK® unterstützt Sie bei der Erstellung oder Integration Ihres professionellen WordPressBlogs und zeigt Ihnen, welche Vorteile das „Bloggen“ für Ihr Unternehmen bietet.

Bulk-editing

Bulk-editing vereinfacht die Produktbearbeitung in Ihrem WooCommerce-Shop. Wir nutzen verschiedene Werkzeuge zum Bulk-editing, mit denen ausgewählte Produkte zusammengefasst und komfortabel gleichzeitig bearbeitet werden können. So lassen sich hunderte Produkte ohne großen Aufwand editieren.

Integration Unternehmensblog in WP Website

Ein WordPress- Unternehmens Blog bietet einen Mehrwert, den viele Nutzer nicht ahnen: Wir zeigen Ihnen, wie Sie mit Hilfe eines professionellen Blogs Ihren Usern nicht nur einen höheren Mehrwert bieten, sondern auch die Relevanz Ihrer Website bei Google enorm steigern können.

Mehrsprachigkeit

Sie möchten mit Ihrer Website international durchstarten? Wir installieren Ihnen ein Mehrsprachen-PlugIn, mit dem sich jeder Inhalt auf Ihrer Website für beliebig viele Sprachversionen nutzen lässt. Außerdem integrieren wir Ihnen eine Sprachumschaltung im Header, erweitern die URL-Struktur um verschiedene Länderkennungen und unterstützen Sie bei der Bearbeitung Ihrer verschiedenen Sprachversionen.

Produktdatenbanken

Kein Inhalt ohne Datenbankeintrag: Sie betreiben einen Webshop und möchten zu WooCommerce wechseln? Wir ex- und importieren Ihre Produkte aus der alten Datenbank in die neue und gestalten einen benutzerfreundlichen Webshop mit Landing Pages zu den Produktkategorien und informativen Produktdetailseiten.

SEO-optimierte Bilder

Auch Bilder tragen zur SEO-Performance bei. Wir zeigen Ihnen, was Sie bei der Bearbeitung und Beschriftung von Bildern auf Ihrer WordPress Website beachten sollten.

Table Rate Shipping

Weltweiter Versand aller Klassen in alle Zonen: Wir nutzen ein PlugIn für Table Rate Shipping, mit dessen Hilfe in jedem Bestellprozess aus einer Vielzahl an Optionen immer die korrekten Versandkosten ermittelt werden.

Wasserzeichen-Tool

Ein Wasserzeichen-Tool auf Ihren Fotos verhindert eine ungewollte Nutzung / Kopie Ihrer Bilder auf fremden Websites. Wir schützen Ihr Bildmaterial und versehen es mit einem Wasserzeichen-Tool.

WooCommerce Webshop

Sie träumen von einem florierenden Online-Geschäft? Wir erstellen Ihnen einen professionellen WooCommerce-Shop, mit dem Sie Ihre Produkte einfach und sicher im Web verkaufen können. Egal ob B2B oder B2C – wir arbeiten nach Ihren individuellen Anforderungen und machen Ihren Shop zu einem attraktiven Einkaufserlebnis, egal ob für Zwischenhändler oder Endkunden.

Sie benötigen professionelle Unterstützung bei der Shoperstellung?