{"id":5483,"date":"2026-03-03T21:23:45","date_gmt":"2026-03-03T20:23:45","guid":{"rendered":"https:\/\/support.sparkles.io\/kennisbank\/editor-basics-wie-funktioniert-der-editor\/"},"modified":"2026-10-28T14:10:03","modified_gmt":"2026-10-28T13:10:03","slug":"editor-basics-wie-funktioniert-der-editor","status":"publish","type":"ht_kb","link":"https:\/\/support.sparkles.io\/de\/kennisbank\/editor-basics-wie-funktioniert-der-editor\/","title":{"rendered":"Designer Editor Basics \u2013 Wie funktioniert der Editor?"},"content":{"rendered":"\n

1. Dateien speichern<\/h2>\n\n

Ein Designer\/Shopbetreiber kann Karten auf seine eigene gew\u00fcnschte Weise entwerfen und erstellen. Ob dies in Adobe InDesign, Photoshop oder Illustrator geschieht, entscheidet der Designer selbst. <\/p>\n\n

Sobald die Kollektion fertig ist, legst du diese dem Shopbetreiber des entsprechenden Shops vor. Nach Freigabe durch den Shopbetreiber k\u00f6nnen die Karten f\u00fcr das Layout im Editor verarbeitet werden. Zuvor m\u00fcssen jedoch Dateien erstellt werden, die nach bestimmten Spezifikationen aufbereitet sein m\u00fcssen. Diese werden unten erl\u00e4utert. <\/p>\n\n

<\/p>\n\n

Hintergr\u00fcnde und Objekte<\/h4>\n\n
Quadratisch<\/strong><\/td>500 x 500 pt (im Editor 480 x 480 pt). Der Beschnitt betr\u00e4gt 10 pt an jeder Seite. <\/td><\/tr>
Rechteckig<\/strong><\/td>750 x 510 pt oder 510 x 750 pt (im Editor 720 x 480 pt oder 480 x 720 pt). Der Beschnitt betr\u00e4gt 15 pt an jeder Seite. <\/td><\/tr>
Abweichendes Format<\/strong><\/td>Zum Beispiel Panorama oder l\u00e4nglich. Der Hintergrund darf im Format des Produkts angelegt werden, zum Beispiel 1020 x 2120 pt. Der Beschnitt betr\u00e4gt 10 pt an jeder Seite. <\/td><\/tr>
Aufl\u00f6sung<\/strong><\/td>Immer 300 dpi in der Gr\u00f6\u00dfe, in der du das Bild platzieren m\u00f6chtest.<\/td><\/tr>
Dateityp Photoshop<\/strong><\/td>Als JPG oder PNG speichern. F\u00fcr Fotos oder Hintergr\u00fcnde verwendest du JPG. F\u00fcr freigestellte Objekte wie ein Label oder eine Kordel verwendest du PNG. <\/td><\/tr>
Dateityp Illustrator<\/strong><\/td>Als SVG speichern. Nur Vektoren verwenden. Diese k\u00f6nnen im Editor einfach farblich angepasst werden, auch in Folienfarben. Lies hier<\/a>, wie du eine SVG erstellst. Eine Online-Konvertierung von PNG zu SVG reicht nicht aus. Die hieraus resultierende SVG enth\u00e4lt Pixel und keine Vektoren<\/td><\/tr>
Farbeinstellung<\/strong><\/td>Verwende immer das Farbprofil sRGB, kein RGB.<\/td><\/tr>
Farbiger Hintergrund<\/strong><\/td>Wenn du eine Vollfl\u00e4che ohne Design verwendest, kannst du dies im Editor als Hintergrundfarbe einstellen. Eine separate Datei ist dann nicht erforderlich. <\/td><\/tr>
Hintergrund mit Muster<\/strong><\/td>Enth\u00e4lt der Hintergrund ein Layout wie eine Struktur oder ein Muster, speichere diesen gem\u00e4\u00df den oben genannten Spezifikationen, zum Beispiel 500 x 500 pt.<\/td><\/tr>
Elemente<\/strong> \/ Clip-Arts<\/td>Alle Illustrationen und Objekte m\u00fcssen einzeln gem\u00e4\u00df den oben genannten Formaten gespeichert werden, maximal 500 x 500 pt oder maximal 750 x 510 pt. Gib den Dateien logische Namen wie pfeil_1, pfeil_2 usw. <\/td><\/tr>
Bleed<\/strong><\/td>Um die Leinwand herum befindet sich eine Sicherheitsmarge. Bleed (Beschnitt) ist zus\u00e4tzlicher Raum um dein Design, der au\u00dferhalb des Endformats liegt und nach dem Druck weggeschnitten wird. Bilder haften automatisch an der Innen- oder Au\u00dfenseite der Sicherheitsmarge, niemals am Rand der Karte. Dies stellt sicher, dass keine Blitzer entstehen. <\/td><\/tr><\/tbody><\/table><\/figure>\n\n

<\/p>\n\n

\"editor-background-instellingen-1024x623<\/figure>\n\n

Hintergrundeinstellungen<\/em><\/p>\n\n

warning<\/i><\/div><\/div>

Anmerkung<\/h3>

Es ist wichtig, dass du den Beschnitt (Bleed) in dein Design der Karte einplanst.<\/p><\/div><\/div><\/div>\n\n

2. Karte im Editor aufbauen<\/h2>\n\n

Um eine Karte im Editor aufzubauen, musst du dich zuerst auf der entsprechenden Website einloggen, f\u00fcr die du die Karten entwerfen wirst, zum Beispiel www.madeformoments.nl<\/a> oder www.prettyorange.nl<\/a>. Klicke oben rechts, um dich mit den Daten einzuloggen, die du vom Shopbetreiber erhalten hast. <\/p>\n\n

Klicke auf die Schaltfl\u00e4che, um eine Karte zu erstellen. Dies variiert je nach Shop. <\/p>\n\n

\n
\n
\"editor-zelfmaken-HG<\/figure>\n<\/div>\n\n\n\n
\n
\"editor-zelfmaken-PO<\/figure>\n<\/div>\n<\/div>\n\n

Beispiele f\u00fcr \u201eSelbst gestalten\u201c-Seiten<\/em><\/p>\n\n

W\u00e4hle den gew\u00fcnschten Kartentyp, zum Beispiel quadratisch, Hochformat oder Querformat. Der Editor wird nun gestartet. Entferne eventuell das vorhandene Layout, das bereits im Editor steht. <\/p>\n\n

\"kaarttype<\/figure>\n\n

Kartentyp w\u00e4hlen<\/em><\/p>\n\n

2.1 Hintergrund hochladen<\/h2>\n\n

Klicke rechts im Men\u00fc auf \u201eHintergrund<\/strong>\u201c und danach auf \u201eEigenes Foto hochladen<\/strong>\u201c. Der Hintergrund wird inklusive Beschnitt vollst\u00e4ndig ausgef\u00fcllt. Achte bei Mustern darauf, dass diese sauber \u00fcber mehrere Seiten verlaufen, damit keine Verspr\u00fcnge entstehen. <\/p>\n\n

\n
\n
\"zelf-maken-editor-1024x557<\/figure>\n<\/div>\n\n\n\n
\n
\"menu-editor<\/figure>\n<\/div>\n<\/div>\n\n

Karte im Editor designen<\/em><\/p>\n\n

<\/p>\n\n

Es ist auch m\u00f6glich, dem Hintergrund eine gleichm\u00e4\u00dfige Volltonfarbe zuzuweisen. Alternativ kann der Karte ein voreingestellter Kraftpapier-Hintergrund zugewiesen werden. Dies ist nur m\u00f6glich, wenn die betreffende Karte im System als Kraftpapierkarte definiert wurde. Kraftpapier<\/a><\/p>\n\n

\"editor-achtergrond-1-1024x700<\/figure>\n\n

<\/p>\n\n

2.2 Objekte hochladen<\/h2>\n\n

Klicke rechts im Men\u00fc auf \u201eBilder und Verzierungen\u201c und danach auf Eigenes Foto hochladen<\/strong>. W\u00e4hle das Objekt aus, das du verwenden m\u00f6chtest, zum Beispiel einen Stern. Skaliere das Objekt, indem du die Ecken nach innen oder au\u00dfen ziehst. <\/p>\n\n

\n
\n
\"editor-kaart-maken-1024x557<\/figure>\n<\/div>\n\n\n\n
\n
\"menu-editor-2<\/figure>\n<\/div>\n<\/div>\n\n

Karte im Editor designen<\/em><\/p>\n\n

Wenn du ein schwarzes SVG-Clipart-Objekt verwendest, kannst du die Farbe einfach \u00fcber die Farbeinstellungen im Editor anpassen.<\/p>\n\n

\"Kleurenmenu<\/figure>\n\n

Standard-Editor-Farben<\/em><\/p>\n\n

\"customkleuren<\/figure>\n\n

F\u00fcge hier den Farbcode ein, den du beispielsweise in Photoshop oder mit einem Colorpicker messen kannst, wie #5b7587.<\/p>\n\n

Gestalte auf diese Weise die gesamte Karte, bis alle Objekte korrekt platziert sind.<\/p>\n\n

<\/p>\n\n

2.3 Texte platzieren<\/h2>\n\n

Klicke im Editor auf \u201eText\u201c und danach auf \u201eNeues Textfeld hinzuf\u00fcgen\u201c. Du kannst hier ganz einfach Texte hinzuf\u00fcgen und bearbeiten. <\/p>\n\n

\n
\n
\"teksten-toevoegen-1024x557<\/figure>\n<\/div>\n\n\n\n
\n
\"menu-editor-3<\/figure>\n<\/div>\n<\/div>\n\n

Texte zu einer Karte hinzuf\u00fcgen<\/em><\/p>\n\n

Innerhalb des Editors kannst du die Schriftart, Schriftgr\u00f6\u00dfe, Farbe, Ausrichtung und andere Formatierungen anpassen.<\/p>\n\n

lightbulb_outline<\/i><\/div><\/div>

Tipp<\/h3>

Viele Tastenkombinationen aus Adobe funktionieren auch im Editor, wie Kopieren und Einf\u00fcgen mit Cmd+C und Cmd+V sowie ein Schritt zur\u00fcck mit Cmd+Z.<\/p><\/div><\/div><\/div>\n\n

Im rechten Men\u00fc stehen die folgenden Funktionen zur Textbearbeitung zur Verf\u00fcgung:<\/p>\n\n

\"editor-tekst1-1024x747<\/figure>\n\n
    \n
  • Schriftart<\/strong> \u2013 aus der voreingestellten Auswahl.<\/li>\n\n\n\n
  • Farbe<\/strong> \u2013 die feste Farpalette<\/li>\n<\/ul>\n\n
    \"kleuren-oallet<\/figure>\n\n
      \n
    • Gr\u00f6\u00dfe<\/strong> \u2013 diese Punktgr\u00f6\u00dfe ist nur im Editor relevant. Bei der Bestellung im Kartenformat wird diese Punktgr\u00f6\u00dfe proportional vergr\u00f6\u00dfert oder verkleinert. W\u00e4hle daher eine durchschnittliche Gr\u00f6\u00dfe im Editor. <\/li>\n\n\n\n
    • Stil<\/strong> \u2013 Fett \/ Kursiv \/ Unterstrichen.<\/li>\n\n\n\n
    • Ausrichtung<\/strong> \u2013 Links \/ Zentriert \/ Rechts \/ Blocksatz.<\/li>\n\n\n\n
    • Zeilenh\u00f6he \u2013 Abstand zwischen den Zeilen: 0,85 \/ 1 \/ 1,15 \/ 1,5 \/ 2 \/ 3.<\/li>\n\n\n\n
    • Spiegeln<\/strong> \u2013 \u00fcber die vertikale oder horizontale Achse.<\/li>\n\n\n\n
    • Transparenz<\/strong> \u2013 hiermit gibst du \u00fcber einen Wert oder den Schieberegler an, wie viel Prozent der Text durchscheinen soll.<\/li>\n\n\n\n
    • Drehen<\/strong> \u2013 steht standardm\u00e4\u00dfig auf Null und kann \u00fcber einen Wert oder den Schieberegler in den Minus- oder Plusbereich gedreht werden.<\/li>\n\n\n\n
    • Position<\/strong> \u2013 dies ist die linke obere Ecke des Rahmens auf der Leinwand des Editors. Die X- und Y-Werte k\u00f6nnen eingegeben werden. <\/li>\n\n\n\n
    • Gr\u00f6\u00dfe<\/strong> \u2013 des Rahmens, die B- und H-Werte k\u00f6nnen eingegeben werden.<\/li>\n<\/ul>\n\n

      <\/p>\n\n

      <\/p>\n\n

      Wenn alle Texte platziert sind und das Layout fertig ist, kann die Karte in der \u201eEigenen Kollektion<\/strong>\u201c \u00fcber die Schaltfl\u00e4che \u201eSpeichern<\/strong>\u201c gespeichert werden. Gib der Karte im Popup einen Namen. <\/p>\n\n

      3. Dem Shop vorstellen<\/h2>\n\n

      Klicke auf die drei Punkte und w\u00e4hle \u201eNeues Design<\/strong>\u201c. Passe den Titel und die Beschreibung an und halte die Beschreibung kurz und deutlich. Klicke auf \u201eZur Pr\u00fcfung speichern<\/strong>\u201c. Die Karte ist nun beim entsprechenden Shop bereit und bleibt in deiner eigenen Kollektion sichtbar. <\/p>\n\n

      \"zelf-kaart-maken-editor-1024x881<\/figure>\n\n

      Karte zur Pr\u00fcfung speichern<\/em><\/p>\n