پیکنگ سلپس کو حسب ضرورت بنانا

آپ اپنی پیکنگ سلپس کے ٹیمپلیٹ کو کسٹمائز کر سکتے ہیں۔ ٹیمپلیٹ کو تبدیل کرنے سے آپ کو اپنی برانڈنگ شامل کرنے اور پیکنگ سلپ کی وضع قطع کو تبدیل کرنے کی سہولت ملتی ہے۔

سٹور کا ایڈریس تبدیل کریں

اگر آپ اپنے سٹور کے ایڈریس میں ترمیم یا تبدیلی کرنا چاہتے ہیں، تو آپ سیٹنگز > جنرل پر جا کر اپنے سٹور کی معلومات میں ترمیم کر سکتے ہیں۔

اگر آپ صرف اپنی پیکنگ سلپ پر ایڈریس تبدیل کرنا چاہتے ہیں، تو ذیل کے اقدامات پر عمل کریں۔

اقدامات:

  1. اپنے Shopify ایڈمن سے، سیٹنگز > شپنگ اور ڈیلیوری پر جائیں۔

  2. دستاویزات سیکشن میں، پیکنگ سلپ ٹیمپلیٹ پر کلک کریں۔

  3. {{ shop_address.summary }} Liquid ویری ایبل تلاش کریں جو آپ کے سٹور کے ایڈریس کا حوالہ دیتا ہے۔ اگر آپ کو یہ ویری ایبل نہیں ملتا ہے، تو درج ذیل کو آزمائیں:

{{ shop_address.address1 }}, {{ shop_address.city }}, {{ shop_address.province_code }}, {{ shop_address.zip }}, {{ shop_address.country }}
  1. اس کوڈ کو ہائی لائٹ کریں، اور اسے ڈیلیٹ کر دیں۔
  2. اس خالی جگہ میں وہ ایڈریس ٹائپ کریں جو آپ اپنی پیکنگ سلپ پر رکھنا چاہتے ہیں۔ مثال کے طور پر، آپ اپنا ایڈریس اس طرح دکھنے کے لیے ٹائپ کر سکتے ہیں: 123 Example Street, New York, NY, 10000, United States
  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 فلٹر آپ کے فراہم کردہ alt ٹیکسٹ کے ساتھ ایک 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 کا استعمال کرتے ہوئے پیکنگ سلپ کو سٹائل کریں

آپ Shopify پر اپ لوڈ کردہ CSS فائلوں کا استعمال کر کے اپنی پیکنگ سلپ کو کسٹمائز کر سکتے ہیں۔ Shopify کے باہر ہوسٹ کی گئی CSS فائلیں مناسب طریقے سے رینڈر نہیں ہوں گی۔

اقدامات:

  1. اپنے Shopify ایڈمن سے، مواد > فائلیں پر جائیں۔

  2. فائلیں اپ لوڈ کریں پر کلک کریں۔

  3. اپنی CSS فائل منتخب کریں اور اپ لوڈ کریں۔

  4. اپ لوڈ مکمل ہونے پر فائل کا URL کاپی کریں۔

  5. درج ذیل کوڈ شامل کریں:

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