mirror of
https://github.com/MarshalX/telegram-crawler.git
synced 2024-11-30 04:03:06 +01:00
267 lines
20 KiB
HTML
267 lines
20 KiB
HTML
<!DOCTYPE html>
|
||
<html class="">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>Telegram Stickers</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta property="description" content="All users can create, send and share custom artwork using Telegram's open platform for stickers and emoji. Stickers take…">
|
||
<meta property="og:title" content="Telegram Stickers">
|
||
<meta property="og:image" content="">
|
||
<meta property="og:description" content="All users can create, send and share custom artwork using Telegram's open platform for stickers and emoji. Stickers take…">
|
||
<link rel="icon" type="image/svg+xml" href="/img/website_icon.svg?4">
|
||
<link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon.png">
|
||
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
|
||
<link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">
|
||
<link rel="alternate icon" href="/img/favicon.ico" type="image/x-icon" />
|
||
<link href="/css/bootstrap.min.css?3" rel="stylesheet">
|
||
|
||
<link href="/css/telegram.css?236" 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"></div>
|
||
<h1 id="dev_page_title">Telegram Stickers</h1>
|
||
|
||
<div id="dev_page_content"><p>All users can create, send and share custom artwork using Telegram's <strong>open platform</strong> for stickers and <a href="#custom-emoji">emoji</a>. Stickers take many forms – from <strong>basic images</strong> to stunning <strong>vector animations</strong>.</p>
|
||
<p>To start building your own custom sets, click below:</p>
|
||
<ul>
|
||
<li><strong>Creating Stickers</strong><ul>
|
||
<li><a href="#creating-animations">Animated</a></li>
|
||
<li><a href="#video-stickers-and-emoji">Video</a></li>
|
||
<li><a href="#static-stickers-and-emoji">Static</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><strong>Uploading Stickers</strong><ul>
|
||
<li><a href="#using-the-stickers-bot">How to Upload</a></li>
|
||
<li><a href="#importing-stickers-from-other-apps">Importing from other apps</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<h3><a class="anchor" name="animated-stickers-and-emoji" href="#animated-stickers-and-emoji"><i class="anchor-icon"></i></a>Animated Stickers and Emoji</h3>
|
||
<p>Telegram stickers and emoji can move with smooth <strong>60 FPS animations</strong> to bring your characters to life in high resolution.</p>
|
||
<blockquote>
|
||
<p>Animations require Telegram's unique <strong>.TGS format</strong> – click <a href="#video-stickers-and-emoji">here</a> for <strong>Video Stickers and Emoji</strong> made in <strong>.WEBM format</strong>.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="creating-animations" href="#creating-animations"><i class="anchor-icon"></i></a>Creating Animations</h4>
|
||
<p>To create vector-animated stickers and emoji you will need the following:</p>
|
||
<ol>
|
||
<li>Any vector graphics editor that allows exporting vector objects to Adobe After Effects to turn them into animations.</li>
|
||
<li>Adobe After Effects.</li>
|
||
<li>The <a href="https://github.com/TelegramMessenger/bodymovin-extension">Bodymovin-TG</a> plugin, a fork of Bodymovin for Adobe After Effects that can be used to export animations to Telegram's <strong>.TGS format</strong>.</li>
|
||
</ol>
|
||
<blockquote>
|
||
<p>The Lottie-based .TGS format allows for incredibly detailed animations that are <strong>less than 30 KB</strong> in size – six times smaller than the average photo.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="animation-requirements" href="#animation-requirements"><i class="anchor-icon"></i></a>Animation Requirements</h4>
|
||
<ul>
|
||
<li>The canvas size must be <strong>512х512 pixels</strong>.</li>
|
||
<li>Objects must not leave the canvas.</li>
|
||
<li>Animation length must not exceed <strong>3 seconds</strong>.</li>
|
||
<li>All animations must be looped.</li>
|
||
<li>Final file size must not exceed <strong>64 KB</strong> after rendering in Bodymovin.</li>
|
||
<li>All animations must run at <strong>60 Frames Per Second</strong>.</li>
|
||
<li>You <strong>must not</strong> use the following Adobe After Effects functionality when animating your artwork: <em>Auto-bezier keys, Expressions, Masks, Layer Effects, Images, Solids, Texts, 3D Layers, Merge Paths, Star Shapes, Gradient Strokes, Repeaters, Time Stretching, Time Remapping, Auto-Oriented Layers</em>.</li>
|
||
</ul>
|
||
<h4><a class="anchor" name="uploading-animations" href="#uploading-animations"><i class="anchor-icon"></i></a>Uploading Animations</h4>
|
||
<p>When your files are ready, send the <code>/newanimated</code> command to the <a href="https://t.me/Stickers">@Stickers</a> bot – then send it the .TGS files.</p>
|
||
<p>To upload emoji, send <code>/newemojipack</code> to <a href="https://t.me/Stickers">@Stickers</a>. The requirements for .TGS stickers and emoji are <strong>exactly the same</strong>.</p>
|
||
<p>Your set will need an icon. Icons for your sets must be <strong>100x100 pixels</strong>, with a looped animation not exceeding 3 seconds.</p>
|
||
<hr>
|
||
<h3><a class="anchor" name="video-stickers-and-emoji" href="#video-stickers-and-emoji"><i class="anchor-icon"></i></a>Video Stickers and Emoji</h3>
|
||
<p>Stickers and emoji can also be built with <strong>.WEBM</strong> – an open-source format that is compatible with many graphics editors to create high-detail images. Requires <a href="https://telegram.org/apps">Telegram 8.5</a> or higher.</p>
|
||
<!--
|
||
> This format also allows you to [import custom stickers](https://core.telegram.org/import-stickers) to Telegram from other apps.
|
||
-->
|
||
|
||
<h4><a class="anchor" name="creating-videos" href="#creating-videos"><i class="anchor-icon"></i></a>Creating Videos</h4>
|
||
<p>To create stickers and emoji from video files, you only need <a href="https://core.telegram.org/stickers/webm-vp9-encoding">editing software</a> that lets you export your project as a <strong>.WEBM video file</strong>.</p>
|
||
<h4><a class="anchor" name="video-requirements" href="#video-requirements"><i class="anchor-icon"></i></a>Video Requirements</h4>
|
||
<blockquote>
|
||
<p>See this <a href="https://core.telegram.org/stickers/webm-vp9-encoding">Encoding .WEBM with VP9 Guide</a> for details </p>
|
||
</blockquote>
|
||
<ul>
|
||
<li>For stickers, one side must be exactly <strong>512 pixels</strong> in size – the other side can be 512 pixels <strong>or less</strong>.</li>
|
||
<li>For emoji, the video must be exactly <strong>100x100 pixels</strong> in size</li>
|
||
<li>Video duration must not exceed <strong>3 seconds</strong>.</li>
|
||
<li>Frame rate can be up to <strong>30 FPS</strong>.</li>
|
||
<li>Video should be looped for optimal user experience.</li>
|
||
<li>Video size should not exceed <strong>256 KB</strong>. </li>
|
||
<li>Video must be in .WEBM format encoded with the <strong>VP9 codec</strong>.</li>
|
||
<li>Video must have <strong>no audio stream</strong>.</li>
|
||
</ul>
|
||
<h4><a class="anchor" name="uploading-videos" href="#uploading-videos"><i class="anchor-icon"></i></a>Uploading Videos</h4>
|
||
<p>Once your stickers are ready, send the <code>/newvideo</code> command to the <a href="https://t.me/Stickers">@Stickers</a> bot – then send it the .WEBM files.</p>
|
||
<p>To upload emoji, send <code>/newemojipack</code> to <a href="https://t.me/Stickers">@Stickers</a>. Note that video emoji need to be a <a href="#video-requirements">smaller resolution</a> than stickers.</p>
|
||
<p>Your set will need a .WEBM icon. Icons for video sticker sets must be <strong>100x100 pixels</strong>, with a looped animation not exceeding 3 seconds.</p>
|
||
<hr>
|
||
<h3><a class="anchor" name="static-stickers-and-emoji" href="#static-stickers-and-emoji"><i class="anchor-icon"></i></a>Static Stickers and Emoji</h3>
|
||
<p>Turn your favorite drawings and memes into packs of images that are easily to share and access on any device.</p>
|
||
<h4><a class="anchor" name="creating-images" href="#creating-images"><i class="anchor-icon"></i></a>Creating Images</h4>
|
||
<p>To create static stickers and emoji for Telegram, you only need an image editor that lets you export in <strong>.PNG</strong> or <strong>.WEBP</strong> format.</p>
|
||
<h4><a class="anchor" name="image-requirements" href="#image-requirements"><i class="anchor-icon"></i></a>Image Requirements</h4>
|
||
<ul>
|
||
<li>For stickers, one side must be exactly <strong>512 pixels</strong> in size – the other side can be 512 pixels <strong>or less</strong>.</li>
|
||
<li>For emoji, images must be exactly <strong>100x100 pixels</strong> in size.</li>
|
||
<li>The image file must be in either .PNG or .WEBP format.</li>
|
||
</ul>
|
||
<blockquote>
|
||
<p>Tip: a transparent background, white stroke and black shadow effect will make your sticker stand out.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="uploading-images" href="#uploading-images"><i class="anchor-icon"></i></a>Uploading Images</h4>
|
||
<p>Once your stickers are ready, start a chat with the <a href="https://t.me/Stickers">@Stickers</a> bot and send the command <code>/newpack</code>. Your sticker set can also have a <strong>custom icon</strong> – a <strong>100x100 pixel image</strong> in .PNG or .WEBP format.</p>
|
||
<p>To upload emoji, send <code>/newemojipack</code> to <a href="https://t.me/Stickers">@Stickers</a>. Note that static emoji need to be a <a href="#image-requirements">smaller resolution</a> than stickers.</p>
|
||
<blockquote>
|
||
<p>For more info about using the <a href="https://t.me/Stickers">@Stickers</a> bot, click <a href="#using-the-stickers-bot">here</a>.</p>
|
||
</blockquote>
|
||
<h3><a class="anchor" name="custom-emoji" href="#custom-emoji"><i class="anchor-icon"></i></a>Custom Emoji</h3>
|
||
<p>As of version 8.9 released in August 2022, Telegram apps support <a href="https://telegram.org/blog/custom-emoji">custom emoji</a>.<br>Emoji use the same technology as stickers, making it very easy to convert your art to <strong>both formats</strong>. Check out the <a href="#video-requirements">video</a> and <a href="#image-requirements">image</a> sections for details on the different size requirements.<br>To upload them, use the <code>/newemojipack</code> command in <a href="https://t.me/stickers">@Stickers</a>. </p>
|
||
<blockquote>
|
||
<p>Everyone can create new custom emoji, however, adding and using custom sets is currently an exclusive <a href="https://t.me/premium">feature</a> of <a href="https://telegram.org/blog/700-million-and-premium">Telegram Premium</a> users.</p>
|
||
</blockquote>
|
||
<hr>
|
||
<h3><a class="anchor" name="using-the-stickers-bot" href="#using-the-stickers-bot"><i class="anchor-icon"></i></a>Using the @Stickers Bot</h3>
|
||
<p>Publishing and <a href="#editing-a-sticker-pack">editing</a> sticker packs is <strong>simple</strong> and <strong>automated</strong>, thanks to the <a href="https://t.me/Stickers">@Stickers</a> bot. It can also show you <a href="#sticker-stats">detailed stats</a> for stickers and packs.</p>
|
||
<h4><a class="anchor" name="publishing-a-sticker-pack" href="#publishing-a-sticker-pack"><i class="anchor-icon"></i></a>Publishing a Sticker Pack</h4>
|
||
<p>Once you open the bot, press the <strong>Start button</strong> or send <code>/start</code>. The bot will reply, describing its different commands. It will walk you through step by step, but here's a quick guide:</p>
|
||
<ul>
|
||
<li>Open the <a href="https://t.me/TelegramTips/283">bot menu</a> in the message bar and select the <code>/newpack</code> command to start uploading <a href="#uploading-images">static stickers</a>. For <a href="#uploading-animations">animated stickers</a> use <code>/newanimated</code>, or <code>/newvideo</code> for <a href="#uploading-videos">video stickers</a>.</li>
|
||
<li>Give your sticker pack a <strong>name</strong> – this name will appear <strong>as the title</strong> for your pack in the sticker panel.</li>
|
||
<li>Send your first sticker file – an <a href="#static-stickers-and-emoji">image file</a>, <a href="#animated-stickers-and-emoji">.TGS file</a>, or <a href="#video-stickers-and-emoji">.WEBM file</a>. Using one of the <a href="https://telegram.org/apps#desktop-apps">Desktop</a> or <a href="https://telegram.org/apps#web-apps">Web apps</a> is <strong>strongly recommended</strong>.</li>
|
||
<li>Choose an <strong>emoji</strong> that corresponds to your sticker – this lets users quickly find it with <a href="https://t.me/TelegramTips/294">sticker suggestions</a>.</li>
|
||
<li>Continue uploading all your sticker files.</li>
|
||
<li>When you're done uploading, send the <code>/publish</code> command.</li>
|
||
<li>Set an icon for your pack – <a href="#static-stickers-and-emoji">static sticker</a> packs can <code>/skip</code> this step, but it is required for <a href="#animated-stickers-and-emoji">animated</a> or <a href="#video-stickers-and-emoji">video stickers</a>.</li>
|
||
<li>Choose a <strong>short name</strong> for your sticker pack – it will be used to create a <strong>shareable link</strong> for the pack like <a href="https://t.me/addstickers/HotCherry">t.me/addstickers/HotCherry</a>. Congratulations! Your stickers are ready for the world.</li>
|
||
</ul>
|
||
<blockquote>
|
||
<p>After your pack is finished, you can send <code>/start</code> again to see the full list of commands, or use the bot menu to create another pack, <a href="#editing-a-sticker-pack">edit an existing pack</a>, or <a href="#sticker-stats">see statistics</a>.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="editing-a-sticker-pack" href="#editing-a-sticker-pack"><i class="anchor-icon"></i></a>Editing a Sticker Pack</h4>
|
||
<p>Once you've created <a href="#publishing-a-sticker-pack">one or more packs</a>, you can <strong>add</strong>, <strong>edit</strong> or <strong>replace stickers</strong> in your existing sets.</p>
|
||
<ul>
|
||
<li>Use <code>/addsticker</code> if you have more artwork you'd like to add to a set. Choose one of your packs from the list – the upload process is <a href="#publishing-a-sticker-pack">exactly the same</a> as before.</li>
|
||
<li>Use <code>/editsticker</code> to <strong>change the emoji</strong> you assigned to a sticker – select the pack and sticker, or simply send the intended sticker from your panel.</li>
|
||
<li>Use <code>/replacesticker</code> if you want to swap out an older sticker for an updated version.</li>
|
||
<li>Use <code>/ordersticker</code> to <strong>change the order</strong> of stickers in your pack. Choose the pack and one of the stickers, then choose another sticker to appear before it (to the left) in the panel.</li>
|
||
<li>Use <code>/delsticker</code> to <strong>remove a sticker</strong> from the pack – you can always use <code>/addsticker</code> to add it again if you change your mind.</li>
|
||
<li>Use <code>/seticon</code> to set an icon for your pack or to <strong>change the icon</strong>. Static sticker packs without a custom icon will use the first sticker as its icon.</li>
|
||
</ul>
|
||
<blockquote>
|
||
<p>Edits to your sticker packs may take up to an hour to update for all users.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="sticker-stats" href="#sticker-stats"><i class="anchor-icon"></i></a>Sticker Stats</h4>
|
||
<p>There are a number of commands that let you <strong>see statistics</strong> for your stickers – here's what they all do:</p>
|
||
<ul>
|
||
<li><code>/packstats</code> shows how many times your pack was <strong>used</strong>, <strong>installed</strong> and <strong>removed</strong> – both recently and overall.</li>
|
||
<li><code>/stats</code> shows how many times an <strong>individual sticker</strong> has been sent.</li>
|
||
<li><code>/top</code> shows the most popular stickers from <strong>all your packs</strong>.</li>
|
||
<li><code>/packtop</code> shows your most popular sticker packs and their <strong>individual stats</strong>.</li>
|
||
<li><code>/topbypack</code> shows the top stickers from a <strong>specific sticker pack</strong>.</li>
|
||
<li><code>/packusagetop</code> shows your most popular packs by <strong>recent usage</strong>.</li>
|
||
</ul>
|
||
<blockquote>
|
||
<p>You can filter the results of <code>/top</code>, <code>/packtop</code>, <code>/topbypack</code> and <code>/packusagetop</code>. For example <code>/top 20</code> would show your top 20 stickers, and <code>/topbypack -5</code> would show the 5 least popular stickers from a pack.</p>
|
||
</blockquote>
|
||
<h3><a class="anchor" name="importing-stickers-from-other-apps" href="#importing-stickers-from-other-apps"><i class="anchor-icon"></i></a>Importing Stickers From Other Apps</h3>
|
||
<p>Developers can build apps to automate importing stickers using Telegram’s API. With these tools, users can instantly bring their favorite stickers to Telegram.</p>
|
||
<h4><a class="anchor" name="for-developers" href="#for-developers"><i class="anchor-icon"></i></a>For Developers</h4>
|
||
<p>As of version 7.8, Telegram apps support a simple API for importing stickers. Developers can use this to <strong>build apps</strong> or <strong>add tools</strong> to apps that let users instantly transfer stickers to Telegram – or create custom stickers from photos or videos.</p>
|
||
<blockquote>
|
||
<p>Click <a href="https://core.telegram.org/import-stickers#sticker-formats">here</a> for more information about developing apps for importing stickers.</p>
|
||
</blockquote>
|
||
<h4><a class="anchor" name="for-users" href="#for-users"><i class="anchor-icon"></i></a>For Users</h4>
|
||
<p>Users can find apps that allow them to import stickers or quickly <strong>generate their own</strong>. They can also easily <a href="#publishing-a-sticker-pack">publish custom stickers</a> with the <a href="https://t.me/Stickers">@Stickers</a> bot using <a href="#static-stickers-and-emoji">.PNG</a>, <a href="#static-stickers-and-emoji">.WEBP</a> or <a href="#video-stickers-and-emoji">.WEBM</a> files for stickers from other apps.</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/privacy">Privacy</a></li>
|
||
<li><a href="//telegram.org/press">Press</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/android">Android</a></li>
|
||
<li><a href="//telegram.org/dl/web">Mobile Web</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="//core.telegram.org/">Platform</a></h5>
|
||
<ul>
|
||
<li><a href="//core.telegram.org/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="//core.telegram.org/">Platform</a></h5>
|
||
</div>
|
||
<div class="footer_column">
|
||
<h5><a href="//telegram.org/press">Press</a></h5>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="/js/main.js?47"></script>
|
||
|
||
<script>backToTopInit("Go up");
|
||
removePreloadInit();
|
||
</script>
|
||
</body>
|
||
</html>
|
||
|