المساعدة
تسجيل الدخول

تخصيص قسائم التعبئة

يمكنك تخصيص قالب قسائم التعبئة الخاصة بك. يتيح لك تغيير القالب إضافة علامتك التجارية وتغيير المظهر العام لقسيمة التعبئة.

في هذه الصفحة

تغيير عنوان المتجر

إذا كنت ترغب في تعديل أو تغيير عنوان متجرك، فيمكنك الانتقال إلى الإعدادات > عـام وتعديل معلومات متجرك.

إذا كنت ترغب في تغيير العنوان في قسائم التعبئة فقط، فاتبع الخطوات التالية.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى الإعدادات > الشحن والتوصيل.

  2. في قسم المستندات، انقر على قالب قسيمة التعبئة.

  3. ابحث عن متغير Liquid {{ shop_address.summary }} الذي يشير إلى عنوان متجرك. وإذا لم تتمكن من العثور على هذا المتغير، فجرّب المتغير التالي:

{{ shop_address.address1 }}, {{ shop_address.city }}, {{ shop_address.province_code }}, {{ shop_address.zip }}, {{ shop_address.country }}
  1. ظلّل هذا الرمز البرمجي، واحذفه.
  2. اكتب العنوان الذي تريد إدراجه في قسائم التعبئة في هذه المساحة الفارغة. على سبيل المثال، يمكنك كتابة عنوانك ليبدو بهذا الشكل: 123 شارع مثال، نيويورك، نيويورك، 10000، الولايات المتحدة
  3. انقر على معاينة القالب لرؤية تغييراتك.
  4. انقر على حفظ.

إزالة صور المنتجات

يمكنك إزالة صور منتجاتك التي تُعرض بجوار عناوين المنتجات في قسائم التعبئة الخاصة بك.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى الإعدادات > الشحن والتوصيل.

  2. في قسم المستندات، انقر على قالب قسيمة التعبئة.

  3. ابحث عن متغيرات Liquid التالية التي تشير إلى صور منتجاتك:

{% if line_item.image != blank %}
       <div class="flex-line-item-img">
         <div class="aspect-ratio aspect-ratio-square" style="width: {{ desired_image_size }}px; height: {{ desired_image_size }}px;">
           {{ line_item.image | img_url: effective_image_dimensions | img_tag: '', 'aspect-ratio__content' }}
         </div>
       </div>
       {% endif %}
  1. ظلّل هذا الرمز البرمجي، واحذفه.
  2. انقر على معاينة القالب لمعاينة تغييراتك.
  3. انقر على حفظ.

قبل إضافة شعار متجرك إلى قسائم التعبئة، ستحتاج إلى رفع شعارك إلى مسؤول Shopify. بعد الرفع، دوّن اسم الملف المرفوع لاستخدامه لاحقًا في قالب قسيمة التعبئة.

بعد رفع شعارك إلى متجرك، يمكنك إضافة شعارك وإزالة اسم متجرك، أو إضافة شعارك أعلى اسم متجرك، أو إضافة شعارك بجوار اسم متجرك.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى المحتوى > الملفات.

  2. انقر على رفع الملفات.

  3. حدّد شعار متجرك وارفعه من جهازك.

  4. دوّن اسم الملف عند اكتمال الرفع، بما في ذلك امتداد الملف (على سبيل المثال، .png، أو .jpg).

إضافة الشعار وإزالة اسم المتجر

يمكنك إزالة اسم متجرك واستبداله بشعار متجرك في الجزء العلوي من قسائم التعبئة.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى الإعدادات > الشحن والتوصيل.

  2. في قسم المستندات، انقر على قالب قسيمة التعبئة.

  3. ابحث عن الرمز البرمجي التالي الذي يشير إلى اسم متجرك:

<p class="to-uppercase">
  {{ shop.name }}
</p>
  1. ظلّل هذا الرمز البرمجي، واحذفه.
  2. في المساحة التي أنشأتها، اكتب الرمز البرمجي التالي باستخدام اسم الملف الذي تم رفعه سابقًا:
{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}

يُنشئ عامل التصفية file_img_url عنوان URL للملف المرفوع بالحجم المحدد، بينما يُنشئ عامل التصفية img_tag علامة صورة HTML مع النص البديل الذي تُقدمه.

على سبيل المثال، إذا كان الملف المرفوع هو shop_logo.png، فسيكون رمز Liquid المقابل هو:

{{ 'shop_logo.png' | file_img_url: 'small' | img_tag: 'Logo' }}
  1. حدّد معاينة القالب لمعاينة تغييراتك.
  2. انقر على حفظ.

إضافة الشعار أعلى اسم المتجر

إذا كنت ترغب في إضافة شعارك أعلى اسم متجرك في الجزء العلوي من قسائم التعبئة، فاتبع الخطوات التالية.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى الإعدادات > الشحن والتوصيل.

  2. في قسم المستندات، انقر على قالب قسيمة التعبئة.

  3. ابحث عن متغير Liquid التالي الذي يشير إلى اسم متجرك، وأضف فاصل أسطر بين السطرين:

<div class="shop-title">
      |
      <p class="to-uppercase">
  1. في المساحة التي أنشأتها، اكتب الرمز البرمجي التالي باستخدام اسم الملف الذي رفعته سابقًا (على سبيل المثال، shop_logo.png):
{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<br>
  1. حدّد معاينة القالب لمعاينة تغييراتك.
  2. انقر على حفظ.

إضافة الشعار بجوار اسم المتجر

إذا كنت ترغب في إضافة شعارك بجوار اسم متجرك في الجزء العلوي من قسائم التعبئة، فاتبع الخطوات التالية.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى الإعدادات > الشحن والتوصيل.

  2. في قسم المستندات، انقر على قالب قسيمة التعبئة.

  3. ابحث عن متغير Liquid التالي الذي يشير إلى اسم متجرك:

<p class="to-uppercase">
{{ shop.name }}
</p>
  1. ظلّل هذا الرمز البرمجي، واحذفه.
  2. في المساحة التي أنشأتها، اكتب الرمز البرمجي التالي باستخدام اسم الملف الذي رفعته سابقًا (على سبيل المثال، shop_logo.png):
{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<span class="to-uppercase">
  {{ shop.name }}
</span>
  1. ابحث عن متغيرات Liquid التالية:
.shop-title {
  -webkit-box-flex: 6;
  -webkit-flex: 6;
  flex: 6;
  font-size: 1.9em;
}
  1. أضف سطرًا جديدًا في نهاية المتغيرات المدرجة أعلاه، والصق الرمز البرمجي التالي:
.shop-title img {
 vertical-align: middle;
}

.shop-title span {
 vertical-align: middle;
}
  1. حدّد معاينة القالب لمعاينة تغييراتك.
  2. انقر على حفظ.

تصميم قسائم التعبئة باستخدام CSS

يمكنك تخصيص قسيمة التعبئة باستخدام ملفات CSS التي ترفعها إلى Shopify. لن يتم عرض ملفات CSS المستضافة خارج Shopify بشكل صحيح.

الخطوات:

  1. من مسؤول Shopify، انتقل إلى المحتوى > الملفات.

  2. انقر على رفع الملفات.

  3. حدّد ملف CSS الخاص بك وارفعه.

  4. انسخ عنوان URL للملف عند اكتمال الرفع.

  5. قم بتضمين الرمز البرمجي التالي:

<link
  rel="stylesheet"
  type="text/css"
  href="https://cdn.shopify.com/path_to_file/styles.css"
>