اپنے تصوراتی تھیم میں حسب ضرورت فونٹس شامل کریں۔

Shopify آپ کے اسٹور کے لیے استعمال کرنے کے لیے سینکڑوں مفت فونٹس فراہم کرتا ہے۔ تاہم، آپ کو اپنے برانڈ گائیڈ لائن کے ساتھ منسلک ہونے کے لیے ایک حسب ضرورت فونٹ استعمال کرنے کی ضرورت ہے لیکن یہ Shopify کے ذریعے تعاون یافتہ نہیں ہے، آپ پھر بھی اسے اپنے تھیم میں شامل کر سکتے ہیں۔

فونٹ اپنی مرضی سے پہلے
فونٹ حسب ضرورت کے بعد

آپ مندرجہ ذیل دو طریقوں میں سے کسی ایک کا استعمال کرتے ہوئے اپنے تصوراتی تھیم میں فونٹس کو اپنی مرضی کے مطابق بنا سکتے ہیں۔

  • مائع کوڈ میں ترمیم کریں (انتہائی تجویز کردہ)

    اسے حاصل کرنے کے لیے یہاں ایک 9 قدمی گائیڈ ہے:

    1. آپ کو پہلے اپنا فونٹ دستیاب ہونا چاہیے۔ کچھ فونٹس کے پاس لائسنس ہوتے ہیں، اس لیے یقینی بنائیں کہ آپ انہیں اپنے استعمال کے لیے مناسب طریقے سے خریدتے ہیں۔ ہماری سپورٹ ٹیم آپ کے مطلوبہ فونٹس حاصل کرنے کی ذمہ دار نہیں ہوگی۔

    2. اس کے بعد، ہر فونٹ اسٹائل کو شامل کرنے کے لیے .woff اور .woff2 فارمیٹ کے ساتھ دو فائلیں تیار کریں۔ یہ یقینی بنانا ہے کہ آپ کا شامل کردہ فونٹ ہر قسم کے براؤزر پر پڑھنے کے قابل ہے۔

    3. کافی فائلیں رکھنے کے بعد، آپ انہیں [ایڈمن ڈیش بورڈ] > [مواد] 1 > [فائلیں] 2 > [اپ لوڈ] 3 کے ذریعے اپ لوڈ کرتے ہیں۔

      آپ کی اپ لوڈ کردہ تمام فونٹ فائلوں میں آپ کے کاپی کرنے کے عمل کے لیے فائل کا لنک فراہم کرنے کے لیے دائیں جانب چین کا بٹن ہوتا ہے۔

    4. اس کے بعد، اپنے ایڈمن ڈیش بورڈ پر واپس جائیں، [آن لائن اسٹور] 1 > [تھیمز] 2 پر کلک کریں > تصور تھیم کا انتخاب کریں > [ایکشن] 3 > [کوڈ میں ترمیم کریں] 4 پر کلک کریں۔

    5. کھلی ترمیم کوڈ ونڈو میں، آپ بائیں ہاتھ کے کالم میں فولڈر [Snippets] 1 پر جاتے ہیں۔ اس فولڈر میں، نئے فونٹ کے لیے کچھ حسب ضرورت کوڈ شامل کرنے کے لیے فائل [css-variables.liquid] 2 پر کلک کریں۔

    6. فائل اوپن فائل میں "css-variables.liquid"، آپ ٹیب اسٹائل کے تحت اضافی کوڈز شامل کرتے ہیں۔ یہ متن {%- style -%} کے نیچے پایا جا سکتا ہے۔ کوڈز مندرجہ ذیل شامل کیے گئے ہیں:


      @font-face {
      font-family: "MyFontHeading"؛
      src: url(' اپنے فونٹ فائل کا لنک شامل کریں ') فارمیٹ ("woff2")،
      url(' اپنے فونٹ فائل کا لنک شامل کریں ') فارمیٹ("woff")؛ }

      @font-face {
      فونٹ فیملی: " MyFontBody"؛
      src: url(' اپنے فونٹ فائل کا لنک شامل کریں ') فارمیٹ ("woff2")،
      url(' اپنے فونٹ فائل کا لنک شامل کریں ') فارمیٹ("woff")؛ }

      نوٹ: اٹالک ٹیکسٹ سیکشنز آپ نے اپنی مرضی کے مطابق بنائے ہیں۔ شامل کیے جانے والے @font-face{ } کوڈز کی تعداد اس بات پر منحصر ہے کہ آپ کے پاس کتنے فونٹ اسٹائل ہیں۔

    7. اس کے بعد، آپ:

      • متن "فونٹ-ہیڈنگ-فیملی" تلاش کریں اور {{...}} کے تمام حصوں کو فونٹ فیملی لائن کے لیے اپنے شامل کردہ متن سے بدل دیں (ہماری مثال میں 'MyFontBody')۔

      • متعلقہ کوڈ لائن پر تشریف لے جانے کے لیے متن "فونٹ-باڈی-فیملی" تلاش کریں اور {{...}} کے تمام حصوں کو مرحلہ 6 کے کوڈز میں فونٹ فیملی کے لیے اپنے شامل کردہ متن سے بدل دیں (ہماری مثال میں، یہ ہے 'MyFontHeading')

    8. تبدیل کرنے کے بعد، یہ نیچے کی تصویر کی طرح لگتا ہے:

    9. نوٹ:

      • تھیم کی ترتیبات > ٹائپوگرافی کی ترتیبات اب اثر میں نہیں رہیں گی چاہے آپ یہاں جو بھی ترتیب دیں ایک بار جب آپ ان کوڈز کو "css-variables.liquid" فائل میں شامل کر لیں۔
      • اوپر دی گئی تمام ہدایات اس وقت لاگو ہوتی ہیں جب آپ تمام سیکشنز اور بلاک کے لیے ایک ہی حسب ضرورت فونٹ لگاتے ہیں۔ اگر آپ کو مختلف حصوں یا بلاکس کے لیے مختلف فونٹس لگانے کی ضرورت ہے، تو ترمیم کا عمل بہت زیادہ پیچیدہ ہو جائے گا اور مزید مدد حاصل کرنے کے لیے براہ کرم ہماری سپورٹ ٹیم سے رابطہ کریں۔
  • RoarTheme ایپ استعمال کرنا

    جبکہ Shopify مفت فونٹس کا ایک وسیع ذخیرہ پیش کرتا ہے، آپ کو اپنے برانڈ کے رہنما خطوط کے ساتھ سیدھ میں لانے کے لیے حسب ضرورت فونٹ کی ضرورت ہو سکتی ہے۔ اگر آپ کا مطلوبہ فونٹ مقامی طور پر Shopify کے ذریعہ تعاون یافتہ نہیں ہے، تو پریشان نہ ہوں! ہماری ٹیم نے ایک ایسی ایپ تیار کی ہے جو آپ کے ویب ڈیزائن کو بڑھانے کے لیے فونٹ کی تخصیص کے اختیارات کی ایک وسیع رینج فراہم کرتی ہے ۔ امکانات کو دریافت کریں اور ہماری ایپ کے ساتھ اپنے اسٹور کے جمالیاتی معیار کو بلند کریں ۔

ہم امید کرتے ہیں کہ آپ کو یہ مضمون مددگار ثابت ہوگا! اگر آپ کو اس خصوصیت کے بارے میں کوئی تشویش ہے تو، مزید مدد کے لیے ہماری ٹیم سے رابطہ کرنے میں ہچکچاہٹ محسوس نہ کریں۔