বাংলায় ওয়াপকিজ টিউটোরিয়াল [পার্ট- 3:ট্যাগ কোড(ব্লগ ফরম)]


ওয়াপকিজ টিউটোরিয়াল সিরিজের তৃতীয় পোস্টে স্বাগতম। ওয়াপকিজ টিউটোরিয়াল সিরিজের এই পোস্টে আমরা ব্লগ ফরম নিয়ে আলোচনা করবো। আমরা প্রথমে ব্লগ ফরম নিয়ে আলোচনা করবো কারণ আপনারা যাতে প্রথমে একটি ব্লগ ফরম তৈরি করে ব্লগ পোস্ট তৈরি করতে পারেন। তাহলে পরে ব্লগ লিস্ট তৈরি করার সময় কোড কাজ করছে কি না সেটা বোঝা যায়। তো চলুন শুরু করা যাক।


ব্লগ ফরম

ব্লগ ফরমের মূল ওয়াপকিজ ট্যাগ হলো [blog_form]সেট||কনটেন্ট[/blog_form]

এখানে 'সেট' এর জায়গায় প্রয়োজন অনুযায়ী সেট প্যারামিটার বসাতে হবে এবং 'কনটেন্ট' এর জায়গায় প্রয়োজন অনুযায়ী কন্টেন্ট প্যারামিটার বসাতে হবে।


সেট প্যারামিটার গুলো:

u=/site-0.html

এখানে পোস্ট পোস্ট পাবলিশ হলে আপনাকে /site-0.html এ নিয়ে যাওয়া হবে। এখানে আপনি /site-0.html এর জায়গায় অন্য কোনো পেজের লিঙ্ক দিতে পারেন।

কন্টেন্ট প্যারামিটার গুলো:

%notify%

এই কোড কন্টেন্ট প্যারামিটার এ বসালে ব্লগ ফরম সঠিক ভাবে পূরণ করা না হলে আপনাকে নোটিফাই করা হবে।


%title%

এই কোড বসালে পোস্টের টাইটেল ইনপুট করার জন্য আপনাকে একটি ইনপুট বক্স দেখানো হবে। এটা ডিজাইন করার জন্য আপনাকে input[type=text] ট্যাগ ডিজাইন করতে হবে CSS দিয়ে।


%text%

এই কোড বসাকে আপনাকে পোস্টের মেইন কন্টেন্ট ইনপুট করার জন্য একটি ইনপুট বক্স দেখানো হবে। এটা ডিজাইন করার জন্য আপনাকে textarea ট্যাগ ডিজাইন করতে হবে CSS দিয়ে।


%category%

এই কোড বসালে পোস্টের ক্যাটাগরি ইনপুট করার জন্য আপনাকে একটি ইনপুট বক্স দেখানো হবে। এটা ডিজাইন করার জন্য আপনাকে input[type=text] ট্যাগ ডিজাইন করতে হবে CSS দিয়ে।


%submit%

ব্লগ ফরমের পোস্ট সাবমিট বাটন দেখানোর জন্য এই প্যারামিটার বসাতে হয়। এটা ডিজাইন করার জন্য আপনাকে input[type=submit] ট্যাগ ডিজাইন করতে হবে CSS দিয়ে।


সবশেষে আমরা ব্লগ ফরমের জন্য নিচের মত একটি কোড তৈরি করতে পারি।

[blog_form]u=site-0.html||
%notify% 
Title:<br/>
%title%<br/>
Content:<br/>
%text%<br/>
Category:<br/>
%category%<br/>
%submit%
[/blog_form]

আপনারা প্রয়োজনে এই কোডে প্রয়োজন অনুযায়ী HTML এবং CSS ব্যবহার করে ইচ্ছা মতো ডিজাইন করতে পারেন।


নিচে আমি একটি অসাধারণ ডিজাইনের ব্লগ ফরম এর কোড শেয়ার করলাম। যাদের প্রয়োজন তারা এটা ব্যাবহার করতে পারেন।   

<div class="blog_form">
[blog_form]u=site-0.html||
%notify% 
Title:<br/>
%title%<br/>
Content:<br/>
%text%<br/>
Category:<br/>
%category%<br/>
%submit%
[/blog_form]
</div>
<style>
.blog_form {
	padding:5px;
	margin:;
	background:#fff;
	color:#555;
}
.blog_form input[type=text] {
	padding:5px;
	width:100%;
	display:block;
	margin:0;
	text-align:left;
	background:#eee;
	color:#111;
	border-radius:4px;
	border:1px solid #aaa;
}
.blog_form input[type=submit] {
	padding:5px;
	width:100%;
	width:100%;
	display:block;
	margin:0;
	text-align:center;
	background:green;
	color:#fff;
	border-radius:4px;
	border:1px solid #aaa;
}
.blog_form textarea {
	padding:5px;
	width:100%;
	height:100px;
	display:block;
	margin:0;
	text-align:left;
	background:#eee;
	color:#111;
	border-radius:4px;
	border:1px solid #aaa;
}
</style>


তো বন্ধুরা এই ছিলো আজকের পোস্ট। এর পরবর্তী পোস্টে আসছি sfAppStore এর সকল কোড নিয়ে। ততক্ষণ আমাদের সাথেই থাকুন, ধন্যবাদ

    

Post a Comment

2 Comments

  1. ভাই,ওয়াপকিয সিরিজ তো সারা জীবনেও শেষ করতে পারবেন না।

    ReplyDelete
  2. vai apner youtube chanel ase

    ReplyDelete