আসুন নিজেই তৈরী করি ওয়ার্ডপ্রেস থিম। পর্ব-৩

আমি ইতোপূর্বে ওয়ার্ডপ্রেস কাস্টম থিম তৈরী করার জন্য 2 টি পোষ্ট করেছি এটি 3য় পোষ্ট। যারা এই টিউটোরিয়াল থেকে ওয়ার্ডপ্রেস থিম তৈরী করা শিখতে চান তাদের বলছি, আপনারা অনুগ্রহ করে আমার পূর্বের পোষ্ট দুটি দেখে নিন:
আসুন নিজেই তৈরী করি ওয়ার্ডপ্রেস থিম। পর্ব-১
আসুন নিজেই তৈরী করি ওয়ার্ডপ্রেস থিম। পর্ব-২

এখন আসুন আমরা তৃতীয় পর্বের মূল আলোচনায় চলে যাই। এই পর্বে আমরা index.html ফাইলে কোড বসাবো এবং সেই কোড নিয়ে আলোচনা করব। নিচের কোড টি প্রথমে কপি করুন এবার আপনার সেই tutorialbd ফোল্ডারে থাকা index.html ফাইলে চলে যান এবং নোটপ্যাড দ্বারা ওপেন করে কোড গুলো পেষ্ট করুন এবং সেভ করে বেরিয়ে আসুন।

<html>

<head>

<title>This place for title</title>

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

</head>

<body>

<div id=”wraper”>

<div id=”header”>

<div id=”logo”>

<h1>This place for sites Logo</h1>

<h3>This place for site’s tag line</h3>

</div>

</div>

<div id=”menu”>

<ul>

<li><a href=”#”>Menu</a></li>

<li><a href=”#”>Menu</a></li>

<li><a href=”#”>Menu</a></li>

<li><a href=”#”>Menu</a></li>

<li><a href=”#”>Menu</a></li>

<li><a href=”#”>Menu</a></li>

</ul>

</div>

<div id=”container”>

<div id=”sidebar”>

<div id=”left-sidebar”>This place for left sidebar</div>

</div>

<div id=”content”>

<div>

<div></div>

</div>

</div>

<div id=”sidebar”>

<div id=”right-sidebar”>This place for right sidebar</div>

</div>

<br />

</div>

<div>footer widgets area</div>

<div>copy right text area</div>

</div>

</body>

</html>

এই কোড গুলো আপনার মূল থিমের একটা পরিপূর্ণ লে-আউট নির্দেশ করে।

*উপরের কোড গুলোর মধ্যে আপনি এই রকম একটি কোড দেখতে পাচ্ছেন:

<title>This place for title</title>

এই কোডটি আপনার পেজের টাইটেল সেট করার জন্য ব্যবহার করা হয়েছে।

* উপরের কোড গুলোর মধ্যে আপনি এই রকম একটি কোড দেখতে পাচ্ছেন:

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

এই কোডটি দ্বারা আপনার পেজে স্টাইল সেট করা হয়েছে অর্থাত index.html পেজে style.css কে কল করার মাধ্যমে পেজ কে স্টাইল করার কাজে ব্যবহার করা হয়েছে।

* উপরের কোড গুলোর মধ্যে আপনি এই রকম একটি কোড দেখতে পাচ্ছেন:

<div id=”left-sidebar”>This place for left sidebar</div>

এই কোডটি দ্বারা আপনার style.css এর মধ্যে অবস্থানরত একটি নির্দিষ্ট স্টাইল কে left-sidebar এ এপ্লাই করা হয়েছে।
এই রকম ভাবে মিলিয়ে দেখলে আশাকরি প্রত্যেকটি কোড কেন ব্যবহার করা হয়েছে তা বুঝতে পারবেন। তার পরও যদি সমস্যা হয় তাহলে সম্পূর্ণ সোর্স কোড টি এখান থেকে জিপ ফাইল ডাউনলোড করে এক্সট্রাক্ট করে নিতে পারেন। পরবর্তী পর্বে আমরা style.css এ কোড বসিয়ে আমাদের index.html ফাইলটি ওপেন করে আমাদের এই প্রোজেক্টের লে-আউট টি একবার দেখে নিব। ততক্ষণ সবাই সুস্থ ও সুন্দর থাকুন। আল্লাহ হাফেজ।

8 thoughts on “আসুন নিজেই তৈরী করি ওয়ার্ডপ্রেস থিম। পর্ব-৩”

  1. ভাইয়া কোডিং না জেনেই কি ওয়ার্ডপ্রেস থিম বানানো যাবে নাকি ?
    আপনার কোড দেখে দেখে ত বানালে আপনার দেওয়া থিমটাই বানালাম। আপনার বানানো কিছু থিম এর লিঙ্ক দিবেন প্লিস ভাইয়া।

  2. ভাই ……..
    ৪, ৫, ৬, …. নং পোষ্ট এর কাজ কি কমপ্লিট হয়েছে ? একটু তারাতারি করুন আমি অপেক্ষায় আছি ।

Leave a Comment