چند روز پیش تصمیم گرفتم برای وبلاگم daily.javadnasrollahi.ir قالب Instant View تلگرام بسازم؛ قالبی که وقتی لینک یکی از پست‌هام در تلگرام ارسال می‌شه، نسخه‌ای ساده، سریع و تمیز از اون پست نشون داده می‌شه. اگر تو هم وبلاگ داری یا محتوایی منتشر می‌کنی و دلت می‌خواد لینک‌هات حرفه‌ای‌تر توی تلگرام نمایش داده بشن، این مقاله برات مفیده.
چرا Instant View؟
تلگرام به کمک قابلیتی به اسم Instant View این امکان رو می‌ده که وقتی یک لینک در گفتگو ارسال می‌شه، نسخه‌ای بهینه‌شده و مینیمال از اون صفحه نمایش داده بشه؛ بدون نیاز به بارگذاری کامل سایت. خیلی سریع، خوانا و کاربرپسند. برای کاربرهایی که اینترنت کند دارن یا با موبایل وارد می‌شن، یه تجربه فوق‌العاده‌ست.
مراحل ساخت قالب Instant View برای وبلاگم
1. آشنایی با مستندات
با مراجعه به مستندات رسمی تلگرام (https://instantview.telegram.org/docs) با ساختار قالب‌ها آشنا شدم. فهمیدم که باید با ترکیبی از XPath و قوانین IV Template کار کنم تا مشخص کنم کدوم بخش‌های صفحه من تو Instant View نمایش داده بشن.
2. تعریف ساختار قالب
ساختار اولیه به شکل زیر بود:
~version: "2.0"
?path: /.+
$main: //div[@id="dev_page_content_wrap"]
title: $main//h1[1]
body: //div[@id="dev_page_content"]
author: "Javad Nasrollahi"
3. حذف عناصر اضافی
@remove: $main//*[has-class("navbar") or has-class("side-menu") or has-class("footer")]
@remove: //script | //style
4. تنظیم عکس شاخص و پیش‌نمایش
cover: $main//img[has-class("cover")]
image_url: $cover/@src
5. تست و ثبت قالب
از طریق Instant View Editor قالب رو تست کردم. همه چیز سبز شد و دکمه Mark as checked رو زدم. بعد با Submit for review قالب رو برای بررسی نهایی فرستادم.
نکات مهم
- XPath بلد بودن خیلی کمک می‌کنه.
- خطاها رو دقیق بخون.
- با @remove بخش‌های اضافی رو خیلی راحت حذف کن.
- به شرط path دقت کن چون کل قالب براساس اون فعال می‌شه.
نتیجه‌گیری
الان وقتی لینک هر پست وبلاگم رو توی تلگرام می‌فرستم، نسخه‌ای ساده و شیک از اون نمایش داده می‌شه. اگر شما هم وبلاگ دارید، پیشنهاد می‌کنم حتماً قالب Instant View بسازید.
