ব্লগে রিলেটেড পোস্ট অতি সহজভাবে যুক্ত করুন এবং জেনে নিন SEO হিসেবে এর গুরুত্ব কতখানি

রিলেটেড পোস্ট কি ?

রিলেটেড পোস্ট গ্যাজেট হল কোন একটি পোস্টের শেষে একই সমগোত্রীয় অন্য পোস্ট সম্পর্কিত আরও পোস্ট এর লিংক দেখানো, যাতে ভিজিটর এ বিষয়ে আরও জানতে পারে রিলেটেড পোস্ট এর এর মাধ্যমে। রিলেটেড পোস্ট গ্যাজেট একটি ওয়েবসাইটের ভিজিটরকে প্রায় ২০% এর বেশি সময় ধরে রাখতে সক্ষম,কখনও কখনও তারও বেশী হয়ে থাকে।এছাড়াও রিলেটেড পোস্ট গ্যাজেট একটি ওয়েবসাইটের লুক বাড়াতে সক্ষম।

এটিও পড়ুন -ব্লগারের সাফল্য লাভের ১০টি মূলমন্ত্র

ধরুন, একজন ভিজিটর সার্চ এঞ্জিনে মাধ্যমে আপনার সাইটে প্রবেশ করেছে সে তার কাঙ্খিত বিষয় পরার পর অন্য কোন বিষয় চোখে পড়ল না, তৎক্ষণাৎ সে আপনার ব্লগ ত্যাগ করতে পারে। এজন্যই ব্লগে রিলেটেড পোস্ট রাখা বাঞ্ছনীয় । এছাড়াও রিলেটেড পোস্ট ব্লগের bounce rate কমায়। মোটকথা রিলেটেড পোস্ট অন্যদিকে SEO এর গুরুত্বপূর্ণ ভুমিকা রাখে। আপনারা যারা  Blogspot ব্লোগিং করেন তাদের ডিফল্ট টেমপ্লেটে রিলেটেড পোস্ট গ্যাজেট থাকে না , এজন্য আপনাকে যুক্ত করে নিতে হয় ।

এটিও পড়ুন - ছাত্র-ছাত্রীদের অনলাইনে টাকা আয় করার সেরা ৬ টি উপায়

অনেকে হয়তো linkwithin এর রিলেটেড পোস্ট গ্যাজেট ব্যবহার করেন, এটি ব্যবহারে খুব সুবিধা জনক হলেও thumbnails ব্যতীত অন্য widget ব্যবহার সুবিধা দেয় না। এজন্য outbrain এর রিলেটেড পোস্ট widget ব্যবহার করে দেখতে পারেন , নিচে এর সবুধা গুলি আলচনা করা হলো । আশা করি ভাল লাগবে।

Outbrain এর মাধ্যমে রিলেটেড পোস্ট গ্যাজেট যুক্ত করার সুবিধা হল:

• HTML না জানলেও হবে।
• এটি সাধারন গ্যাজেটগুলির মতই তাই যুক্ত করতে কোন অসুবিধা নেই।
• প্রয়োজনে এটি যুক্ত করা যায় প্রয়োজন না থাকলে সাথেসাথেই রিমুভ করা যায়।
• এটাতে থাম্বনেইল (thumbnails) ও টেক্সট (textual) ব্যবহারের সুযোগ আছে।
• আপনি কয়টি রিলেটেড পোস্ট দেখাবেন তা আপনি কাস্টমাইজ করতে পারবেন।
• রিলেটেড পোস্ট গ্যাজেটের লিংকগুলিতে আপনি আপনার ইচ্ছেমত শব্দ কম কিংবা বেশী দিতে পারবেন।
• থাম্বনেইল সাইজ,স্টাইল ইত্যাদি সব ধরনের পরিবর্তন আপনি করতে পারেন।
•  এছাড়াও প্রবর্তিতে আপনি outbrain সাইতে গিয়ে Click ও CTR চেক এবং প্রয়োজনে modify করতে পারবেন।

রিলেটেড পোস্ট গ্যাজেটটি যুক্ত করার নিয়ম:

• প্রথমে https://my.outbrain.com/getwidget প্রবেশ করুন। অথবা এখানে ক্লিক করুন ।
• এরপর (1) Text অথবা  (2) thumbnails যে কোন একটিতে আপার পছন্দ মতো ক্লিক করুন। নিচের ছবিটি লক্ষ্য করুন।

 

 

• এরপর Blogspot ব্লগে ক্লিক করুন। নিচের ছবিটি লক্ষ্য করুন।

• এরপর সঠিক তথ্য দিয়ে ফর্মটি পূর্ণ করুন । নিচের ছবিটি লক্ষ্য করুন।

• instal অপশনে ক্লিক করার পর নিচের ছবিটির মতো দেখতে পাবেন।

•  সবশেষে  Add Widget অপশনে ক্লিক করুন।

->> আপনি Linkwithin থেকে রিলেটেড পোস্ট গ্যাজেটটি যুক্ত করতে চাইলে এখানে ক্লিক করুন ।

তবে এখন এ অবধি । কোন সমস্যা হলে অবশ্যই কমেন্ট করবেন। ভালো থাকুন সুস্থ থাকুন ধন্যবাদ।

ব্লগস্পট ব্লগে ফ্রী টপ লেবেল ডোমেইন .co.vu যুক্ত করার সহজ সরলতম পদ্ধতি

বন্ধুরা,  আজ আমি আপনাদের জন্য নিয়ে এসেছি ব্লগের জন্য একটি সুন্দর টিপস। আপনাদের যাদের নিজস্ব ব্লগ আছে তাদের জন্য বিশেষ করে এই টিপস কাজে আসবে। টিপসটি হল কীভাবে আপনার ব্লগে আপনি একটি .co.vu ডমেইন যুক্ত করবেন তাও আবার ফ্রী। কেননা টপ লেভেল ডোমেন যেমন - .COM,.CO ইত্যাদি কিনতে গেলে আমাদের অনেক টাকা গুনতে হয়। এছাড়াও আপনার ব্লগের SEO এর ক্ষত্রে .co.vu খুব কাজে আসে। আপনার ব্লগের জন্য Advance Meta Tools ব্যবহার করে আপনার সাইট ভিজিটর বাড়িয়ে নিতে পারেন। তাহলে আসুন জেনে নেই কীভাব ব্লগে .co.vu ডোমেন যুক্ত করবেন।

এটিও পড়ুন -সহজে ব্লগ পোস্ট টাইটেল কে তুলে ধরুন সার্চ ইঞ্জিনে

পদ্ধতি ১।

• প্রথমে এখানে ক্লিক করুন। তারপর নীচের মত একটি রেজিস্টার Page দেখতে পাবেন।

পদ্ধতি ২। 

• এরপর Sign in  এ ক্লিক করুন।

পদ্ধতি ৩। 

• Sign In এ ক্লিক করার পরে তার নীচে আপনি Create a new Account  দেখতে পাবেন। সেখানে ক্লিক করুন। এরপর আপনার ইমেইল,পাসওয়ার্ড ও নাম দিয়ে রেজিস্টার করুন অথবা ফেসবুকের মাধ্যমেও কানেক্ট করে চালাতে পারবেন।

পদ্ধতি ৪।  

• রেজিস্টার করার পরে আপনি সেখানে আপনার  ডোমেইন টি লিখুন।যদি ডমেইন টি আগে ব্যাবহার না হয়ে থাকে, তাহলে আপনি সেই ডোমেইন রেজিস্টার করতে পারবেন। Domain আগে ব্যাবহার না । তাহলে অন্য নাম দিয়ে চেষ্টা করুন। যেমন আমি এখানে ioffer টাইপ করেছি। তাহলে আমার সাইটি হবে www.ioffer.co.vu 

পদ্ধতি ৫। 

• এবার Register Domain  এ ক্লিক করুন।

পদ্ধতি ৬।  

• এরপর আপনাকে ব্লগে সেটাপ করতে হবে। 

ব্লগে সেটাপ যে ভাবে করবেন ?

পদ্ধতি ৭। 

• এরপর Register Domain  এ ক্লিক করার পরে নীচের মত আসবে।

পদ্ধতি ৮। 

• এবার বাম পাশে Blogger এ ক্লিক করুন। তারপরে Configure To Blogger  এ ক্লিক করুন।

পদ্ধতি ৯। 

•  এবার Blogger এ যান।

পদ্ধতি ১০। 

• Blogger এ গিয়ে Settings এ যান।তারপরে Setup a 3rd Party URL এ ক্লিক করুন।

পদ্ধতি ১১।

•  এবার www সহ আপনার ডোমেইন টি লিখুন যেটা আপনি রেজিস্টার করেছেন।

পদ্ধতি ১২।

• এরপর Save এ ক্লিক করুন। সেভ এ ক্লিক করলে নীচের মত আসবে।

পদ্ধতি ১৩।

•  উপরে ইন্ডিকেট করা কোড গুলো কপি করে রাখুন।

পদ্ধতি ১৪।

• এরপর আবার .co.vu এর ওয়েবসাইট টি তে যান।

পদ্ধতি ১৫।

• এরপর My Domains এ ক্লিক করুন এবং Configure অপশনে ক্লিক করুন।
•  এরপর Blogger অপশনে ক্লিক করুন এবং ৭ নাম্বার অপশনে যান। নীচের মত দেখতে পাবেন।

পদ্ধতি ১৬।

• এবার যে কোড গুলো কপি করে রেখেছিলেন সে কোড গুলো নীচে বসান। কোড গুলোর ডান পাশের নীচের টা Name এ বসান আর কোড গুলোর ডান পাশের নীচের টা Point To তে বসান এবং Create verification CNAME এ ক্লিক করুন।
• এবার আপনার ব্লগে পুনরায় যান ও ডমেইন টাকে Save করুন। তারপরে আবার ঐ ডোমেইনটার Edit বাটনে ক্লিক করুন তার পরে Redirect serverbd.co.vu to http://www.ioffer.co.vu.  এই লেখটার পাশে টিক দিন এবং সবশেষে Save করুন।

পদ্ধতি ১৭।

• এবার co.vu এর ওয়েবসাইট টি তে গিয়ে সবার নীচে Test Domain এ ক্লিক করুন।যদি ডোমেইন ঠিক ভাবে লাগানো হয়ে থাকে তাহলে নীচের মত একটা পেইজ দেখাবে।

 

কোন সমস্যা হলে কমেন্ট করুন। ভালো থাকুন ধন্যবাদ।

ব্লগে অটো Scrolling পপ আপ ফেসবুক লাইক বক্স যুক্ত করুন - একদম ভিন্ন সাধের !!

ব্লগে ফেসবুক লাইক বক্স থাকলে যেমন ফেসবুক পেজের ফ্যান বারে তেমনি ওপর দিকে সাইটের বা ব্লগের ট্রাফিক ও বাড়ে । তাই আমি মনে করি ব্লগ বা সাইটে ফেসবুক লাইক বক্স থাকা জরুরী। কম্পিউটার জগৎ সাইটেও অটো Scrolling পপ-আপ ফেসবুক লাইক বক্স যুক্ত করা আছে। আজকে এই পোষ্টে একটি ভিন্ন সাধের ফেসবুক পপ-আপ লাইক বক্স শেয়ার করছি। এর আগের পোষ্টে কিভাবে ব্লগের প্রতিটি পোস্টের নীচে সহজে Subscribe বক্স যুক্ত করবো  আলোচনা করা হয়েছিল। সাইট ট্রাফিক বাড়াতে গেলেও ব্লগে Subscribe বক্স যুক্ত করা প্রয়োজন। কেননা এতে ব্লগার ও পাঠকের উভয়েরই লাভ। কথা না বাড়িয়ে আসুন নিজে নিজে আপনি আপনার ব্লগে যুক্ত করে নিন, অটো Scrolling পপ আপ ফেসবুক লাইক বক্স ।

 এটিও পড়ুন - ছাত্র-ছাত্রীদের অনলাইনে টাকা আয় করার সেরা ৬ টি উপায়

কিভাবে ব্লগে অটো Scrolling পপ আপ লাইক বক্স যুক্ত করবেন ?

<style type='text/css'>
#blogtariffFBpop {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#FEFEFE;font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#blogtariffFBpop a.bsclose {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#000000;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:25px;
cursor:pointer;
}
</style>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top
$('#blogtariffFBpop').animate({top:"50px"}, 1000);
// Widget by www.blogtariff.com
$('a.bsclose').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='blogtariffFBpop'>
<!-- Widget by www.computerjajot.com Start -->
<center><b><a class="Blogtariff">Don't Forget To Join With Our Community</a></b></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fgeteverythingcomputers&amp;width=292&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=true&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowTransparency="true"></iframe></center>
<!-- Widget by www.computerjajot.com End -->
<a class='bsclose' href='#'>&times;</a>
<center style="float:right; margin-right:10px;"><span style="font-size:xx-small; color:#000; text-decoration:none;">+Get this at</span> <a target='_blank' style="font-size:xx-small; color:#3B78CD; text-decoration:none;" href="http://www.computerjajot.com/2015/03/add-tech-scrolling-facbook-popup-like.html">PCTipsTweets </a></center>
</div>

নোট -

• আপনি পপ আপ ফেসবুক লাইক বক্সে কালার (রং) পরিবর্তন করতে চাইলে, FEFEFE লেখাটি মুছে দিয়ে অন্য কলার কোড ব্যবহার করতে পারেন। 
• geteverythingcomputers মুছে দিয়ে আপনার ফেসবুক পেজের নাম টাইপ করুন ।

কোন সমস্যা হলে কমেন্ট করুন। ধন্যবাদ

ব্লগে ৯০% আয় বাড়ান আকর্ষণীয়ভাবে ঝুলন্ত বিজ্ঞাপন ব্যবহার করে

ব্লগ লেখালেখি করে অনেকেই নিজেকে ফোকাস করতে পেরেছেন। আর যারাই আজ বরণীয় তাদের সাফল্য লাভের পিছনে রয়েছে নিরলস পরিশ্রম ও অঘাত চেষ্টা। আমরা ছটবেলায় শখের বসে খাতায় দু-একটি ছড়া- ছন্দ লেখি কিংবা গল্প , কবিতা খাতার  লিখে এক কোনে লুকিয়ে রাখি, বলতে গেলে আমাদের তখন থেকেই ব্লগ শুরু। বর্তমানে অনলাইনে কোন এক জায়গায় নিজের লেখাগুলি প্রকাশ কে  একথায় ব্লগ বলি।  শখ থেকেই শুরু হল ব্লগে লেখা আর ব্লগে লেখা লেখির পাশা পাশি আমাদের যদি টাকা ইনকাম হয়, তোবে তো সেটা মন্দ নয়।

এটিও পড়ুন -ছাত্র-ছাত্রীদের অনলাইনে টাকা আয় করার সেরা ৬ টি উপায়

ব্লগে আমারা অনেক ভাবে ইনকাম করতে পারি। তো আজ আমি আপনাদের সাথে আমি একটি অসাধারন টিপস শেয়ার করবো, যাদের ব্লগ আছে কিংবা ব্লগ শুরু করতে চাইছেন তাদের কাজে লাগবে। আমারা তো অনেকেই ব্লগে অ্যাড ব্যবহার করি কিন্তু অ্যাডে ক্লিক পরে না। আর অ্যাডে ক্লিক না পড়ার দরুন আমাদের ইনকাম বেশি হয় না। তাই অনেকে হতাশ হয়ে ব্লগ লেখা বন্ধ করে দেন।

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

এটিও পড়ুন -আজীবন আয় করুন সোশ্যাল নেটওয়ার্ক সাইট থেকে

এটি আপনার ব্লগের ডানে বা বামে দিকে বিজ্ঞাপন ঝুলন্ত অবস্থায় থাকবে। এবং পাঠকের মনে আকর্ষণ জগাবে ফলে বিজ্ঞাপনটি সহজেই চোখে লাগবে। যারা ব্লগস্পটে ব্লগিং করছেন তাদের জন্য আজকের এই টিপস। ডেমো দেখুন আমার এই কম্পিউটার জগতেই। ডান পাশে ঝুলে আছে একটি বিজ্ঞাপন। ঠিক এইরকম বিজ্ঞাপন আপনার ব্লগস্পট ব্লগেও লাগাতে পারেন। তাই এবার আসুন কিভাবে ব্লগে এরকম এড বসাবেন?

কিভাবে আকর্ষণীয়ভাবে বিজ্ঞাপন যুক্ত করবেন?

• প্রথমে Blogspot ব্লগে লগিন করুন
•  এরপর Layout অপশনে যান
• তারপর Html/JavaScript Gadget ক্লিক করুন এবং
• এবার Title অপশন ফাঁকা রেখে Content বক্সে নিচের কোডগুলো দিন।

কোড টি হল-

 <style>
#bloggermarufflotads {
height:30px;
width:auto;
background: #333333 url('..');
background-repeat:repeat-x;
text-align:left;
padding-top:4px;
}
#bsadsbase{
height:500;
margin:0auto;
width:160px;
background:#fff;
border-bottom:2px #333333 solid;
border-right:2px #333333 solid;
border-left:2px #333333 solid;
text-align:center;
padding:4px;
}
#bsadsheadline{
opacity:1.0;
height:auto;
width:auto;
position:fixed;
top:65px;
left:10px;
border-bottom:1px #005094 solid;
border-bottom:0px blue solid;
color:#333;
padding:0px;
z-index:1001;
font-size:13px;}
</style>
<script type="text/javascript">
function getValue()
{
document.getElementById("bsadsheadline").style.display = 'none';
}
</script>
<div id="bsadsheadline">
<div id="bloggermarufflotads">
<span style="color:#fff;font-size:13px;font-weight:bold;text-shadow:black 0.1em 0.1em 0.1em"></span>
<span style="color:#fff;font-size:13px;font-weight:bold;text-shadow:black 0.1em 0.1em 0.1em;float:right;padding-top:3px;padding-right:10px"><a href="http://www.computerjajot.com" target="_blank" onclick="getValue()">Close This Ad(X)</a></span>
</div>
<div id="bsadsbase">                                                                                                

[ Your Advertise Code Here ( অ্যাডসেন্স কোডটি এখানে লিখুন ) ]

</div></div>

নোট-

১। কোডে text-align:left; এর স্থানে আপনি ব্লগের ডান পাশে নাকি বাম পাশে দেখাতে চান সেটা বলে দিন। বাম পাশে হলে text-align:left; আর যদি চান ডান পাশে তবে text-align:right;

২)  height:500; কোডটিতে দৈর্ঘ্য বা উচ্চতা পরিবর্তন করতে চাইলে 500 এর স্থলে আপনার ইচ্ছেমত সাইজ বসিয়ে দিন। এবং প্রস্থ পরিবর্তন করতে চাইলেও একই কাজ। width:160px; কোডে 160 এর স্থলে  আপনার চাহিদামত সাইজ বসিয়ে দিন।
৩) Your Advertise Code Here লেখাটির বদলে আপনার এড কোড বসান। 

 ব্যাস, আর কাজ নেই। এবার উইডগেটটি  Save করেই সমাপ্ত করুন। সমস্যা হলে কমেন্ট করুন।  ধন্যবাদ

কিভাবে ব্লগে বা সাইটে Contact Form যুক্ত করবেন ? Source কোড সহ

আজ আমি ব্লগ বা সাইট ডেভেলপার জন্য দুর্দান্ত একটি Contact ফর্ম এর সোর্স কোড শেয়ার করছি। আপনার যারা ব্লগ বা সাইট বানান, আপনি যেই সিএমএস CMS ইউস করুন না কেন? আপনি চাইলে সহজেই আপনার সাইটে বা ব্লগে যোগাযোগের ফর্ম ( Contact Form ) যুক্ত করতে পারেন। জুমলা Joomla, ওয়ার্ডপ্রেস WordPress, ব্লগার Blogger ইত্যাদি দিয়ে তৈরী যেকোন সাইটে বা এইচটিএমএল HTML দিয়ে তৈরী সাইটেও এই Contact Form যুক্ত করতে পারবেন।

কিভাবে ব্লগে Contact ফর্ম যুক্ত করবেন ?

• প্রথমে Blogger এ লগইন করুন
• এর পর New Page এ ক্লিক করুন
• তারপর HTML মোড এ ক্লিক করুন
• এরপর নিম্ন প্রদত্ত কোডটি পেস্ট করুন

এটিও পড়ুন -Google এর ১৬টি অসাধারণ সেবা যা কিনা অনেকেই জানি না

কোডটি হল -

<FORM action="mailto:you@yourdomain.com" method="post" enctype="text/plain">
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="4" WIDTH="90%">
<TR>
<TD width="30%"><DIV align="right">
<B>Name:</B>
</DIV>
</TD>
<TD width="70%">
<INPUT type="text" name="name" size="20">
</TD>
</TR>
<TR>
<TD><DIV align="right"><B>Email:</B></DIV>
</TD>
<TD>
<INPUT type="text" name="email" size="20">
</TD>
</TR>
<TR>
<TD><DIV align="right">
<B>Comment:</B>
</DIV>
</TD>
<TD><TEXTAREA name="comment" cols="30" wrap="virtual" rows="4">
</TEXTAREA>
</TD></TR>
<TR>
<TD>&nbsp;</TD>
<TD>
<INPUT type="submit" name="submit" value="Submit">
<INPUT type="reset" name="reset" value="Reset">
</TD></TR>
</TABLE>
</FORM>

Website এর ক্ষেত্রে -

• প্রথমে আপনি Notepad কিংবা আপনার সাইট এডিটর ওপেন করুন
• এরপর নিম্ন প্রদত্ত কোডটি পেস্ট করুন।
• শেষে Contact.html লিখে শেভ করুন।

<html>
<body >

উক্ত কোডটি এখানে পেস্ট করুন

</body>
</html>

নোট-

এখন কোডের মধ্যে থাকা you@yourdomain.com এই ইমেইল এড্রেস টি পরিবর্তন করে আপনার ইমেল ID যোগ করুন।

আশা করি আপনার মূল্যবান মতামত দিয়ে আরো লেখার জন্য উৎসাহ প্রদান করবেন। ভালো থাকুন সুস্থ থাকুন। ধন্যবাদ।

কিভাবে টেবিল কন্টেন্ট অনুযায়ী ব্লগের পেজ বানাবেন ? Update কোড ব্লগারদের জন্য

আজ আমার দেখাবো কি ভাবে লেবেল কন্টেন্ট গুলিকে একই পেজে সম্মিলিত করা যায়। লেবেল কন্টেন্ট বলতে সাধারন কথায় বলতে পারি-অধ্যায় বা চ্যাপ্টার। সাইটের ক্ষেত্রে আমরা লেবেল অনুযায়ী পোষ্ট গুলিকে একই পেজে একত্রীকরন কে বলবো। যেমন কোন পুস্তকের অধ্যায় বা চ্যাপ্টার দেখে নির্বাচন করি কোন চ্যাপ্টারটা পড়ব। ঠিক সাইটের Table Contents বেলাতেও । যাক এবার হয়তো  আপনি ভাবছেন এত সুন্দর Table Contents পোষ্টি  কিভাবে আপনার ব্লগে যুক্ত করবেন ? কি ভাবে করবেন নিম্নে লক্ষ্য করুন-
এটিও পড়ুন -ব্লগস্পট ব্লগে পোষ্ট ভিউ কাউন্টার Plugin যোগ করুন সরল নিয়মে - নতুন !

ডেমো - ডেমো দেখতে চাইলে এখানে ক্লিক করুন

Table Contents পেজের জন্য যা যা করতে হবে-

•  প্রথমে Blogger এ লগ ইন করুন
• তারপর Design গিয়ে  Edit HTMLক্লিক করুন
• এরপর ]]></b:skin>লিখে সার্চ করুন
• এরপর নিম্ন প্রদত্ত কোডটি ]]></b:skin> উপরে পেস্ট করুন

কোডটি হল-

/*--------MBT TOC-----*/
.judul-label{
background-color:#E5ECF9;
font-weight:bold;
line-height:1.4em;
margin-bottom:5px;
overflow:hidden;
white-space:nowrap;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-decoration: none;
font: 14px/100% Arial, Helvetica, sans-serif;
padding: .5em 2em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 1px 1px 4px #AAAAAA;
box-shadow: 0 1px 2px rgba(0,0,0,.2);
color: #e9e9e9;
border: 2px solid white !important;
background: #6e6e6e;
background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
background: -moz-linear-gradient(top,  #888,  #575757);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.data-list{
line-height:1.5em;
margin-left:5px;
margin-right:5px;
padding-left:15px;
padding-right:5px;
white-space:nowrap;
text-align:left;
font-family:"Arial",sans-serif;
font-size:12px;
}
.list-ganjil{
background-color:#F6F6F6;
}
.headactive{
    color: #fef4e9;
    border: 2px solid white !important;
    background: #1C8DFF;
    background: -webkit-gradient(linear, left top, left bottom, from(#9dc2e7), to(#438cd2));
    background: -moz-linear-gradient(top,  #9dc2e7,  #438cd2);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dc2e7', endColorstr='#438cd2');
}

• এরপর টেম্পলেটিকে সেভ করুন। 
• এরপর New Page অপশনে ক্লিক করুন
• এরপর EDIT HTML মোডে ক্লিক করুন।
• এরপর Blank পেজে নিচের কোডটি পেস্ট করুন

UPDATED কোডটি হল নিম্নরূপ-

<script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js"></script>
<script src="http://www.computerjajot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
<script type="text/javascript">
var accToc=true;
</script>
<script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript"></script>

নোট- http://www.computerjajot.com এর জায়গায় আপনার সাইটের URL টাইপ করুন। 
সবশেষে পেজটিকে পাবলিশ করুন। সমস্যা হলে কমেন্ট করুন। ধন্যবাদ।

ব্লগস্পট ব্লগে পোষ্ট ভিউ কাউন্টার Plugin যোগ করুন সরল নিয়মে - নতুন !

বন্ধুরা, আজ আমি ব্লগার বন্ধুদের জন্য Postviews Plugin শেয়ার করছি। Postviews Plugin মাধ্যমে আপনারা আপনার ব্লগের ব্লগ পোষ্ট কত বার দেখা হয়েছে তা আমরা Postviews Plugin এর মাধ্যমে জানতে পারি। তাতে ব্লগের পাঠক জানতে পারবে পোষ্টি কত বার পড়া হয়েছে।তবে এবার শুরু করা যাক।

Postviews Plugin এর জন্য যা যা করতে হবে

            ১.প্রথম Firebase Account বানান                           এখুনি লগ ইন করার জন্য এখানে ক্লিক করুন
              এরপর ফর্ম ফিলাপ করে সাইন আপ করুন, এবং Create New App এ ক্লিক করুন
           ২.এরপর আপনার পছন্দ মতো নাম দিন   [যেমন -https://digizone.firebaseio.com/ ]                    https://digizone.firebaseio.com/ কপি করে নিন।

৩.যে ভাবে ব্লগ Postviews Plugin যুক্ত করবেন

• প্রথমে ব্লগে লগ ইন করুন।
• তারপর Blogger > Template
• Template টিকে Backup নিন
• এরপর Expand widget Templates অপশনে ক্লিক করুন
• এরপর ]]></b:skin> লিখে সার্চ করুন

•  এরপর নিচের কোডটি ]]></b:skin> এর উপরে পেস্ট করুন

/*-------- Post Views  ----------*/
#views-container {
width: 85px;
float: right;
}
.mbtloading {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhItKcxq-oNxAKjEJb4SGJz9M5_7CSLLUuV9zeWj-Z-cJHoTQAILJIG1RuTQ_TuVtDBucP7TmskhaCC5prd3eLkF8JQUuHNRwJgAeIxf5K6cnoaKC0FzZOosPAf8WA5xkCiWfZouUKOhsat/s320/mbtloading.gif') no-repeat left center;
width: 16px;
height: 16px;
}
.viewscount {
float: right;
color: #EE5D06;
font: bold italic 14px arial;
}
.views-text {
float: left;
font: bold 12px arial;
color: #333;
}
.views-icon{
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSK-mqqTEFfRDiUlzbPTLlVc7Rl_9Mwoi_rnKbe-L8_2Oc4N7sV3XL0FJ72EWxreMhrW-NvvJkDBqRgT4HKulspFi6oJ5goc31pmN2q2KaNkbiqVNaKOwkC_ag8fcQK2y7Wk82cZYH5yyP/s1600/postviews.png') no-repeat left;
border: 0px;
display: block;
width: 16px;
height: 16px;
float: left;
padding: 0px 2px;
}

নোট- চাইলে #EE5D06 এবং right কে left তে পরিবর্তন করে নিতে পারেন।

৪.এরপর </body>  লিখে সার্চ করুন এবং তার উপরে নিচের JavaScript কোডটি পেস্ট করুন

<!-- Post Views Script by MBT -->
<script type='text/javascript'>
    window.setTimeout(function() {
        document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;);
      }, 10);
  </script>
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($(&#39;a[name]&#39;), function(i, e) {
var elem = $(e).parent().find(&#39;#postviews&#39;).addClass(&#39;mbtloading&#39;);
var blogStats = new Firebase(&quot;https://digizone.firebaseio.com/pages/id/&quot; + $(e).attr(&#39;name&#39;));
blogStats.once(&#39;value&#39;, function(snapshot) {
var data = snapshot.val();
var isnew = false;
if(data == null) {
data= {};
data.value = 0;
data.url = window.location.href;
data.id = $(e).attr(&#39;name&#39;);
isnew = true;
}
elem.removeClass(&#39;mbtloading&#39;).text(data.value);
data.value++;
if(window.location.pathname!=&#39;/&#39;)
{
if(isnew)
blogStats.set(data);
else
blogStats.child(&#39;value&#39;).set(data.value);
}
});
});
</script>

এরপর  highlighted  করা অংশটি পরিবর্তন করে নিজের তৈরি করা URL টি টাইপ করুন। ২ নং এর মতো।
    ৫. এরপর নিচের কোডটি খুঁজুন

<data:post.body/> 

নোট- উপরের কোডটি বার বার  থাকতে পারে, তাই প্রথম টি খুঁজুন।
৬.এরপর নিচের কোডটি তার উপরে পেস্ট করুন

<!-- Post Views Counter by MBT-->
<div id='views-container'><span class='views-icon'/><div class='views-text'>Views:</div> <div class='mbtloading viewscount' id='postviews'/></div>

৭. সবশেষে <head> এর নিচে , নিচের দেওয়া কোডটি পেস্ট করুন।

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>

৮. এবার সেভ এ ক্লিক করুন
এবার ব্লগটিকে চালিয়ে দেখুন। কোন সমস্যা হলে কমেন্ট করুন। ধন্যবাদ।
 

Godaddy থেকে ডোমেইন কিনে যে ভাবে ব্লগার ব্লগে সেট করবেন -মেগা পোষ্ট

আজকের পোস্ট এর টাইটেল দেখেই নিশ্চয় বুঝেগেছেন আমি ঠিক কি নিয়ে পোস্ট করতে যাছি । আজকে আমি আপনাদের দেখাবো কিভাবে আপনি একটি ডোমেইন কিনবেন যেমনঃ .COM , NET , INFO , ORG ইত্যাদি এবং আপনার ব্লগার ব্লগে সেট করবেন । আমি আপনাদের দেখাবো কিভাবে জনপ্রিয় ডোমেইন - হোস্টিং কোম্পানি Godaddy থেকে একটা ডোমেইন কিনবেন এবং সঙ্গে আপনার ব্লগে সেট করবেন । আসুন শুরু করি।

☞ Godaddy থেকে ডোমেইন কেনার জন্য যা যা করতে হবে -

•   প্রথমে godaddy.com এ যান সেখানে গিয়ে Search Domain বক্সে আপনার নাম আপনার ডোমেইন সিলেক্ট করে নিন তারপর Search Domain ক্লিক করুন তারপর আপনার ডোমেইনটি সিলেক্ট করেনিন তারপর Continue to Cart এ ক্লিক করুন তার আগে ডোমেইন রেজিস্টার করেনিন । নীচের চিত্রের সাহায্য নিতে পারেন।

•   এবার যে পেজ আসবে যাযা অ্যাড করার করে নিন যদি অ্যাড করতে না চান তাহলে  সব নীচে থেকে Continue to Cart এ ক্লিক করুন । নিচের চিত্রের মতো দেখতে পাবেন।

•  এবার একটি নতুন পেজ আসবে সেখানে আপনাকে বলা হবে আপনি কত দিনের জন্য ডোমেইন কিনতে চান। তা নির্ধারণ করুন।  নীচের চিত্রের মতো দেখতে পাবেন।

•  সময় নির্ধারণ হয়ে গেলে নীচে থেকে Proceed to Checkout > এ ক্লিক করুন । নীচের ছবিটি লক্ষ্য করুন । 

•   এবার যে পেজ আসবে সেখানে থেকে আপনাকে পেমেন্ট করতে হবে আপনি ৭ ভাবে পেমেন্ট করতে পারবেন আপনার সুবিদা অনুযায়ী পেমেন্ট করুন । নীচের চিত্রে দেখুন । 

•  এরপর একটি ফর্ম আসবে আগে এবং পরে নিজেরাই পরে বুজতে পারবেন কিভাবে পুরন করতে হবে । ব্যাস হয়েগেল আপনার ডোমেইন কেনা ।

☞ কিভাবে কাস্টম ডোমেইন আপনার ব্লগার ব্লগে সেট করবেন?

•   এবার ডোমেইন প্যানেল থেকে আপনার ডোমেইনকে Launch করুন এর জন্য Launch বাটনে ক্লিক করুন  তারপর আপনার ডোমেইন নাম এর উপর ক্লিক করুন । নীচের চিত্রে দেখুন । 

•   এবার DNS Zone File এ ক্লিক করুন । নীচের চিত্রে দেখুন । 

•   উপরের মতো রেখে দিন এবার আপনি আপনার ব্লগার ব্লগ লগইন করুন । ড্যাশবোর্ড থেকে Settings এ ক্লিক করুন Basic এ ক্লিক করুন তারপর + Setup a 3rd party URL for your blog বাটনে ক্লিক করুন । নীচের চিত্রে দেখুন ।

• এবার সেখানে www সহ আপনি এখুনি যে ডোমেইন কিনলেন সেই ডোমেইন নামটি বসান । তারপর Save এ ক্লিক করুন তাহলেই সেখানে DNS Settings File নামে একটি ফাইল পাবেন তাতে ক্লিক করে ডাউনলোড করেনিন এবং সেটাকে ডেস্ক টপে রেখে দিন । নীচের চিত্রে দেখুন । 

• এবার যে পেজ আসবে সেখান থেকে A (Host ) এ সব কিছু ডিলিট করে দিন তারপর More ট্যাব থেকে Import Zone File এ ক্লিক করুন তাহলেই নীচের চিত্রের মতো একটি পপআপ বক্স আসবে । নীচের চিত্রে দেখুন ।

• এবার উপরের বক্স থেকে Select File এ ক্লিক করে ৪ নাম্বার স্টেপে DNS Settings File ফাইল ডাউনলোড করলেন সেটা সিলেক্ট করে Save এ ক্লিক করুন উপরের চিত্রেই দেখুন । 

•   ব্যাস হয়েগেল এবার আপনি ডোমেইন প্যানেল দেখুন ঠিক এই রকম দেখাবে । নীচের চিত্রে দেখুন ।

• এবার আবারও আপনার ব্লগার ব্লগ লগইন করুন তারপর ড্যাশবোর্ড থেকে Settings এ ক্লিক করুন Basic এ ক্লিক করুন তারপর + Setup a 3rd party URL for your blog বাটনে ক্লিক করুন । এবং সেখানে www সহ আপনি ডোমেইনটি বসিয়ে Save এ ক্লিক করুন । তারপর আবার Edit এ ক্লিক করুন এবং Redirect বাটনে ঠিক দিয়ে Save এ ক্লিক করুন । ব্যাস এখুন আপনার ব্লগে কেউ www ছাড়াও ভিজিট করতে পারবে । নীচের চিত্রে দেখুন ।

•   ব্যাস হয়েগেল এই টিপসটি শুধু মাত্র Godaddy  এর সকল ডোমেইন এর ক্ষেত্রে আপনি যদি অন্য কোন কোম্পানির ডোমেইন কিনেন তাহলে আপনাকে A (Host )  হিসাবে নীচের গুলো ব্যবহার করত হবে।

216.239.32.21

216.239.34.21

216.239.36.21

216.239.38.21

• আর CName (Alias) হিসাবে 

www  →  ghs.google.com এটা সবার জন্য একি কিন্তু ৪ নাম্বার স্টেপে দেখুন www    ghs.google.com এর নীচে কিছু কোড আছে সেগুলো এক একজনের এক রকম হবে সেগুলো ব্যবহার করতে হবে এর কিভাবে ব্যবহার করবেন সেটা উপরের ৭ নাম্বার স্টেপ এর স্ক্রীনশর্ট দেখুন বুঝতে পারবেন । 

 

☞ ব্যাস হয়েগেল আপনার একটি কাস্টম পেইড ডোমেইন কেনা এবং ব্লগার ব্লগে সেট করা। সমস্যা হলে কমেন্ট করুন। ধন্যবাদ।

ব্লগে যুক্ত করুন পাঠকে মুগ্ধ করার অভিন্ন একটি ঝরা পাতার ইফেক্ট

ব্লগ আমাদের একটি অভিমত প্রকাশ করার জায়গা। ব্লগে লেখক তার মনের ভাষা বিশ্ব বাসীর কাছে শেয়ার করে। প্রয়োজনে পাঠক তার মন্তব্য ও লেখকে জানাতে পারে। আর এই ব্লগকে সুন্দর করে সাজিয়ে তোলার জন্য অনেকে দিন-রাত এক করে চলছে। আজ আমি আপনার স্বপ্নের ব্লগের জন্য একটি ঝরা পাতার ইফেক্ট নিয়ে লিখছি। আপনি চাইলে আপনার ব্লগে ঝরা পাতার ইফেক্ট যুক্ত করে দিয়ে পাঠকে মুগ্ধ  করে দিতে পারেন। আসুন দেখি কি ভাবে ব্লগে ঝরা পাতার ইফেক্ট তৈরি করবো। 

 ঝরা পাতা ইফেক্টের জন্য যা যা করনীয়-

• প্রথমে আপনার ব্লগে লগইন করুন। 
• তারপর Layout যান।
• এরপর Add Gadget ক্লিক করুন এবং
• সবশেষে HTML/JavaScript সিলেক্ট করুন।
•  এবং নিচের কোডটুকু পেষ্ট করুন।

এটিও পড়ুন - আজীবন আয় করুন আপনার ব্লগ সাইট থেকে 

 ঝরা পাতার কোডটি নিম্নরূপ-

<script>if(typeof jQuery=='undefined'){document.write
('<'+'script');document.write(' language="javascript"');document.write('
type="text/javascript"');document.write('
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');docume
nt.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array
()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']
="<strong>http://3.bp.blogspot.com/-
bH72rAXHnLA/UMG5q0ZKQ_I/AAAAAAAAFQM/J8cQ6cP_1ks/s1600/Leaf1.p
ng</strong>";image_urls['rain2']="<strong>http://2.bp.blogspot.com/-sYEBH-
PlRjw/UMG5tAbpx6I/AAAAAAAAFQU/z343xo80F8k/s1600/Leaf2.png</strong>
";image_urls['rain3']="<strong>http://2.bp.blogspot.com/-
vc1D74L_B3k/UMG5xW3F0FI/AAAAAAAAFQk/BuhLTp4lpl8/s1600/Leaf6.png
</strong>";image_urls['rain4']="<strong>http://1.bp.blogspot.com/-
6ITYtjlpbog/UMG5vGq29-
I/AAAAAAAAFQc/eee_PBRaQ8k/s1600/Leaf5.png</strong>";$(document).rea
dy(function(){var c=$(window).width();var d=$(window).height();var e=function
(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a)
{setTimeout(function(){a.css({left:e(0,c)+'px',top:'-
30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e
(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e
(1,8000))};$('<div></div>').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-
5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var
g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e
(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f
(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width
();d=$(window).height()})});</script>
<script>if(typeof jQuery=='undefined'){document.write
('<'+'script');document.write(' language="javascript"');document.write('
type="text/javascript"');document.write('
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');docume
nt.write('</'+'script'+'>')}</script>

 ডেমো -
আপনি চাইলে ঝরা পাতা ইফেক্টের ডেমো ব্লগ এখানে ক্লিক করে দেখে নিতে পারেন।

এবার আপনার ব্লগকে সেভ করে দিন। এবার আপনার ব্লগকে চালিয়ে দেখুন আর মজা নিন। কোন সমস্যা হলে কমেন্ট করুন। সুস্থ ও ভালো থাকুন ধন্যবাদ।