Instant View
googleweblight.comAnnouncing the winners of the Summer 2017 Instant View Contest!
Instant Views Explained
allows Telegram users to view articles from around the Web in a consistent way, with zero loading time. When you get a link to an article via Telegram, simply tap the
Instant View
button, and the page will open instantly.
With Instant View, Telegram users can enjoy articles from any mass media or blogs in a uniform and easily readable way. Instant View pages support text and media of any type and work great even if the original website was not optimized for mobile devices.
On top of this, Instant View pages are extremely lightweight and are cached on the Telegram servers, so they load instantly on pretty much any connection — hence the name. No more waiting for clunky websites to load, now you can get the good stuff right away!
And the best part is that webmasters don't need to change anything on their websites for Instant Views to work.
Instant View Button
Instant View Page
How does this work?
When you share a link via Telegram and a
is generated, our Instant View bot also checks if it has an
Instant View Template
for that website. Templates are sets of instructions we call
rules
that teach the IV bot to build instant view pages for particular domains or URLs.
If a template exists for the link, the bot uses it to find the relevant content on the page (headings, text, media, embedded elements), remove clutter, and create a slim and beautiful Instant View page.
Anyone can use our
Instant View Editor
to create templates. Once a template for a URL is
, all Telegram users will get the option to view the page in the
Instant View
format whenever they see a link to it on Telegram.
If you publish your content on Telegram yourself, you don‘t even need to wait for us to approve your template. You can just send specially formatted links to your subscribers, and they’ll get Instant View pages built using your template right away.
Join buttons
Another added bonus if you have a channel is that you can direct users to
join
your channel from the Instant View pages built from your articles.
Join Button
For this to work, the template must contain a
channel
property that holds a link to your channel.
Instant View Editor
Telegram's Instant View Editor allows you to create and test templates for any domain. To begin, just go to
, type a target URL for your Instant View template into the box, and hit ‘enter’. This will open the editor. The source page will be displayed on the left.
Tip:
Use the
Developer Tools
in your browser (e.g.
Inspect
mode in Chrome) to study the HTML markup of the page.
The middle section of the page is where you create your template for the chosen domain name or URL. Templates consist of simple instructions to our IV bot we call
rules
. You can later study the syntax in detail
. Once you've saved your rules for the page (
cmd + S
or
ctrl + S
in the Rules window), the window on the right will display the Instant View page that the IV bot would create based on the current instructions.
Note the
status line
at the bottom of the page — it displays the result of the last operation. This is also where you'll find the output of the
function:
Sample templates
If you'd like an example, you can check out the
that we're currently using to generate Instant View pages for posts on
,
, and the
. We've added many comments to these templates, so they literally speak for themselves.
Feel free to experiment with them and see what changes. Don‘t worry, your changes won’t be applied to the actual Instant View pages that regular Telegram users can see.
Templates tutorial
When creating an Instant View template, you have four main objectives:
Instant View pages must only be generated for pages that
need
them.
All
essential content
from the source page must be represented.
All
unnecessary elements
must be eliminated from the Instant View page.
Your template must work well with
any
of the pages it covers.
Accordingly, one of the ways to create a template is to follow these steps:
Step 1. Aim your template
Instant View pages work best with relatively static articles. On the other hand, the main page of a news site that contains ever-changing lists of links to new articles would hardly benefit from the IV treatment.
For the first step, you will likely use
to clearly define which parts of the target website will and will not be covered by your template.
Step 2. Grab the essentials
Now it's time to do some real business. An Instant View page requires at least two
to be created: a
title
and a
body
. Take a close look at the target article and make sure that all important elements are carried over to the IV page in a format
by the Telegram apps.
At this stage, you may need to use
to transform some elements before they are transferred. By the time you're done, your IV page should show the entire text of the article, along with all the headings and subheadings, quotes, cover and other photos, videos, and other kinds of embedded content from the source page.
Step 3. Remove the rest
Salvage the remaining useful bits, then use the
to drop the rest. By now you should have a clean and slim IV page that displays the pure content and none of the fluff.
Step 4. Refine your template
At this stage, we advise you to leave the familiar confines of the page you were using for testing and check out different pages from your target website. See if any pages that don't deserve IVs are getting them — and whether IV pages are missing for any that do deserve them.
Also, check whether pages with irregular elements are processed correctly. Pay special attention to ensure that various types of media, embedded content, quotes, and separators are all displayed nicely. Check 5-10 different links and make the relevant adjustments.
Naturally, this is just a brief outline of what you could do — Instant View pages offer limitless possibilities.
Tracking changes
Once you're
with your template's generated IV pages, press the
Track Changes
button. If modified template rules are subsequently applied, they can now be checked across all applicable IV pages within the system.
Track Changes
After Track Changes is enabled, editing your template will not immediately check for changes across all pages. Instead, when you're happy with the currently generated IV page, and no warnings are shown, click
Mark as Checked
to see if your changes broke anything on the other IV pages impacted by your template.
Pages Modified
If any changes are detected, the status line will display the difference and the result:
Changes Detected
Take care that your changes don‘t break pages that already had good IV pages. There’s a handy indicator at the top of the page that shows the status of the pages relevant for your template. As long as it's
green
, everything's fine.
Publishing templates
If the Instant View page has been processed successfully, you'll see a
View in Telegram
button in the top right corner – you can use it to view the resulting page in-app.
For your own audience
Note that if you send the resulting
t.me/iv?url=...&rhash=...
link to other Telegram users, they will see an Instant View page built using your template (the
rhash
parameter in the link determines which template is used to create the page). This means that, as a website owner, you can create a template for your page and publish
t.me/iv?url=...
links with the corresponding
rhash
to your Telegram channel — and your subscribers will be able to view your articles in the Instant View format right away.
For all Telegram users
If you'd like your template to become truly public and seen by all users, regardless of the link they get, the template will need to be approved by the Telegram team.
And that‘s it, you’re now ready to move on to the
full instant view documentation
.
Don't forget that you can also check out our
.
Source googleweblight.com