ساخت دکمه اشتراک گذاری تلگرام برای سایت- Telegram Share button

به نام خدا

بروز رسانی در ۱۰ تیر ۹۵

در این پست از سایت امیر با نحوه ساخت دکمه اشتراک گذاری تلگرام آشنا میشیم.
اکثر سایتها دکمه‌هایی در کنار مطالبشون دارن که میتونید با کلیک روی اونها مطلب مورد نظر رو توی شبکه‌های اجتماعی بزرگ مثل فیسبوک یا توییتر و یا هر شبکه‌ی دیگه ای به اشتراک بذارید. یکی از این شبکه‌ها که از قضا طرفداران زیادی هم توی کشور ما داره، تلگرام هست. در این پست میخواهیم با شیوه ایجاد دکمه اشتراک گذاری تلگرام آشنا بشیم. این اپلیکیشن با امکانات و سرعت بالای خودش ابزار خوبی برای تبادل سریع اطلاعاته. اگه شما هم دوست دارید مطالب سایتتون براحتی توی تلگرام منتشر بشه باید به فکر طراحی یک دکمه خوشگل باشید که تنها با یک کلیک آدرس صفحات سایت شما رو به اپلیکیشن تلگرام انتقال بده.

ساخت دکمه اشتراک گذاری تلگرام

این روش در تلگرام اندروید از نسخه ۳.۱.۱ اضافه شده است. نسخه‌های پایین‌تر این امکان رو پشتیبانی نمی‌کنند.

۱- ابتدا یک لینک ایجاد می‌کنیم.

<a href="#" title="اشتراک گذاری در تلگرام"> Click Here! </a>

۲- کد جاوا اسکریپت زیر رو پایین لینک Copy/Paste می‌کنیم. دقت کنید که این کد جاوا اسکریپت رو میتونید

<script type="text/javascript">
//تابع اشتراک گذاری را تعریف می کنیم
	function teleShare() {

//خط پایین، یک پنجره باز میکند که از کاربر سوال میکند آیا میخواهد آدرس این صفحه را در تلگرام به اشتراک بگذارد؟
	var r = confirm("Share the address of this page to Telegram?");

// اگر کاربر روی دکمه اوکی کلیک کرد، کاربر را به اپلیکیشن تلگرام هدایت میکنیم.
//و ازش میخواهیم که یک چت را برای اشتراک گذاری آدرس انتخاب کند
		if (r == true) {
		window.location.replace('https://telegram.me/share/url?text=Custom+Text&url='+window.location.href)
		}
	}
</script>

وقتی روی دکمه کلیک میشه شما به آدرس ( https://telegram.me/share ) میرید و این سایت به سیستم عامل دستور میده تا اپلیکیشن تلگرام رو باز کنه و متن موجود در قسمت text و url رو توی یک چت بفرسته. هر مقداری که شما جلوی text و url بنویسید به اپ تلگرام منتقل میشن. ما در اینجا مقدار url رو مساوی با آدرس صفحه‌ی فعلی قرار دادیم و یه متن دلخواه هم جلوی text نوشتیم. متغیر text اگه خالی باشه اشکال نداره.

۳- لینک رو یه کم ویرایش میکنیم و بهش یه attribute به اسم onclick می افزاییم! همون طور که از اسمش پیداست یعنی وقت روی لینک کلیک شد یه کاری بکن. در اینجا اون یه کار، فراخوانی تابع teleShare هستش.

<a href="#" title="اشتراک گذاری در تلگرام" onclick="teleShare()"> Click Here! </a>

خوب لینک ما آماده است. میتونید با گوشیتون صفحه رو بارگذاری کنید و روی لینک کلیک کنید تا نتیجه کار رو ببینید.

به طور پیش فرض تلگرام اطلاعات لینکهای ارسالی رو زیرشون نمایش میده. مثلا خلاصه ای از یه نوشته رو. پس لازم نیست توضیحی کنار لینک بدین.

نمونه دکمه اشتراک گذاری تلگرام  پایین صفحه است که میتونید با کلیک کردن روش تستش کنید.

[js]

برای وردپرس

اون دسته از دوستانی که میخوان این دکمه رو واسه سایت وردپرس خودشون درست کنن، این کد زیر رو به فایل functions.php پوسته‌ی سایتشون اضافه کنن. حالا هرجایی که خواستید میتونید کد کوتاه [teleShare] رو وارد کنید تا در اونجا دکمه‌ی اشتراک گذاری در تلگرام ظاهر بشه. مثلا در آخر نوشته‌ها یا محصولات فروشگاهتون.

//[teleShare]
function tele_func(){
return <<<_END
<a title="Share this page to Telegram" onclick="teleShare();"><img src="//ameer.ir/wp-content/uploads/2015/10/t-logo.svg" alt="دکمه اشتراک گذاری تلگرام" width="64" /></a>
<script type="text/javascript">
	function teleShare() {
		var r = confirm("Share the address of this page to Telegram?");
		if (r == true) {
			window.location.replace('https://telegram.me/share/url?text=Custom+Text&url='+window.location.href);
		}
	}
</script>
_END;
}
add_shortcode( 'teleShare', 'tele_func' );

سعی میکنم که این امکان رو توی نسخه‌های بعدی افزونه Telegram for WordPress اضافه کنم تا بدون دردسر پایین هر صفحه و نوشته بتونید این رو نمایش بدین.

91 دیدگاه برای “ساخت دکمه اشتراک گذاری تلگرام برای سایت- Telegram Share button

  1. سلام … ببخشید من یه آموزش تصویری رو می خوام با php که بتونه کاربر مطالب سایتش رو در تلگرام به اشتراک بزاره … می تونید برام آموزش بدید تشکر

  2. سلام امیر جان
    من آموزشرو به درستی انجام دادم به تلگرام منقل میشه ولی دیگه آدرس صفحه و متن و به اشتراک نمیزاره، ممنون میشم کمکی کنی.
    با تلگرام نسخه iOS تست کردم.

    1. سلام وقتتون بخیر :)
      اگه از آخرین نسخه تلگرام استفاده میکنید، ممکنه این امکان هنوز بهش اضافه نشده باشه.حالا من مجدد نگاه میکنم :)

  3. سلام
    وقتتون بخیر. من این دکمه رو دارم. ولی وقتی می خوام صفحه ای از سایتمو تو تلگرام به اشتراک بذارم. فقط لینک مطلب میاد. در صورتی تو خیلی از سایت ها عکس و چند خط اول مطلب هم به تلگرام منتقل میشه. ممنون میشم اگر بفرماید چطوری می تونم این مشکلو حل کنم.

  4. افزونه ورد پرس تلگرام تان بسیار عالیه فقط اگر بهش این امکان را بدهید که پست را بصورت کامل به اشتراک بگذاره خوب میشد متن و تصویر به همراه لینک مطب را و اشتراک گذاری مطالب برای شبکه ها اجتماعی را هم بهش اضافه کنید

  5. بسیار عالی
    یه سوال
    شماره مخاطب های من داخل یک فایل اکسل هستش
    اینو موفق شدم که به مخاطبین تلگرام اضافه کنم
    اما مشکلی که هست وقتی میخوام براشون تبلیغ اخرین کار و بفرستم ، خیلی طول میکشه باید دونه دونه ارسال کنم!
    حتی اگر بخوام یک گروه بسازم و ادد کنم باز هم خیلی وقت گیره!
    راه حلی نیست که بشه mark all زد؟
    مخصوصا اگر امکان پیدا بشه اخرین کارهام از وردپرس به مخاطبین م ارسال بشه عالی میشه
    البته افزونه تلگرام شما رو دیدم منظورم اون نیست

    1. سلام روزتون بخیر :)
      راستش در این مورد من اطلاعات زیادی ندارم. این کار باید با Telegram CLI انجام بشه که نیاز به برنامه نویسی سمت سرور داره ;)

  6. کد کوتاه [teleShare] یعنی چی ؟

    میخوام اخر هر نوشته کد تلگرام باشه با ایکونش چیکار باید بکنم ؟ برای وردپرس منظورمه
    میشه بیشتر توضیح بدید

    1. سلام روزتون بخیر
      بعد از وارد کردن کدهای مربوطه در فایل functions.php ، این عبارت رو بذارید پایین هر نوشته
      [teleShare]

      مثل کدکوتاه فرم تماس می مونه. اگه بازم سوالی بود در خدمتم

  7. سلام ممنون دوست خوبم بخاطر آموزش های خوبت
    من از سایت همیار باهات آشنا شدم و اونجا ازت راهنمایی می خواستم که البته هنوز مشکل قبلی هم برطرف نشده
    ولی برای این دکمه اشتراک گذاری نگفتی که باید این سورس هارو تو کدوم صفحه وردپرس اضافه کنیم ، ممنون میشم بیشتر توضیح بدی
    سپاس

      1. ممنون دوست عزیز
        شما که این همه توضیح دادی ، کاشکی میگفتی کد کوتاه [teleShare] رو کجا اضافه کنیم ؟
        مثلا وقتی پست های عادی یعنی همون نوشته هارو ارسال می کنیم ، این کد بایستی در کدوم صفحه اضافه بشه ؟

        1. در همون قسمتی که محتوا رو مینویسید میتونید پایینش اضافه اش کنید. پایین نوشته ها یا محصولات فروشگاه. فرق نداره

  8. درود !
    ممنون بابت این پست مفید، امیدوارم در آینده برای نسخه دسکتاپ هم جواب بده ..

    یک درخواست داشتم، البته جسارت هست ..
    در صورت امکان، یک نسخه از قالبتون رو برای من ارسال کنید ؟
    قصد دارم یک وبلاگ برای ثبت خاطراتم ایجاد کنم که از پوسته وبگاه شما خیلی خوشم اومده ..

    تشکر (:

      1. درود !
        خیلی ممنون ولی من ایمیلی دریافت نکردم متاسفانه !

        جسارتا مجدد به این ایمیل ارسال کنید (در صورت لزوم، متن دیدگاه رو هم ویرایش و آدرس ایمیل رو حذف کنید !)

        تشکر (:

    1. سلام دوست عزیز
      نسخه تلگرامتون باید ۳.۱ به بالا باشه. در ضمن برای نسخه وب و دسکتاپ هنوز راه حلی ارائه نشده:)

  9. مشتاقانه منتظر این متنی هستیم که نوشتی :

    “سعی میکنم که این امکان رو توی نسخه‌های بعدی افزونه Telegram for WordPress اضافه کنم تا بدون دردسر پایین هر صفحه و نوشته بتونید این رو نمایش بدین.”

دیدگاه‌ها بسته‌اند.