Ayuda
Iniciar sesión

Personalizar las plantillas de Order Printer

En el panel de control de Shopify puedes crear y personalizar hasta 15 plantillas para la aplicación Order Printer. De forma predeterminada, la aplicación Order Printer incluye dos plantillas:

  • Factura - una factura básica que puedes enviar a un cliente
  • Nota de entrega - una impresión con la dirección de la tienda y la dirección de envío del cliente

En esta página

Crear una nueva plantilla de Order Printer

Para crear una nueva plantilla de Order Printer, necesitas tener conocimientos de HTML, CSS y Liquid. Atención al cliente para temas de Shopify podría ayudarte con ajustes menores en los temas gratuitos de Shopify dentro del alcance de la Política de diseño de Shopify. Si necesitas cambios más complejos o usas un tema que no fue creado por Shopify, considera contratar a un Shopify Partner.

Pasos:

  1. Desde el panel de control de Shopify, ve a Aplicaciones > Order Printer (legacy).

  2. Haz clic en Administrar plantillas.

  3. Haz clic en Agregar plantilla.

  4. Escribe un nombre para la nueva plantilla en el campo Nombre.

  5. Agrega código HTML, CSS o Liquid en el campo Código para crear la plantilla.

  6. Cuando termines, haz clic en Guardar.

Editar una plantilla de Order Printer

Para editar tus plantillas de Order Printer, necesitas tener conocimientos de HTML, CSS y Liquid. Atención al cliente para temas de Shopify no puede editar en profundidad las plantillas por ti, pero podría ayudarte con ajustes menores en los temas gratuitos de Shopify dentro del alcance de la Política de diseño de Shopify. Para realizar cambios más complejos, considera contratar a un Shopify Partner.

Pasos:

  1. Desde el panel de control de Shopify, ve a Aplicaciones > Order Printer (legacy).

  2. Haz clic en Administrar plantillas.

  3. Haz clic en el nombre de la plantilla que quieres editar.

  4. Realiza los cambios en la plantilla agregando o editando código HTML, CSS o Liquid en el campo Código. Para ver ejemplos de personalizaciones de plantillas, consulta Ejemplos de personalización de plantillas.

  5. Cuando termines, haz clic en Guardar.

Ejemplos de personalización de plantillas

Estos ejemplos explican algunas formas comunes de personalizar las plantillas de Order Printer:

Escritorio

  1. Desde el panel de control de Shopify, ve a Contenido > Archivos.

  2. Haz clic en Cargar archivos y selecciona el archivo de imagen en la computadora.

  3. En la página Archivos, busca el archivo cargado y haz clic en Copiar URL.

  4. Desde el panel de control de Shopify, haz clic en Configuración > Aplicaciones.

  5. Haz clic en Order Printer para abrir la aplicación.

  6. Haz clic en Administrar plantillas.

  7. Haz clic en el nombre de la plantilla que quieres editar.

  8. Ingresa el siguiente fragmento de código en la plantilla donde quieres que aparezca el logo: <img src="your-image-URL">.

  9. Reemplaza your-image-URL por la URL de la imagen que copiaste. Según dónde quieras mostrar el logo, quizá debas agregar la etiqueta <br/> para insertar un salto de línea antes o después de la imagen.

Móvil

  1. Desde la app de Shopify, toca el ícono Menu.

  2. En el menú Contenido, toca el ícono flecha hacia abajo y luego toca Archivos.

  3. Toca Cargar archivos y selecciona el archivo de imagen en la computadora.

  4. En la página Archivos, busca el archivo cargado y toca Copiar URL.

  5. Desde el panel de control de Shopify, toca Configuración > Aplicaciones.

  6. Toca Order Printer para abrir la aplicación.

  7. Toca Administrar plantillas.

  8. Toca el nombre de la plantilla que quieres editar.

  9. Ingresa el siguiente fragmento de código en la plantilla donde quieres que aparezca el logo: <img src="your-image-URL">.

  10. Reemplaza your-image-URL por la URL de la imagen que copiaste. Según dónde quieras que aparezca el logo, quizá debas agregar la etiqueta <br/> para insertar un salto de línea antes o después de la imagen.

En HTML debería verse así:

Código HTML de ejemplo

Ejemplo: hacer que las tablas tengan un ancho del 100%

Para que las tablas tengan bordes y ocupen el 100% del ancho, agrega la clase table-tabular a la tabla:

<table class="table-tabular">
    ...
</table>

Ejemplo: mostrar miniaturas de productos

Para incluir miniaturas de productos, inserta este código en la plantilla:

{{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }}

Agrega información del pedido

Puedes agregar información del pedido a las plantillas, como el nombre, la cantidad y el costo de los artículos comprados. Para agregar información del pedido a la plantilla:

  1. Desde el panel de control de Shopify, ve a Aplicaciones > Order Printer (legacy).

  2. Haz clic en Administrar plantillas.

  3. Haz clic en el nombre de la plantilla que quieres editar.

  4. Usa variables de Liquid para agregar información del pedido y HTML para aplicar formato. Por ejemplo, el {{ line_item.price | money }} imprime el precio del artículo.

  5. Cuando termines, haz clic en Guardar.

Por ejemplo, Nyla quiere editar la plantilla de nota de entrega para incluir una lista de los artículos que se envían. Agrega el siguiente código al final de la plantilla Nota de entrega en la aplicación Order Printer:

<br>
<br>
<table class="table-tabular" style="margin: 0 0 1.5em 0;">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Item</th>
      {% if tax_lines.size > 0 %}
      <th>Taxes</th>
      {% endif %}
      <th>Price</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in line_items %}
      <tr>
        <td>{{ line_item.quantity }} x</td>
        <td><b>{{ line_item.title }}</b></td>
        {% if line_item.tax_lines %}
          <td>
            {% for tax_line in line_item.tax_lines %}
              {{ tax_line.price | money }} {{ tax_line.title }}<br/>
            {% endfor %}
          </td>
        {% endif %}
        <td>{{ line_item.price | money }}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>

Como resultado, las notas de entrega de Nyla ahora incluyen una tabla que enumera los artículos comprados.