جیسا کہ تیسرے سبق میں بتایا گیا تھا کہ اس سبق میں کسی تھیم کو اردوانے کے سلسلے میں اس کے قابل تبدیل حصوں کا جائزہ لیا جائے گا۔ ورڈپریس کے تھیم عمومًا ایک جیسے کوڈ پر مشتمل ہوتے ہیں۔ چند ایک میں ہی ایک آدھ ڈورے کا فرق پڑجاتا ہے۔ بنیادی چیز جو ایک تھیم کو دوسرے سے ممتاز کرتی ہے وہ ہے اس کی سٹائل شیٹ یعنی سی ایس ایس CSS۔ سٹائل شیٹ اس بات کو واضح کرتی ہے کہ تھیم کس طرح نظر آئے گا۔ میرا علم سٹائل شیٹ کے سلسلے میں اگرچہ بہت محدود ہے لیکن کوشش ہے جو کچھ مجھے سمجھ آئی ہے آپ کو بھی سمجھا سکوں۔ انگریزی اور اردو تھیم میں بنیادی فرق سمت کا ہے۔ انگریزی بائیں سے دائیں ہے اور اردو دائیں سے بائیں، دوسرا بڑا فرق فونٹ کے استعمال کا ہے۔ انگریزی کے اچھے فونٹ جیسے تاہوما وغیرہ یونیکوڈ کو سپورٹ تو کرتے ہیں لیکن ان کا نتیجہ انتہائی بھدا ہوتا ہے۔ اس لیے اردو کے فونٹ استعمال کرنا ضروری ہوجاتا ہے۔ اگرچہ وہ بھی کوئی اتنی زیادہ تعداد میں نہیں لیکن گزارہ کرتے ہیں۔ عمومی پسند کیے جانے والے فونٹس میں پہلے نمبر پر اردو نسخ ایشیا ٹائپ ہے جو قریبا ویب استعمال کرنے والے ہر اردو صارف کے پی سی پر نصب ہوتا ہے۔ دوسرے نمبر پر نفیس ویب نسخ ہے۔ یہ فونٹ اکثر اوقات ایشیا ٹائپ سے بہتر نتیجہ دیتا ہے۔ بہرحال یہ آپ کی پسند ہوتی ہے کہ بنیادی فونٹ کونسا ہو لیکن متن کے لیے ہم آپ کو انھی دو میں سے کوئی ایک منتخب کرنے کا مشورہ دیں گے چونکہ ایک تو یہ چھوٹے سائز میں خوبصورت لگتے ہیں دوسرے جلدی پیش ہوجاتے ہیں یعنی انکی نمائش کے لیے زیادہ عمل کاری نہیں کرنا پڑتی کمپیوٹر کو۔ (اگر تجربہ کرنا چاہیں تو نفیس نستعلیق میں ایک ویب پیج بنا کر دیکھ لیں دو پیروں کا صفحہ بھی کھلنے میں کم از کم ایک منٹ لے گا یہ طاقتور پی سی کی بات ہورہی ہے پی ون اور ٹو تو چاہے جام ہوجائیں اس افتاد سے گھبرا کر)۔ اچھا تو اب ہم دیکھتے ہیں ایک تھیم کے لیے کیا بنیادی تبدیلیاں درکار ہونگی۔ سب سے پہلے ہم نے ہیڈر فائل میں تھوڑی سے تبدیلی کرنا ہے۔ ہر تھیم میں ایک ہیڈر فائل، ایک فوٹر فائل، ایک سائڈ بار، ایک سرچ رزلٹ فائل، ایک آرچیو فائل ، اور پوسٹ فائل قسم کی چیز ہونگی ۔ ساتھ میں ایک فولڈر ہوگا جس میں اس تھیم میں استعمال کی گئی تصاویر ہونگی۔ چلتے چلتے ایک ٹپ سے دے دیں ہم نے ذاتی طور پر زیادہ گرافکس والے تھیم کو اردوانے کی کوشش کی تھی شروع شروع میں لیکن ناکامی ہوئی چونکہ سمت بدل دی جاتی ہے اس لیے گرافکس کا بیڑہ غرق ہوجاتا ہے۔ تحریر کا پس منظر سائیڈ بار کے پیچھے نظر آرہا ہوتا ہے اور سائیڈ بار کا تحریر کے پیچھے۔ اس لیے ہم نے توبہ کی اور اس وقت ہمارے بلاگ پر سادہ سا تھیم جس میں گرافکس کے نام پر آر ایس آیس کے آئکن ہیں اردوا لیا۔ خیر ماہرین بے شک ان کو للکار سکتے ہیں۔ بس یہ یاد رکھیے گا اگر کوئی گرافکس سے بھرپور تھیم پسند آگیا ہے تو پس منظر کی تصاویر کو بھی اس حساب سے دائیں بائیں کرنا ہوگا۔ چلیں اب شروع کریں۔ ہیڈر ڈاٹ پی ایچ پی فائل کھول لیں۔ میرے تھیم ونٹر ڈے کی فائل کی ابتدائی سطور کچھ ایسے ہیں۔
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ur" xml:lang="ur" dir="rtl">
<head profile="http://gmpg.org/xfn/11" link rel="shortcut icon" href="favicon.ico"
link rel="icon" href="animated_favicon1.gif" type="image/gif">
اس میں دوسری سطر دیکھیں سب سے پہلی تبدیلی یہاں کرنی ہے۔ اگر آپ اپنے تھیم کی اسی فائل کا موازنہ اس فائل سے کریں تو آپ کو اس میں دو چیزیں اضافی نظر آئیں گی ایک تو lag= ur دوسرے dir =rtl یہ دونوں کمانڈیں خود سے دینے کی بجائے آپ یہ لائن نقل کریں اور اپنے تھیم کی فائل کی متعلقہ سطر اس سے بدل دیں۔ براؤزر اب اس صفحے کو اردو کے طور پر شناخت کرے گا اور سمت دائیں سے بائیں کردے گا۔ دوسری چیز ہے اس فائل میں ویب پیڈ کی شمولیت کے لیے کوڈ شامل کرنا۔ چونکہ ہمارا مقصد صارف کی آسانی ہے اس لیے ویب پیڈ کی شمولیت ضروری ہے اور اس کی سکرپٹ کو کال ہیڈر میں ہی کیا جائے گا بعد میں مختلف جگہوں پر اسے لاگو کردیا جائے گا۔ چناچہ اپنی اسی فائل میں باڈی کا ٹیگ ڈھونڈیں۔ یہ اکیلا ہوگا اس کے آگے پیچھے کچھ بھی نہیں ہوگا۔ صرف یہی لکھا ہوگا۔
<body>
اس کے فورًا بعد آپ نے یہ سطور شامل کردینی ہیں۔ یہاں میں اپنی متعلقہ فائل سے سارا کوڈ کاپی کررہا ہوں آپ باڈی کو چھوڑ کر باقی اٹھا لیجیے۔
<body>
<script language="javascript1.2" type="text/javascript" src="http://www.yourdomain.com/UrduEditor.js"></script>
<script language="JavaScript" type=text/javascript>
initUrduEditor("http://www.yourdomain.com/");
</script>
یہاں yourdomain کو اپنے ڈومین سے بدل دیں۔ اور اردوپیڈ آپ نے اپنی روٹ ڈائرکڑی میں کاپی کر ہی لیا ہوگا۔ یہ تو کام ختم ہوا ایک اور چیز جو بونس میں بتائے دیتا ہوں وہ ہے فےو آئکن۔ اس کا ربط بھی اسی فائل میں دینا ہے۔ ہیڈ سیکشن میں جیسے میرے ہاں کچھ ایسے ہے۔
<head profile="http://gmpg.org/xfn/11" link rel="shortcut icon" href="favicon.ico"
link rel="icon" href="animated_favicon1.gif" type="image/gif">
فےو آئکن کیا ہے اس کے لیے میرا لکھا ہوا چھوٹا سا ایک سبق اردو محفل پر موجود ہے۔ چلیں صاحب اب چلتے ہیں سائیڈ بار میں جہاں ہم نے تلاش کے قطعے میں ویب پیڈ شامل کرنا ہے۔میری فائل کی مثال ملاحظہ کیجیے۔
<li id="search">
<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
<p><input type="text" name="s" id="s" onfocus="setEditor(this)" "<?php echo wp_specialchars($s, 1); ?>" size="22" tabindex="1" />
<script language="JavaScript" type=text/javascript>
makeUrduEditor("s", 12);
</script></p>
English<input type="radio" value="English" name="toggle1" onclick='setEnglish("s")'><font face="Urdu Naskh Asiatype">اردو</font><input type="radio" value="Urdu" checked name="toggle1" onclick='setUrdu("s")'>
<p><input type="submit" id="searchsubmit" value="تلاش" />
</p>
</form>
</li>
تلاش کا خانہ ہوسکتا ہے الگ سے ایک فائل میں موجود ہو جیسے ورڈپریس کے بنیادی کربک تھیم میں ہے۔ لیکن اس میں یہ چیز مشترک ہوگی۔ اب آپ کا کام ہے کہ اوپر والی مثال اور اپنی فائل میں موجود فرق جانچیں اور ان کو ایک جیسا کرلیں۔ آپ اس کو بھی اپنی فائل کے متعلقہ حصے میں اٹھا کر رکھ سکتے ہیں پرانا اڑا کر۔ اصل میں زیادہ فرق نہیں ہوگا صرف اتنا ہی کہ پیرا کی جگہ اس نے ڈویژن کی کمانڈ دی ہوگی۔ باقی اردو پیڈ کی شمولیت ایسے ہی ہوگی۔ اردو ویب پیڈ کی شمولیت کے سلسلے میں آپ کو ایک دو بار شاید پریشانی ہو لیکن پھر آپ اسے کسی بھی عبارتی/تدوینی علاقے میں شامل کرنے کے قابل ہونگے۔ خیر یہ تو بات تھی تلاش کے قطعے کی۔ اب چلتے ہیں کمنٹس کی فائل میں۔ اور یہ وہ فائل ہے جس نے مجھے بہت تنگ کیا تھا۔ اس فائل میں دو جگہیں ہیں جہاں آپ کو ویب پیڈ شامل کرنا ہوگا نمبر ایک مصنف کا نام اور دوسرے تبصروں کا خانہ۔ دونوں کی مثالیں اپنی فائل سے آپ کے سامنے رکھ رہا ہوں انھیں دیکھیں، فرق جانچیں اور متعلقہ تبدیلی اسی طرح کرلیں۔ یاد رہے p کا ٹیگ div کے ٹیب سے بدل دینے سے کوئی خاص فرق نہیں پڑے گا۔ یہ ہے مصنف کے نام کا قطعہ
<div><label for="author"><?php _e('نام'); ?> <?php if ($req) _e('(درکار)'); ?></label></div>
English<input type="radio" value="English" name="toggle" onclick='setEnglish("author")'><font face="Urdu Naskh Asiatype">اردو</font><input type="radio" value="Urdu" checked name="toggle" onclick='setUrdu("author")'>
<div><input type="text" name="author" id="author" onfocus="setEditor(this)" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
<script language="JavaScript" type=text/javascript>
makeUrduEditor("author", 12);
</script></div>
اور یہ ہے تبصرہ کرنے کا خانہ
<div><label for="comment"><?php _e('لکھیں'); ?> <?php _e('تبصرہ'); ?></label></div>
<div><textarea name="comment" id="comment" onfocus="setEditor(this)" cols="50" rows="10" tabindex="4"></textarea></div>
<script language="JavaScript" type=text/javascript>
makeUrduEditor("comment", 16);
</script>
English<input type="radio" value="English" name="toggle1" onclick='setEnglish("comment")'><font face="Urdu Naskh Asiatype">اردو</font><input type="radio" value="Urdu" checked name="toggle1" onclick='setUrdu("comment")'>
ہمارا مشورہ ہے کہ یہ سب تبدیلیاں اپنے ڈیسکٹاپ پر کی جائیں پھر ایک ہی بار فائلوں کو بلاگ پر چڑھا کر ان کو جانچا جائے۔ اب ہم آتے ہیں آخری کام پر اور وہ ہے سٹائل شیٹ میں تبدیلی۔ یہ اصل میں سب سے آسان کام ہے۔ یہاں صرف کاپی پیسٹ کرنا ہے ہم نے۔ سٹائل شیٹ میں جو چیزیں تبدیل ہونگی وہ ہیں font-size, font-family, float اور بعض صورتوں میں padding , margin وغیرہ بھی۔ بنیادی طور پر اگر آپ سادہ تھیم پسند کرتے ہیں تو پہلی تین صورتیں ہی کافی ہونگی۔ اب ہم بات کرتے ہیں کہ فونٹ کوکس طرح بدلنا ہے اور کہاں کہاں۔ فونٹ کو آپ نے صرف ایک جگہ نہیں بدلنا اور وہ ہے code کی آئی ڈی۔ باقی ہر جگہ خصوصًا content, sidebar, heading, h1, h2 وغیرہ وغیرہ میں جہاں بھی فونٹ کا ذکر موجود ہے وہاں آپ نے اللہ کا نام لے کر یہ پیسٹ کرتے جانا ہے۔
font-family : "Urdu Naskh Asiatype", "Nafees Web Naskh", "Lucida Grande", Verdana, Arial, Sans-Serif;
یاد رہے فونٹ فیملی کی ساری کمانڈ کو آپ نے اس سے بدلتے جانا ہے۔ اس میں پہلا فونٹ ایشیا ٹائپ ہے اگر وہ نہ ہوتو نفیس ویب نسخ اگر وہ بھی دستیاب نہیں تو لوسیڈا وغیرہ وغیرہ۔ آپ ان میں اپنی پسند کے مطابق آگے پیچھے کرکے تبدیلی کرسکتے ہیں۔ اگلی بات ہے فونٹ سائز کی۔ فونٹ کا سائز تھوڑا سا بڑا کرنا پڑے گا۔ لیکن یہ آپ کو خود کرنا ہے۔ پہلے بنیادی سائز پر دیکھ لیں بلاگ کیسا لگتا ہے اگر نہ جچے تو اس کو بڑا کرلیں فونٹ سائز em, pt, px اور % وغیرہ میں ہوسکتا ہے یہ اب آپ کی پسند و لیاقت پر ہے کہ کتنا فونٹ سائز پسند کرتے ہیں۔ تیسری چیز ہے فلوٹ۔ یہ اصل میں براؤزرکو بتاتی ہے کہ یہ چیز دائیں ہویا بائیں۔ جیسے اگر ایک تھیم میں سائیڈ بار دائیں طرف ہے تو اس کی سٹائل شیٹ میں sidebar کی آئی ڈی کے تحت فلوٹ رائٹ لکھا ہوگا۔ اسی طرح متن یعنی content کا حساب ہے۔ لیکن دونوں کبھی بھی ایک ہی طرف نہیں ہونگے مخالف سمتوں میں ہونگے۔ سو اگر آپ سائیڈ بار بائیں اور متن بار دائیں کرنا چاہیں تو آپ کو فلوٹ کی کمانڈ الٹنا ہوگی۔ بس یہ ہی تھا سب۔ سٹائل شیٹ میں بس اتنی ہی تبدیلیاں درکار ہوتی ہیں ہمارے خیال میں۔ اب بات کرتے ہیں اصطلاحات کے ترجمہ کی۔ ترجمہ آُپ پی ایچ پی کوڈ کے اندر باآسانی پہچان لیتے ہیں جو عمومًا دو واوین جیسے ٰیہٰ کی شکل میں ہوتے ہیں، اکثر ان کے شروع میں ایک e بھی دیا ہوتا ہے یا ایک -جیسی چیز نظر آرہی ہوتی ہے۔ ان کو دیکھیں اور مناسب الفاظ میں اردو ترجمہ کرکے فائل کو یو ٹی ایف 8 بناوٹ میں محفوظ کردیں ایکس پی میں اگر آپ یہ سب کررہے ہیں تو وہ نوٹ پیڈ میں فائل کی تدوین کے بعد محفوظ کرنے سے پہلے ایرر دے گا کہ انکوڈنگ ٹھیک نہیں چناچہ اسے یو ٹی ایف 8 کرلیجیے گا۔ لینکس طےشدہ طور پر ہی فائل کو یو ٹی ایف 8 میں محفوظ کرتا ہے۔ اب ایک آخری بات جب آپ کوئی پرانی تحریر دیکھ رہے ہوں تو نیچے لکھا آتا ہے ٰ<<فلاں تحریرٰ اور ٰفلاں تحریر>>ٰ۔ انگریزی میں ہونے کی وجہ سے ان کی جگہیں الٹ ہونگی دائیں والی بائیں اور بائیں والی دائیں ہوگی۔ اس میں آپ تبدیلی کرلیں کہ متعلقہ فائل میں جاکر (جو ترجمہ کرتے وقت آپ کو کلیئیر ہوجائے گی) ان کی سمت الٹ کردیں۔ تو یہ تھا سب کچھ جو ہم نے اب تک سیکھا۔ اگرچہ ہم اب بھی کچھ معاملات میں پریشان ہیں جیسے اگر صفحے کی چوڑائی بڑھا کر رقبہ زیادہ کرنا ہو تو سٹائل شیٹ کا کونسا بٹن دبائیں لیکن امید ہے آپ کے لیے نارمل بلاگنگ کرنے کے لیے یہ سب کچھ بہت ہوگا۔ باقی ورڈپریس کے سپورٹ فورم پر حاضر رہیے گا، وہاں سے آپ کو بہترین اور ہر قسم کی مدد مل سکے گی، اس کے علاوہ اپنی ضرورت کے مطابق دخیلے یعنی پلگ ان نصب کرلیجیے گا ان سے بہت آسانی ہوجاتی ہے اس سلسلے میں بھی ورڈپریس کے گرو جو متعلقہ چوپالوں میں بیٹھے ہیں آپ کو ربط فراہم کردیں گے۔ اب دعا کیجیے گا کہ انھیں صفحات پر اردو ورڈپریس کا تعارف بھی لکھوں۔ اللہ توفیق دے۔ آمین وسلام
مجھے آپ سے دو باتیںپوچھنی ہیں۔ ایک یھ کھ سائڈ بار کو دائیں طرف کیسے لا سکتے ہیں۔
جواب دیںحذف کریںدوسری یھ کھ میںاپنی سائٹ والے کمینٹ کے صفحے کو آپ کی طرح کا کیسے بنا سکتا ھوں۔ آپ کے کمینٹ کے صفحے میںیھ خوبی ھے کھ بناں انگلش سے اردو فونٹ بدلے آپ کمینٹ اردو میںبھیج سکتے ہیں۔
معذرت کے ساتھ جناب۔
جواب دیںحذف کریںمیں آپ کو برقیے میں ہی جواب دیتا ہوں۔
وسلام
بہت ہی عمدہ شاکر بھائی۔۔۔میں اپنی نئی تھیم میں کل اسی طرح سے ویب پیڈ شامل کرتا ہوں۔ بہت شکریہ
جواب دیںحذف کریںبہت بہت شکریہ (دوست) شاکر بھائی
جواب دیںحذف کریںویسے میں بھی اپنا بلاگ بنانے کے چکر میں ہوں
ٹرائی کرتا ہوں۔