Skip to main content

Live-Shopping

Alt: CMS & Webshop

Diese Handbuchseite widmet sich Funktionen des alten plentymarkets Webshops Callisto. Informationen zum Webshop-Template Ceres findest du hier.

Beim Live-Shopping wird täglich ein Artikel aus dem Sortiment für einen bestimmten Zeitraum (z.B. von 9:00 bis 18:00 Uhr) zu einem vergünstigten Preis angeboten. Live-Shopping-Angebote konfigurierst du im Menü System » Systemeinstellungen » Mandant » Global » Live-Shopping.

1. Live-Shopping-Angebot erstellen

Gehe wie unten beschrieben vor, um ein neues Live-Shopping-Angebot zu erstellen.

Verkaufspreis für Live-Shopping-Angebote

Lege einen Verkaufspreis des Preistyps Aktionspreis an und hinterlege diesen Verkaufspreis am Artikel. Der Verkaufspreis für deine Live-Shopping-Angebote wird automatisch basierend auf Verkaufspreis-Einstellungen gewählt.

Live-Shopping-Angebot erstellen:

  1. Öffne das Menü System » Systemeinstellungen » Mandant » Global » Live-Shopping.

  2. Klicke auf ein Live-Shopping-Tab.

  3. Klicke auf das grüne Plus.
    → Das Fenster Neues Live-Shopping wird angezeigt.

  4. Nimm die Einstellungen vor. Beachte dabei Tabelle 1.

  5. Speichere () die Einstellungen.

Tabelle 1. Live-Shopping; Einstellungen
Einstellung Erläuterung

Start

Datum und Uhrzeit für Beginn des Live-Shopping-Angebots wählen.

Ende

Datum und Uhrzeit für Ende des Live-Shopping-Angebots wählen.

Artikel-ID

ID des Artikels eingeben.
Hinweis: Derselbe Artikel kann nicht zur gleichen Zeit in mehreren Live-Shopping-Angeboten angeboten werden.

Menge verkauft

Eingabe ändert die Prozentanzeige der bereits verkauften Menge im Live-Shopping.

Gesamt

Menge eingeben, die maximal zum Angebotspreis verkauft werden soll. Unabhängig von dieser Angabe muss bei Artikeln, die an Warenbestand gebunden sind, ausreichend Bestand vorhanden sein.
Wenn ein Kunde im Warenkorb versucht, eine höhere Menge zu erwerben, wird die Menge automatisch verringert. Sobald diese Menge verkauft ist, gilt wieder der normale Preis.

Verknüpfung aktiv

Dieselbe Zeitspanne kann für mehrere Live-Shopping-Angebote konfiguriert werden. Option aktivieren, um dieses Angebot anzuzeigen, sobald ein Live-Shopping-Angebot, das in der Live-Shopping-Ansicht weiter oben steht und zum gleichen Zeitpunkt verkauft wird, ausverkauft ist.

Preis bei Überschreiten der Restmenge

Wenn ein Käufer mehr Artikel in den Warenkorb legt, als für das Live-Shopping-Angebot verfügbar sind, wird die gesamte Bestellmenge des Artikels zum regulären Preis berechnet. Beträgt z.B. die Restmenge eines Live-Shopping-Artikels 7 Stück und ein Kunde legt den Artikel 8-mal in den Warenkorb, wird für alle 8 Artikel der normale Verkaufspreis berechnet.

Weise deine Kunden darauf hin und stelle sicher, dass bei Live-Shopping-Angeboten jederzeit ersichtlich ist, wie viele Artikel noch zum vergünstigten Preis verfügbar sind.

2. Live-Shopping-Angebot konfigurieren

Gehe wie unten beschrieben vor, um ein neu angelegtes Live-Shopping-Angebot zu konfigurieren.

Live-Shopping-Angebot konfigurieren:

  1. Öffne das Menü System » Systemeinstellungen » Mandant » Global » Live-Shopping.

  2. Klicke auf ein Live-Shopping-Tab.

  3. Wechsle in das Tab Einstellungen.

  4. Nimm die Einstellungen vor. Beachte dabei Tabelle 2.

  5. Speichere () die Einstellungen.

Tabelle 2. Einstellungen für Live-Shopping-Angebote
Einstellung Erläuterung

Live-Shopping anzeigen

Ausblenden, wenn kein Angebot aktiv = Template-Variable Container_ItemViewLiveShopping() wird nur befüllt, wenn ein Artikel gerade zum günstigen Preis gekauft werden kann.
Zeige nächstes Angebot, wenn kein Angebot aktiv = Template-Variable wird immer befüllt. Wenn kein Angebot aktiv ist, wird eine Vorschau des nächsten Angebots angezeigt. Der vergünstigte Preis gilt jedoch erst ab dem eingestellten Angebotsbeginn. Daher für Angebote, die einander automatisch folgen sollen, die gleiche Startzeit festlegen. Siehe auch Tabelle 1 , Option Verknüpfung aktiv.

3. Live-Shopping in deinen Webshop einbinden

Binde nun die Live-Shopping-Funktion in deinem Webshop ein. Füge dazu die folgenden Template-Funktion und -Variable in das Design deines Webshops ein:

  • {% Container_ItemViewLiveShopping() %}

  • {% $LiveShoppingID = 1 %}
    → Die ID bestimmt, welches Live-Shopping-Angebot eingefügt wird. Mit ID 1 wird z.B. Angebot Live Shopping 1 eingefügt.

3.1. ItemViewSingleItem-Ansicht anpassen

Um in der Artikeldetailansicht nochmals deutlich zu machen, dass es sich bei dem Live-Shopping-Angebot um ein Sonderangebot handelt, stehen die folgenden Template-Variablen zur Verfügung, die in das Template ItemViewSingleItem eingefügt werden:

  • $LiveShoppingQuantityRemaining

  • $LiveShoppingPrice

Beispielcode für dein ItemViewSingleItem-Template:

{% if $LiveShoppingQuantityRemaining>0 %} LiveShopping SONDERANGEBOT befristet!! {% endif %}

3.2. Aktionsansicht mit Template-Variablen anpassen

Im Template CMS » Webdesign » Layout » ItemView » ItemViewLiveShopping gestaltest du die Live-Shopping-Angebote. Die folgenden Template-Variablen stehen dazu zur Verfügung:

  • $LiveShoppingContainerId

  • $LiveShoppingQuantityRemaining

  • $LiveShoppingPrice

  • $LiveShoppingPriceOriginal

  • $LiveShoppingPercentRemaining

  • $LiveShoppingPercentSold

  • $LiveShoppingQuantitySold

  • $LiveShoppingStartTime

  • $LiveShoppingEndTime

Der folgende Code ist ein Beispiel für die Gestaltung von Live-Shopping-Angeboten im Template ItemViewLiveShopping:

<div class="ff01_pagenav">

    <h2 id="liveshopping_von_bis" >Liveshopping</h2>

</div>

<table width="100%" border="0" cellspacing="0" cellpadding="3" class="border marginbottom"><tr><td style="width:40%;">

    <table width="100%" border="0" cellspacing="0" cellpadding="3">

        <tr>

            <td colspan="2" style="padding:10px;"><strong>$Name[1]</strong>

            </td>

        </tr>

        <tr>

            <td rowspan="1" style="padding-left:10px; height:250px" width="60%">$MiddleSizeImage[1]</td>

            <td style="padding-left:10px;" valign="top">

                <table width="200" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                        <td id="clock_clock" width="36">&nbsp;

                        </td>

                        <td style="padding-left:10px">

                            Angebot läuft noch<br /><span  id="ldate" style="font-size:20px; font-weight:bold;"></span>

                        </td>

                    </tr>

                </table><br /><br />

                <div>statt <span style="text-decoration: line-through;">$LiveShoppingPriceOriginal $Currency</span>

                <div><span class="Price_single_art">nur $LiveShoppingPrice</span> <span class="Price_single_art">$Currency</span></div>

                <div class="small">inkl. ges. Mwst. 19%</div>

                <div class="small" style="margin-bottom:10px;"><a href="{% Link_ShippingCosts() %}">zzgl. Versandkosten</a></div>

                {% if $Weight > 0 %}

                  <div>Versandgewicht: $Weight g

                  </div>

                {% endif %}

                <div>$FormOpenOrder$AttributeSelect

                    <input src="/layout/farbfinal01/images/btn_basket.png" title="Kaufen" alt="Kaufen" type="image" style="padding-top:15px" >

      $FormCloseOrder

                </div>

                </div>

            </td>

        </tr>

        <tr>

            <td style="padding-left:10px; width:40%;"><b>Artikelbeschreibung:</b><br /><br />$DescriptionShort<br /><br />

                <label onclick="if(document.getElementById('liveshopping_description').style.display=='none'){ document.getElementById('liveshopping_description').style.display='block'; } else {    document.getElementById('liveshopping_description').style.display='none'; }"> <b>weitere Informationen...</b>

                </label><br />

                <div id="liveshopping_description" style="display:none;">$Description</div><br />

            </td>

            <td style="width:40%; width:40%; padding-left:10px;" valign="top"> Noch $LiveShoppingPercentRemaining Prozent verfügbar!

                <table width="150px" height="12px" cellspacing="0">

                    <tr>

                        <td style="background-image:url(/images/icons/liveshopping/balken_links.jpg); padding-left:6px; height:7px; width=7px";>

                        </td>

                        <td style="background-image:url(/images/icons/liveshopping/balken_mitte.jpg); height:7px; width=7px;"$LiveShoppingPercentRemaining%>

                      </td>

                <td style="background-image:url(/images/icons/liveshopping/balken_gruen_rechts.jpg); padding-left:4px; height:7px;" width="5"></td>

                <td style="background-image:url(/images/icons/liveshopping/balken_grau.jpg); height:7px;" width="$LiveShoppingPercentSold%"></td>

                <td style="background-image:url(/images/icons/liveshopping/balken_rechts.jpg); padding-left:4px; height:7px;" width="5"></td>

    </tr>

        </table>

      <br />

      <br />

      {% if $LiveShoppingQuantityRemaining<=0 %} <b>Live-Shopping derzeit nicht aktiv oder Aktionsbestand ausverkauft!</b><br />

      {% endif %} </td>

  </tr>

</table></td>



    </tr>

</table>





<script language="JavaScript" type="text/javascript">



  function tickLiveShoppingTimer() {



    var currenttime=new Date();



    if(checkIfCurrentTimeIsInPeriod('$LiveShoppingStartTime','$LiveShoppingEndTime')){



      var eventdate = getDateObjectFromUTC("$LiveShoppingEndTime");

      var milliseconds_until_event=Math.floor((eventdate.getTime()-currenttime.getTime()));

      var seconds_until_event=milliseconds_until_event/1000;



      days = Math.floor(seconds_until_event/(60*60*24));

      hours = Math.floor(seconds_until_event/(60*60)) - (days * 24);

      minutes = Math.floor(seconds_until_event/(60)) - (days*24*60+hours*60);

      seconds = seconds_until_event - (days*24*60*60+hours*60*60+minutes*60);



      //ggf. führende Nullen anfügen

      var s_minutes = (minutes < 10) ? '0' + minutes : minutes ;

      seconds = Math.floor(seconds);

      var s_seconds = (seconds < 10) ? '0' + seconds : seconds ;



      if(document.getElementById('ldate') && document.getElementById('clock_clock')){

        document.getElementById('ldate').innerHTML = (days>0?days+"d ":"")+hours+'h '+s_minutes+':'+s_seconds;

        document.getElementById('clock_clock').style.backgroundImage = 'url(/images/icons/liveshopping/clock.jpg)';

      }



      window.setTimeout("tickLiveShoppingTimer()", 1000);



    } else {

      if(document.getElementById('ldate') && document.getElementById('clock_clock')){

        document.getElementById('ldate').innerHTML = '';

        document.getElementById('clock_clock').style.backgroundImage = '';

        window.setTimeout("tickLiveShoppingTimer()", 1000);

      }

    }

  }



  function getLocalDateTimeStringFromUTC(strDateTime) {



    var DateTimeArray = strDateTime.split(" ");



    var DateArray = DateTimeArray[0].split("-");

    var strYear = DateArray[0];

    var strMonth = DateArray[1];

    var strDay = DateArray[2];



    var TimeArray = DateTimeArray[1].split(":");

    var strHour = TimeArray[0];

    var strMinutes = TimeArray[1];

    var strSeconds = TimeArray[2];



    var eventtime = new Date();

    eventtime.setUTCSeconds(strSeconds);

    eventtime.setUTCMinutes(strMinutes);

    eventtime.setUTCHours(strHour);

    eventtime.setUTCDate(strDay);

    eventtime.setUTCMonth(strMonth-1);

    eventtime.setUTCFullYear(strYear);



    var strDateLocal = ((eventtime.getDate()<10)?'0'+eventtime.getDate():eventtime.getDate())  +"."+  ((eventtime.getMonth()+1<10)?'0'+(eventtime.getMonth()+1):eventtime.getMonth()+1) +"."+ eventtime.getFullYear();

    var strTimeLocal = ((eventtime.getHours() < 10) ? '0' + eventtime.getHours() : eventtime.getHours()) +':'+ ((eventtime.getMinutes() < 10) ? '0' + eventtime.getMinutes() : eventtime.getMinutes());

    return strDateLocal+" "+strTimeLocal;

    //return eventtime.toLocaleString(); //always uses long date format :( it is although buggy in firefox.. even more buggy with firefox+mac os leopard

  }



  function getDateObjectFromUTC(strDateTime) {



    var DateTimeArray = strDateTime.split(" ");



    var DateArray = DateTimeArray[0].split("-");

    var strYear = DateArray[0];

    var strMonth = DateArray[1];

    var strDay = DateArray[2];



    var TimeArray = DateTimeArray[1].split(":");

    var strHour = TimeArray[0];

    var strMinutes = TimeArray[1];

    var strSeconds = TimeArray[2];



    var eventtime = new Date();

    eventtime.setUTCSeconds(strSeconds);

    eventtime.setUTCMinutes(strMinutes);

    eventtime.setUTCHours(strHour);

    eventtime.setUTCDate(strDay);

    eventtime.setUTCMonth(strMonth-1);

    eventtime.setUTCFullYear(strYear);



    return eventtime;

  }



  function checkIfCurrentTimeIsInPeriod(strStartDateTime, strEndDateTime){



    var StartDateTimeArray = strStartDateTime.split(" ");



    var StartDateArray = StartDateTimeArray[0].split("-");

    var strYear = StartDateArray[0];

    var strMonth = StartDateArray[1];

    var strDay = StartDateArray[2];



    var StartTimeArray = StartDateTimeArray[1].split(":");

    var strHour = StartTimeArray[0];

    var strMinutes = StartTimeArray[1];

    var strSeconds = StartTimeArray[2];



    var starttime = new Date();

    starttime.setUTCSeconds(strSeconds);

    starttime.setUTCMinutes(strMinutes);

    starttime.setUTCHours(strHour);

    starttime.setUTCDate(strDay);

    starttime.setUTCMonth(strMonth-1);

    starttime.setUTCFullYear(strYear);



    var EndDateTimeArray = strEndDateTime.split(" ");



    var EndDateArray = EndDateTimeArray[0].split("-");

    var strYear = EndDateArray[0];

    var strMonth = EndDateArray[1];

    var strDay = EndDateArray[2];



    var EndTimeArray = EndDateTimeArray[1].split(":");

    var strHour = EndTimeArray[0];

    var strMinutes = EndTimeArray[1];

    var strSeconds = EndTimeArray[2];



    var endtime = new Date();

    endtime.setUTCSeconds(strSeconds);

    endtime.setUTCMinutes(strMinutes);

    endtime.setUTCHours(strHour);

    endtime.setUTCDate(strDay);

    endtime.setUTCMonth(strMonth-1);

    endtime.setUTCFullYear(strYear);



    var currenttime=new Date();



    var startDateSeconds = Date.UTC(starttime.getFullYear(), starttime.getMonth() , starttime.getDate(), starttime.getHours(), starttime.getMinutes(), starttime.getSeconds());

    var endDateSeconds = Date.UTC(endtime.getFullYear(), endtime.getMonth() , endtime.getDate(), endtime.getHours(), endtime.getMinutes(), endtime.getSeconds());

    var currentDateSeconds = Date.UTC(currenttime.getFullYear(), currenttime.getMonth() , currenttime.getDate(), currenttime.getHours(), currenttime.getMinutes(), currenttime.getSeconds());



    if(currentDateSeconds>=startDateSeconds && currentDateSeconds<endDateSeconds){

      return true;

    } else {

      return false;

    }

  }



  document.getElementById('liveshopping_von_bis').innerHTML='Live Shopping Angebot '+getLocalDateTimeStringFromUTC('$LiveShoppingStartTime')+' bis '+getLocalDateTimeStringFromUTC('$LiveShoppingEndTime');

  tickLiveShoppingTimer();





    </script>

4. Live-Shopping-Angebot veröffentlichen

Live-Shopping-Angebote können auch auf externen Plattformen eingestellt werden, z.B. auf liveshopping-aktuell.de. Registriere dich dazu bei dem Anbieter und hinterlege die URL der Angebote nach folgendem Muster:

  • Angebot 1: deine_Domain/plenty/api/liveshopping_xml_1.php

  • Angebot 2: deine_Domain/plenty/api/liveshopping_xml_2.php

Bei diesen Beispielen werden die Artikel des ersten und zweiten Live-Shopping-Angebots exportiert.

Per ID bestimmst du, welches Live-Shopping-Angebot exportiert werden soll. Mit dem Parameter SHIPPING legst du feste Versandkosten fest.

Beispiel: Parameter ID und SHIPPING

Mit ID für Live-Shopping-Angebot 1: "deine_Domain/plenty/api/liveshopping_xml_1.php?ID=1"
Mit ID für Live-Shopping-Angebot 3 und mit Code für 3,90 Versandkosten: "deine_Domain/plenty/api/liveshopping_xml_2.php?ID=3&SHIPPING=3.90"

Als Beschreibung des Artikels wird nur der Vorschautext (short_description) exportiert.

Exportbedingung

Live-Shopping-Angebote werden nur exportiert, wenn der Artikel einer Kategorie zugeordnet ist.

5. Automatisch über Live-Shopping-Angebote berichten

Nutze den Aktionsmanager, um täglich auf Twitter und Facebook über deine Live-Shopping-Angebote zu berichten. Richte dafür Aktionen ein. Weitere Informationen zur Einrichtung deines Twitter-Kontos in plentymarkets findest du auf der Handbuchseite Twitter.

Aktion einrichten:

  1. Öffne das Menü System » Systemeinstellungen » Artikel » Aktionen.

  2. Wechsle in das Tab Neue Aktion.

  3. Wähle die Aktion Live-Shopping twittern.

  4. Gib einen Namen ein.

  5. Wähle eine Uhrzeit, zu der die Aktion ausgeführt werden soll.

  6. Setze ein Häkchen bei Aktiv.

  7. Wechsle in das Tab Filter.

  8. Wähle den Mandanten (Shop).

  9. Wähle die Kategorieseite, in die das Live-Shopping-Angebot als Template-Variable eingefügt wurde.

  10. Wähle das Twitter-Konto, das für die Aktion genutzt werden soll.

  11. Wechsle in das Tab Aktion.

  12. Gib eine Nachricht für die Aktion ein.

  13. Speichere () die Einstellungen.
    → Die Aktion wird eingerichtet und im Tab Aktionen angezeigt.

Um Live-Shopping-Angebote auf Facebook zu posten, richtest du eine zweite Aktion Live-Shopping auf Facebook posten analog ein und verknüpfen diese Aktion mit deinem Facebook-Konto.

Facebook-Berechtigungen

Damit die Verknüpfung mit deinem Facebook-Konto einwandfrei funktioniert, musst du die beiden Berechtigungen manage_pages und publish_pages aktivieren.

6. FAQ

6.1. Aktives Live-Shopping

Wann ist Live-Shopping für einen Artikel aktiv?

Das Live-Shopping für einen Artikel ist aktiv, wenn die aktuelle Uhrzeit sich im konfigurierten Bereich befindet und bei warenbestandsabhängigen Artikeln noch ausreichend Bestand für das Live-Shopping vorhanden ist.=== Attributartikel verkaufen

Ich verkaufe Attributartikel. Kann die Attributauswahl in das Live-Shopping-Angebot eingebaut werden?

Ja, die Attributauswahl kann in das Live-Shopping-Angebot eingebaut werden. Verwende dazu dieselben Template-Variablen wie in der Ansicht eines Einzelartikels verfügbar, darunter auch $AttributeSelect und $AttributeSelectWithoutAttributeName. Baue einfach einen der beiden Template-Variablen in das Template ItemViewLiveShopping ein.

Ich möchte von der Startseite einen Link zur Seite mit dem Live-Shopping-Angebot setzen. Wie blende ich diesen Link nur ein, wenn ein LiveShopping Angebot aktiv ist?

Verwende dazu die Template-Funktion {% if Container_ItemViewLiveShopping() %} LINK {% endif %}.

Zum Seitenanfang