Dokumentation Entwickler Liquid Referenz Filter

URL

Aktualisiert am 16.03.2017

URL-Filter erzeugen URLs für Media- und Asset-Dateien ihres Shops. All diese Dateien werden über ein CDN bereit gestellt.


media_movie_url

Der media_movie_url Filter nimmt den Namen einer Filmdatei entgegen und erzeugt die URL zu dieser Datei in Ihrem Movies - Verzeichnis.

Filme laden Sie hoch in Katalog » Redaktion » Filme.

Syntax

movie | media_movie_url

Beispiel

{{ 'demo.mov' | media_movie_url }}

Ausgabe

/accounts/demo_versacommerce_de/mediafiles/movies/demo.mov

Beispiel

Ausgabe

<span class="nt"><object</span> <span class="na">classid=</span><span class="s">"clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"</span>
<span class="na">codebase=</span><span class="s">"http://www.apple.com/qtactivex/qtplugin.cab"</span>
<span class="na">width=</span><span class="s">"500"</span>
<span class="na">height=</span><span class="s">"300"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"src"</span> <span class="na">value=</span><span class="s">"</span><span class="cp">{{</span> <span class="s1">'demo.mov'</span> <span class="o">|</span> <span class="nf">media_movie_url</span> <span class="cp">}}</span><span class="s">"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"controller"</span> <span class="na">value=</span><span class="s">"true"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"autoplay"</span> <span class="na">value=</span><span class="s">"true"</span><span class="nt">></span>
<span class="nt"><embed</span> <span class="na">src=</span><span class="s">"</span><span class="cp">{{</span> <span class="s1">'demo.mov'</span> <span class="o">|</span> <span class="nf">media_movie_url</span> <span class="cp">}}</span><span class="s">"</span>
<span class="na">width=</span><span class="s">"500"</span>
<span class="na">height=</span><span class="s">"300"</span>
<span class="na">controller=</span><span class="s">"false"</span>
<span class="na">autoplay=</span><span class="s">"true"</span>
<span class="na">scale=</span><span class="s">"tofit"</span>
<span class="na">cache=</span><span class="s">"true"</span>
<span class="na">pluginspage=</span><span class="s">"http://www.apple.com/quicktime/download/"</span><span class="nt">></span>
<span class="nt"></embed>
</span></object>

Beispiel

Ausgabe

<span class="nt"><object</span> <span class="na">classid=</span><span class="s">"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"</span>
<span class="na">codebase=</span><span class="s">"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"</span>
<span class="na">width=</span><span class="s">"500"</span>
<span class="na">height=</span><span class="s">"300"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"movie"</span> <span class="na">value=</span><span class="s">"</span><span class="cp">{{</span> <span class="s1">'demo.swf'</span> <span class="o">|</span> <span class="nf">media_movie_url</span> <span class="cp">}}</span><span class="s">"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"quality"</span> <span class="na">value=</span><span class="s">"high"</span><span class="nt">></span>
<span class="nt"><param</span> <span class="na">name=</span><span class="s">"bgcolor"</span> <span class="na">value=</span><span class="s">"#FF6633"</span><span class="nt">></span>
<span class="nt"><embed</span> <span class="na">src=</span><span class="s">"</span><span class="cp">{{</span> <span class="s1">'demo.swf'</span> <span class="o">|</span> <span class="nf">media_movie_url</span> <span class="cp">}}</span><span class="s">"</span>
<span class="na">quality=</span><span class="s">"high"</span>
<span class="na">pluginspage=</span><span class="s">"http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"</span>
<span class="na">type=</span><span class="s">"application/x-shockwave-flash"</span>
<span class="na">width=</span><span class="s">"500"</span>
<span class="na">height=</span><span class="s">"300"</span><span class="nt">></span>
<span class="nt"></embed>
</span></object>

within

Der within Filter nimmt eine url entgegen und erzeugt eine verschachtelte URL, indem url an die URL von object angehängt wird.

VersaCommerce erzeugt Gruppen dynamisch auf der Basis von Filtern, die Sie unter Katalog » Gruppen anlegen. Eine solche Gruppe “weiss” zwar welche Produkte in ihr sind; umgekehrt “weiss” aber ein Produkt nicht, in welchen Gruppen es vorkommt. Nehmen wir an, in der Gruppe “Eine Gruppe” gibt es das Produkt “Ein Produkt”:

Syntax

url | within: object

Beispiel

URL einer Produktübersichtsseite, die Gruppe “kennt” ihre Produkte.

demo.versacommerce.de/collections/eine-gruppe

URL einer Produktdetailseite, das Produkt “kennt” aber nicht seine Gruppe.

demo.versacommerce.de/products/ein-produkt

Verschachtelte URL einer Produktdetailseite, erzeugt durch den within - Filter.

demo.versacommerce.de/collections/eine-gruppe/products/ein-produkt

Der Variable product steht bei dem Aufruf einer verschachtelten URL die Variable collection zur Verfügung. Sie können also über alle Attribute der Produktgruppe zugreifen, in der sich dieses Produkt befindet.

Inhalt

asset_url

Asset-URL erzeugen

Syntax:
{{ dateiname |asset_url }}
Beispiel:
{{ 'shop.css' | asset_url }}
Ausgabe:
/accounts/demo_versacommerce_de/designs/standard/assets/shop.css

Asset-URL inkl. Stylesheet-Tag erzeugen

{{ 'shop.css' | asset_url | stylesheet_tag }}
Ausgabe:
<link href="/accounts/demo_versacommerce_de/designs/standard/assets/shop.css" rel="stylesheet" media="all" type="text/css"/>

background

Der Einsatz dieses Filters macht nur Sinn bei GIF- oder PNG- Dateien, die Transparenzen anzeigen können, oder bei dem Einsatz des Filters canvas, sofern die Bildfläche vergrössert wird.

Als Farbwert können Farbnamen oder numerische Farbangaben nach den Spezifikationen RGB, RGBA, HSL und HSLA gemacht werden.

Syntax:
{{ url | background color }}
Beispiel:
{{ product.featured_image | product_img_url | background: 'black' }}

{{ product.featured_image | product_img_url | background: 'blue' }}

{{ product.featured_image | product_img_url | background: '#ddddff' }}

{{ product.featured_image | product_img_url | background: 'rgb(255,255,255)' }}

Weitere Beeinflussungsmöglichkeiten von Produktbildern haben Sie mit den Filtern resize,canvas, background, gravity, convert_to und refit. Mit Hilfe aller dieser Filter sind Sie sogar in der Lage, Transparenz enthaltende PNG-Dateien für den Microsoft InternetExplorer 6 zu erstellen!

force_http_scheme

Syntax:
{{ url | force_http_scheme Beispiel }}
Beispiel:
{{ 'mein-shop.versacommerce.de' | force_http_scheme }}
Ausgabe:
<a href="http://mein-shop.versacommerce.de">http://mein-shop.versacommerce.de</a>

force_https_scheme

Syntax:
{{ url | force_https_scheme }}
Beispiel:
{{ 'http://mein-shop.versacommerce.de' | force_https_scheme }}
Ausgabe:
<a href="https://mein-shop.versacommerce.de">https://mein-shop.versacommerce.de</a>

force_scheme

Syntax:
{{ url | force_https_scheme }}
Beispiel:
{{ 'http://mein-shop.versacommerce.de' | force_scheme: 'ftp' }}
Ausgabe:
ftp://mein-shop.versacommerce.de

media_document_url

Syntax:
{{ document | media_document_url }}
Beispiel:
{{ 'mein-datenblatt.pdf' | media_document_url }}
Ausgabe:
/accounts/demo_versacommerce_de/mediafiles/documents/mein-datenblatt.pdf

media_image_url

{{ 'mein-bild.jpg' | media_image_url | img_tag }}
Ausgabe:
<img src="//cdn-assets.versacommerce.de/demo_versacommerce_de/mediafiles/images/testbild.jpg" />

media_movie_url

Syntax:
{{ movie | media_movie_url }}
Beispiel:
{{ 'demo.mov' | media_movie_url }}
Ausgabe:
/accounts/demo_versacommerce_de/mediafiles/movies/demo.mov

url_for

Syntax:
{{ tag_handle | url_for }}
Beispiel:
{{ "tolle-dinge" | url_for }}
Ausgabe:
/tags/tolle-dinge

url_for_type

Syntax:
{{ category | url_for_type }}
Beispiel:
{{ product.category | url_for_type }}
Ausgabe:
/categories/origami

url_for_variant

Syntax:
{{ variant_handle | url_for_variant }}
Beispiel:
{{  product.variants.first | url_for_variant }}
Ausgabe:
/products/sport-schuhe-rot

url_for_vendor

Syntax:
{{ vendor | url_for_vendor }}
Beispiel:
{{ product.category | url_for_vendor }}
Ausgabe:
/vendors/versacommerce

within

VersaCommerce erzeugt Gruppen dynamisch auf der Basis von Filtern, die Sie unter Katalog » Gruppen anlegen. Eine solche Gruppe “weiss” zwar welche Produkte in ihr sind; umgekehrt “weiss” aber ein Produkt nicht, in welchen Gruppen es vorkommt. Nehmen wir an, in der Gruppe “Eine Gruppe” gibt es das Produkt “Ein Produkt”:

{{ url | within: object }}