More Related Post এর পাশে বিজ্ঞাপন… এইটা আবার কি?
যারা আমার ইংরেজি ব্লগে পা রেখেছেন, তার লক্ষ করলে দেখবেন যেকোনো ব্লগ পোষ্টের শেষে Most Related Post লিষ্টের পাশে গুগল এডসেন্সের বিজ্ঞাপন দেখে থাকবেন। এভাবে বসালে বেশি ক্লিক পড়ে কিনা আমি এখন টেস্ট করছি, উত্তরে পৌঁছাতে পারিনি। তবে আপনার আগ্রহী হলে নিজেদের ব্লগে টেষ্ট করে দেখতে পারেন। আমি এখানে কেবল নিজ সার্ভারে ইনস্টল করা ওয়ার্ডপ্রেস সাইটের জন্য টিউটোরিয়ালটি বর্ণনা করব।
![More Related Post এর পাশে কিভাবে বিজ্ঞাপন/গুগল এডসেন্স বসাবেন [প্রোগ্রামিং জ্ঞান প্রয়োজন] More Related Post এর পাশে কিভাবে বিজ্ঞাপন/গুগল এডসেন্স বসাবেন [প্রোগ্রামিং জ্ঞান প্রয়োজন]](http://juhbn.s3.amazonaws.com/wp-content/uploads/2010/01/google-adsense-beside-related-posts-400x212.jpg)
এই কাষ্টমাইজেশনটি তিনটি স্তরে সম্পন্ন করতে হবে, প্লাগইন ইনস্টল, ওয়ার্ডপ্রেসের পোষ্ট হুকে কোড স্থাপন (php) এবং সঠিক স্থান ও রং বসানো (css)। তাই তাড়াহুড়া করার কোনোই দরকার নেই, ধীরে ধীরে করুন। নাইলে কিন্তু…
এক – প্লাগইন ইনস্টল
এই কাজের জন্য আমি Yet Another Related Post Plugin প্লাগইনটি ব্যবহার করেছি। আপনার Plugin ইনস্টলে গিয়ে YARPP দিয়ে সার্চ দিলে এই প্লাগইনটি খুঁজে পাবেন, তা ইনস্টল করে ফেলুন।
এবার Settings এ গিয়ে Display Options for your website এর ঘরে Automatically display related posts? এর পাশের টিক চিহ্নটি তুলে দিন। তা না হলে এটি অটোমেটিকভাবে আপনার ব্লগে Related Post দেখাতে শুরু করবে। যা আমরা দেখাতে চাই না। আর যারা কাষ্টমাইজেশন করতে চান না, তারা এখানেই থেমে যেতে পারেন।
দুই – সঠিক স্থান এবং রং বসানো (CSS)
আমি পোষ্টের শেষে যে জায়গায় বসিয়েছি, সেখানকার প্রস্থ হচ্ছে ৫৫০ পিক্সেল, তাই আমি স্থানটিকে সমান দুইভাগে ভাগ করে প্রথম অংশে Related Post এবং অন্য অংশে বিজ্ঞাপন বসিয়েছি। এবং পছন্দসই রং ব্যবহার করেছি – রং বাছাইয়ের জন্য এই পোষ্টটি পড়ুন।
এখন রং পছন্দ হয়ে গেলে কাগজে টুকে রাখুন।
এবার Appearance > Editor এ গিয়ে style.css ফাইলটি খুলুন এবং সবার শেষে গিয়ে নিচের কোডটি বসিয়ে দিন।
/******* main container ***************/
.custom .format_text div.ads {
background: #F4EFA4 center no-repeat; border: 2px solid #E0C64C; padding:15px 8px 15px 8px;
-moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px;
-moz-border-radius-topleft:4px; -moz-border-radius-topright:4px;
-webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px;
-webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; margin-bottom:10px; overflow:hidden; }
/******* related post container **********/
#yarpp { float: left; font-size:13px; width:50%; font-weight:bold; }
#yarpp ul { border:0px; padding:0px; }
#yarpp ul li a { text-decoration:none; }
#yarpp ul li a:hover { text-decoration:none; }
/******* related post title **************/
#yarpp .title { padding:0px; border:0px; font-size:18px; color:#960101; font-family:'century gothic'; text-transform:uppercase; font-weight:bold; }
/******* ads container ****************/
#yarpp-ads { float: right; width: 50%; text-align:right; verticle-align:top; }
আপনার পছন্দসই রং #F4EFA4 (background) এবং #E0C64C(border) এর পরিবর্তে ব্যবহার করতে পারেন।
এক – টেমপ্লেটে কোড স্থাপন (php)
যারা php কোডিং নিয়ে ধারনা রাখেন, তারা নিচের কোডটুকু main index template/ single post template পেজের do_action(‘the_entry’); এর পর সুবিধাজনক স্হানে বসিয়ে দেবেন।
if (!is_home() && !is_page() ) {
?>
<div class = 'ads'>
<div id=yarpp>
<font class = title >More Related Posts</font><? related_posts(); ?>
</div>
<div id = yarpp-ads>
/**** your adsense code here ****/
</div>
</div>
<? }
আর যারা php কোডিং জানেন না কিংবা php কোডে হাত দিতে চান না, তারা comments template পেজে সবার উপরে নিচের কোডটুকু যোগ করে দিন।
<? }
if (!is_home() && !is_page() ) {
?>
<div class = 'ads'>
<div id=yarpp>
<font class = title >More Related Posts</font><? related_posts(); ?>
</div>
<div id = yarpp-ads>
/**** your adsense code here ****/
</div>
</div>
<? } ?>
এরপর পছন্দমতো আপনার পছন্দমতো background এবং border এর রঙয়ের সাথে মিল রেখে এডসেন্স কোড তৈরি করুন এবং /*** your adsense code here ****/ লাইনের নিচে যোগ করে টেমপ্লেটটি save করুন। আমি এখানে এডসেন্সের ২৫০ * ২৫০ সাইজটি ব্যবহার করেছি।
ব্যাস, সবকিছু ঠিক থাকলে স্বল্প সময়ের মধ্যে More related post এবং এডসেন্সের বিজ্ঞাপনকে পাশাপাশি দেখতে পারেন। এডসেন্সের পরিবর্ত অন্য যেকোনো বিজ্ঞাপন, লেখা প্রদর্শণ করতে পারবেন।
সর্তকতা
প্রোগ্রামিং জ্ঞান প্রয়োজন, এই ধরনের পোষ্ট দিতে ভয় লাগে। কারণ এতে দূর্ঘটনা ঘটার সম্ভাবনা থাকে। আর দূর্ঘটনার পর আমি দোষী প্রমাণিত না হলেও ক্ষতিপূরণ হিসেবে আমাকে ব্লগকে পুরোনো জায়গায় ফেরত নিয়ে যাওয়ার অনুরোধ শুনতে হতে পারে। যা আমার ব্যস্ত জীবনে সবসময় সম্ভব নয়। তাই এই পোষ্টটি নিজের ব্লগে প্রয়োগের আগে সর্তকতা অবলম্বন করবেন, সম্ভব হয়ে দক্ষ কারোও সাহায্য নেবেন।
যেকোনো টেমপ্লেট ফাইল পরিবর্তন করার পূর্বে notepad এর পুরো কোডটি সংরক্ষন করুন। কোনো সমস্যা হলে notepad থেকে কোডটি নিয়ে আবার টেমপ্লেটে বসিয়ে দিন।
সবশেষে, সবাই ভাল থাকুন, সুস্থ থাকুন।
শুভ কামনা রইল সবার জন্য।
এ ধরনের আরও কিছু পোষ্ট:
- গুগল এডসেন্স একাউন্টের জন্য আবেদন করার পূর্বে যা যা করবেন
- গুগল এডসেন্স চেক – জানুয়ারী, ২০১০
- কিভাবে গুগল এডসেন্স/বিজ্ঞাপন পোষ্টের মধ্যে ডানে/বামে সরাবেন? [টিউটোরিয়াল]
- জনগুরুত্বপূর্ণ পোষ্ট – গুগল এডসেন্স একাউন্ট ব্যান এবং ওয়েবসাইট বিষয়ক একটি প্রসঙ্গ
- গুগল এডসেন্স বিজ্ঞাপনে বৈচিত্র্য আনুন – Multiple Palettes ব্যবহার করুন
- গুগল এডসেন্স চেক – সেপ্টেম্বর, ২০০৯
- কিভাবে গুগল এডসেন্স বিজ্ঞাপনের রং নির্ধারণ করবেন?
- গুগল এডসেন্স ভুয়া চেক/রিপোর্ট জালিয়াতি থেকে সাবধান
{ 30 comments… read them below or add one }
�পনার প��ষ� �ি
এসব কি দেখাচ্ছে?
উপরের আমার কমেন্টটা ভুল করে চলে গেছে।ডিলিট করে দিয়েন ভাই।
হাসান ভাই related post এর বক্সটি করবো কিভাবে?সবই হচ্ছে কিন্তু আপনার মত বক্সটি করতে পারছিনা, সাহায্য করেন।আপনার মত বক্স করে সেখানে related post আর এ্যাড দেখাতে চাচ্ছি।
হাসান ভাই adsense apply করার পর ব্লগে নতুন post দেয়া যাবে??
হ্যাঁ.. কেন যাবে না?
ধন্যবাদ ভাইয়া,পোস্টটা অনেক কাজে দিবে!
হাসান ভাইয়ের কাছে আমার প্রথম চাওয়া পূরণ হলো। ধন্যবাদ আপনাকে… ভবিষ্যতে এ ধরনের আরও ভাল পোস্ট চাই।এখনো try করিনি আগে লোকাল হোস্টে try করবো।
ভাই এমনভাবে বলেছেন যেন অতীতে আপনার আর কোনো চাওয়া পূরণ করিনি।
করেছেন।আরে ভাই সেটা বলিনি এটা ছিল special চাওয়ার মধ্যে প্রথম। আরও অনেক বিষয়ে আপনার help পেয়েছি, আশা করি ভবিষ্যতে আরও করবেন। ভালই মজা করতে পারেন।আপনার কথায় খুব হাসি পাচ্ছে। হা..হা..হা
হাসান ভাইয়ের সব পোষ্টই ভাল হয়-কিছু না কিছু ইনফরমেশন অবশ্যই আমরা পাই তা না হলে এই ব্লগের পাঠক এভাবে বাড়ত না- সেটা চিন্তা করে দেখেন।
হাসান ভাই আমি মনে মনে এমনই ভাবছিলাম যে, আপনার ইংরেজী বলগের কিভাবে লাগানো হয়েছে……?
।
কিন্তু প্রশ্ন করতে তেমন সাহস পাচ্ছিলাম না। আজ জানেত পারলাম ,
ভালথাকেবন ।
ধন্যবাদ। পেজটা বুকমার্ক করে রাখলাম
ধন্যবাদ ভাইয়া, অনেক ভাল একটি আর্টিকেল এর জন্য
css পর্যন্ত কোন সমস্যা হবে না। কিন্তু Php তো এখন পারিনা। কেবল শিখছি। তাই আপতত দেখে রাখলাম পড়ে ব্যবহার করব। যতদুর মনে হচ্ছে আদনান ভাইয়ের এক প্রশ্নের উত্তরে হাসান ভাই আগেই এই প্লাগইন এর কথা বলেছিলো।
হাসান ভাই ব্লগের বাইরে আমার একটি জিনিস (ইংল্যান্ডের ব্ল্যাক লিষ্টেট ইউনির্ভাসিটি নামের তালিকা ) জরুরী প্রয়োজন । আপনাকে মেইল করে রেসপন্ড খুব কম পাওয়া যায় বলে ব্লগে বলতে বাধ্য হলাম। আপনি কি এই জাতীয কোন কিছুর লিংক বা অন্য কিছুর খোজ আমাকে দিতে পারেন? আমি যতটুকু জানি এরকম প্রায় ২০০র মত ইউনিভার্সিটি আছে ইংল্যাল্ডে। কিছু সার্চ ইঞ্জিনে ২০ অধিত আমি পায়নি, তাও আবার এদের কোন বিশ্বাস যোগ্য উৎস নেই। আমার সঠিক তথ্যটা সরকার। আমি বাংলাদেশে ইউকে হাই কমিশনে ফোন করে ব্যর্থ হয়েছি। ইংল্যন্ডে পরিচিত একমাত্র আপনিই আছেন তাই আপনাকে বলা।
ব্যান হওয়ার লিস্ট আছে কিনা জানি না, তবে যেগুলো কলেজ অনুমতি পেয়েছে সে সম্বন্ধে জানতে পাবেন এখানে – http://www.thelondonstudy.com/
ধন্যবাদ হাসান ভাই এটা দিয়ে মোটামুটি কাজ চালানো যাবে।
হাসান ভাই অনেক ধন্যবাদ কোড স্নিপিট এর জন্য। আমি অনেকদিন ধরে YRPP ব্যবহার করছি। কিন্তু কোডে হাত দেয়ার ঝামেলার কারনে কখনো চিন্তা করিনি। এখন কোডটা খুব কাজে আসবে।
হাসান ভাই আপনাকে অনেক ধন্যবাদ এ ধরনের একটা পোস্ট দেওয়ার জন্য।
মনের মতো একটি লিখা পেলাম।
প্রথমেই লোকাল হোস্টে চেক করলাম কাজ করেছে তবে আমার ব্লগে এখন ট্রাই করবো না CSS শেখা প্রায় শেষ PHP দ্রুত ধরব, তারপর এতে কাজ করবো।
হাসান ভাই এরকম পোষ্ট সামনে আরো চাই।
কোথায় শিখছেন css ভাইয়া
অনেকটা নিজে নিজে আর স্যারদের সহযোগীতা ছিল।
প্লাগইন ইন্সটলের পর উপরে এই মেসেজ দেখায়।
Please move the YARPP template files into your theme to complete installation.
Simply move the sample template files (currently in wp-content/plugins/yet-another-related-posts-plugin/yarpp-templates/) to the /home/www/xxx.com/wp-content/themes/ directory.
এটা কি ফাইলজিলা দিয়ে করতে হবে?
ফাইলগুলো আপলোড না করলেও তো কাজ করার কথা।
না করলে ফাইলজিলা দিয়ে wp-content/plugins/yet-another-related-posts-plugin/yarpp-templates/ ফোল্ডারের সব ফাইলগুলো /home/www/xxx.com/wp-content/themes/ এর ভেতরের থীম ফোল্ডারে পাঠিয়ে দিন।
অসাধারন পোষ্ট।দারুন দারুন খুবই দারুন।আশা করি সবার কাজে লাগবে।তবে ভাইয়া, একটা ব্যাপার বুঝতে পারলাম না, আমি Yet Another Related Post Plugin প্লাগইনটি ব্যবহার করি যা অটোমেটিকলি পোষ্ট দেখায়।এই পদ্ধতিতে দেখাতে হলে তো আমাকে ম্যানুয়ালী রিলেটেড পোষ্টগুলো দেখাতে হবে।সেটা কোথায় কিভাবে করব? আর হাসান ভাই, বিজ্ঞাপনগুলো ডানে না রেখে বামে রাখতে চাইলে কি করব?
“/******* ads container ****************/
#yarpp-ads { float: right; width: 50%; text-align:right; verticle-align:top; }”-এখানে কি left করে দিতে হবে? ভাল থাকবেন…
যেখানে কোড বসাবেন, সেখানেই related_posts(); কোডের জন্য দেখাবে। আপাতত এই কোডে বামে related post এবং ডানে বিজ্ঞাপন দেখাবে।
সাইড পরিবর্তন করতে css এর মধ্যে left কে right আর right কে left করুন।
একটা চাওয়া পূর্ন হল এখন ২য় চাওয়া………………..
কি হতে পারে,………..ওহ! মনে আসছে……
এটা হচ্ছে কিভাবে হোষ্টং সার্ভার পরিবতর্ন করব আমরা।
আশা করি নিকট ভবিষ্যতেই পেয়ে যাব।
খুবই গুরুত্বপূর্ন টিউটোরিয়াল।
কিন্তু সতর্কতা অবলম্বন করতে নোটিশ জারি করা হয়ে গেছে; তাই …………সাবধানে আস্তে ধীরে বুঝে কাজটি করবেন সবাই।
আমি করতে পারবনা এখনই তাই ভবিষ্যতের জন্য প্রিয়তে রেখে দিলাম।
হাসান ভাইকে অসংখ্য ধন্যবাদ।
কোডিংয়ে হাত না দিলেও প্লাগইনটি ব্যবহার করে দেখতে পারেন।
ধন্যবাদ ভাইয়া, তাহলে অবশ্যই ব্যবহার করব।
হাসান ভাই, অনেক অনেক ধন্যবাদ এই ব্যপারটা নিয়ে লেখার জন্য। অনেক দিন থেকে এটা নিয়ে আগ্রহ ছিল।