Настройка шаблонов Order Printer

В панели администратора Shopify можно создать и настроить до 15 шаблонов для приложения Order Printer. По умолчанию приложение Order Printer включает два шаблона:

  • Счет-фактура — базовый счет-фактура, который можно отправить клиенту.
  • Упаковочный лист — распечатка с адресом вашего магазина и адресом доставки клиента.

Создание нового шаблона Order Printer

Для создания нового шаблона Order Printer необходимо знание HTML, CSS и Liquid. Служба поддержки тем Shopify может помочь с небольшими корректировками бесплатных тем Shopify в рамках Политики дизайна Shopify. Если вам требуются более сложные изменения или вы используете тему, созданную не Shopify, подумайте о том, чтобы нанять партнера Shopify.

Шаги:

  1. В панели администратора Shopify перейдите в раздел «Приложения» > Order Printer (legacy).

  2. Нажмите «Управление шаблонами».

  3. Нажмите «Добавить шаблон».

  4. Введите название нового шаблона в поле «Название».

  5. Добавьте код HTML, CSS или Liquid в поле «Код», чтобы создать шаблон.

  6. По завершении нажмите «Сохранить».

Редактирование шаблона Order Printer

Для редактирования шаблонов Order Printer необходимо знание HTML, CSS и Liquid. Служба поддержки тем Shopify не может вносить значительные изменения в шаблоны за вас, но может помочь с небольшими корректировками бесплатных тем Shopify в рамках Политики дизайна Shopify. Для выполнения более сложных изменений подумайте о том, чтобы нанять партнера Shopify.

Шаги:

  1. В панели администратора Shopify перейдите в раздел «Приложения» > Order Printer (legacy).

  2. Нажмите «Управление шаблонами».

  3. Нажмите на название шаблона, который хотите отредактировать.

  4. Внесите изменения в шаблон, добавив или отредактировав код HTML, CSS или Liquid в поле «Код». Чтобы просмотреть примеры настроек шаблона, см. раздел Примеры настроек шаблонов.

  5. По завершении нажмите «Сохранить».

Примеры настроек шаблонов

В следующих примерах описаны распространенные способы настройки шаблонов Order Printer:

На компьютере
  1. В панели администратора Shopify перейдите в раздел «Контент» > Файлы.

  2. Нажмите «Загрузить файлы» и выберите файл изображения на своем компьютере.

  3. На странице «Файлы» найдите загруженный файл и нажмите «Копировать URL».

  4. В панели администратора Shopify нажмите «Настройки» > «Приложения».

  5. Нажмите Order Printer, чтобы открыть приложение.

  6. Нажмите «Управление шаблонами».

  7. Нажмите на название шаблона, который хотите отредактировать.

  8. Вставьте следующий фрагмент кода в шаблон в том месте, где должен появиться ваш логотип: <img src="your-image-URL">.

  9. Замените your-image-URL на скопированный URL-адрес изображения. В зависимости от того, где вы хотите разместить логотип, может потребоваться добавить тег <br/> для разрыва строки до или после изображения.

На мобильном устройстве
  1. В приложении Shopify нажмите значок Меню.

  2. В меню «Контент» нажмите значок arrow down, а затем — «Файлы».

  3. Нажмите «Загрузить файлы» и выберите файл изображения на своем компьютере.

  4. На странице «Файлы» найдите загруженный файл и нажмите «Копировать URL».

  5. В панели администратора Shopify нажмите «Настройки» > «Приложения».

  6. Нажмите «Order Printer», чтобы открыть приложение.

  7. Нажмите «Управление шаблонами».

  8. Нажмите на название шаблона, который хотите отредактировать.

  9. Вставьте следующий фрагмент кода в шаблон в том месте, где должен появиться ваш логотип: <img src="your-image-URL">.

  10. Замените your-image-URL на скопированный URL-адрес изображения. В зависимости от того, где вы хотите разместить логотип, может потребоваться добавить тег <br/> для разрыва строки до или после изображения.

В HTML это должно выглядеть так:

Пример кода HTML

Пример: настройка ширины таблиц на 100%

Чтобы таблицы имели границы и растягивались на 100% ширины, добавьте к таблице класс table-tabular:

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

Пример: отображение миниатюр товаров

Чтобы добавить миниатюры товаров, вставьте в шаблон следующий код:

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

Добавление деталей заказа

Вы можете добавлять в шаблоны детали заказа, такие как название, количество и стоимость купленных товаров. Чтобы добавить детали заказа в шаблон:

  1. В панели администратора Shopify перейдите в раздел «Приложения» > Order Printer (legacy).

  2. Нажмите «Управление шаблонами».

  3. Нажмите на название шаблона, который хотите отредактировать.

  4. Используйте переменные Liquid для добавления деталей заказа и HTML для форматирования. Например, код {{ line_item.price | money }} выводит цену товара.

  5. По завершении нажмите «Сохранить».

Например, Найла хочет отредактировать свой шаблон упаковочного листа, чтобы включить в него список отправляемых товаров. Для этого она добавляет следующий код в конец своего шаблона «Упаковочный лист» в приложении 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>

В результате упаковочные листы Найлы теперь содержат таблицу со списком купленных товаров.