Shop Produkte

Visuelles Beispiel

 

 

 

 
 

Allgemein

Als Bestandteil der Web Shop Modulsammlung dient das Modul Shop Produkte zur Präsentation von Produkten und Dienstleistungen in Form von Listen und Einzelansichten. Bezeichnung im Sitemanager: Shop Produkte (deutsch)

Leistungsmerkmale

  • Verwaltung und Darstellung von Produkten und Dienstleistungen in Listenform
  • Link zum Hinzufügen eines Produktes zum Warenkorb
  • Einzel- und Druckansichten von Produkten
  • Produktbeschreibung im WYSIWYG Editor
  • Zuordnung von anderen Objekten wie verwandten Produkten, Kontakten oder Dokumenten automatisch über Kategorien oder auch manuell (Content Relationship Management)
  • Kategorie-Navigation möglich
  • Zusatzfunktion „Meistgekaufte Produkte"
  • Zusatzfunktion „zu diesem Produkt gekaufte weitere Produkte"
  • Kommentarfunktion (über Kommentar Modul)
  • Bewertung (über Bewertungsmodul)
  • Empfehlungsfunktion (über Empfehlungsmodul)
  • Sprachvarianten
  • Suchmaschinen werden unterstützt durch Smart URL – Ihr Produkt wird sicher verschlagwortet.
  • Automatische Verschlagwortung für die Volltextsuche
  • Import / Export über API
  • Volle Kontrolle über die Gestaltung über Templates
  • Zugriffsrechte bis auf Objekt-/Sprachebene
  • Zeitkontrollierte Veröffentlichung von Produktinformation auf verschiedenen Seiten für verschiedene Zielgruppen und unterschiedlichen Zeitspannen
  • Zahlreiche Customization Points für die kundenspezifische Anpassung (Programmierung)
  • Nahtlose Integration in die Geschäftsprozesse des Kunden, Referenzen für Microsoft Dynamics NAV und Microsoft Commerce Server vorhanden

Bestimmung

  • Katalogdarstellung, Online Shop

Nutzen

  • Unkomplizierte Bereitstellung von Produkten und Dienstleistungen im Internet, Extra-net und Intranet ohne Programmierung

Beschreibung

Produktdarstellungen, die sich auf den Warenkorb und die Bezahlung beschränkten, sind für Besucher nicht besonders ansprechend. Diese wünschen oft weitere Informationen, insbesondere bei erklärungsbedürftigen Produkten oder Dienstleistungen. Das kann durch zugeordnete Artikel, Dokumente oder auch Kontakte erfolgen. Die Integration eines Shop-Moduls in einem Content Management System bringt klare Vorteile gegenüber einem reinen Shop-System.

 
 

Der Bestellvorgang

  • Die gewünschten Artikel werden im Produktkatalog ausgewählt und in den Warenkorb gelegt.
  • Nach dem Wechsel zum Warenkorb können Änderungen erfolgen (Bestellmenge, Löschen von Artikeln etc.)
  • Nach dem Klick auf “Bestellen” muss sich der Benutzer einloggen. Ist der Benutzer noch nicht eingeloggt, wird/kann ein Log-in-Modul erscheinen. Die Benutzerdaten werden vom Bestell-Formular geladen.
  • Wenn alle Informationen korrekt sind, kann der Bestellvorgang abgeschlossen werden.
  • Der Kunde erhält eine Bestätigung der Bestellung per Email an die in den Benutzerdaten angegebene Adresse.

 

Abb.: Der Bestellvorgang mit den contentXXL Shop Modulen.

Als Redakteur können Sie Produktdaten wie alle anderen contentXXL Objektdaten, z. B. Artikel oder Kontakte, ohne Einschränkungen im Objekt Edit Manager bearbeiten.

 

 
 

Das Basisdaten Formular eines Shop-Objekts (Produkt)

Abb.: Das Produkt Basisdaten Formular

  • A Artikelnummer des Produkts
  • B Artikelname
  • C Der Text erscheint als Vorschau in der Listenansicht der Webseite.
  • D Produktpreis
  • E Auswahl / Ändern / Löschen des Vorschaubildes aus dem Ressourcen Manager.
  • F Titel des Vorschaubilds
  • G Auswahl / Ändern / Löschen des Detailbildes aus dem Ressourcen Manager.
  • H Benutzerdefinierte Felder

Dieses Modul steht auch als „Verknüpfte Produkte“ zur Verfügung. Dabei werden jeweils die verknüpften Produkte zu einem in Einzelansicht dargestellten Objekt angezeigt.

 
 

Spezielle Einstellungen

Das Modul Shop Produkte weist einige spezielle Einstellungen auf.

  • Shopkonfiguration: Hier werden die Währung (Eingabe Währungssymbol) und Bezeichnungen für spezifische Felder  (produktspezifische Eigenschaften, z. B. Antrieb, Traglast, Hubhöhe usw.) angegeben.
  • Templates Einzelansicht: Wählen Sie hier die Templates für die Einzelansicht sowie für die Druckvorschau eines Produktes aus.
  • Templates auch gekauft: Wählen Sie hier die Templates für den Kopf- und Fußbereich sowie für ein Listenelement der Liste der im Zusammenhang mit dem ausgewählten Produkt ebenfalls gekauften Produkte aus.
  • Templates Listenansicht: Wählen Sie hier die Einstellungen und Templates für die Listenansicht analog zu Artikeln.
  • Blättern in der Vorschau: Wählen Sie hier die Templates für den Kopf- und Fußbereich der Liste sowie für den Fall, dass keine Daten vorhanden sind.
  • Erweiterte Einstellungen: Wählen Sie hier die Einstellungen zu Rotationsmodus, Teasermodus (Angabe einer Zielseite und Zielmodul) sowie Featuremodus analog zu Artikeln.

Abb.: Spezielle Einstellungen des Moduls Shop-Produkte.

 
 

Templates Einzelansicht: Detailansicht

<ul class="media-list">
     <li class="media">
          <img class="media-object pull-left" src='[imageurl]' alt=''>
          <div class="media-body">
                [editbutton]
              <h3>[articlename]</h3>
              <h5>[articlenumber]</h5>
              <label [mvif:price:neq:0]>[price] [currency]</label>
               <p class="margin-top10" [mvif:price:neq:0]><a href='[AddToBasketLink]' class="btn btn-default" role="button"> <span class="glyphicon glyphicon-shopping-cart"></span>&nbsp; [localize:add_to_basket]&nbsp;<span class="badge">[countitem]</span></a>
 <a href='[backlink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-close"></span></a>  <a href='[printlink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-print"></span></a></p>
               <p class="margin-top10" [mvif:price:eq:0]>
 <a href='[backlink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-close"></span></a>  <a href='[printlink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-print"></span></a></p>
              <hr/>
              [description]
          </div>
    </li>
</ul>

 

Templates Einzelansicht: Druckansicht

<img [mvif:imageurl:neq:0] class="media-object" src='[imageurl]' alt=''/>
     <div>
     [editbutton]
     <h3>[articlename]</h3>
     <h5>[articlenumber]</h5>
    <label [mvif:price:neq:0]>[price] [currency]</label>
    <hr/>
    [description]
</div>

 

Templates Auch gekauft: Kopfbereich

<div class="row">[template_end]</div>

 

Templates Auch gekauft: Ansicht

<img [mvif:imageurl:neq:0] class="media-object" src='[imageurl]' alt=''/>
     <div>
     [editbutton]
     <h3>[articlename]</h3>
     <h5>[articlenumber]</h5>
    <label [mvif:price:neq:0]>[price] [currency]</label>
    <hr/>
    [description]
</div><div class="col-sm-6 col-md-4">
    <div class="thumbnail">
      <img src='ResourceImage.aspx?raid=[previewimage]' alt='[previewimage_alt]'/>
      <div class="caption" [mvif:articlenumber:neq:]>
         [editbutton]
        <h3>[articlename]</h3>
        <h5>[articlenumber]</h5>
        <label class="no-margin" [mvif:price:neq:0]>[price] [currency]</label>
         <hr/>
        <p [mvif:preview:neq:]>[preview] </p>
         <p  [mvif:price:neq:0]>
         <a href='[morelink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-open"></span></a>
         <a  href='[AddToBasketLink]' class="btn btn-default" role="button"> <span class="glyphicon glyphicon-shopping-cart"></span>&nbsp; [localize:add_to_basket]&nbsp;<span class="badge">[countitem]</span></a>
         </p>
         <p [mvif:price:eq:0]>
           <a href='[morelink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-open"></span>&nbsp; [localize:product_details]</a>
         </p>
      </div>
    </div>
</div>

 

Templates Auch gekauft: Fußbereich

<div class="row">[template_start]</div>

 

Templates Listenansicht: Vorschau groß

<div class="col-sm-6 col-md-4">
    <div class="thumbnail">
      <img src='ResourceImage.aspx?raid=[previewimage]' alt='[previewimage_alt]'/>
      <div class="caption" [mvif:articlenumber:neq:]>
         [editbutton]
        <h3>[articlename]</h3>
        <h5>[articlenumber]</h5>
        <label class="no-margin" [mvif:price:neq:0]>[price] [currency]</label>
         <hr/>
        <p [mvif:preview:neq:]>[preview] </p>
         <p  [mvif:price:neq:0]>
         <a href='[morelink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-open"></span></a>
         <a  href='[AddToBasketLink]' class="btn btn-default" role="button"> <span class="glyphicon glyphicon-shopping-cart"></span>&nbsp; [localize:add_to_basket]&nbsp;<span class="badge">[countitem]</span></a>
         </p>
         <p [mvif:price:eq:0]>
           <a href='[morelink]' class="btn btn-default" role="button"><span class="glyphicon glyphicon-eye-open"></span>&nbsp; [localize:product_details]</a>
         </p>
      </div>
    </div>
</div>

 

Template: Blättern in der Vorschau - Kopfbereich

<div class="row">[template_end]</div>

 

Template: Blättern in der Vorschau - Fußbereich

<div class="row">[template_start]</div>
<div class="row">
   <div class="col-sm-6 col-md-8">
      <ul class="pagination">
           <li><a href='[FirstPage]'>[localize:firstpage]</a></li>
           <li><a href='[PreviousPage]'>&laquo;</a></li>
           <li><span>[CurrentPageNumber]</span></li>
           <li><a href='[NextPage]'>&raquo;</a></li>
           <li><a href='[LastPage]'>[localize:lastpage]</a></li>
     </ul>
   </div>
</div>

 

 
 

Platzhalter: Detailansicht

Platzhaltername

Type

Platzhalterbeschreibung

[addtobasketlink]

string

Link um das Produkt zum Warenkorb hinzuzufügen

[articlename]

string

Name des Produkts

[articlenumber]

string

Externe Produktnummer

[backlink]

string

Link zurück zur Listenansicht

[caneditinline]

string

Darf der Benutzer den Inline Editor verwenden

[countitem]

integer

Anzahl wieoft sich das aktuelle Produkt im Warenkorb befindet

[currency]

string

Währung

[description]

string

Textdaten (WYSIWYG) des Produkts

[detailimage]

string

url zum Detailbild

[editbutton]

string

Schaltfläche zum bearbeiten des Produkts

[editinlinebutton]

string

Schaltfläche die den Inline Editor öffnet

[editinlinelink]

string

Link zum Inline Editor

[imageurl]

string

url des Vorschaubilds

[nextitemurl]

string

url zum nächsten Element

[preview]

string

Vorschautext des Produkts

[previewimage]

string

Vorschaubild des Produkts

[previewimageisvisible]

string

(veraltet). Verwenden Sie [mvif:previewimage:neq:0].

[previewitemurl]

string

url des Vorschau Elements

[price]

string

Selbsterklärend

[printlink]

string

Link zur Druckansicht

Anmerkung:
Ihnen stehen hier zusätzlich die Felder [usersetting1] - [usersetting10] (string Werte), [userint1]-[userint5] (integer Werte), [userdate1] and [userdate2] (datetime Werte), [userfloat1]-[userfloat5] (double Werte), [userimage1]-[userimage5] als rid‘s, [userimage1_alt]-[userimage5_alt] (string Werte).

 

Platzhalter: Kopf- und Fußbereich

Platzhaltername

Type

Platzhalterbeschreibung

[CanCreateInline]

string

Darf der Benutzer den Inline Editor verwenden

[CreatInlineButton]

string

Schaltfläche die den Inline Editor öffnet

[CreatInlineLink]

string

Link zum Inline Editor

[CurrentPageNumber]

integer

Aktuelle Seitennummer – Paging

[FirstPage]

string

Link zur ersten Seite – Paging

[IsListView]

string

Befindet sich das Modul in der Listenansicht

[LastPage]

string

Link zur letzten Seite – Paging

[ModulePreview]

string

Vorschautext des Moduls

[ModulePreviewImage]

string

RAID des Vorschaulbilds des Moduls

[ModuleImage_alt]

string

Alternativtext des Vorschaubilds

[NextPage]

string

Link zur nächsten Seite – Paging

[PreviousPage]

string

Link zur vorherigen Seite Paging

[PrintLink]

string

Link zur Druckansicht

[ReturnToListLink]

string

Link zurück zur Listenansicht

[ReturnToOriginalListLink]

string

  

[ShownFrom]

integer

Index des ersten auf der aktuellen Seite angezeigten Elements

[ShownTo]

integer

Index des ersten auf der aktuellen Seite angezeigten Elements

[TellAFrendLink]

string

selbsterklärend

[TotalItemsCount]

integer

Anzahl aller Elemente – Paging

[TotalPageCount]

integer

Anzahl aller Seiten – Paging

 

Platzhalter: Listenansicht

Platzhaltername

Type

Platzhalterbeschreibung

[addtobasketlink]

string

Link um das Produkt zum Warenkorb hinzuzufügen

[articlename]

string

Name des Produkts

[articlenumber]

string

Externe Produktnummer

[countitem]

integer

Anzahl wieoft sich das aktuelle Produkt im Warenkorb befindet

[caneditinline]

string

Darf der Benutzer den Inline Editor verwenden

[currency]

string

Währung

[description]

string

Textdaten (WYSIWYG) des Produkts

[detailimage]

string

url zum Detailbild

[editbutton]

string

Schaltfläche zum bearbeiten des Produkts

[editinlinebutton]

string

Schaltfläche die den Inline Editor öffnet

[editinlinelink]

string

Link zum Inline Editor

[imageurl]

string

url des Vorschaubilds

[itemid]

integer

ID des Produkts

[morelink]

string

Link zur Detailansicht des Produkts

[preview]

string

Vorschautext des Produkts

[previewimage]

string

Vorschaubild des Produkts

[previewimage_alt]

string

(veraltet). Verwenden Sie [mvif:previewimage:neq:0].

[previewimageisvisible]

string

url des Vorschau Elements

[previousitemurl]

string

Vorschautext des Produkts

[price]

string

Selbsterklärend

Anmerkung:
Ihnen stehen hier zusätzlich die Felder [usersetting1] - [usersetting10] (string Werte), [userint1]-[userint5] (integer Werte), [userdate1] and [userdate2] (datetime Werte), [userfloat1]-[userfloat5] (double Werte), [userimage1]-[userimage5] als rid‘s, [userimage1_alt]-[userimage5_alt] (string Werte).

 

 

Service Links