Ubercart 2

Wichtige Anmerkung: Die Version dieser Seite ist "pre-pre-alpha". Das bedeutet, dass sowohl Quantität als auch Qualität folgender Informationen mit "ungenügend" zu bewerten wären. Bitte behalten Sie diese Warnung beim Lesen im Hinterkopf. Das Ziel ist selbstverständlich die Verbesserung der Note.

Letzte Änderung: 18.11.2011

Basisinstallation von Drupal und Ubercart

Installation mit Aktivierung der deutschen Sprache

Diese Beschreibung nimmt an, dass Sie die deutschsprachige Drupal-Version 6.x von drupalcenter.de installieren. Unterschiede zwischen den Versionen von drupalcenter.de und von drupal.org gibt es lediglich in folgenden Punkten:

  • Die Version von drupalcenter.de enthält ein Installationsprofil für die deutschsprachige Lokalisierung. Sie finden dieses im Drupalverzeichnisbaum unter profiles/drupalcenter. Dieses Installationsprofil sollten Sie bei der Installation auswählen. Das Installationsprofil aktiviert das Module "locale".
  • Die Version von drupalcenter.de enthält für die Module und einige Themes deutsche Sprachdateien. Diese finden Sie z. B. unter
    • modules/aggregator/translations/modules-aggregator.de.po
    • modules/block/translations/modules-block.de.po
    • modules/blog/translations/modules-blog.de.po
    • ...

Eigentlich sollte Drupal Sie nach der Installation direkt in deutscher Sprache begrüßen. Das funktioniert allerdings gelegentlich nicht. Führen Sie folgende Schritte aus, falls Drupal bei Ihnen Texte in englischer Sprache ausgibt.

  • Laden Sie sich die deutsche Übersetzungsdatei für Drupal 6 (diese Anleitung geht davon aus, dass Sie Drupal 6 installiert haben) von http://localize.drupal.org/translate/languages/de herunter.
  • Importieren Sie die Übersetzungsdatei auf der Seite admin/build/translate/import Ihrer Drupalinstalation. Achten Sie darauf, dass Sie im Abschnit "Import into" die Option "German" ausgewählt haben. Nun sollte admin/build/translate zu den übersetzten Zeichenketten etwa die Angabe 3115/3120 (99.84%) machen.

Drupal sollte jetzt nahezu alle Texte in deutscher Sprache ausgeben. Es folgt die Installation von Ubercart und dessen Übersetzungen.

Nachdem wir die Module Ubercart und Token (Ubercart hängt von Token ab) von

heruntergeladen und entpackt haben, aktivieren wir auf http://www.example.com/admin/build/modules die folgenden Module:

  • Cart
  • Conditional Actions
  • Order
  • Product
  • Store

Ein Klick auf "Konfiguration speichern" nennt dann die vorausgesetzten Module und schlägt sie zur Installation vor, was wir mit einem Klick auf den Button "Weiter" bestätigen.

Die Einrichtung der deutschen Übersetzung von Ubercart erledigen Sie wie folgt:

  • Laden Sie die für Ihre Ubercartversion passende deutsche Übersetzungsdatei von ftp://ftp.drupal.org/pub/drupal/files/translations/6.x/ubercart/ herunter - also z. B. die Datei ubercart-6.x-2.7.de.po.
  • Die heruntergeladene Datei importieren Sie auf admin/build/translate/import. Bei "Modus" gibt es die Auswahl "Zeichenketten in der hochgeladenen Datei ersetzen bereits Vorhandene; Neue werden hinzugefügt." Ich wähle diese aus, bin mir aber nicht sicher, ob das wirklich empfehlenswert ist.

Für weitere Tests brauchen wir einen Testartikel, den wir auf http://www.example.com/node/add/product anlegen, wo wir lediglich die Felder für "Name", "Artikelnummer" und Preis ausfüllen. Alles andere ist optional. Der angelegte Artikel sollte nun auf der Startseite http://www.example.com/ zu sehen sein.

Währung und andere Formate einstellen

Auf http://www.example.com/admin/store/settings/store/edit/format setzen wir im Abschnitt "Währungsformat" folgendes:

  • Standard Währung: EUR
  • Währungszeichen: €
  • "Währungszeichen nach dem Betrag anzeigen" aktivieren
  • Tausender Trennzeichen: .
  • Dezimal Trennzeichen: ,

Im Abschnitt "Datumsformat" auf derselben Seite schreiben wir in das Feld "Standard Stringformat:" den Wert d.m.Y. [Ohne den letzten Punkt.]

Mehrwertsteuer

Das Modul uc_vat in Verbindung mit dem Ubercart-Core-Modul "Taxes" kümmert sich um alles, was in Zusammenhang mit der Mehrwertsteuer relevant ist. Beim Schreiben folgender Zeilen ist Version 6.x-1.2 des Moduls uc_vat aktuell.

Nachdem wir die beiden genannten Module, die Sie in der Modulliste unter den Namen "Taxes" und "VAT" finden, aktiviert haben, erstellen wir zunächst auf der Seite http://www.example.com/admin/store/settings/taxes/add, die von dem Core-Modul "Taxes" erzeugt wird, einen neuen Steuersatz. Füllen Sie dazu das Formular auf der Seite so aus, wie der folgende Screenshot zeigt:

Steuersatz anlegen

Nun konfigurieren wir auf der Seite http://www.example.com/admin/store/settings/taxes/vat das Contrib-Modul uc_vat gemäß folgender Einstellungen:

  • Im Feld Tax name den Wert MwSt. eintragen.
  • Die Option Add "including VAT" to tax inclusive product prices. aktivieren.
  • Die Option Add "excluding shipping costs" to shippable product prices and cart displays. aktivieren.
  • Die Checkbox bei Verkaufspreis aktivieren.
  • Die Option Show VAT amounts in the cart and at checkout. aktivieren.
  • Die Option Show VAT amounts in separate columns at checkout. aktivieren.

Auf folgendem Screenshot sehen Sie das Formular mit unseren Einstellungen.

VAT Settings

Wir erstellen nun einen neuen Artikel mit einem Verkaufspreis von 100 Euro, was gemäß unserer Einstellungen inklusive Mehrwertsteuer ist. Eine Artikelseite zeigt nun erwartungsgemäß den Text 100,00€ including 19% MwSt. excluding shipping costs an, wie folgender Screenshot zeigt:

Artikel mit MwSt.

Der Text including 19% MwSt. excluding shipping costs ragt bei dem fett gedruckten Preis rechts aus der Seite heraus, was per theming [ein paar Zeilen weiter unten am Ende dieses Abschnitts beschrieben] zu korrigieren ist. Bei der Preisangabe über dem Button ist die zusätzliche Information ebenfalls zu finden.

Wenn wir den Artikel in den Warenkorb legen, dann sollten wir auf der Seite http://www.example.com/cart mit dem Warenkorb folgendes sehen:

Warenkorb mit korrekter Preisanzeige

Es folgt die angekündigte Anleitung für das Theming des Preises oben rechts. Nebenbei werden wir auch dafür sorgen, dass die Hinweise bzgl. MwSt. und Versandkosten in deutscher Sprache erscheinen. Ziel ist also folgende Darstellung:

Artikelansicht

Es ist erkennbar, dass sich das folgende Vorgehen auch auf den unten links angezeigten Preis auswirkt. Im Abschnitt über die Darstellung von Shopartikeln ist erklärt, wie Sie die Anzeige von dem Preis unten links komplett unterdrücken können. Möglicherweise haben folgende Anpassungen an anderen Stellen unerwünschte Darstellungen zur Folge. Das müssen Sie also nach Durchführung der folgenden Schritte noch abklären.

  1. Schreiben Sie folgende Funktion in die template.php Ihres Themes: 
    function phptemplate_uc_vat_excluding_shipping_costs($element = 'span') {
  if ($link = variable_get('uc_vat_suffix_shipping_link', '')) {
    $output = t('excluding !shipping', array('!shipping' => l(t('shipping costs'), $link)));
  }
  else {
    $output = t('excluding shipping costs');
  }
 
  return '<br /><' . $element . ' class="price-shipping-suffix">' . $output . '</' . $element . '>';
}
    Zweck: Wir überschreiben hiermit die Theme-Funktion uc_vat_excluding_shipping_costs(), die Sie in der Datei uc_vat/uc_vat.theme.inc finden. Die einzige vorgenommene Änderung ist der hinzugefügte Zeilenumbruch in der zurückzugebenden Zeichenkette.
  2. Sorgen Sie dafür, dass folgender CSS-Code aktiviert wird: 
    div.display .uc-price-display {
    width: auto;
    text-align: left;
}
 
div.display .uc-price-display .price-suffixes {
    font-size: 0.7em;
}
  3. Speichern Sie die folgenden Zeilen in einer Datei: 
    msgid "including !taxes"
msgstr "<br />inklusive !taxes"
 
msgid "excluding shipping costs"
msgstr "zzgl. Versandkosten"
    Beachten Sie den Zeilenumbruch in der Übersetzung. Importieren Sie die Datei auf http://www.example.com/admin/build/translate/import.
  4. Leeren Sie den Cache mit dem Button ganz unten auf der Seite http://www.example.com/admin/settings/performance.

Belieferbare Länder festlegen

In dem Formular auf der Seite http://www.example.com/cart/checkout, in dem der Kunde seine Lieferadresse und Rechnungsanschrift eingeben soll, stehen für das Feld "Land" zur Zeit lediglich "Canada" und "United States" zur Verfügung. Um diese beiden Optionen zu entfernen und die Option "Deutschland" hinzuzufügen, gehen wir auf die Seite http://www.example.com/admin/store/settings/countries/edit, wo wir in der Select-Box die Option "germany" auswählen. In der Tabelle unterhalb der Select-Box klicken wir in den Zeilen für "Canada" und "United States" auf den Link "deaktivieren".

Zustimmungspflichtige Allgemeine Geschäftsbedingungen (AGB)

Wenn Sie in Ihrem Shop allgemeine Geschäftsbedingungen verwenden, dann muss ein Kunde diesen explizit zustimmen. Das Modul http://drupal.org/project/uc_termsofservice setzt diese Anforderung um. Nachdem Sie das Modul aktiviert haben, erfolgt die Einrichtigung in folgenden Schritten:

  • Legen Sie eine neue Seite (also einen neuen Node) an, die Ihre AGB enthält. Verwenden Sie dabei den Titel "Allgemeine Geschäftsbedingungen".
  • Auf der Seite http://www.example.com/admin/store/settings/checkout/edit/panes finden Sie den neuen Kassenabschnitt "Terms of Service", der aktiviert sein muss.
  • Auf derselben Seite finden Sie den Abschnitt "Terms of Service Einstellungen". In das Eingabefeld in dem Abschnitt tragen Sie den Titel von dem eben erstellen Node ein, also "Allgemeine Geschäftsbedingungen".
  • Außerdem aktivieren wir die Checkbox zu der Beschreibung "ToS agreement is required"

Der Ergebnis dieser Einstellungen ist, dass der Käufer auf http://www.example.com/cart/checkout den neuen Abschnitt "Allgemeine Geschäftsbedingungen" sieht. Als Titel für den Abschnitt hat das Modul automatisch den Titel des Nodes genommen. Folgender Screenshot zeigt dies:

AGB bestaetigen

Darstellung von Shopartikeln

Grundeinstellungen

Auf http://www.example.com/admin/store/settings/products/edit/fields legen Sie fest, welche Informationen Sie auf den Artikelseiten anzeigen möchten. In der Tabelle finden Sie Artikelfelder mit den Namen "angezeigter Preis" und "Verkaufspreis". Der Preis in beiden Feldern ist immer derselbe. Insofern sind die beiden Felder äquivalent. Sie unterscheiden sich aber in der Darstellung auf der Artikelseite. Betrachten Sie dazu folgenden Screenshot:

Artikelansicht

Der Preis unten links wird genau dann angezeigt, wenn Sie "Verkaufspreis" aktivieren. Der fettgedruckte Preis oben rechts wird genau dann angezeigt, wenn Sie "angezeigter Preis" aktivieren.

Angaben zu Autor und Datum unterdrücken

Damit bei Shopartikeln nicht angezeigt wird, wer den Artikel zu welcher Zeit erstellt hat, entfernen wir auf der Seite http://www.example.com/admin/build/themes/settings im Abschnitt "Autor-Angaben und Datum anzeigen bei" die Checkbox bei "Artikel". Dummerweise steht dort zweimal das Wort "Artikel". Eins von beiden steht für den Shopartikel und eins für einen normalen Textbeitrag. Um welchen es sich handelt, müssen Sie ausprobieren.

Produktbilder

Achtung: Da die im folgenden beschriebene Methode imagecache verwendet, muss clean URL's aktiviert sein und funktionieren. Zudem gibt es mindestens einen Webspaceprovider, bei dem in der .htaccess eine Anpassung gemäß folgender Anweisung, die in der .htaccess steht, vorgenommen werden muss: 

# If your site is running in a VirtualDocumentRoot at example.com,
# uncomment the following line:
# RewriteBase /

Eventuell muss RewriteBase auch auf ein anderes Verzeichnis gesetzt werden. Auch das ist in der .htaccess erwähnt. Für weitere Infos siehe http://drupal.org/node/224913 und da den Abschnitt "Rewrite". Bei Problemen mit Bildern sind auch die anderen Abschnitte auf der Seite von Bedeutung.

Nun zur Einrichtung der Bilder: Wir beginnen mit einer frischen Drupal Installation, wobei vorausgesetzt wird, dass Ubercart bereits installiert und aktiviert ist. Um Produktbilder anzeigen zu können, benötigen wir zusätzlich die folgenden Module:

Auf der Seite http://www.example.com/admin/build/modules aktivieren wir nun die folgenden Module:

  • Im Bereich CCK
    • Content
    • FileField
    • ImageField
  • Im Bereich ImageCache
    • ImageAPI
    • ImageAPI GD2
    • ImageCache
    • ImageCache UI
  • Im Bereich Other
    • Thickbox

Gehen wir nun auf die Seite http://www.example.com/admin/store, so sehen wir folgende Information im Bereich "Status messages":

image status messages

Nach einem Klick auf "Click here" sollten wir oben auf der Seite die Meldungen

  • Created field Image
  • Default image support configured for Ubercart products using CCK and ImageCache

sehen. Im Bereich "Status Messages" sollte nun "Product image support has been automatically configured by Ubercart." zu lesen sein. Auf der Seite http://www.example.com/admin/content/node-type/product gibt es einen Bereich "Ubercart Artikel Einstellungen". In dem Drop-Down-Menü darin muss "Image" ausgewählt sein, was aber per default der Fall sein sollte. In dem Formular für die Erstellung eines neuen Shopartikels gibt es jetzt ein neues Feld, um Bilder hochladen zu können. Diese werden dann automatisch auf der Seite mit der Produktansicht dargestellt. Ein Klick auf eines der Bilder in der Produktansicht zeigt die größere Version des Bildes über Thickbox an. Innerhalb der Thickbox kann man mit den Links "weiter" und "zurück" alle Bilder durchlaufen.

Versandkosten

Dieser Abschnitt enthält eine Schritt für Schritt Anleitung zur Konfiguration von Versandkosten, die vom Bestellwert abhängen. Bis 50,00 Euro sollen die Versandkosten 7,00 Euro betragen. Ab 50,00 Euro soll der Versand kostenfrei sein.

  1. Die Module "Shipping Quotes" und "Flatrate" aktivieren. [Es sei explizit erwähnt, dass das Modul "Shipping" in diesem Zusammenhang nicht aktiviert sein muss.]
  2. Auf admin/store/settings/quotes/methods/flatrate auf den Link "Neue Versandpauschale anlegen." klicken und das Formular wie folgt ausfüllen:
    • Bezeichnung der Versandart: Lieferung per Post bis 50 Euro
    • Bezeichnung der Zeile: Lieferung per Post
    • Grund Preis: 8.00
    • Standard Artikel versandkosten: 0
  3. Nochmal auf den Link "Neue Versandpauschale anlegen." klicken und das Formular diesmal so ausfüllen:
    • Bezeichnung der Versandart: Lieferung per Post ab 50 Euro
    • Bezeichnung der Zeile: Lieferung per Post
    • Grund Preis: 0.00
    • Standard Artikel versandkosten: 0
  4. Auf admin/store/settings/quotes/methods/flatrate sollten nun die beiden Berechnungsmethoden angezeigt werden. Wir klicken auf den Link "Bedingungen" von der Berechnungsmethode "Lieferung per Post bis 50 Euro".
  5. In dem Drop-Down-Menü Verfügbare Bedingungen wählen wir "Summe der Bestellung prüfen" und klicken auf den Button "Bedingung hinzufügen". In dem Feld Gesamtsumme der Bestellung geben wir 49.99 ein. Bei den Radio-Buttons Bestellsummen Vergleichs Typ wählen wir "Summe ist kleiner gleich dem angegebenen Wert." Anschließend klicken wir ganz unten auf den Button "Änderungen speichern".
  6. Analog gehen wir nun bei der Berechnungsmethode "Lieferung per Post ab 50 Euro" vor. Dort, wo wir vorher 49.99 eingetragen haben, tragen wir nun 50.00 ein. Und dort, wo wir vorher "Summe ist kleiner gleich dem angegebenen Wert." ausgewählt haben, wählen wir nun "Summe ist größer gleich dem angegebenen Wert."
  7. Damit ist die Konfiguration beendet.

Zahlungsmethoden

Vorauskasse

Das Modul http://drupal.org/project/uc_bank_transfer ermöglicht dem Shopbetreiber die Eingabe seiner Bankverbindung, die dem Kunden im Bestellprozess angezeigt wird. Nachdem Sie das Modul, das sich unter dem Namen "Bank Transfer" präsentiert, aktiviert haben, können Sie auf http://www.example.com/admin/store/settings/payment/edit/methods die Zahlungsart "Bank Transfer" aktivieren. Im Abschnitt "Bank Transfer Einstellungen" auf derselben Seite schreiben Sie in das Feld "Bezeichnung der Bezahlmethode" den Text "Überweisung". In das Eingabefeld "Payment instructions" schreiben sie etwa folgenden Text: 

<br />
Kontoinhaber: Vorname Nachname<br />
Kontonummer: 1111111111111111<br />
BLZ: 2222222222222222222<br />
Kreditinstitut: asdfasdfasdf

Ein Käufer sollte auf der Seite http://www.example.com/cart/checkout/ nun folgendes sehen:

cart checkout zahlungsmethode

PayPal

Express Checkout

Ablauf (erste Möglichkeit)

  1. Ihr Kunde befindet sich auf der Seite http://www.example.com/cart. Dort klickt er auf den Button "Checkout with PayPal".
  2. Der Kunde ist nun nicht mehr in Ihrem Shop, sondern sieht eine Seite, die der Server von PayPal ausliefert. Auf dieser Seite befindet sich ein Login-Formular, mit dem sich Ihr Kunde bei PayPal anmeldet.
  3. PayPal zeigt dem Käufer nun eine Seite, auf der er die Zahlungsmethode auswählen kann sowie die Versandadresse überprüfen und ändern kann. Als Versandadresse zeigt PayPal die Adresse, die in dem PayPal-Konto des Käufers gespeichert ist. Wenn der Käufer mit allen Angaben zufrieden ist, dann bestätigt er diese mit einem Klick auf den Button "weiter".
  4. Ihr Kunde befindet sich nun wieder in Ihrem Shop - und zwar auf der Seite http://www.example.com/cart/echeckout/review, wo er auf den Button "continue checkout" klickt.
  5. Die nun angezeigte Seite http://www.example.com/cart/echeckout/submit ist die letzte Seite in dem Checkout-Prozess, die eine Aktion von dem Benutzer erwartet. Mit einem Klick auf den Button "Submit Order" schließt Ihr Kunde die Bestellung ab.
  6. Ubercart zeigt nun die Seite http://www.example.com/cart/checkout/complete.

Ablauf (zweite Möglichkeit)

  1. Ihr Kunde befindet sich auf der Seite http://www.example.com/cart. Dort klickt er nicht auf "Checkout with PayPal" wie bei der ersten Möglichkeit, sondern auf den Button "checkout".
  2. Dadurch bleibt er zunächst in Ihrem Shop und sieht die Seite http://www.example.com/cart/checkout, auf der er Angaben zur Rechnungsadresse macht, PayPal als Zahlungsmethode auswählt und auf "Review Order" klickt.
  3. Der Kunde ist nun nicht mehr in Ihrem Shop, sondern sieht eine Seite, die der Server von PayPal ausliefert. Auf dieser Seite befindet sich ein Login-Formular, mit dem sich Ihr Kunde bei PayPal anmeldet.
  4. PayPal zeigt nun eine Seite an, die der in Punkt drei der ersten Variante in den wesentlichen Eigenschaften ähnelt. Die Unterschiede sind:
    • Als Lieferadresse wird nicht die bei PayPal gespeicherte Adresse verwendet, sondern die Adresse, die der Käufer auf der Seite cart/checkout eingetragen hat.
    • Diese Adresse ist auf der Paypal Seite nicht änderbar.
    Wenn der Käufer mit allen Angaben zufrieden ist, dann bestätigt er diese mit einem Klick auf den Button "weiter".
  5. Ihr Kunde befindet sich nun wieder in Ihrem Shop - und zwar auf der Seite http://www.example.com/cart/checkout/review. Mit einem Klick auf den Button "Submit Order" schließt er die Bestellung ab.
  6. Ubercart zeigt nun die Seite http://www.example.com/cart/checkout/complete.

Betrachten wir noch einmal die erste Möglichkeit und nehmen an, dass Sie möchten, dass der Käufer AGB und Widerrufsrecht akzeptieren muss, damit er den Kauf abschließen kann. Mit dem im Abschnitt "Allgemeine Geschäftsbedingungen und Widerrufsrecht" dargestellten Modul werden die Checkboxen für die Bestätigung der AGB und des Widerrufsrechts auf der Seite http://www.example.com/cart/checkout angezeigt. Bei dem ersten möglichen Ablauf bekommt der Käufer diese Seite aber überhaupt nicht zu sehen und umgeht damit das Formular. Er kann also den Kauf abschließen, ohne die AGB und das Widerrufsrecht bestätigt zu haben. Wenn dies erforderlich ist, dann sollten Sie demnach keinen PayPal-Button auf der Seite http://www.example.com/cart platzieren.

Website Payments Standard

Ablauf

  1. Der Käufer befindet sich auf der Seite http://www.example.com/cart, wo er auf den Button "checkout" klickt.
  2. Dadurch bleibt er zunächst in Ihrem Shop und sieht die Seite http://www.example.com/cart/checkout, auf der er Angaben zur Rechnungsadresse macht, PayPal als Zahlungsmethode auswählt und auf "Review Order" klickt.
  3. Ubercart zeigt nun die Seite http://www.example.com/cart/checkout/review mit einer Zusammenfassung der gesammelten Informationen. Dort klickt Ihr Kunde auf den Button "Submit Order". (Den Text für diesen Button ändern Sie auf der Seite http://www.example.com/admin/store/settings/payment/edit/methods im Abschnitt "PayPal Website Payments Standard settings".)
  4. Ihr Kunde ist nun nicht mehr in Ihrem Shop, sondern sieht eine Seite, die der Server von PayPal ausliefert. Er hat die Möglichkeit, einen neuen PayPal-Account zu erstellen oder sich in seinen bestehenden Account einzuloggen. In diesem Beispiel betrachten wir den Fall, dass sich der Kunde in seinen bestehenden Account einloggt.
  5. PayPal zeigt nun eine Seite, auf der der Käufer im Wesentlichen die folgenden Informationen erhält:
    • Gesamtpreis aller Artikel im Warenkorb.
    • Höhe der Versandkosten.
    • Zu bezahlender Betrag, der sich aus der Summe der Versandkosten und des Gesamtpreises ergibt.
    • Lieferadresse (und zwar die Lieferadresse, die vorher auf der Seite cart/checkout eingetragen wurde und nicht die, die zu dem Konto gespeichert ist.)
    • aktuell ausgewählte Zahlungsmethode (Diese ist vom Kunden änderbar. So hat er die Möglichkeit, giropay oder Kreditkarte auszuwählen. Zudem hat der Käufer hier direkt die Möglichkeit, neue Kreditkartendaten hinzuzufügen.)
    Wenn der Käufer mit allen Angaben zufrieden ist, dann bestätigt er diese mit einem Klick auf den Button "Jetzt bezahlen".
  6. PayPal informiert Ihren Kunden nun darüber, dass der Zahlungsbetrag dem Verkäufer bereits gutgeschrieben wurde. Außerdem wird der Transaktionscode angezeigt. Auf derselben Seite befindet sich ein Button "Zurück zum Händler". Für dieses Beispiel nehmen wir an, dass der Kunde diesen Button anklickt.
  7. Ihr Kunde befindet sich jetzt wieder auf Ihrer Webpräsenz - und zwar auf der Seite http://www.example.com/cart/checkout/complete. Dort wird er darüber informiert, dass die Bestellung abgeschlossen wurde. Außerdem erfährt er dort die Bestellnummer.

ClickandBuy

Auf http://drupal.org/project/uc_clickandbuy steht ein Drupal-Modul zum Download bereit, mit dem Ubercart ClickandBuy als Bezahlsystem nutzen kann. Einen kurzen Überblick über dieses Bezahlsystem insbesondere aus Käufersicht liefert http://clickandbuy.com/DE/de/info.html. Die Pressemitteilung von ClickandBuy diesbezüglich finden Sie unter http://www.clickandbuy.com/DE/de/sa/inc/presse/pm/06237.html.

Für Shopbetreiber ist interessant, dass ClickandBuy solchen Händlern, die Ubercart einsetzen, Sonderkonditionen gewährt, die attraktiver sind, als die auf http://www.clickandbuy.com/DE/de/merchantportal/registration/condition_r... aufgeführten Konditionen. Um diese nutzen zu können, muss die Registrierung bei ClickandBuy aus Ubercart heraus erfolgen. Beispielsweise zahlen Ubercartnutzer keine monatliche Grundgebühr an ClickandBuy. Genaue Informationen über die Konditionen liefert das Drupal-Modul, welches das Bezahlsystem implementiert. Wir kommen im folgenden darauf zurück.

Dieser Abschnitt fast einige Notizen bezüglich der Integration von ClickandBuy in Ubercart zusammen. Installieren wir also zunächst solche Module, die für grundlegende erste Schritte in diesem Zusammenhang erforderlich sind:

Wer noch keinen Händler-Account bei ClickandBuy hat, muss sich zunächst bei ClickandBuy registrieren. Wie das geht, erklärt der kommende Abschnitt "Registrierung bei ClickandBuy". Wenn Sie bereits einen Account bei ClickandBuy haben, dann können Sie direkt zum Abschnitt "ClickandBuy-Accountinformationen eintragen" springen.

Registrierung bei ClickandBuy

Wenn Sie diesen Abschnitt durchgearbeitet haben, dann ist Ihre Drupalinstallation automatisch für die Verwendung mit ClickandBuy konfiguriert. Sie können daher den kommenden Abschnitt "ClickandBuy-Accountinformationen eintragen" überspringen.

Auf der Seite admin/build/modules aktivieren wir das Modul "ClickandBuy registration", sowie alle weiteren Module, von denen "ClickandBuy registration" abhängt.

Auf der Seite admin/store/settings/payment/clickandbuy klicken wir auf auf "Register now!" (siehe folgender Screenshot).

Registrierung bei ClickandBuy

Sie sehen hier bereits wichtige Informationen über die Gebühren, die auf den Shopbetreiber zukommen, wenn er ClickandBuy nutzt. Ein Klick auf den Link "Register now!" öffnet folgende Seite mit detaillierten Informationen über die Konditionen.

Registrierung bei ClickandBuy

Klicken Sie auf den Button "Continue to ClickandBuy registration", wenn Sie mit den Konditionen einverstanden sind.

In dem Registrierungs-Formular von ClickandBuy kann man nach Auswählen der deutschen Sprache direkt auf "Weiter" klicken, um übersichtlicher sehen zu können, welche Felder man ausfüllen muss. Hat man Drupal lokal auf dem Rechner installiert, dann muss man sogar zunächst auf "Weiter" klicken, damit man die Felder "Url Ihres Transaktionsskripts" und "Url Ihrer Domain" anpassen kann. Diese beiden mit "localhost" vorbelegten Felder sind nämlich zunächst nicht editierbar und "localhost" wird von ClickandBuy nicht als gültige Eingabe angesehen. Wenn Sie noch nicht wissen, unter welcher Domain der Shop ereichbar sein wird, dann können Sie als Domain zunächst überall example.com angeben, wie im folgenden Ausschnitt des Formulars zu sehen ist.

example.com im clickandbuy Formular

Diese Angaben können später im Mitgliederbereich von ClickandBuy angepasst werden. Nachdem Sie die weiteren Schritte der Registrierung auf den Seiten von ClickandBuy durchlaufen haben, werden Sie automatisch wieder auf die Seite admin/store/settings/payment/edit/methods Ihrer Drupalinstallation geleitet. Im Abschnitt "ClickandBuy settings" sehen Sie, dass die Werte für

  • Premiumlink URL
  • Seller ID
  • Transaction Manager password

automatisch eingetragen wurden. Die "Seller ID" finden Sie im Mitgliederbereich von ClickandBuy, wenn Sie im Abschnitt "Einstellungen" auf "Stammdaten" klicken. Die "Seller ID" heißt bei ClickandBuy übersetzt "Anbieter ID". Um die "Premiumlink URL" nachzuschauen, klicken Sie im Abschnitt "Angebotsverwaltung" auf "Übersicht", dann auf die entsprechende Domain und dann auf den Link "Linkliste". Sie sehen nun einen Button "Link einbauen". Wenn Sie diesen anklicken, dann öffnet sich ein neues Fenster. Darin befinden sich zwei Textfelder, von denen das erste die Premiumlink URL beinhaltet. In Dokumentationen von ClickandBuy wird der Premiumlink teilweise auch "Transaktionslink" genannt. Da das "Transaction Manager password" nicht im Mitgliederbereich von ClickandBuy nachgeschaut werden kann, sollten Sie dieses notieren.

Die Felder "ClickandBuy domain link" sowie "EMS Push URL" können nicht verändert werden. Das ClickandBuy Modul setzt sie automatisch in Abhängigkeit von der Domain und dem Pfad, in dem sich die Drupalinstallation befindet. Wenn sie Drupal zu einer anderen Domain umziehen, dann wird der Pfad in diesen Feldern automatisch angepasst.

Falls Sie bei der Registrierung example.com angegeben haben, dann müssen Sie dies im Mitgliederbereich vor dem ersten Testkauf anpassen.

ClickandBuy-Accountinformationen eintragen

Wenn Sie die Registrierung bei ClickandBuy aus der aktuellen Drupal-Installation heraus gestartet haben, dann sind keine weiteren manuellen Anpassungen mehr erforderlich. Handelt es sich hingegen um eine frische Drupalinstallation mit Ubercart und haben Sie bereits einen Account bei ClickandBuy, dann können Sie wie folgt vorgehen, um ClickandBuy zu aktivieren und zu konfigurieren.

Auf der Seite admin/build/modules aktivieren wir das Modul "ClickandBuy", sowie alle weiteren Module, von denen "ClickandBuy" abhängt.

Auf der Seite admin/store/settings/payment/edit/methods nimmt der Shopbetreiber die Einstellungen für ClickandBuy vor. Dort klicken wir auf "ClickandBuy-Settings".

Moneybookers

Moneybookers unterstützt Ubercart offiziell, was dadurch deutlich wird, dass Moneybookers auf http://www.moneybookers.com/partners/drupal/ explizit die Konditionen für Betreiber eines Shops auf Basis von Ubercart listet und in dem Dokument http://www.moneybookers.com/creatives/integrationmanual/MB-Drupal-Integration_en.pdf Informationen zur Integration von Moneybookers in einen Ubercart-Shop bereitstellt. Auch das Drupalmodul, das die Zahlung über Moneybookers ermöglich, stellt Moneybookers unter http://www.moneybookers.com/partners/drupal/moduledrupal.zip zum Download zur Verfügung.

Moneybookers bietet die Systeme "Moneybookers Quick Checkout" und "Moneybookers eWallet" an, über die Sie auf http://www.moneybookers.com/ads/zahlungsabwicklung/ weitere Informationen finden. Oben rechts auf der Seite finden Sie einen Link zum Informationscenter, das ebenfalls relevante Informationen enthält. Allgemeine Informationen zum Thema E-Wallet liefert auch http://de.wikipedia.org/wiki/E-Wallet.

Damit Moneybookers weiß, dass Sie Ubercart als Shopsystem verwenden, sollten Sie sich über die Seite http://www.moneybookers.com/partners/online-payment/?p=Drupal registrieren. Nachdem der Account aktiviert wurde, was bis zu zwei Werktagen dauert, loggt man sich in seinen Account ein und klickt im Menü auf der linken Seite auf "Händlereinstellungen", wo man ein Geheimwort eingeben muss. Auf Seite acht in http://www.moneybookers.com/creatives/integrationmanual/MB-Drupal-Integration_en.pdf steht, dass das Wort maximal 10 Zeichen lang sein darf und nur kleine Buchstaben und Zahlen enthalten darf.

Nachdem Sie das Modul von Moneybookers aktiviert haben, definieren Sie auf admin/store/settings/payment/edit/methods, welche Zahlungsoptionen Sie anbieten möchten. Auf derselben Seite finden Sie den Abschnitt "Moneybookers eWallet Einstellungen" (siehe folgender Screenshot), in dem einige Angaben zu machen sind. Die Kundennummer finden Sie unter der Bezeichnung "Kunden-ID" im Mitgliederbereich von Moneybookers.

moneybookers e-wallet-einstellungen

Wenn man nach Eingabe der Emailadresse auf den Button "Überprüfung der Emailadresse" klickt, dann erscheint die Meldung "Falsche Emailadresse eingegeben". Warum das so ist, weiß ich nicht. Die Bezahlung funktioniert dennoch.

Wenn man auf "Geheimwort verifizieren" klickt, dann erscheint die Meldung "Das geheime Wort konnte nicht erfolgreich überprüft werden. Test fehlgeschlagen!". Warum das so ist, weiß ich nicht. Die Bezahlung funktioniert dennoch.

Wenn der Kunde seine Bezahlung bei Moneybookers abgeschlossen hat, wird er automatisch wieder auf Ihren Shop geleitet und sieht folgende Meldung:

moneybookers-zahlungserfolg-1.png

Klickt er dort auf weiter, dann sieht er folgendes, was sicherlich nicht optimal ist:

moneybookers-zahlungserfolg-2.png

Moneybookers schickt nach Abschluss der Zahlung eine Mail an Ihren Kunden.

Rechnungserstellung

Grundvoraussetzung dafür, dass ein eingeloggter Kunde seine Rechnungen anschauen kann ist, dass er das Recht 'view own orders' hat. In dem Fall, dass er diese Berechtigung hat, findet er eine Übersicht über alle seine Bestellungen auf user/[benutzerid]/orders. Die Seite user/[benutzerid]/order/123 zeigt ihm die Bestellung mit der Id 123. Dort sieht er den Link "Click to open a window with a printable invoice.", wenn Sie auf admin/store/settings/orders/edit/basic die Checkbox bei "Allow customers to view order invoices from their order history." aktiviert haben.

Ebenfalls auf admin/store/settings/orders/edit/basic finden Sie ein Drop-Down-Menü, in dem Sie das Rechnungstemplate auswählen. Hier werden die Namen aller Templates im Verzeichnis sites/all/modules/ubercart/uc_order/templates angezeigt. Der Name eines Templates ist nach dem Muster [name].itpl.php aufgebaut. Die Auswahl in diesem Drop-Down-Menü gilt nur für das Rechnungstemplate, welches für die Rechnung genommen wird, die angezeigt wird, wenn der Kunde auf den Link "Click to open a window with a printable invoice." klickt. Auf admin/store/ca/uc_checkout_customer_notification/edit/actions legen Sie das Rechnungstemplate für die Email fest, die dem Käufer nach der Bestellung zugeschickt wird.

Anzeige von Preisen

Zunächst passen wir die Darstellung von Preisen an hiesige Verhältnisse an, indem wir das Formular auf admin/store/settings/store/edit/format so ausfüllen, wie in folgendem Screenshot zu sehen:

ubercart-price-settings

Ubercart bietet ein flexibles System, um die Darstellung von Preisen mit eigenen Modulen anzupassen. Betrachten wir zunächst admin/store/settings/price-handlers (folgender Screenshot):

Ubercart Price Handlers

Wie wir sehen, gibt es zwei Typen von Handlern, die auf den Preis Einfluss nehmen:

  • Price alterer
  • Price formatter

Ein Price alterer verändert den angezeigten Preis. So ist es zum Beispiel mit einem Price alterer möglich, 10% Rabatt auf alle Produkte zu gewähren. Ein Price formatter kümmert sich um die Darstellung des Preises. Zum Beispiel kann mit einem Price formatter jeder Preisangabe der Zusatz "(inkl. 19% MwSt. zzgl. Versandkosten) " hinzugefügt werden. Wie das geht, schauen wir uns nun anhand eines kleinen Beispielmoduls an. Zuvor sollte allerdings noch die Option "Cache generated price values until the next cron run." deaktiviert werden (siehe voranstehender Screenshot).

Wir wollen nun ein Modul "price_test" erstellen, welches nichts weiter tut, als bei einem Aufruf von http://www.example.com/?q=price_test den Rückgabewert von uc_price() auszugeben. Folgende price_test.module leistet dies: 

<?php
function price_test_menu() {
  $items['price_test'] = array(
    'title'           => 'Preisinfo',
    'page callback'   => 'our_test_function',
    'access callback' => TRUE,
    );
  return $items;
}
 
function our_test_function() {
  return uc_price('30', array());
}

Nachdem nun noch die price_test.info mit dem Inhalt 

; $Id$
name = price_test
description = Wir schauen uns die Funktion uc_price() an.
core = 6.x
erstellt wurde, können wir das Modul auf der Seite admin/build/modules aktivieren und http://www.example.com/?q=price_test aufrufen. Im Inhalt der Seite sollte nun 

Preisinfo
30,00€

erscheinen. Die zentrale Bedeutung in dem System zur Darstellung und Veränderung von Preisen kommt der Funktion uc_price() zu, die in ubercart/uc_store/includes/uc_price.inc definiert wird.

Wir wollen nun unseren eigenen "price formatter" definieren. Dazu erweitern wir die Datei price_test.module um die folgenden beiden Funktionen. 

/*
 * Implementation of hook_uc_price_handler()
 */
function price_test_uc_price_handler() {
  $items['format'] = array(
    'title' => t('Mehrwertsteuer- und Versandkostenanzeige'),
    'description' => t('Jedem Preis den Text "(inkl. 19% MwSt. zzgl. Versandkosten)" hinzuf&uuml;gen.'),
    'callback' => 'mwst_und_vsndkosten_anzeigen',
    );
  return $items;
}
 
function mwst_und_vsndkosten_anzeigen($price, $options) {
  $output = uc_store_price_handler_format($price, $options);
  return $output."<br />(inkl. 19% MwSt. zzgl. Versandkosten)";
}

Bis einschließlich Version 2.0-rc3 müssen Sie nun noch den Patch von http://www.ubercart.org/files/price_handlers.patch anwenden. Rufen wir nun erneut admin/store/settings/price-handlers auf, dann sehen wir, dass wir einen neuen price formatter zur Auswahl haben.

New Price Formatter

Hier speichern wir unsere Auswahl "Mehrwertsteuer- und Versandkostenanzeige" und rufen erneut http://www.example.com/?q=price_test auf. Diesmal sollten wir 

Preisinfo
30,00€
(inkl. 19% MwSt. zzgl. Versandkosten)

als Ausgabe bekommen. Es wird jetzt jeder Preisangabe der Zusatz in Klammern hinzugefügt. Das ist aber nicht das, was man will. Es gibt Stellen, an denen dieser Zusatz unpassend bis falsch ist. Die Anzeige des Rechnungsbetrages ist ein Beispiel dafür. Wie also kann man bestimmte Stellen ausnehmen?

Eigenschaften und Optionen

Um Eigenschaften verwenden zu können, muss auf der Seite admin/build/modules im Abschnitt "Ubercart - Kern (optional)" das Modul "Product attributes" aktiviert sein.

Die Seite admin/store/attributes/add stellt ein Formular zur Verfüfung, mit dem Sie eine neue Eigenschaft anlegen können. Geben Sie im Feld für den Namen der Eigenschaft "Größe" ein und klicken Sie auf den Button "Absenden". Die Seite admin/store/attributes zeigt alle angelegten Eigenschaften. Klicken Sie bei der neu angelegten Eigenschaft "Größe" auf den Link "Optionen" und dann auf "Option hinzufügen". Dort legen wir die Optionen "S", "M" und "L" an.

Wir haben nun also eine neue Eigenschaft mit drei Optionen angelegt. Man nehme zur Kenntnis, dass wir diese Eigenschaft völlig unabhängig von einem Artikel erstellt haben. Diese Zuordnung zu einem Artikel mit dem Namen A1 nehmen wir wie folgt vor:

  • Auf der Bearbeitungsseite von A1 klicken wir auf den Link "Eigenschaften" und dann auf den Link in dem Satz "Für product müssen erst Eigenschaften hinzugefügt werden."
  • Dort wählen wir "Größe" aus und klicken auf den Button "Eigenschaften hinzufügen". Wenn Sie nun wieder die Artikelansichtsseite aufrufen, dann sehen Sie die neu hinzugekommene Eigenschaft mit den Auswahlmöglichkeiten S, M und L.

Erstellen Sie nun einen neuen Artikel mit dem Namen A2 und weisen ihm ebenfalls die Eigenschaft "Größe" zu. Klicken Sie dann auf der Bearbeitungsseite von A1 auf den Link "Optionen" und entfernen Sie die Häkchen bei den Optionen S und L, sodass nur noch M einen Haken hat. Setzen Sie mit Hilfe der Radio-Buttons außerdem den Standard auf M. Die Artikelansichtsseite von A1 zeigt nun bei dem Attribut Größe lediglich M zur Auswahl an. Bei A2 sind alle drei Optionen weiterhin verfügbar. Wir sehen daran, dass wir lediglich eine Eigenschaft benötigen und die Einstellungen für die Optionen für jeden Artikel individuell einstellen können.

Es kann gelegentlich vorkommen, dass Sie Ihrem Kunden auf der Artikelseite ein Textfeld anzeigen möchten, damit der Kunde dort etwas eingeben kann. Dies ist zum Beispiel dann sinnvoll, wenn Ihr Kunde einen Text eingeben soll, der dann auf ein zu bestellendes T-Shirt gedruckt wird. Auch das lässt sich mit Hilfe einer Eigenschaft machen. Wählen Sie dazu auf der Seite admin/store/attributes/add als Darstellungsart für die Eigenschaft "Textfeld" aus.

Den Optionen Bilder zuweisen

Das Modul uc_option_image ermöglicht die Zuweisung von Bildern zu Optionen. Als Voraussetzung benötigt es imagecache, das wiederum von imageapi abhängt.

Die Version 6.x-1.4 auf der Projektseite ist allerdings fehlerbehaftet. Besser ist die Verwendung der Version in diesem Posting: http://drupal.org/node/550344#comment-2113120

Wir wollen dafür sorgen, dass bei Artikel 2 in Abhängigkeit von der Gewählten Option "S", "M", "L" unterschiedliche Bilder angezeigt werden.

Zunächst müssen wir die Verwendung von option images für das Attribut "Größe" aktivieren. Gehen Sie dazu auf die Seite admin/store/settings/attributes. Dort gibt es einen Bereich "Option Images", innerhalb dessen sich die Überschrift "Switch Attributes" befindet. Dort sollte das Attribut "Größe" gelistet sein. Hier ist nun ein Häkchen vor das Attribut zu setzen. Die anderen Einstellungen auf der Seite können ersteinmal unverändert bleiben. Rufen Sie nun die Ansichtsseite von Artikel 2 auf. Sie sehen nun einen durchgestrichenen Fotoapparat. Das liegt daran, dass wir den Optionen noch keine Bilder zugewiesen haben. Meines Erachtens handelt es sich hier aber dennoch um einen Bug in dem Modul. Wenn Sie nämlich eine andere der drei Größen auswählen, dann verschwindet der Fotoapparat. Sie können nun alle Optionen durchklicken, ohne dass der Fotoapparat erneut angezeigt wird. Er erscheint also nur beim ersten Aufrufen des Artikels, was meines Erachtens ein Fehler darstellt.

Wie wollen den Optionen nun eigene Bilder zuweisen. Klicken Sie dazu bei Artikel 2 (also bei dem Artikel mit den drei aktivierten Optionen) auf "Bearbeiten" und dann auf "Optionen". Sie sehen nun bei jeder Option ein Feld, mit dem Sie jeweils ein Bild hochladen können. Nachdem Sie Bilder ausgewählt haben und Ihre Änderungen mit einem Klick auf den Button "Speichern" bestätigt haben, sehen Sie auf der Artikelansichtsseite das Bild zu der Standardoption. Wenn Sie nun eine andere Option auswählen, dann sollte das Bild wechseln.

Wenn Sie für einen Artikel zwei oder mehr Attribute verwenden, dann setzen Sie das Attribut, bei dessen Optionen Bilder gewechselt werden sollen, an erste Stelle. Ansonsten kann es sein, dass der Mechanismus nicht richtig funktioniert. Die Reihenfolge der Attribute legen Sie wie folgt fest: Klicken Sie auf der Bearbeitungsseite eines Artikels auf "Eigenschaften", um alle Attribute für den Artikel anzeigen zu lassen. Zu Beginn jeder Zeile sehen Sie ein Kreuz, mit dem Sie das entsprechende Attribut an die gewünschte Stelle schieben können.

Beachten Sie, dass wir nur bei diesem einen Artikel Bilder mit den Optionen verknüpft haben. Dies muss für jeden Artikel getrennt geschehen. Im Gegensatz zu der Standardversion von der Projektseite bietet die oben genannte Version aus dem Beitrag im Thread auf der Seite admin/store/settings/attributes allerdings die Option: "Set option images to be the same for all prducts". Klickt man dies an, muss man also nicht mehr für jedes Produkt die Einstellungen gesondert vornehmen.

Compatibility with Ubercart Ajax Attribute Calculations module: http://drupal.org/node/712542

Die hochgeladenen Bilder liegen alle im Verzeichnis sites/default/files/option-images. Man beachte, dass das Modul dort keine Bilder löscht - auch dann nicht, wenn man für ein bestehendes Bild ein anderes Bild hochlädt.

Sonstige Notizen

Testversion

Wenn Sie einen Liveshop sichern und auf Ihrem Testsystem wieder installieren, dann müssen unter Umständen Emailadressen angepasst werden, damit Ihr Testsystem bei Testkäufen keine Emails an den Shopbetreiber schickt. Auf folgenden Seiten sind eventuell Emailadressen anzupassen.

  • Adresse im Feld "Empfänger" auf admin/store/ca/uc_checkout_admin_notification/edit/actions