mirror of
https://github.com/MarshalX/telegram-crawler.git
synced 2024-11-24 08:16:34 +01:00
146 lines
8.9 KiB
HTML
146 lines
8.9 KiB
HTML
<!DOCTYPE html>
|
||
<html class="">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>Creating Custom Cloud Themes</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta property="description" content="Official Telegram apps support custom cloud themes as of version 5.11. Everyone is welcome to create and share their themes.…">
|
||
<meta property="og:title" content="Creating Custom Cloud Themes">
|
||
<meta property="og:image" content="">
|
||
<meta property="og:description" content="Official Telegram apps support custom cloud themes as of version 5.11. Everyone is welcome to create and share their themes.…">
|
||
<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?230" 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">Creating Custom Cloud Themes</h1>
|
||
|
||
<div id="dev_page_content"><p>Official Telegram apps support <a href="https://telegram.org/blog/scheduled-reminders-themes#custom-cloud-themes">custom cloud themes</a> as of version <strong>5.11</strong>. Everyone is welcome to create and share their themes.</p>
|
||
<h3><a class="anchor" name="creating-a-theme" href="#creating-a-theme"><i class="anchor-icon"></i></a>Creating a theme</h3>
|
||
<p>You can use the <a href="https://themes.contest.com/"><strong>Online Theme Editor</strong></a> (use a <strong>VPN</strong> if it is blocked in your country) to create new Telegram themes from scratch or edit existing ones. Simply log in with your Telegram account and pick a platform to start <strong>editing</strong> the relevant theme file – or <strong>import</strong> an existing theme.</p>
|
||
<ul>
|
||
<li>Set a <strong>name</strong> for your theme using the <code>name</code> attribute</li>
|
||
<li>Set colors for elements using <strong>hex codes</strong> or the <strong>color picker</strong></li>
|
||
<li>Press ‘Save and apply theme’ to <strong>push changes</strong> to all users of your theme</li>
|
||
</ul>
|
||
<h3><a class="anchor" name="checking-your-theme-in-app" href="#checking-your-theme-in-app"><i class="anchor-icon"></i></a>Checking your theme in-app</h3>
|
||
<p>Once you have <strong>saved</strong> a theme for the first time, Telegram will send you a message with its <a href="#publishing-your-theme">sharing link</a>. Open the link in the app to switch to your theme.</p>
|
||
<p>You can always switch to your theme in <em>Settings > Chat Settings</em>. On iOS and MacOS native app – <em>Settings > Appearance</em>.</p>
|
||
<h3><a class="anchor" name="publishing-your-theme" href="#publishing-your-theme"><i class="anchor-icon"></i></a>Publishing your theme</h3>
|
||
<p>Each theme has a <code>t.me/addtheme</code> <strong>link</strong> which people can use to switch to your theme. You can choose a beautiful short link (e.g., <a href="https://t.me/addtheme/desert"><a href="https://t.me/addtheme/desert">https://t.me/addtheme/desert</a></a>) by changing the <code>shortname</code> attribute. If you add support for multiple platforms, the same link can be used for setting your theme on <strong>all</strong> of them.</p>
|
||
<h3><a class="anchor" name="updating-your-theme" href="#updating-your-theme"><i class="anchor-icon"></i></a>Updating your theme</h3>
|
||
<p>Your theme gets <strong>updated automatically</strong> for all its users whenever you save and apply changes.</p>
|
||
<h3><a class="anchor" name="including-a-chat-background" href="#including-a-chat-background"><i class="anchor-icon"></i></a>Including a chat background</h3>
|
||
<p>Your themes can include a <a href="https://telegram.org/blog/backgrounds-2-0">custom wallpaper</a>. To do this, simply go to <em>Settings > Chat Settings > Chat Background</em>. On iOS and MacOS native app – <em>Settings > Appearance > Chat Background</em>.</p>
|
||
<p>Open any background and tap the sharing button in the top right corner, then copy its <code>t.me/bg/...</code> link. In the theme file, set this link as the value of the <code>wallpaper</code> attribute.</p>
|
||
<p>For Telegram Desktop, if you want to make the background <strong>tiled</strong>, add <code>?mode=tiled</code> at the end of the link. For example:</p>
|
||
<pre><code>wallpaper: t.me/bg/-jI7lnO3DFABAAAA1vXcFaZP_Vo?mode=tiled</code></pre>
|
||
<h3><a class="anchor" name="creating-themes-in-app" href="#creating-themes-in-app"><i class="anchor-icon"></i></a>Creating themes in-app</h3>
|
||
<p>If you prefer a more WYSIWYG approach, try creating themes using the in-app tools for customizing appearance. Telegram for <a href="https://telegra.ph/Create-Theme-Android-FAQ">Android</a> and <a href="https://telegra.ph/Create-Theme-Desktop-FAQ">Telegram Desktop</a> have advanced in-app theme editors. Telegram for iOS and MacOS allow choosing a custom accent color from the color wheel and a background, then saving the result as a custom theme.</p>
|
||
<p>Once you have saved a new theme in any of the apps, it also becomes accessible in the <a href="https://themes.contest.com/">online editor</a>.</p>
|
||
<p><strong>Read more</strong></p>
|
||
<ul>
|
||
<li><a href="https://telegra.ph/Create-Theme-Android-FAQ">Android Theme Editor</a></li>
|
||
<li><a href="https://telegra.ph/Create-Theme-Desktop-FAQ">Telegram Desktop Theme Editor</a></li>
|
||
</ul>
|
||
</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?46"></script>
|
||
|
||
<script>backToTopInit("Go up");
|
||
removePreloadInit();
|
||
</script>
|
||
</body>
|
||
</html>
|
||
|