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

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

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

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

  3. کافی فائلیں رکھنے کے بعد، آپ انہیں تھیم کی ترتیبات میں فائل فائل میں اپ لوڈ کرتے ہیں۔

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

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

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

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

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

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

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

  7. اس کے بعد، آپ متعلقہ کوڈ لائن پر جانے کے لیے متن "فونٹ-باڈی-فیملی" تلاش کرتے ہیں اور {{...}} کے تمام حصوں کو مرحلہ 6 کے کوڈز میں فونٹ فیملی کے لیے اپنے شامل کردہ متن سے بدل دیتے ہیں (ہمارے مثال کے طور پر، یہ 'MyFontBody' ہے)۔ اسی طرح، "font-heading-family" کے متن کو تلاش کریں اور {{...}} کے تمام حصوں کو فونٹ فیملی لائن کے لیے اپنے شامل کردہ متن سے بدل دیں (ہماری مثال میں 'MyFontHeading')۔
  8. تبدیل کرنے کے بعد، سرخ خانے میں تبصرہ کردہ کوڈ کو سبز خانے میں موجود کوڈ سے بدل دیا جاتا ہے۔ یہ نیچے کی تصویر کی طرح لگتا ہے:
  9. آخر میں، محفوظ کریں پر کلک کریں۔

نوٹ :

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

مزید مدد کی ضرورت ہے۔

اگر آپ کو کوئی مسئلہ درپیش ہے یا آپ کو اپنے Be Yours تھیم کے ساتھ اضافی مدد کی ضرورت ہے، تو ماہر رہنمائی کے لیے Roartheme کی سپورٹ ٹیم تک پہنچنے میں ہچکچاہٹ محسوس نہ کریں۔

RoarTheme's Whatsapp کے ذریعے 8 گھنٹے کے اندر سپورٹ حاصل کرنے کے لیے QR کوڈ اسکین کریں۔