jlelse's Blog

Thoughts, stories and ideas

Telegram Instant View templates

Published on in 👨‍💻 Dev
Updated on
Short link: https://b.jlel.se/s/3ae
Share online  Translate 

A blog follower contacted me yesterday and reported that he had created a template for my blog for Telegram’s Instant View.

Telegram’s Instant View feature allows you to open links directly in Telegram, so you don’t have to open a browser first to read articles, but can directly see the content in a customized view in the Telegram app. Kind of like the reading view in Firefox.

I have adjusted the template a bit so that images are displayed correctly and it should meet the checklist for Perfect Templates.

Technically, Telegram Instant View templates use XPath. Using the templates, the HTML of the website is parsed and properties such as title, author, publication time and content are extracted. I have never worked with XPath before, but it seems to be common for searching in XML and HTML is similar to XML.

What made parsing easier is that I use microformats for the markup of my blog. They are specially designed to make it easier to extract certain information.

Finally, I submitted the following template for review by the Telegram team:

~version: "2.1"

# Only posts
?exists: /html/head/meta[@itemprop="datePublished"]

# Microformats h-entry
hentry: //*[contains(@class, 'h-entry')]

# Fix images
@replace_tag(<figure>): $hentry//a[.//img]
@replace_tag(<div>): $hentry//p[.//figure]

# Find properties
body: $hentry//*[@class='e-content']
title: $hentry//*[@class='p-name']
published_date: $hentry//time[contains(@class, 'dt-published')]/@datetime
author: $hentry//*[contains(@class, 'p-author')]//*[contains(@class, 'p-name')]
author_url: $hentry//*[contains(@class, 'p-author')]//a[contains(@class, 'u-url')]/@href

# Add channel
?path: /de/.*
channel: "@eingeek"
?path_not: /de/.*
channel: "@jlelseblog"

Once the Telegram team has reviewed and accepted the template (let’s see how long that will take), a button should appear directly under the links in my Telegram channels (English and German), which you can then use to read the posts directly in the Telegram app on Android and iOS.

Until then, a preview should be possible via this link: https://t.me/iv?url=https%3A%2F%2Fjlelse.blog%2Fthoughts%2F2021%2F01%2Fliberty-air-2-pro&rhash=e16f2c0535ed51. Copy and paste it into a chat.

Thanks Paul!

Tags:

Jan-Lukas Else
Interactions & Comments