ওয়ার্ডপ্রেস টেম্পেলেট তৈরি ২য় পর্ব

কেমন আছেন আপনারা। আবারও আসলাম ওয়ার্ডপ্রেস টেম্পেলেট তৈরির ২য় পর্ব নিয়ে। মুলত এটি একটি সিরিজ টিউটোরিয়াল। আমি মনে করি আমার এই টেম্পেলেট তৈরির সিরিজটি ফলো করলে আপনিও পারবেন আপনার নিজের ওয়ার্ডপ্রেস ও এইচটিএমএল টেম্পেলেট তৈরি করতে। আমি আবার ও বলছি টেম্পেলেট তৈরি করতে হলে আপনা কে অবশ্যই HTML এবং CSS সম্পর্কে কিছু ধারনা থাকতে হবে।

টেম্পেলেট এর লেআউট তৈরি

আপনার index.html ফাইলটি Dreamweaver অথবা  Note pad দিয়ে খুলুন। যেটি আমরা ওয়ার্ডপ্রেস টেম্পেলেট তৈরি ১ম পর্বে তৈরি করেছি। এবং নিচের কোড টুকু লিখুন অথবা পেস্ট করুন।
</pre>
<html>

<head>

<title>Here title</title>

<link rel="stylesheet" type="text/css" href="style.css"/>

</head>

<body>

<div id="wraper">

<div id="header">

<div id="logo">

<h1>Here Web site's logo code</h1>

<h3>Here web site's tag line code</h3>

</div>

</div>

<div id="menu">

<ul>

<li><a href="#">Home</a></li>

<li><a href="#">Home</a></li>

<li><a href="#">Home</a></li>

<li><a href="#">Home</a></li>

<li><a href="#">Home</a></li>

<li><a href="#">Home</a></li>

</ul>

</div>

<div id="container">

<div id="sidebar">

<div id="left-sidebar">Here left sidebar code</div>

</div>

<div id="content">

<div class="post">

<div class="entry"></div>

</div>

</div>

<div id="sidebar">

<div id="right-sidebar">Here right sidebar code</div>

</div>

<br class="clear" />

</div>

<div class="footer-widgets">Here will footer widgets</div>

<div class="footer">here will copy right text </div>

</div>

</body>

</html>
<pre>
এখন পেজটি সেভ করে যে কোন ওয়েব ব্রাউজার দিয়ে ওপেন করুন তাহলে আমাদের তৈরি করা সাইট লেআউট টি দেখতে পারবেন। এটা খুব খারাপ দেখতে তাই না? না চিন্তার কোন কারণ নেই। আমরা যখন আমাদের style.css ফাইলটি যোগ করব  তখন ভালো দেখাবে। দুঃখিত! আমরা যোগ করেছি কিন্তু কোন কোড লিখিনি। নিচের কোড টুকু দেখুন। এই কোড এর মাধ্যমে এইচটিএমএল ফাইল এর সাথে সিএসএস ফাইল অ্যাড করা হই। এই কোড টুকু আমরা আমাদের index.html ফাইল এর <head>----</head> ট্যাগ আর মধ্যে অ্যাড করেছি।
<link rel="stylesheet" type="text/css" href="style.css"/>
এটাই হোল স্ট্যাটিক সাইটে স্টাইল সিট যোগ করার পদ্ধতি। আমরা যখন এই টেম্পেলেট ওয়ার্ডপ্রেস টেম্পেলেটে কনভার্ট করব তখন এখানে কিছু php code অ্যাড করব।

Comments