Entfernen von doppelten Produkten auf Seiten mit mehr als einem Banner

Ausschluss von Produkten zwischen Bannern, um nur einzigartige Produkte in allen Bannern anzuzeigen.

Die Verwendung dieser Funktion erzwingt das Laden mehrerer Clerk.io Empfehlungen nacheinander, anstatt gleichzeitig, was die Ladezeit der Seite zusätzlich verlängert.

**Stellen Sie sicher, dass der Kompromiss bei der Ladezeit es wert ist, die Duplikate zu vermeiden.

Clerk.js bietet eine einfache Möglichkeit, Duplikate bei mehreren Empfehlungsschiebern auf derselben Seite zu vermeiden.

Dies geschieht durch Hinzufügen des Attributs data-exclude-from auf dem Clerk-Block, von dem Sie die Duplikate entfernen möchten. Der Wert des Attributs sollte ein CSS-Selektor für den anderen Block sein, von dem Duplikate verhindert werden sollen.

Im folgenden Beispiel schließt der Schieber .clerk2 alle Produkte aus, die sich im Schieber .clerk1 befinden, und der Schieber .clerk3 schließt alle Produkte aus, die sich entweder im Schieber .clerk1 oder .clerk2 befinden.

HTML

<span class="clerk clerk1"
  id="clerk1"
  data-template="@clerk-banner-1">
</span>

<span class="clerk clerk2"
  id="clerk2"
  data-exclude-from=".clerk1"
  data-template="@clerk-banner-2">
</span>

<span class="clerk clerk3"
  id="clerk3"
  data-exclude-from=".clerk1,.clerk2"
  data-template="@clerk-banner-3">
</span>

Sie können den Ausschluss auch so einschränken, dass nur die ersten n Produkte angezeigt werden (ein kluger Schachzug, wenn Sie einen Schieberegler mit 20 Produkten haben, aber nur vier zu einem Zeitpunkt sichtbar sind).

Dies geschieht über die Option :limit(n) (wobei n die erste Anzahl der Produkte ist, die Sie ausschließen möchten).

Hier ist das gleiche Beispiel von oben, aber wo die Ausschluss-ID nur die ersten fünf Produkte betrifft.

HTML

Sie können den Ausschluss auch so einschränken, dass nur die ersten n Produkte angezeigt werden (ein kluger Schachzug, wenn Sie einen Schieberegler mit 20 Produkten haben, aber nur vier zu einem Zeitpunkt sichtbar sind).

Dies geschieht über die Option :limit(n) (wobei n die erste Anzahl der Produkte ist, die Sie ausschließen möchten).

Hier ist das gleiche Beispiel von oben, aber wo die Ausschluss-ID nur die ersten fünf Produkte betrifft.

HTML

<span class="clerk clerk1"
  id="clerk1"
  data-template="@clerk-banner-1">
</span>

<span class="clerk clerk2"
  id="clerk2"
  data-exclude-from=".clerk1:limit(5)"
  data-template="@clerk-banner-2">
</span>

<span class="clerk clerk3"
  id="clerk3"
  data-exclude-from=".clerk1:limit(5),.clerk2:limit(5)"
  data-template="@clerk-banner-3">
</span>