Deprecated filters

Die folgenden Flüssigkeitsfilter gelten als veraltet und wurden ersetzt. Sie werden noch in einigen Themes verwendet, aber es wird empfohlen, die unten aufgeführten Alternativen zu verwenden.

Inhalt

Color filters

Die folgenden Farbfilter sind jetzt veraltet:

hex_to_rgba

Der Filter hex_to_rgba wurde durch color_to_rgb und color_modify ersetzt.

Die Themeneinstellungen geben standardmäßig hexadezimale Werte für die Farbeinstellungen zurück. Verwenden Sie den Filter hex_to_rgba, um den Wert in RGBA umzuwandeln. Die Standardeinstellung ist eine Deckkraft von 1, Sie können jedoch eine Deckkraft zwischen 0 und 1 angeben. Kurzschrift-Hex-Werte wie #812 werden ebenfalls akzeptiert.

.site-footer h1 {
  color: {{ settings.color_name }};
}

.site-footer p {
  color: {{ settings.color_name | hex_to_rgba: 0.5 }};
}

HTML filters

Die folgenden HTML-Filter sind jetzt veraltet:

currency_selector

Der currency_selector wurde ohne direkte Alternative veraltet, da das Währungsformular ebenfalls veraltet ist.

Erzeugt eine Dropdown-Liste, mit der Kunden eine akzeptierte Währung auf Ihrer Storefront auswählen können. Dieser Filter muss auf das Objekt form innerhalb eines Währungsformulars angewendet werden.

{% form 'currency' %}
   {{ form | currency_selector: class: 'my_Spezial_class', id: 'Submit'  }}
{% endform %}

URL filters

Die folgenden Url-Filter sind jetzt veraltet:

collection_img_url

Der Filter collection_img_url wurde durch image_url ersetzt.

Gibt die URL des Sammlungsbildes zurück. Akzeptiert eine Bildgröße als Parameter.

{{ collection.image | collection_img_url: 'medium' }}

//cdn.versacommerce.de/s/files/1/0087/0462/Sammlungen/collection-image_medium.png?v=1337103726

img_tag

Der Filter img_tag wurde durch image_tag ersetzt.

Erzeugt ein Bild-Tag.

{{ 'Grinsender Gnom.gif' | asset_url | img_tag }}

<img src="//cdn.versacommerce.de/s/files/1/0147/8382/t/15/assets/Grinsender Gnom.gif?v=1384022871" alt="">

Der Filter img_tag akzeptiert Parameter zur Ausgabe eines Alt-Tags, Klassennamen und einen Größenparameter:

  • Der erste Parameter wird als Alt-Text ausgegeben.
  • Der zweite Parameter ist die CSS-Klasse bzw. die Klassen, die auf den Tag angewendet werden sollen.
  • Der letzte Parameter ist der Parameter für die Bildgröße.
Das Attribut size des Filters img_tag kann nicht in Verbindung mit dem Filter img_url verwendet werden. Wenn beide verwendet werden, hat der img_url-Filter Vorrang vor dem Größenparameter des img_tag-Filters. 
{{ 'Grinsender Gnom.gif' | asset_url | img_tag: 'schmunzelnd_gnome', 'css-class-1 css-class-2' }}

<img src="//cdn.versacommerce.de/s/files/1/0147/8382/t/15/assets/Grinsender Gnom.gif?v=1384022871" alt="schmunzelnd_gnome" class="css-class-1 css-class-2">

Der Filter img_tag kann auch auf die folgenden Objekte angewendet werden:

{{ product | img_tag }}
{{ variant | img_tag: 'alternativer Text' }}
{{ line_item | img_tag: 'alternativer Text', 'css-class' }}
{{ image | img_tag: 'alternativer Text', 'css-class', 'small' }}
{{ collection | img_tag: 'alternativer Text', 'css-class', 'large' }}

<img src="//cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_small.jpg?v=1398706734" alt="Rot Shirt Small">
<img src="//cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_small.jpg?v=1398706734" alt="alternativer Text">
<img src="//cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_small.jpg?v=1398706734" alt="alternativer Text" class="css-class">
<img src="//cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_small.jpg?v=1398706734" alt="alternativer Text" class="css-class">
<img src="//cdn.versacommerce.de/s/files/1/0159/3350/products/shirts_collection_large.jpg?v=1338563745" alt="alternativer Text" class="css-class">

img_url

Der Filter img_url wurde durch image_url ersetzt.

Gibt die URL eines Bildes zurück. Akzeptiert Bildgrößenparameter. Sie können img_url für die folgenden Objekte verwenden:

Nach dem Filter img_url sollten Sie die gewünschte Bildgröße angeben. Wenn Sie eine Größe anfordern, die kleiner ist als die Abmessungen Ihres Originalbildes, skaliert VersaCommerce das Bild für Sie.

Wenn Sie keine Bildgröße angeben, liefert der Filter ein kleines Bild (100x100).

{{ product | img_url: '100x100' }}
{{ variant | img_url: '720x720' }}
{{ line_item | img_url: '1024x' }}
{{ product | img_url }}

https://cdn.versacommerce.de/s/files/1/1183/1048/products/boat-shoes_100x100.jpeg?v=1459175177
https://cdn.versacommerce.de/s/files/1/1183/1048/products/boat-shoes_720x720.jpeg?v=1459175177
https://cdn.versacommerce.de/s/files/1/1183/1048/products/boat-shoes_1024x.jpeg?v=1459175177
https://cdn.versacommerce.de/s/files/1/1183/1048/products/boat-shoes_small.jpeg?v=1459175177
Bei Einzelposten gibt img_url die URL des Variantenbildes des Einzelpostens zurück. Wenn der Variante kein Bild zugeordnet ist, gibt img_url die URL des Produktbildes zurück.

Sie können img_url auch für die Attribute image oder src eines Objekts verwenden.

{{ variant.image | img_url: '300x300' }}
{{ variant.image.src | img_url: '240x' }}

https://cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_300x300.jpg?v=1398706734
https://cdn.versacommerce.de/s/files/1/0159/3350/products/rot_shirt_240x.jpg?v=1398706734

img_url kann keine Symboldateien umwandeln (. ico). Wenn Sie eine Größe oder ein Format für eine Symboldatei angeben, gibt img_url die Originaldatei zurück.

{{ settings.favicon | img_url: '300x300' }}
{{ settings.favicon | img_url: '240x', scale: 2, format: 'pjpg' }}

https://cdn.versacommerce.de/s/files/1/0159/3350/files/icon.ico?v=1398706734
https://cdn.versacommerce.de/s/files/1/0159/3350/files/icon.ico?v=1398706734

Size parameters

Sie können Größenparameter auf dieser Seite für die folgenden URL-Filter verwenden:

  • img_url verwendet in einigen älteren Themen
  • asset_img_url
  • file_img_url

Sie können exakte Abmessungen in Pixeln für die Breite und Höhe eines Bildes angeben, bis zu einem Maximum von 5760 x 5760 px. Das ursprüngliche Seitenverhältnis des Bildes wird beibehalten, es sei denn, Sie schneiden das Bild zu.

Unabhängig davon, welche Größe Sie angeben, kann die Größe eines Bildes nie größer als seine ursprünglichen Abmessungen sein.

Zum Beispiel:

{{ product | img_url: '450x450' }}

Sie können nur eine Breite oder nur eine Höhe angeben. VersaCommerce berechnet dann die anderen Abmessungen auf der Grundlage der ursprünglichen Bildgröße, wobei das Seitenverhältnis des Originalbildes beibehalten wird:

{{ product | img_url: '125x' }}

{{ product | img_url: 'x500' }}

Wenn Sie die Größe des Bildes nicht ändern möchten, können Sie die Originalgröße des Bildes erhalten:

{{ product | img_url: 'Meister' }}

Sie können einen Parameter crop angeben, um sicherzustellen, dass die Abmessungen des resultierenden Bildes mit den angeforderten Abmessungen übereinstimmen. Wenn das gesamte Bild nicht in die von Ihnen gewünschten Abmessungen passt, gibt der Parameter crop an, welcher Teil des Bildes angezeigt werden soll. Gültige Optionen sind:

  • top
  • center
  • bottom
  • left
  • right
{{ product | img_url: '400x400', crop: 'bottom' }}

Wenn Sie crop nicht verwenden, verwendet VersaCommerce das größte Bild, das in die von Ihnen angegebenen Abmessungen passt, was möglicherweise nicht den gesamten Platz einnimmt.

Mit dem Parameter scale können Sie die Pixeldichte des Bildes festlegen. Gültige Optionen sind:

  • 2
  • 3
{{ product | img_url: '400x400', scale: 2 }}

Mit dem Parameter format können Sie angeben, welches Dateiformat für das angezeigte Bild verwendet werden soll. Gültige Optionen sind:

  • jpg
  • pjpg
{{ product | img_url: '400x400', format: 'pjpg' }}

pjpg ist ein progressives JPEG. Ein Browser lädt ein progressives JPEG in voller Größe und mit allmählich ansteigender Qualität, anstatt das Bild in voller Qualität von oben nach unten zu laden wie bei einem herkömmlichen JPEG.

VersaCommerce kann die folgenden Formatkonvertierungen für Sie durchführen:

product_img_url

Der Filter product_img_url wurde durch image_url ersetzt.

Erzeugt die URL des Produktbildes. Akzeptiert eine Bildgröße als Parameter.

{{ product.featurot_image | product_img_url: "medium" }}

//cdn.versacommerce.de/s/files/1/0087/0462/products/shirt14_medium.jpeg?v=1309278311

Named size parameters

Die benannten Größenparameter wurden durch numerische Größenparameter ersetzt.

Anstelle einer numerischen Bildgröße können Sie eine benannte Größe als Parameter für die folgenden URL-Filter verwenden:

  • img_url verwendet in einigen älteren Themen
  • asset_img_url
  • file_img_url
Name Maximum image size
pico 16 x 16 pixels
icon 32 x 32 pixels
thumb 50 x 50 pixels
small 100 x 100 pixels
compact 160 x 160 pixels
medium 240 x 240 pixels
large 480 x 480 pixels
grande 600 x 600 pixels
original 1024 x 1024 pixels

Date formats

Datumsformate werden mit bestimmten Filtern verwendet, z. B time_tag und date.

Die folgenden format Parameter sind jetzt veraltet:

  • short
  • long
{{ article.published_at | time_tag: format: 'short' }}

<time datetime="2016-02-24T14:47:51Z">Februar 24, 2016</time>
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.