telegram-crawler/data/core.telegram.org/widgets/post.html
2022-03-18 19:48:38 +00:00

240 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html class="">
<head>
<meta charset="utf-8">
<title>Post Widget</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="description" content="You can embed messages from public groups and channels anywhere. Heres what an embed of a Telegram message looks like when…">
<meta property="og:title" content="Post Widget">
<meta property="og:image" content="https://core.telegram.org/file/811140747/166d/MNEJA3BlETo.107862/6fe98d36f382b03091">
<meta property="og:description" content="You can embed messages from public groups and channels anywhere. Heres what an embed of a Telegram message looks like when…">
<link rel="shortcut icon" href="/favicon.ico?4" type="image/x-icon" />
<link href="/css/bootstrap.min.css?3" rel="stylesheet">
<link href="/css/bootstrap-extra.css?2" rel="stylesheet">
<link href="/css/core-widgets.css?1" rel="stylesheet">
<link href="/css/telegram.css?224" rel="stylesheet" media="screen">
<style>
</style>
</head>
<body class="preload">
<div class="dev_page_wrap">
<div class="dev_page_head navbar navbar-static-top navbar-tg">
<div class="navbar-inner">
<div class="container clearfix">
<ul class="nav navbar-nav navbar-right hidden-xs"><li class="navbar-twitter"><a href="https://twitter.com/telegram" target="_blank" data-track="Follow/Twitter" onclick="trackDlClick(this, event)"><i class="icon icon-twitter"></i><span> Twitter</span></a></li></ul>
<ul class="nav navbar-nav">
<li><a href="//telegram.org/">Home</a></li>
<li class="hidden-xs"><a href="//telegram.org/faq">FAQ</a></li>
<li class="hidden-xs"><a href="//telegram.org/apps">Apps</a></li>
<li class=""><a href="/api">API</a></li>
<li class=""><a href="/mtproto">Protocol</a></li>
<li class=""><a href="/schema">Schema</a></li>
</ul>
</div>
</div>
</div>
<div class="container clearfix">
<div class="dev_page">
<div id="dev_page_content_wrap" class=" ">
<div class="dev_page_bread_crumbs"><ul class="breadcrumb clearfix"><li><a href="/widgets" >Widgets</a></li><i class="icon icon-breadcrumb-divider"></i><li><a href="/widgets/post" >Post Widget</a></li></ul></div>
<h1 id="dev_page_title">Post Widget</h1>
<div id="dev_page_content"><p>You can <strong>embed messages from public groups and channels</strong> anywhere. Heres what an embed of a Telegram message looks like when included on a web page:</p>
<div><br>
<script async src="https://telegram.org/js/telegram-widget.js?1" data-telegram-post="durov/68" data-width="100%"></script>
<br><br>
</div>
<p>To get the HTML-code for embedding a message, just <strong>open its t.me link</strong> (e.g., <a href="https://t.me/durov/43">t.me/durov/43</a>) in a web browser and click <strong>&lt; &gt; EMBED</strong>:</p>
<div class="blog_image_wrap">
<a href="/file/811140747/166d/MNEJA3BlETo.107862/6fe98d36f382b03091" target="_blank"><img src="/file/811140747/166d/MNEJA3BlETo.107862/6fe98d36f382b03091" title="Login on external website" /></a>
</div>
<h3><a class="anchor" name="configure-widget" href="#configure-widget"><i class="anchor-icon"></i></a>Configure widget</h3>
<p>You can choose more options using the form below.</p>
<p><form class="form-horizontal form-telegram clearfix" id="post_widget_config">
<div class="form-group">
<label class="col-md-3 control-label">Link to post:</label>
<div class="col-md-6">
<div class="textfield-item">
<input id="post_link" name="post_link" type="text" class="form-control" placeholder="link to a public post, e.g. https://t.me/telegram/83">
<div class="textfield-item-underline"></div>
<span class="textfield-item-error" id="post_link_error"></span>
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Width:</label>
<div class="col-md-6">
<div class="textfield-item" style="width: 50px;">
<input id="width" name="width" type="text" class="form-control" placeholder="100%" maxlength="4">
<div class="textfield-item-underline"></div>
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Author Photo:</label>
<div class="col-md-6">
<label class="radio-item radio-item-block">
<input type="radio" class="radio" name="author_photo" value="" checked />
<span class="radio-input ripple-handler"><span class="ripple-mask"><span class="ripple"></span></span><span class="radio-input-icon"></span></span><span class="radio-label">Auto</span>
</label>
<label class="radio-item radio-item-block">
<input type="radio" class="radio" name="author_photo" value="true" />
<span class="radio-input ripple-handler"><span class="ripple-mask"><span class="ripple"></span></span><span class="radio-input-icon"></span></span><span class="radio-label">Always show</span>
</label>
<label class="radio-item radio-item-block">
<input type="radio" class="radio" name="author_photo" value="false" />
<span class="radio-input ripple-handler"><span class="ripple-mask"><span class="ripple"></span></span><span class="radio-input-icon"></span></span><span class="radio-label">Always hide</span>
</label>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Accent color:</label>
<div class="col-md-6">
<div class="widget-accent-colors">
<label class="widget-accent-color-item">
<input type="radio" class="radio" name="color" value="default" checked />
<div class="widget-color-circle"></div>
<div class="widget-color-label">Default</div>
</label>
<label class="widget-accent-color-item" data-color="13B4C6" data-bg-color="13C5D9" data-dark-color="39C4E8">
<input type="radio" class="radio" name="color" value="13B4C6" />
<div class="widget-color-circle" style="background-color: #13C5D9;"></div>
<div class="widget-color-label">Cyan</div>
</label>
<label class="widget-accent-color-item" data-color="29B127" data-bg-color="4CB94E" data-dark-color="72E350">
<input type="radio" class="radio" name="color" value="29B127" />
<div class="widget-color-circle" style="background-color: #4CB94E;"></div>
<div class="widget-color-label">Green</div>
</label>
<label class="widget-accent-color-item" data-color="CA9C0E" data-bg-color="E8B824" data-dark-color="F0B138">
<input type="radio" class="radio" name="color" value="CA9C0E" />
<div class="widget-color-circle" style="background-color: #E8B824;"></div>
<div class="widget-color-label">Yellow</div>
</label>
<label class="widget-accent-color-item" data-color="E22F38" data-bg-color="F34750" data-dark-color="F95C54">
<input type="radio" class="radio" name="color" value="E22F38" />
<div class="widget-color-circle" style="background-color: #F34750;"></div>
<div class="widget-color-label">Red</div>
</label>
<label class="widget-accent-color-item" data-color="343638" data-bg-color="343638" data-dark-color="FFFFFF" data-text="Black" data-dark-text="White">
<input type="radio" class="radio" name="color" value="343638" />
<div class="widget-color-circle" style="background-color: #343638;"></div>
<div class="widget-color-label">Black</div>
</label>
<label class="widget-accent-color-item">
<input type="radio" class="radio" name="color" value="custom">
<div class="widget-color-circle widget-color-circle-custom" style="color: #F646A4;"></div>
<div class="widget-color-label widget-color-label-custom">Custom</div>
<div class="textfield-item widget-accent-color-field-item">
<input class="form-control widget-accent-color-field" name="customcolor" type="text" autocomplete="off" value="F646A4" maxlength="6">
<div class="textfield-item-underline"></div>
</div>
</label>
</div>
<label class="checkbox-item checkbox-item-block">
<input type="checkbox" class="checkbox" name="dark" value="1" />
<span class="checkbox-input ripple-handler"><span class="ripple-mask"><span class="ripple"></span></span><span class="checkbox-input-icon"></span></span><span class="checkbox-label">Dark theme</span>
</label>
</div>
</div>
<div class="form-group">
<label for="embed_code" class="col-md-3 control-label">Embed Code:</label>
<div class="col-md-6">
<textarea id="embed_code" class="form-control embed_code" rows="5" readonly onclick="this.select();"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-1 col-md-10">
<div class="widget_container row" id="widget_container"></div>
</div>
</div>
</form></p>
</div>
</div>
</div>
</div>
<div class="footer_wrap">
<div class="footer_columns_wrap footer_desktop">
<div class="footer_column footer_column_telegram">
<h5>Telegram</h5>
<div class="footer_telegram_description"></div>
Telegram is a cloud-based mobile and desktop messaging app with a focus on security and speed.
</div>
<div class="footer_column">
<h5><a href="//telegram.org/faq">About</a></h5>
<ul>
<li><a href="//telegram.org/faq">FAQ</a></li>
<li><a href="//telegram.org/blog">Blog</a></li>
<li><a href="//telegram.org/jobs">Jobs</a></li>
</ul>
</div>
<div class="footer_column">
<h5><a href="//telegram.org/apps#mobile-apps">Mobile Apps</a></h5>
<ul>
<li><a href="//telegram.org/dl/ios">iPhone/iPad</a></li>
<li><a href="//telegram.org/dl/android">Android</a></li>
<li><a href="//telegram.org/dl/wp">Windows Phone</a></li>
</ul>
</div>
<div class="footer_column">
<h5><a href="//telegram.org/apps#desktop-apps">Desktop Apps</a></h5>
<ul>
<li><a href="//desktop.telegram.org/">PC/Mac/Linux</a></li>
<li><a href="//macos.telegram.org/">macOS</a></li>
<li><a href="//telegram.org/dl/web">Web-browser</a></li>
</ul>
</div>
<div class="footer_column footer_column_platform">
<h5><a href="/">Platform</a></h5>
<ul>
<li><a href="/api">API</a></li>
<li><a href="//translations.telegram.org/">Translations</a></li>
<li><a href="//instantview.telegram.org/">Instant View</a></li>
</ul>
</div>
</div>
<div class="footer_columns_wrap footer_mobile">
<div class="footer_column">
<h5><a href="//telegram.org/faq">About</a></h5>
</div>
<div class="footer_column">
<h5><a href="//telegram.org/blog">Blog</a></h5>
</div>
<div class="footer_column">
<h5><a href="//telegram.org/apps">Apps</a></h5>
</div>
<div class="footer_column">
<h5><a href="/">Platform</a></h5>
</div>
<div class="footer_column">
<h5><a href="https://twitter.com/telegram" target="_blank" data-track="Follow/Twitter" onclick="trackDlClick(this, event)">Twitter</a></h5>
</div>
</div>
</div>
</div>
<script src="/js/main.js?43"></script>
<script src="/js/jquery.min.js?1"></script>
<script src="/js/jquery-ui.min.js?1"></script>
<script src="/js/bootstrap.min.js?1"></script>
<script src="/js/core-widgets.js?1"></script>
<script>PostWidget.init({"default_link":"https:\/\/t.me\/telegram\/83","link_error":"Invalid post link","widget_script":"https:\/\/telegram.org\/js\/telegram-widget.js?18"});
backToTopInit("Go up");
removePreloadInit();
</script>
</body>
</html>