ہیڈر فائل کی تیاری
یہاں سے ہم اپنا اصل کام یعنی سانچہ کو توڑنا اور ورڈپریس کے قابل بنانا شروع کریں گے ۔سانچہ کو تورٹے وقت سب سے اہم بات جس کا خیال آپ کو رکھنا ہو گا، وہ یہ ہے کہ جو سلیکٹر ٹیگ جیسے ڈِوو ٹیگ شروع ہوگا، اُس کو بند بھی لازمی کرنا ہے علاوہ ازیں کہیں کوئی ٹیگ دوبار نہیں آنا چاہیے۔ اس لئے انڈیکس سے کاپی کرتے وقت یہ بات ذہن میں رکھیں کہ آپ نے کہاں تک کا کوڈ کاپی کر کے نئی فائل میں پیسٹ کیا ہے ۔ایک چھوٹی سی غلطی پورا سانچہ تباہ کر کے رکھ سکتی ہے، اس لئے کوشش کریں کہ غلطی ہو ہی نہیں ۔
اب ہم اپنی انڈیکس فائل کو دیکھتے ہیں،صحفہ کے ہیڈ ٹیگ کے ختم ہونے تک سب کچھ ہم کاپی کریں گے، باڈی ٹیگ کے فوراً نیچے ہمیں ہیڈر نام کا سلیکٹر نظر آ رہا ہے جس کے اندر دو مختلف کلاسز ہیں ایک لوگو کی دوسری مینوبار نام کی اضافی طور پر سرچ نام کی ایک کلاس بھی موجود ہے، اس کے بعد یہ تمام سلیکٹرز ایک ایک کر کے بند ہو رہے ہیں ۔ فوراً بعد ہی پیج نام کا ایک سلیکٹر ہے،اس سلیکٹر کے درمیان میں پورا صحفہ یعنی پوسٹ اور سائیڈبار موجود ہیں ۔ ہم اس سلیکٹر تک سب کچھ کاپی کر کے اس ہیڈر فائل میں پیسٹ کر دیں گے ۔ ذیل میں دیکھیں.
Code: Select all
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />
<title>creating wordpress theme</title>
<link rel=”stylesheet” href=”style.css” type=”text/css” />
</head>
<body>
<div id=”header”>
<div class=”logo”>This is logo of the site</div>
<div class=”navbar”>
<ul>
<li>First Page</li>
<li>2nd Page</li>
<li>3rd Page</li>
</ul>
<div class=”search”>
<form method=”get” action=”index.html”>
<input type=”text” class=”s” name=”s”/>
<input type=”submit” class=”button” value=”Go”/>
<form>
</div>
</div>
<div id=”page”>
یہاں ایک بات آپ نے نوٹ کی ہو گی، میں نے اوپر کہا تھا کہ جو سلیکٹر شروع ہو گا اُسے لازمی بند کرنا ہے، لیکن اوپر پیسٹ کردہ مثال میں پیج نام کا سلیکٹر شروع تو ہوا ہے لیکن ہم نے اسے بند نہیں کیا ۔ اگر ایچ ٹی ایم ایل کی انڈیکس فائل کو دیکھیں تو یہ سلیکٹر سب سے آخر میں بند ہو رہا ہے ۔ ہم بھی اس سلیکٹر کو آخر میں ہی بند کریں گے ۔
اب اگر ہم اس ہیڈر فائل کو یوں ہی رہنے دیں، تب بھی یہ ایک مکمل فائل ہے، لیکن بہتر یہی ہے کہ ہم اس میں ورڈپریس ٹیگز کا استعمال کریں ۔ورڈپریس میں استعمال ہونے والے ٹیگز کا مکمل مطالعہ آپ یہاں کر سکتے ہیں ۔
سب سے پہلے ہم مندرجہ ذیل سطر کو اس طرح ٹیگز سے بدل دیں گے.
Code: Select all
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />
<meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’);?>” />
اوپر کی دونوں سطروں میں کوئی فرق نہیں ہے، نیچے والی سطر میں ہمارے پاس یہ اختیار حاصل ہو گیا ہے کہ ورڈپریس کنٹرول پینل سے
ہم جو بھی اینکوڈنگ صحفہ میں شامل کریں گے وہ خود یہاں سیٹ ہو جائے گی ۔
اس سطر کے بعد ہمیں ٹائٹل نام کا سلیکٹر نظر آ رہا ہے ،ہم یا تو خود یہاں صحفہ کا عنوان لکھ سکتے ہیں، یا پھر یہاں بھی ورڈپریس ٹیگز کا اضافہ کر کے ورڈپریس سے یہ کام لیں گے ۔ تو آپ ٹائٹل کو مندرجہ ذیل طریقہ سے بدل دیں ۔
Code: Select all
<title>creating wordpress theme</title>
<title><?php bloginfo(‘name’); ?>|<?php wp_title(); ?></title>
ایسا کرنے کے بعد ہم بلاگ کے ڈیش بورڈ میں جو بھی نام رکھیں گے، وہ خود یہاں ظاہر ہو جائے گا ۔
اس سطر کے بعد ہمیں سٹائل شیٹ کی سطر نظر آ رہی ہے جسے ہم ذیل کی طرح بدل دیں گے ۔
Code: Select all
<link rel=”stylesheet” href=”style.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” />
یہ اوپر والی سطر اسی صورت میں کام کرے گی جب آپ کی سٹائل شیٹ کا نام سٹائل ڈاٹ سی ایس ایس ہو گا، لیکن ایسا بھی ہو سکتا ہے کہ جس سانچہ کو آپ ڈھال رہے ہیں اُس میں سٹائل شیٹ کا نام کچھ اور ہو، یا سانچہ میں ایک سے زیادہ سٹائل شیٹ کا استعمال ہو رہا ہو، ایسی صورت میں سٹائل شیٹ کو ورڈپریس میں بلانے کے لئے مندرجہ ذیل طریقہ استعمال کیا جائے گا ۔
Code: Select all
<link rel=”stylesheet” href=”<?php bloginfo(‘template_directory’); ?>/style_name.css” type=”text/css” />
اب ہم اس کے نیچے آتے ہیں تو باڈی سلیکٹر کے بعد ہیڈر سلیکٹر اور وہاں لوگو سلیکٹر کی کلاس ہے، اس ہم یوں بھی رہنے دیں تو مضائقہ نہیں ہے، لیکن ہم چاہتے ہیں کہ جب ہم ڈیش بورڈ میں بلاگ کا نام بدلیں تو یہاں بھی بدلا جائے، ایسا کرنے کے
لئے ہم یہاں بھی ورڈ پریس ٹیگز کا استعمال کریں گے ۔
Code: Select all
<div class=”logo”>This is logo of the site</div>
<div class=”logo”><a href=”<?php get_option(‘home’); ?>/”><?php bloginfo(‘name’); ?></a></div>
اس سلیکٹر کے نیچے منیوبار نام کا سلیکٹر ہے، یہاں آپ اپنے بلاگ کا مرکزی صحفہ سے دوسرے صحفات تک جانے کے روابط ڈال سکتے ہیں ۔اگر آپ منیو کا استعمال نہیں کرنا چاہتے تو اسے مٹا سکتے ہیں ۔ یہاں کسی ٹیگ کے اضافہ کی ضرورت نہیں ہے ۔
اس کے نیچے ہمیں سرچ نام کا سلیکٹر نظر آ رہا ہے ہم یہاں ذیل کا پورا کوڈ کاپی کر کے سرچ فارم والی فائل میں کاپی کر یں گے.
Code: Select all
<div class=”search”>
<form method=”get” action=”index.html”>
<input type=”text” class=”s” name=”s”/>
<input type=”submit” class=”button” value=”Go”/>
<form>
</div>
اس فائل کو ہم بعد میں دیکھیں گے، اور جہاں یہ کوڈ موجود تھا وہاں ورڈپریس کے مندرجہ ذیل ٹیگ کا استعمال کریں گے ۔
Code: Select all
<?php include (TEMPLATEPATH . ‘/searchform.php’); ?>
یہ ٹیگ یہ ظاہر کر رہا ہے کہ یہاں پر سرچ فارم والا سانچہ آنا ہے، اور میں نے اوپر کہا تھا کہ جب کسی فائل کا نام ورڈپریس کے مقرر کردہ معیار کے مطابق نہ ہو تو اسے بلانے کا طریقہ علیحدہ ہے ۔ اوپر والا ٹیگ ایسی تمام فائلوں کو بلانے کے کام آتا ہے ۔ جیسے آپ نے اگر ایک فائل لاہور نام کی بنائی ہو تو اُس کو یوں بلایا جائے گا ۔
Code: Select all
<?php include (TEMPLATEPATH . ‘/lahore.php’); ?>
اس کے بعد ہم باڈی سلیکٹر سے اوپر جہاں ہیڈ سلیکٹر ختم ہو رہا ہے، اُس کے ختم ہونے سے پہلے مندرجہ ذیل ٹیگز کا اضافہ کرنا ہے ۔
Code: Select all
<link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />
<?php wp_get_archives(‘type=monthly&format=link’); ?>
<?php wp_head(); ?>
<script language=”javascript” type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/UrduEditor.js”></script>
<script language=”JavaScript” type=”text/javascript”>
initUrduEditor();
</script>
پہلی سطر بتاتی ہے کہ بلاگ کا فیڈ کہاں ہے، دوسری سطر تحریروں کے مستقل روابط بتاتی ہے، تیسری سطر بلاگ کی مخفوظات کی تحریریں دکھاتی ہے، ان کو ہم نے ہیڈر میں اس لئے رکھا ہے کہ جب سرچ انجن کا کرالر آئے تو اسے پتہ ہو کہ کہاں کہاں منہ مارنا ہے، اور آپ کی تحریروں کو اپنے انڈیکس میں شامل کر لے ۔اُس کے بعد ہمارا اپنا اردو ایڈیٹر کا سکرپٹ ہے ۔ اس ہم بعد میں دیکھیں گے ۔ یہ لیجیے ہمارا ہیڈر مکمل ہے ۔
یہ سب تبدیلیوں کے بعد ہیڈر فائل کی مندرجہ ذیل شکل ہمارے پاس موجود ہونا چاہیے ۔
Code: Select all
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />
<title><?php bloginfo(‘name’); ?>|<?php wp_title(); ?></title>
<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” />
<link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />
<?php wp_get_archives(‘type=monthly&format=link’); ?>
<?php wp_head(); ?>
<script language=”javascript” type=”text/javascript”
src=”<?php bloginfo(‘template_directory’); ?>/js/UrduEditor.js”></script>
<script language=”JavaScript” type=”text/javascript”>
initUrduEditor();
</script>
</head>
<body>
<div id=”header”>
<div class=”logo”><a href=”<?php get_option(‘home’); ?>/”><?php bloginfo(‘name’); ?></a></div>
<div class=”navbar”>
<ul>
<li>FirstPage</li>
<li>2nd Page</li>
<li>3rd Page</li>
</ul>
<?php include (TEMPLATEPATH . ‘/searchform.php’); ?>
</div>
<div id=”page”>
بشکریہ: جہاں زیب اشرف
ماخذ: اردو جہاں بلاگ