Kaufe auf Etsy ein

Mini-Etsy: Integriere Deinen Etsy-Shop in Deinen Blog

Dez 21, 2012

von Antje Wolter

Etsy.com handmade and vintage goods

Viele von euch haben auch einen eigenen Blog oder eine Webseite um euren Shop zu promoten und über euch als Label zu berichten. Wusstest du schon, dass du deinen Etsy-Shop auch in deinen Blog integrieren kannst? Das ist gar nicht schwer. Wir zeigen dir in kurzen Anleitungen, wie du deinen Shop in WordPress, Tumblr und Blogspot einbindest.

  1. Das Mini Etsy anlegen
  2. Mini Etsy in einen Blogspot Blog einbinden
  3. Mini Etsy in einen Tumblr Blog einbinden
  4. Mini Etsy in einen WordPress Blog einbinden

Du kannst unser sogenanntes Mini Etsy in deinen Blog in die Seitenleiste als Widget / Badge einbinden und so auf deinen Shop aufmerksam machen. Du kannst das Mini Etsy aber auch so benutzen, dass es auf deinem Blog oder Website unter einer eigenständigen Seite namens z.B. „Mein Online-Shop“ wie eigener richtiger Online Shop aussieht. Sobald deine Besucher auf Produkte in deinem Mini Etsy klicken, werden sie in deinen Etsy Shop weitergeleitet.

Etsy Mini Shop auf deinem Blog einbinden, in Blogspot einbinden, Blog von Olivegreenanne

olivegreenanna benutzt ein Mini Etsy auf ihrem Blogspot-Blog in der Seitenleiste

Ein Mini Etsy anlegen

Dann kann es los gehen: Logge dich in Deinen Etsy Account ein und klicke auf Dein Shop, dann in der unteren linken Seitenleiste unter Werbung auf den Mini Etsy Link. Dein Shop > Werbung > Mini Etsy Dieser Link bringt dich zur Dein eigenes Mini-Etsy erstellen-Seite.

Mini Etsy: Thumbnails-Funktion für die Einbindung in Seitenleiste, Blog, Blogspot, WordPress, Tumblr

Nach Auswahl der einzelnen Kriterien bekommst du eine genaue Vorschau deines Mini Etsy Shop.

Hier solltest du darauf achten, dass du Artikel aus meinem Shop anklickst, damit auch wirklich nur deine eigenen Produkte auf deinem Blog erscheinen.

  1. Für eine Verwendung in der Seitenleiste deines Blogs solltest du die Thumbnail-Option verwenden, da diese kleine quadratische Bilder anzeigt. Für Seitenleisten eignen sich am besten 2 Spalten in der Breite. Die Anzahl der Reihen, kannst du je nach Belieben und Look deines Blogs festlegen. Je größer, desto offensichtlicher.
  2. Für eine Verwendung unter einer eigenen Seite z.B. namens „Meine Online Shop“ empfiehlt sich die Option Galerie-Ansicht. Deine Produkte werden genauso wie in deinen Etsy Shop angezeigt. Wieviele Reihen und Spalten du brauchst, liegt vor allem an den Dimensionen deiner Webseite bzw. deines Blogs. Fang doch einfach mal mit vier Spalten (Breite) und vier Reihen (Höhe) an. Falls es nicht passt, kannst Du es später immer noch ändern.

Etwas weiter unten solltest du schon eine Vorschau deines Mini Etsy sehen können und darunter ein  Feld mit einem Code. Keine Angst! Du musst den Code nur kopieren und dann in deinem Blog wieder einfügen, mehr nicht. Wo, zeigen wir dir gleich.

Mini Etsy in der Gallerie Option, um eine eigene Shop Präsenz auf einem Blog einzubinden.

Die Gallerie Option gibt dir die Möglichkeit einen richtigen kleinen Shop in deine Seite einzubinden.

nach oben

Blogspot / Blogger

Kopiere den JavaScript-Code aus dem Feld (siehe Bild oben) und öffne ein neues Tab in deinem Browser. Tippe www.blogger.com/home in die URL-Zeile und logge dich in deinen Blog ein. Im Blogger-Dashboard wählst du nun das Blog aus, in das du dein Mini Etsy einfügen willst. Klicke dafür auf den Namen des Blogs:

Mini Etsy in einen Blogspot / Blogger Blog einfügen. Den Blog öffnen.

Klicke im Dashboard auf den Namen des Blog um die Übersicht zu öffnen.

In der Übersicht klickst du in der linken Leiste auf Layout. Im Layout-Bereich kannst du sogenannte Gadgets in deinen Blog einfügen, entfernen, bearbeiten und verschieben. Um dein Mini Etsy in die Seitenleiste einzufügen, klicke an dem gewünschten Ort auf Gadget hinzufügen. 

Mini Etsy in Blogger Blog einfügen. Im Layout Bereich ein Gadget hinzufügen.

Klicke auf „Gadget hinzufügen“ um dein Mini Etsy einzubinden.

Es öffnet sich nun ein Pop Up Fenster Gadget hinzufügen. Scrolle runter und suche nach HTML/JavaScript. Klicke auf das kleine blaue Kreuz rechts und es öffnet sich das Fenster HTML/JavaScript konfigurieren. Hier gibst du deinem Mini Etsy einen Namen (Titel) und kopierst den JavaScript-Code in das „Content“-Feld. Klicke anschließend Speichern.

Den JavaSript Code für dein Mini Etsy in das Blogger Gadget kopieren

Kopiere den Code in das „Content“-Feld.

Wenn du ein Gadget in der Position verschieben willst, klicke an und schiebe es an die gewünschte Stelle. Ganz einfach, das nennt man Drag & Drop. Wenn du fertig bist, klicke oben rechts in der Layout-Übersicht auf Layout speichern und dann auf Vorschau um dir dein fertiges Mini Etsy anzuschauen.

Dein Mini Etsy als eigener Shop mit Seitenreiter

Solltest du dein Mini Etsy lieber auf einer eigenen Seite innerhalb deines Shops anzeigen wollen, klicke in deiner Blog-Übersicht in der linken Leiste auf Seiten (wenn du keinen Link zu „Seiten“ siehst, schau im Layout nach, ob das Gadget „Seiten“ aktiviert bzw. eingefügt ist). Es empfiehlt sich hinter Seiten anzeigen als die Option Top-Tabs auszuwählen. Klicke nun oben auf Neue Seite und wähle Leere Seite aus.

Dein Mini Etsy in eigene Seite in Blogspot einfügen

Gebe deiner Seite einen Namen, schalte auf HTML um und kopiere den JavaScript Code in das Feld.

Hier gibst Du Deiner neuen Shop Seite einen Namen und fügst dann den Code dort ein, wo Du normalerweise den Text einfügen würdest. Achte allerdings darauf, dass Du vorher auf „html“ umstellst. Klicke dann speichern und veröffentlichen. Fertig!

Dein Mini Etsy als eigene Seite und eigener kleiner Online Shop in deinem Blogspot Blog.

Dein Mini Etsy sieht wie ein eigener Online Shop auf deinem Blog aus.

nach oben

Tumblr

Kopiere den JavaScript-Code aus dem Feld (siehe Bild oben) und öffne ein neues Tab in deinem Browser. Tippe www.tumblr.com/dashboard in die URL-Zeile und logge dich in deinen Blog ein. Im Tumblr-Dashboard wählst du in der oberen Reihe das kleine Zahnrad (Einstellungen) aus. Im Einstellungsmenü wählst du links das Blog aus, in das du dein Mini Etsy einfügen willst und klickst dann unter deinem Template (Blog-Vorlage) auf Anpassen. Es öffnet sich nun dein Blog in der Template-Ansicht mit einer Einstellungsleiste auf der linken Seite.

Um dein Mini Etsy in der Seitenleiste (Position je nach Template unterschiedlich) einzufügen, kopiere den JavaScript-Code und füge ihn in das Kästchen Beschreibung ein.

Ein Mini Etsy in die Seitenleiste deines Tumblr Blogs einfügen.

Abhängig vom Template kannst du mit diesem einfach Trick ein Mini Etsy in die Seitenleise deines Tumblr Blogs einfügen.

Dein Mini Etsy als eigener Shop mit Seitenreiter

Um in einem Tumblr Blog ein Mini Etsy als optisch eigenständiger Shop einzubinden ist etwas kniffeliger. Rupa von AnOctopusADay teilte ihr ausgetüfteltes Geheimrezept mit euch im Etsy Business Topics Team:

Schaut dazu als allererstes in eurem Template nach, ob dieses die Seitenfunktion unterstützt und wo diese dann auf dem Blog angezeigt werden. Ich verwende im Folgenden das Template Quite Big theme von George Dunkley.

1. Kopiere den JavaScript Code (Galerie-Option), den die Mini Etsy Seite für dich generiert.

2. Öffne einen einfachen Texteditor wie z.B. Notepad oder TextEdit, füge den Code ein und speichere die Datei unter „minietsy.html“ bzw. wähle als Dateiformat „Webseite (.html)“. Achte darauf, dass es sich bei dem Text um „reinen Text“ handelt, sonst wandel ihn in solchen um (z.B. in TextEdit: Format > In reinen Text umwandeln). Prüfe auch noch mal, ob die Datei wirklich auf „.html“ endet und nicht auf „.html.txt“.

3. Schließe den Text-Editor und doppelklicke auf die Datei, die du gerade erstellt hast. Sie sollte sich in deinem Browser öffnen (Ich mache das hier übrigens alles in Chrome – nur mal so am Rande). Du solltest jetzt die Shop-Galerie sehen.

4. Kopiere alles direkt aus deinem Browserfenster, nicht aus der Quellcode-Ansicht.

5. Um Seiten in deinem Blog anzulegen, gehe wie oben zu den Einstellungen > Blog auswählen > Anpassen. Wenn sich dein Blog mit der Einstellungsleise links öffnet, scrolle dort runter bis zum Kästchen Seiten und klicke auf Eine Seite hinzufügen. Es öffnet sich das Pop-Up Fenster Seite bearbeiten (wenn nicht, überprüft eure Browser-Einstellungen zu Pop-Ups).

6. Füge die kopierte Seite direkt in das Feld Body ein (NICHT in der HTML Ansicht, ganz normal). Dann alles speichern, Blog öffnen und ausprobieren!!

Dein Mini Etsy als eigenständige Seite in einen Tumblr Blog einbinden.

Bei Tumblr Templates mit einer Seitenfunktion kann man mit einem Kniff ganz leicht seinen Shop auf einer eigenen Seite einbinden.

Für Fortgeschrittene: Du kannst auch noch ein bisschen an der Breite (width) oder der Ausrichtung (align=“center“) des Mini Etsy pfeilen, in dem du in den HTML Modus wechselst.  Schau mal hinter den ersten p tag. Super viel kann man jetzt nicht ändern, aber immerhin.

Klickst du jetzt auf deinem Blog auf dem Link / den Reiter zu deiner Seite, öffnet sich quasi ein eigener kleiner Mini Etsy Shop.

Dein Mini Etsy als eigene Seite in deinem Tumblr Blog.

Ein Mini Etsy als eigene Seite in einem Tumblr Blog.

nach oben

WordPress

…. folgt bald.

***

Herzlichen Glückwunsch! Nun ist Dein Etsy Shop in Deinen Blog integriert und jeder, der auf eines der Etsy-Bilder klickt, wird direkt auf die Etsy-Seite weitergeleitet und kann dort Deine Produkte erwerben. Wenn Du willst, kannst Du den Link zu Deinem neu integrierten Shop unten im Kommentar-Abschnitt hinterlassen, damit wir ihn alle bewundern können. Wer weiß, vielleicht gewinnst Du dadurch sogar noch neue Kunden?

Du willst deinen Shop noch anderweitig promoten? Super, dann haben wir hier noch ein paar Artikel für dich:

***

Etsy Deutscher Newsletter   –   Etsy Verkäufer Newsletter

5 Kommentare

  • FibrePiratess

    Jasna von FibrePiratess hat vor 6 Jahre gesagt

    Seltsamerweise funktioniert das nicht, wenn ich bei Blogspot eine eigene Seite anlegen will. Da wird dann nichts angezeigt :-(

  • EggbertTurkey

    Gemma von EggbertAndTurkey hat vor 6 Jahre gesagt

    Es funktioniert auch nicht auf Tumblr! :-(

  • fyaule

    Theres Kubitz von einfachtagfuertag hat vor 6 Jahre gesagt

    ich werde mich mal daran versuchen gibt es zur not auch noch bei problemen hilfe?

  • Emelice

    Stefanie Haferanke von Emelice hat vor 6 Jahre gesagt

    Habe es versucht in Blogger einzubinden, jedoch ist der Content auf der Seite dann leer, wo der Mini Shop sein sollte. (Überschrift wird dennoch angezeigt)

  • Geldverdienen mit Blogs: Selbstgedrucktes verkaufen — Conterest Blog hat vor 3 Jahre gesagt

    […] Etsy […]

Einloggen und eigene hinzufügen