How to Add Telegram and Whatsapp Group in WordPress Blog Post
আমরা যারা সাধারণতঃ WordPress Blog সাইট নিয়ে নিয়মমত কাজ করছি তাদের সাইটগুলোতে ভিজিটর বাড়ানোর জন্য কিছু আধুনিক কৌশল অবলম্বন করতে হয়। সেই টেকনিকগুলোর মধ্যে অন্যতম টেকনিক হলো ব্লগ পোস্টের মধ্যে Telegram এবং Whatsapp Group/Channel যুক্ত করা। তাই আমি আপনাদের জন্য নিয়ে এলাম সম্পূর্ণ ফ্রীতে Telegram এবং Whatsapp Group/Channel যুক্ত করার জন্য HTML Code for WordPress Blog. নিচে দেখানো পদ্ধতি অনুসরণ করে আপনি খুব সহজেই আপনার WordPress Blog Post ওয়েবসাইটে HTML Code টি যুক্ত করতে পারবেন।

Also Read More
প্রথমেই WordPress Blog সাইটের অ্যাডমিন প্যানেলে একটি প্লাগিন add করে নিন
তাহলে শুরু করা যাক-প্রথমেই আপনার ওয়ার্ডপ্রেস ব্লগ সাইটের অ্যাডমিন প্যানেলে একটি প্লাগিন add করে নিন। প্লাগিনটি হলো “Ad Inserter – Ad Manager & AdSense Ads” নিচের দেখানো অনুযায়ী Add New Plugin এ গিয়ে সার্চ বক্সে “Ad Inserter” লিখে সার্চ করুন তারপর প্লাগিনটি add এবং Active করুন। এখানে উল্লেখ্য যে – যাদের Blog সাইটে AdSense Active আছে তাদের ওয়েবসাইটে এই প্লাগিনটি ইনস্টল করা আছে তাই তাদের আর এই প্লাগিনটি ইনস্টল করার প্রয়োজন নেই। আমার ওয়েবসাইটে প্লাগিনটি করা আছে তাই এরকম দেখাচ্ছে।
How to Add Telegram and Whatsapp Group in WordPress Blog Post
এবার নিচে দেয়া হলো HTML Code টি। Code টি কপি করুন এবং নোট প্যাডে পেস্ট করুন।
<link rel=”stylesheet” href=”https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css”>
<style>
.group-card {
margin-bottom: 20px;
position: relative;
border: 2px solid transparent;
border-radius: 5px;
background: #f0f8ff;
display: flex;
align-items: center;
padding: 7px;
justify-content: space-between;
overflow: hidden;
}
.whatsapp-card {
animation: whatsapp-border-animation 1s infinite;
}
.telegram-card {
animation: telegram-border-animation 1s infinite;
}
@keyframes whatsapp-border-animation {
0% {
border-color: transparent;
}
50% {
border-color: #25d366;
}
100% {
border-color: transparent;
}
}
@keyframes telegram-border-animation {
0% {
border-color: transparent;
}
50% {
border-color: #004F7A;
}
100% {
border-color: transparent;
}
}
@keyframes instagram-border-animation {
0% {
border-color: transparent;
}
50% {
border-color: #E1306C;
}
100% {
border-color: transparent;
}
}
.seoquake-nofollow {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1rem;
font-weight: bold;
text-decoration: none;
padding: 5px 20px;
border-radius: 2px;
flex-shrink: 0;
transition: all 0.3s ease-in-out;
color: white !important;
}
.seoquake-nofollow i {
margin-right: 5px;
}
.whatsapp-card .seoquake-nofollow {
background: #25d366;
}
.telegram-card .seoquake-nofollow {
background: #004F7A;
}
.seoquake-nofollow:hover {
transform: scale(1.05);
}
</style>
<div class=”group-card whatsapp-card”>
<span style=”display: flex; align-items: center;”><i class=”fab fa-whatsapp”
style=”font-size:24px;color:#25d366;”></i>
<span style=”font-weight: bold; margin-left: 10px; font-size: 0.9rem !important;”>WhatsApp Group</span>
</span>
<a class=”seoquake-nofollow” href=”https://www.whatsapp.com/channel/0029VazdPBP59PwV2xspwn0p” rel=”nofollow noopener noreferrer”
target=”_blank”>
<i class=”fab fa-whatsapp”></i> Join Now
</a>
</div>
<div class=”group-card telegram-card”>
<span style=”display: flex; align-items: center;”><i class=”fab fa-telegram”
style=”font-size:24px;color:#004F7A;”></i>
<span style=”font-weight: bold; margin-left: 10px; font-size: 0.9rem !important;”>Telegram Group</span>
</span>
<a class=”seoquake-nofollow” href=”https://t.me/UpdateTechNew” rel=”nofollow noopener noreferrer”
target=”_blank”>
<i class=”fab fa-telegram”></i> Join Now
</a>
এবার Plugins টি Settings করুন
তারপর আবার Plugins অপশনে গিয়ে Installed Plugins এ গিয়ে ছবিতে দেখানো অনুযায়ী Ad Inserter Settings অপশনে ক্লিক করুন। তাহলেই আপনি Copy করা HTML Code টি পেস্ট করতে পারবেন।

Also Read More: 10 things to Consider Before Buying a Smartphone
উপসংহার
এবার উপরে লাল রংয়ের বক্সে মার্ক করা অংশে দেখে আসুন আমার সাইটে কিভাবে শো করছে। তারপর HTML Code টি পেস্ট করে নিচে ছবিতে দেখানো অনুযায়ী সেটআপ করুন। অর্থাৎ পোস্ট বক্সটি চেক করুন এরপর আপনি যেখানে এটি শো করাতে চাচ্ছেন সেখানে সিলেক্ট করুন আমি কিন্তু After Paragraph শো করানো সিলেক্ট করেছি তারপর Alignment option select করুন অর্থাৎ আপনি পোস্টের কোন স্থানে শো করাবেন আমি কিন্তু মধ্যে বা Center Select করেছি এবং Save Settings এ ক্লিক করুন। তারপর শেষে দেখুন লাল রংয়ের বক্সে Aero চিহ্ন দেওয়া যে লিংকটি দেখানো হয়েছে সেটি আমার লিংক তাই ঐ লিংক দুটি মুছে দিয়ে আপনার Telegram এবং Whatsapp Group এর লিংক দুটি বসিয়ে Save Settings ক্লিক করুন। এবার আপনার পোস্টটি চেক করুন। আর আপনার বুঝতে সমস্যা হলে আমাকে Whatsapp এ নক দিন। ভুল ত্রূটি ক্ষমাসুন্দর দৃষ্টিতে দেখবেন। আপনাদের সবাইকে অসংখ্য ধন্যবাদ।

সাধারণ জিজ্ঞাসিত কিছু প্রশ্ন ও উত্তর FAQ’s
আমি কি আমার ওয়ার্ডপ্রেস ব্লগ পোস্টে একটি হোয়াটসঅ্যাপ গ্রুপ লিঙ্ক যুক্ত করতে পারবো?
হ্যা নিশ্চয়ই হোয়াটসঅ্যাপ গ্রুপ লিঙ্ক যুক্ত পারবেন।
আমি কি আমার ওয়ার্ডপ্রেস ব্লগ পোস্টে একটি টেলিগ্রাম গ্রুপ লিঙ্ক যুক্ত করতে পারবো?
হ্যাঁ নিশ্চয়ই আপনি আপনার ব্লগ পোস্টে টেলিগ্রাম গ্রুপ লিঙ্ক যুক্ত পারবেন।
আমি কি আমার ব্লগ পোস্টে হোয়াটসঅ্যাপ বা টেলিগ্রামের জন্য একটি ক্লিকযোগ্য বাটন তৈরি করতে পারবো?
হ্যাঁ নিশ্চয়ই আপনি আপনার ব্লগ পোস্টে HTML কোড ব্যবহার করে বাটন যুক্ত করতে পারবেন।
ওয়ার্ডপ্রেসে WhatsApp এবং Telegram বাটন যুক্ত করার জন্য কি কোন প্লাগিন আছে?
হ্যাঁ নিশ্চয় প্লাগিন আছে