Index

Eigene Angebotsdesigns erstellen

Übersicht

Mit GarageSale können Sie eigene Angebots-Designs erstellen oder integrierte Designvorlagen anpassen. HTML-Kenntnisse sind hierfür jedoch zwingend erforderlich.

GarageSale’s Designvorlagen sind Ordner, deren Namen mit dem Suffix “.designTemplate” enden. In einem “.designTemplate” Ordner müssen sich zumindest zwei Datein befinden: Info.plist und body.html.

• Die body.html Datei enthält gewöhnlichen HTML-Code mit zusätzlichen Befehlen aus der “GarageSale-Vorlagensprache”, um dem aktuellen Angebot Eigenschaften (z.B. Title, Beschreibung und Bilder) hinzuzufügen.

• Die Info.plist Datei enthält Information zu der Designvorlage selbst, wie den Namen, die Version und eine Auflistung der Bilder, die in der Vorlage verwendet und auf einem Remote-Web-Server gespeichert werden.

Um eigene Designvorlagen zu erstellen, können Sie das “Design Utility” verwenden oder das Design von Hand erstellen. Das Design Utility kann hier herunterdeladen werden: Design Utility herunterladen. Einsteiger sollten ein bestehndes Angebotsdesign duplizieren und alle Modifikationen an diesem Duplikat vornehmen. Wenn Sie dies tun, achten Sie darauf, dass Sie in der “info.plist” Datei eine einmalige Identifikations-ID verwenden.

Designvorlagen lokalisieren und speichern

Das oben erwähnte Design Utility ermöglicht Ihnen, GarageSales Designvorlagen zu lokalisieren und zu bearbeiten. Sie können auf GarageSales integrierte Designvorlagen jedoch auch zugreifen, indem Sie die Control/Steuerung Taste gedrückt halten, während Sie auf das GarageSale Programmsymbol klicken. In dem Kontextmenü wählen Sie anschliessend “Paketinhalt zeigen” und navigieren zu Contents > Resources > DesignTemplates. Bitte duplizieren Sie die Vorlagen unbedingt bevor Sie Veränderungen vornehmen.

Damit GarageSale auf Ihre modifizierten Designvorlagen zurückgreifen kann, müssen Sie diese in der GarageSale Datenbank in Ihrer Benutzer-Library sichern. Um auf die Datenbank zurückzugreifen, klicken Sie in GarageSales Hilfe-Menü einfach auf “Benutzer-Library öffnen”.

Erstellen Sie einen neuen Ordner namens “DesignTemplates”, um dort Ihre modifizierten Vorlagen zu speichern.

Designvorlagensprache

Um ein eigendes Angebotsdesign für GarageSale zu erstellen, müssen Sie sogenannte Makrosprachbefehle aus GarageSales Designvorlagensprache in Ihren HTML-Code eingeben.

Nehmen wir an, dass Sie den Angebotstitel, die Artikelbeschreibung und -bilder in Ihrem Angebotsdesign anzeigen lassen möchten. Mithilfe der Makrobefehle können Sie GarageSale ganz einfach mitteilen, wo diese Elemente eingefügt werden sollen. Hier sehen Sie ein einfaches Beispiel:

<h1>[[item.title]]</h1>
<div>[[listingDescription]]</div>
[[foreach image item.auctionImages imagesMainLoop]]
	<img src="[[image.imageURL]]">
[[endforeach imagesMainLoop]]

GarageSale unterscheidet zwischen HTML und Makrosprachbefehlen mittels doppelter eckiger Klammern. Das bedeutet, dass Makrosprachbefehle zwischen folgende Charaktere eingebettet sein müssen: [[ und ]] oder {{ und }}.

Makrosprachbefehle können sowohl im HTML-Code der Designvorlage selbst, als auch direkt in der Artikelbeschreibung in GarageSales Bearbeitungsmodus verwendet werden.

Objekt-Platzhalter

Manche Makrobefehle sind Platzhalter, die durch Objekte ausgetauscht werden, wenn eine Designvorlage auf eine Artikelbeschreibung angewendet wird. Wenn sich der Platzhalter auf ein String-Objekt bezieht (z.B. [[listingDescription]], wird es durch diesen String ersetzt. Wenn es sich um eine andere Objektart handelt, können Sie einen Punktoperator verwenden, um auf die Eigenschaften des Bezugobjektes zurückzugreifen (z.B. [[item.title]]).

[[ und ]] werden sofort aufgelöst, wenn Sie GarageSales Vorschaubearbeitung verwenden oder wenn das Angebot zu eBay hochgeladen ist. Daher sollten diese Charaktere nicht in der Artikelbeschreibung Verwendung finden, wenn Sie in GarageSales Vorschaumodus arbeiten.

Stattdessen sollten Sie die Charaktere {{ und }} verwenden. Platzhalter, die mit diesen Charakteren versehen sind, lösen sich nur vorrübergehend auf, wenn Sie im Vorschaumodus die Steuerung/Control- und Wahl/Option-Taste gleichzeitig drücken und wenn das Angebot bei eBay eingestellt wird.

Control Statements

Die zweite Art von Makrosprachbefehlen sind sogenannte Control Statements. Diese können je nach Bedingungen auf verschiedene HTML-Aspekte der Titelbeschreibung angewendet werden. Sie können z.B. if für Konditionen oder for Schleifen verwenden, um die Bildanzahl des Angebots einzustellen.

If Statements

Ein if statement hat in GarageSales Makrosprache folgende Form:

[[if condition]]
	<code to include>
[[else]]
	<alternate code to include>
[[endif]]

Der Code zwischen den Befehlen if und endif wird nur dann zu dem Angebot hinzugefügt, wenn die “Kondition” wahr ist oder das Bezugsobjekt definifert ist. Hier ist ein Beispiel für ein if statement, dass einen Untertitel hinzufügt, wenn der Anwender einen solchen angegeben hat:

[[if item.subTitle]]
	<h2> [[item.subTitle]] </h2>
[[endif]]

Foreach Statements

Ein foreach Statement kann zusätzlichen Text in der Designvorlage für jeden Artikel in einer Liste enthalten, z.B. für jedes Angebotsbild. Eine foreach-Schleife hat folgende Form:

[[foreach item itemList loopIdentifer]]
	<code to include>
[[endforeach loopIdentifier]]

item bezieht sich auf einen Artikel, der in itemList enthalten ist, jedes Mal, wenn die foreach-Schleife wiederholt wird. Der loopIdentifier wird als Match für foreach and endforeach verwendet, wenn Sie mehrere Schleifen einnesten. Hier ein Beispiel für ein foreach statement, dass eine HTML-Bild-Referenz für jedes Angebotsbild enthält:

[[foreach image item.auctionImages imagesMainLoop]]
	<img src="[[image.imageURL]]">
[[endforeach imagesMainLoop]]

Wenn Sie eine solche foreach-Schleife nur dann einbeziehen möchten, wenn Sie nicht eBay’s Bilderdienst EPS verwenden, ist es schlau, ihre derzeitigen Servereinstellungen zu überprüfen:

[[if preferences.useOwnServer]]
	[[foreach image item.auctionImages imagesMainLoop]]
		<img src="[[image.imageURL]]">
	[[endforeach imagesMainLoop]] 
[[endif]]

Procedure und Call Statements

Wenn Sie die gleichen Zeilen HTML-Code mehrfach in einem Design benötigen, können Sie die Befehle procedure und call verwenden, um Code und Zeit zu sparen.

Dazu müssen Sie das HTML einmal zu Beginn des Codes innerhalb eines Paares von procedure and endprocedure Befehlen wie folgt definieren:

[[procedure my_procedure]] my custom HTML [[endprocedure]]

Später im Code können Sie den Befehl [[call my_procedure]] verwenden, um jedweglichen Code einzubetten, der my_procedure enthält.

Zugriff auf URLs mit einzelnen Bildern

Sie können das [[index item.auctionImageURLs i]] Statement verwenden, um gezielt auf einzelne Bild-URLs zuzugreifen. Ersetzen Sie i mit dem Index des Angebotbildes, dessen URL sie hinzufügen möchten. Bitte beachten Sie, dass das erste Bild über den Index 0 verfügt, das zweite Bild den Index 1 usw. Der folgende Code Ausschnitt würde das erste Bild unmittelbar im Angebotsdesign einfügen:

<img src="[[index item.auctionImageURLs 0]]">

Die Gültigkeit eines Bild-Index überprüfen

Bei manchen Designvorlagen kann es notwendig sein, zu prüfen, ob das Angebot ein zweites Bild enthält, bevor Sie einen gewissen Code in die generierte HTML-Datei einfügen. Mittels der folgenden Syntax können Sie überprüfen, ob ein Angebotsbild mit einem bestimmten Index existiert:

[[if "index item.auctionImageURLs i"]]

i entspricht dem Index, den Sie überprüfen. Bitte bedenken Sie, dass der Bilderindex mit 0 beginnt.

Dieser Beispielcode enthält nur HTML-Code für ein zweites Bild, falls dieses auch wirklich existiert:

[[if "index item.auctionImageURLs 1"]]
	<img src="[[index item.auctionImageURLs 1]]">
[[endif]]

Das Hinzufügen von Versandinformationen zum Angebot

Wenn Sie berechneten Versand verwenden (nur eBay.com), können Sie die Packetinformationen, die Sie in GarageSales Versandoptionen hinterlegt haben, direkt im Angebotsdesign hinterlegen.

[[if item.shippingOptions.usesCalculatedShipping]]
	<b>Shipping Dimensions:</b><br>
	Weight: [[item.shippingOptions.packagePounds]] lbs [[item.shippingOptions.packageOunces]]<br>
	Dimension:[[item.shippingOptions.packageWidth]] x [[item.shippingOptions.packageLength]] x [[item.shippingOptions.packageDepth]]
[[endif]]

Designvorlagen-Platzhalter

Die folgenden Platzhalter können in der body.html-Datei einer Designvorlage verwendet werden. Die einzelnen Eigenschaften eines Angebots können über diese Platzhalter erreicht werden:

Angebotseigenschaften

Bildereigenschaften

Die einzelnen Eigenschaften eines Bildes erreichen Sie über diese Platzhalter:

Einstellungseigenschaften

Verwenden Sie das Einstellungs-Objekt, um Eigenschaften für die GarageSale Einstellungen anzufragen:

Versandoptionseigenschaften

Sie können auf die Eigenschaften der Versandoptionen zurückgreifen, um Versandinformationen zur Artikelbschreibung hinzuzufügen.

Beispiele

Alle Artikelmerkmale in der Beschreibung anzeigen:

<table>
[[foreach attr item.previewSpecifics attLoop]]
<tr><td>[[attr.name]]</td><td>[[attr.value]]</td></tr>
[[endforeach attLoop]]
</table>

Alle Artikelmerkmale inklusiver aller Mehrfach-Werten in der Beschreibung anzeigen:

<table>
[[foreach attr item.previewSpecifics attLoop]]
<tr>
<td style="padding-right: 5px"><b>[[attr.name]]:</b></td>
<td>
[[foreach attrValue attr.values valueLoop]][[if attrValueIndex > 0]], [[endif]][[attrValue]][[endforeach valueLoop]]
</td>
</tr>
[[endforeach attLoop]]
</table>

Nur bestimmte Artikelmerkmale in der Beschreibung anzeigen:

<table>
[[foreach attr item.previewSpecifics attLoop]]
[[if attr.name=="Brand"]]<tr><td>[[attr.name]]</td><td>[[attr.value]]</td></tr>[[endif]]
[[if attr.name=="Color"]]<tr><td>[[attr.name]]</td><td>[[attr.value]]</td></tr>[[endif]]
[[endforeach attLoop]]
</table>

Werte von bestimmten Mehrfach-Artikelmerkmal-Attributen in der Artikelbeschreibung anzeigen (z.B. Mehrfachnennungen beim Feld “Autor” oder “Features”):

[[foreach attr item.previewSpecifics attLoop]]
[[if attr.name=="Autor"]]
[[foreach authorName attr.values valueLoop]]
<b>Autor: [[authorName]]</b></br>
[[endforeach valueLoop]]
[[endif]]
[[endforeach attLoop]]