Initial commit based on English version.

etagwerker
2011-09-05 15:44:23 -07:00
parent 7756d93ad2
commit 0f2c63374b
+128 -128
@@ -1,20 +1,20 @@
There are two types of markup in Liquid: Output and Tag. Hay dos tipos de tags en Liquid: De Texto y Lógicos.
* Output markup (which may resolve to text) is surrounded by * Tags de texto (que pueden devolver texto) están envueltos por
<pre> <pre>
{{ matched pairs of curly brackets (ie, braces) }} {{ llaves dobles de apertura y cierre (se ven así) }}
</pre> </pre>
* Tag markup (which cannot resolve to text) is surrounded by * Tags lógicos (que nunca devuelven texto) están envueltos por
<pre> <pre>
{% matched pairs of curly brackets and percent signs %} {% llave y porcentaje de apertura y cierre (se ven así) %}
</pre> </pre>
h1. Output h1. Tags de Texto
Here is a simple example of Output: Aquí hay un ejemplo simple de salida:
<pre> <pre>
Hello {{name}} Hello {{name}}
@@ -24,176 +24,175 @@ Hello {{ 'tobi' }}
<a name="filters"></a> <a name="filters"></a>
h2. Advanced output: Filters h2. Salida de Texto Avanzada: Filtros
Output markup takes filters. Los tags de texto pueden tomar filtros.
Filters are simple methods. Los filtros son métodos simples.
The first parameter is always the output of the left side of the filter. El primer parámetro que recibe el filtro es el texto o variable que se encuentra a la izquierda del filtro.
The return value of the filter will be the new left value when the next filter is run. En caso de ver más de un filtro, lo que produzca el filtro más a la izquierda será el parámetro de entrada al filtro siguiente a la derecha.
When there are no more filters, the template will receive the resulting string. Cuando no haya más filtros, el template va a recibir el texto del último filtro aplicado.
<pre> <pre>
Hello {{ 'tobi' | upcase }} Hola {{ 'tobi' | upcase }}
Hello tobi has {{ 'tobi' | size }} letters! Hola tobi tiene {{ 'tobi' | size }} letras!
Hello {{ '*tobi*' | textilize | upcase }} Hola {{ '*tobi*' | textilize | upcase }}
Hello {{ 'now' | date: "%Y %h" }} Hola {{ 'now' | date: "%Y %h" }}
</pre> </pre>
h3. Standard Filters h3. Filtros Estándar
* **date** - reformat a date ("syntax reference":http://liquid.rubyforge.org/classes/Liquid/StandardFilters.html#M000012) * **date** - le dá formato a una fecha ("syntax reference":http://liquid.rubyforge.org/classes/Liquid/StandardFilters.html#M000012)
* **capitalize** - capitalize words in the input sentence * **capitalize** - Pone en mayúscula la primera letra del parámtro de entrada
* **downcase** - convert an input string to lowercase * **downcase** - Convierte todo el parámetro de entrada a minúsculas
* **upcase** - convert an input string to uppercase * **upcase** - Convierte todo el parámetro de entrada a mayúsculas
* **first** - get the first element of the passed in array * **first** - Devuelve el primer elemento de un parámetro de tipo array
* **last** - get the last element of the passed in array * **last** - Devuelve el último elemento de un parámetro de tipo array
* **join** - join elements of the array with certain character between them * **join** - Concatenar los elementos de un array con cierto caracter entre ellos
* **sort** - sort elements of the array * **sort** - Ordenar los elementos del array
* **map** - map/collect an array on a given property * **map** - Devuelve un array con la propiedad de los miembros de otro array
* **size** - return the size of an array or string * **size** - Devuelve el tamaño de un array o string (cadena de caracteres)
* **escape** - escape a string * **escape** - Escapea un string
* **escape_once** - returns an escaped version of html without affecting existing escaped entities * **escape_once** - Devuelve una versión escapeada en html sin afectar entidades ya escapeadas
* **strip_html** - strip html from string * **strip_html** - Saca todo html del string
* **strip_newlines** - strip all newlines (\n) from string * **strip_newlines** - Saca todos los 'enters' (\n) de un string
* **newline_to_br** - replace each newline (\n) with html break * **newline_to_br** - Reemplaca todos los 'enters' (\n) con un HTML br
* **replace** - replace each occurrence **e.g.** {{ 'foofoo' | replace:'foo','bar' }} #=> 'barbar' * **replace** - Reemplaza ocurrencias de cierto string **por ejemplo** {{ 'foofoo' | replace:'foo','bar' }} #=> 'barbar'
* **replace_first** - replace the first occurrence **e.g.** {{ 'barbar' | replace_first:'bar','foo' }} #=> 'foobar' * **replace_first** - Reemplaza la primer ocurrencia de un string **por ejemplo** {{ 'barbar' | replace_first:'bar','foo' }} #=> 'foobar'
* **remove** - remove each occurrence **e.g.** {{ 'foobarfoobar' | remove:'foo' }} #=> 'barbar' * **remove** - Remueve de un string toda ocurrencia de otro string **por ejemplo** {{ 'foobarfoobar' | remove:'foo' }} #=> 'barbar'
* **remove_first** - remove the first occurrence **e.g.** {{ 'barbar' | remove_first:'bar' }} #=> 'bar' * **remove_first** - Remueve de un string la primera ocurrencia de otro string **por ejemplo** {{ 'barbar' | remove_first:'bar' }} #=> 'bar'
* **truncate** - truncate a string down to x characters * **truncate** - Trunca un string de los X caracteres deseados
* **truncatewords** - truncate a string down to x words * **truncatewords** - Trunca un string de las X palabras deseadas
* **prepend** - prepend a string **e.g.** {{ 'bar' | prepend:'foo' }} #=> 'foobar' * **prepend** - Concatena un string al principio de otro string **por ejemplo** {{ 'bar' | prepend:'foo' }} #=> 'foobar'
* **append** - append a string **e.g.** {{ 'foo' | append:'bar' }} #=> 'foobar' * **append** - Concatena un string al final de otro string **por ejemplo** {{ 'foo' | append:'bar' }} #=> 'foobar'
* **minus** - subtraction **e.g** {{ 4 | minus:2 }} #=> 2 * **minus** - Resta un número de otro **por ejemplo** {{ 4 | minus:2 }} #=> 2
* **plus** - addition **e.g** {{ '1' | plus:'1' }} #=> '11', {{ 1 | plus:1 }} #=> 2 * **plus** - Suma un número a otro **por ejemplo** {{ '1' | plus:'1' }} #=> '11', {{ 1 | plus:1 }} #=> 2
* **times** - multiplication **e.g** {{ 5 | times:4 }} #=> 20 * **times** - Multiplica un número por otro **por ejemplo** {{ 5 | times:4 }} #=> 20
* **divided_by** - division **e.g** {{ 10 | divided_by:2 }} #=> 5 * **divided_by** - Divide un número por otro **por ejemplo** {{ 10 | divided_by:2 }} #=> 5
* **split** - split a string on a matching pattern **e.g.** {{ "a~b" | split:~ }} #=> ['a','b'] * **split** - Divide un string utilizando un patrón parámetro **por ejemplo** {{ "a~b" | split:~ }} #=> ['a','b']
h1. Tags h1. Tags Lógicos
Tags are used for the logic in your template. Se utilizan para la lógica dentro de tu template.
New tags are very easy to code, so I hope to get many contributions to the standard tag library after releasing this code. Es muy fácil desarrollar nuevos tags, así que esperamos recibir nuevas contribuciones a esta librería.
Here is a list of currently supported tags: Aquí hay una lista de tags:
* **assign** - Assgins some value to a variable * **assign** - Assigna un valor a una variable
* **capture** - Block tag that captures text into a variable * **capture** - Captura texto dentro del bloque y lo guarda en una variable
* **case** - Block tag, its the standard case...when block * **case** - Se utiliza para hacer comparaciones con valores específico (bloque case...when)
* **comment** - Block tag, comments out the text in the block * **comment** - Block tag, comenta el texto dentro del bloque
* **cycle** - Cycle is usually used within a loop to alternate between values, like colors or DOM classes. * **cycle** - Se utiliza para ciclar entre valores, por ejemplo colores o clases DOM.
* **for** - For loop * **for** - Para ciclos tipo for
* **if** - Standard if/else block * **if** - Para bloques if/else estándar
* **include** - Includes another template, useful for partials * **include** - Incluye otro template, útil para templates parciales
* **unless** - Mirror of if statement * **unless** - Idéntico al if
h2. Comments h2. Comentarios
Comment is the simplest tag. Comment es el tag más simple.
It just swallows content. Solamente oculta el contenido que encierra.
<pre> <pre>
We made 1 million dollars {% comment %} in losses {% endcomment %} this year Generamos 1 millón de dólares {% comment %} en pérdidas {% endcomment %} este año
</pre> </pre>
h2. If / Else h2. If / Else
@if / else@ should be well known from any imaginable programming language. @if / else@ funciona como en cualquier lenguaje de programación.
Liquid allows you to write simple expressions in the @if@ or @unless@ (and optionally, @elsif@ and @else@) clause: Liquid te permite escribir expresiones simples en las clausulas del @if@ o @unless@ (y opcionalmente, @elsif@ y @else@):
<pre> <pre>
{% if user %} {% if user %}
Hello {{ user.name }} Hola {{ user.name }}
{% endif %} {% endif %}
{% if user.name == 'tobi' %} {% if user.name == 'tobi' %}
Hello tobi Hola tobi
{% elsif user.name == 'bob' %} {% elsif user.name == 'bob' %}
Hello bob Hola bob
{% endif %} {% endif %}
{% if user.name == 'tobi' or user.name == 'bob' %} {% if user.name == 'tobi' or user.name == 'bob' %}
Hello tobi or bob Hola tobi o bob
{% endif %} {% endif %}
{% if user.name == 'bob' and user.age > 45 %} {% if user.name == 'bob' and user.age > 45 %}
Hello old bob Hola viejo bob
{% endif %} {% endif %}
{% if user.name != 'tobi' %} {% if user.name != 'tobi' %}
Hello non-tobi Hola non-tobi
{% endif %} {% endif %}
# Same as above # Es la misma clausula que la de arriba
{% unless user.name == 'tobi' %} {% unless user.name == 'tobi' %}
Hello non-tobi Hola non-tobi
{% endunless %} {% endunless %}
# Check if the user has a credit card # Fijarse si el user tiene creditcard
{% if user.creditcard != null %} {% if user.creditcard != null %}
poor sob Pobre
{% endif %} {% endif %}
# Same as above # Igual que arriba
{% if user.creditcard %} {% if user.creditcard %}
poor sob Pobre
{% endif %} {% endif %}
# Check for an empty array # Chequear por un array vacío
{% if user.payments == empty %} {% if user.payments == empty %}
you never paid ! No pagaste todavía!
{% endif %} {% endif %}
{% if user.age > 18 %} {% if user.age > 18 %}
Login here Login aquí
{% else %} {% else %}
Sorry, you are too young Perdón, eres muy joven.
{% endif %} {% endif %}
# array = 1,2,3 # array = 1,2,3
{% if array contains 2 %} {% if array contains 2 %}
array includes 2 el array incluye 2
{% endif %} {% endif %}
# string = 'hello world' # string = 'hola mundo'
{% if string contains 'hello' %} {% if string contains 'hola' %}
string includes 'hello' string incluye 'hello'
{% endif %} {% endif %}
</pre> </pre>
h2. Case Statement h2. Tag Case
If you need more conditions, you can use the @case@ statement: Si necesita más condiciones, puede usar el tag @case@:
<pre> <pre>
{% case condition %} {% case condition %}
{% when 1 %} {% when 1 %}
hit 1 condition es 1
{% when 2 or 3 %} {% when 2 or 3 %}
hit 2 or 3 condition es 2 o 3
{% else %} {% else %}
... else ... condition no es ni 1, ni 2, ni 3
{% endcase %} {% endcase %}
</pre> </pre>
*Example:* *Ejemplo:*
<pre> <pre>
{% case template %} {% case template %}
{% when 'label' %}
{% when 'label' %}
// {{ label.title }} // {{ label.title }}
{% when 'product' %} {% when 'product' %}
// {{ product.vendor | link_to_vendor }} / {{ product.title }} // {{ product.vendor | link_to_vendor }} / {{ product.title }}
{% else %} {% else %}
// {{page_title}} // {{page_title}}
{% endcase %} {% endcase %}
</pre> </pre>
h2. Cycle h2. Tag Cycle
Often you have to alternate between different colors or similar tasks. Frecuentemente uno debe alternar entre colores diferentes o tareas similares.
Liquid has built-in support for such operations, using the @cycle@ tag. Liquid tiene soporte para ese tipo de operaciones, utilizando el tag @cycle@.
<pre> <pre>
{% cycle 'one', 'two', 'three' %} {% cycle 'one', 'two', 'three' %}
@@ -201,7 +200,7 @@ Liquid has built-in support for such operations, using the @cycle@ tag.
{% cycle 'one', 'two', 'three' %} {% cycle 'one', 'two', 'three' %}
{% cycle 'one', 'two', 'three' %} {% cycle 'one', 'two', 'three' %}
will result in va a producir:
one one
two two
@@ -209,11 +208,11 @@ three
one one
</pre> </pre>
If no name is supplied for the cycle group, Si no se provee ningún nombre para el grupo del ciclo,
then it's assumed that multiple calls with the same parameters are one group. entonces se asume que múltiples llamadas con los mismos parámetros son un grupo.
If you want to have total control over cycle groups, you can optionally specify the name of the group. Si quiere tener control total sobre los grupos del ciclo, opcionalmente puede especificar el nombre del grupo.
This can even be a variable. Esto puede ser una variable.
<pre> <pre>
@@ -222,7 +221,7 @@ This can even be a variable.
{% cycle 'group 2': 'one', 'two', 'three' %} {% cycle 'group 2': 'one', 'two', 'three' %}
{% cycle 'group 2': 'one', 'two', 'three' %} {% cycle 'group 2': 'one', 'two', 'three' %}
will result in va a producir:
one one
two two
@@ -230,9 +229,9 @@ one
two two
</pre> </pre>
h2. For loops h2. Ciclos For
Liquid allows @for@ loops over collections: Liquid te permite iterar sobre collecciones con un tag @for@:
<pre> <pre>
{% for item in array %} {% for item in array %}
@@ -240,22 +239,22 @@ Liquid allows @for@ loops over collections:
{% endfor %} {% endfor %}
</pre> </pre>
During every @for@ loop, the following helper variables are available for extra styling needs: En cada iteración del ciclo @for@, puede usar alguna de las siguientes variables para sus necesidades de styling:
<pre> <pre>
forloop.length # => length of the entire for loop forloop.length # => largo de todo el for
forloop.index # => index of the current iteration forloop.index # => índice de la iteración actual (empieza en 1)
forloop.index0 # => index of the current iteration (zero based) forloop.index0 # => índice de la iteración actual (empieza en 0)
forloop.rindex # => how many items are still left? forloop.rindex # => cuántos items falta iterar? (empieza en 1)
forloop.rindex0 # => how many items are still left? (zero based) forloop.rindex0 # => cuántos items falta iterar? (empieza en 0)
forloop.first # => is this the first iteration? forloop.first # => es esta la primera iteración?
forloop.last # => is this the last iternation? forloop.last # => es esta la última iteración?
</pre> </pre>
There are several attributes you can use to influence which items you receive in your loop Hay muchos atributos que puedes usar para influenciar a los items que usas para iterar en tu ciclo.
*limit:int* lets you restrict how many items you get. *limit:int* te permite la cantidad de items que recibes para iterar.
*offset:int* lets you start the collection with the nth item. *offset:int* te permite empezar en la posicion N de la collección.
<pre> <pre>
# array = [1,2,3,4,5,6] # array = [1,2,3,4,5,6]
@@ -265,14 +264,14 @@ There are several attributes you can use to influence which items you receive in
# results in 3,4 # results in 3,4
</pre> </pre>
Reversing the loop Iterando el ciclo en forma inversa
<pre> <pre>
{% for item in collection reversed %} {{item}} {% endfor %} {% for item in collection reversed %} {{item}} {% endfor %}
</pre> </pre>
Instead of looping over an existing collection, you can define a range of numbers to loop through. En vez de iterar sobre una collección existente, puedes definir un rango de numbers para iterarlo.
The range can be defined by both literal and variable numbers: El rango se puede definir por literales o números variables:
<pre> <pre>
# if item.quantity is 4... # if item.quantity is 4...
@@ -282,10 +281,10 @@ The range can be defined by both literal and variable numbers:
# results in 1,2,3,4 # results in 1,2,3,4
</pre> </pre>
h2. Variable Assignment h2. Asignación de Variables
You can store data in your own variables, to be used in output or other tags as desired. Puedes guardar datos en tus propias variables, para ser usadas en otros tags de texto o lógica como necesites.
The simplest way to create a variable is with the @assign@ tag, which has a pretty straightforward syntax: La forma más simple de crear una variable es con un tag @assign@, que tiene una sintáxis bien directa:
<pre> <pre>
{% assign name = 'freestyle' %} {% assign name = 'freestyle' %}
@@ -295,7 +294,7 @@ The simplest way to create a variable is with the @assign@ tag, which has a pret
{% endif %}{% endfor %} {% endif %}{% endfor %}
</pre> </pre>
Another way of doing this would be to assign @true / false@ values to the variable: Otra forma de hacer esto sería asignando los valores @true / false@ a una variable:
<pre> <pre>
{% assign freestyle = false %} {% assign freestyle = false %}
@@ -309,7 +308,8 @@ Another way of doing this would be to assign @true / false@ values to the variab
{% endif %} {% endif %}
</pre> </pre>
If you want to combine a number of strings into a single string and save it to a variable, you can do that with the @capture@ tag. This tag is a block which "captures" whatever is rendered inside it, then assigns the captured value to the given variable instead of rendering it to the screen. Si quieres combinar muchos strings en un solo string y luego guardarlo en una variable, puedes usar el tag @capture@.
Este tag es un bloque que "captura" todo lo que tenga adentro, luego lo asigna a una variable en vez de mostrarlo por pantalla.
<pre> <pre>
{% capture attribute_name %}{{ item.title | handleize }}-{{ i }}-color{% endcapture %} {% capture attribute_name %}{{ item.title | handleize }}-{{ i }}-color{% endcapture %}