Реклама мешает? Идти Без рекламы Сегодня 

Генератор шаблона электронной почты на языке HTML

РазработчикТекст

ВХОД

Автоматический процесс

Заголовок

Используется для электронной почты тега и отображения предварительного просмотра. </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailPreheader">Предзаголовок</label> <div class="input-group"> <input type="text" name="ioEmailPreheader" id="ioEmailPreheader" class="form-control" placeholder="Быстрый гайд и то, что нужно сделать дальше." aria-label="Быстрый гайд и то, что нужно сделать дальше." value="Here is everything you need to get started." > </div> <small class="form-text form__help-text text-muted"> Краткое описание, отображаемое после заголовка в большинстве ящиков электронной почты. </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailFont">Семейство шрифтов</label> <div class="input-group"> <select class="custom-select" id="ioEmailFont" name="ioEmailFont"> <option value="system" selected>Системный / без шрифта</option> <option value="helvetica" >Готика / Ариал</option> <option value="georgia" >Георгия / шрифт-семейство</option> <option value="courier" >Курьер / монospace</option> </select> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailBrandColor">Цвет бренда</label> <div class="input-group"> <input type="color" name="ioEmailBrandColor" id="ioEmailBrandColor" class="form-control" data-coloris value="#464aff" > </div> <small class="form-text form__help-text text-muted"> Используется для кнопок и акцентов. </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailBgColor">Цвет фона</label> <div class="input-group"> <input type="color" name="ioEmailBgColor" id="ioEmailBgColor" class="form-control" data-coloris value="#f4f4f7" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailTextColor">Цвет текста</label> <div class="input-group"> <input type="color" name="ioEmailTextColor" id="ioEmailTextColor" class="form-control" data-coloris value="#333333" > </div> </div> <p class="h5 blue mb-3">Блок заголовка</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailHeaderEnabled" name="ioEmailHeaderEnabled" checked > <label class="custom-control-label" for="ioEmailHeaderEnabled">Включить блок заголовка</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeaderLogo">Текст логотипа</label> <div class="input-group"> <input type="text" name="ioEmailHeaderLogo" id="ioEmailHeaderLogo" class="form-control" placeholder="Название вашей марки или продукта" aria-label="Название вашей марки или продукта" value="Acme" data-rules="[{"name":"ioEmailHeaderEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeaderTagline">Слоган</label> <div class="input-group"> <input type="text" name="ioEmailHeaderTagline" id="ioEmailHeaderTagline" class="form-control" placeholder="Опциональный короткий слоган" aria-label="Опциональный короткий слоган" value="Build things that matter" data-rules="[{"name":"ioEmailHeaderEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">Блок главного изображения</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailHeroEnabled" name="ioEmailHeroEnabled" checked > <label class="custom-control-label" for="ioEmailHeroEnabled">Включить блок главного изображения</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeroTitle">Заголовок главного изображения</label> <div class="input-group"> <input type="text" name="ioEmailHeroTitle" id="ioEmailHeroTitle" class="form-control" value="Welcome aboard, friend!" data-rules="[{"name":"ioEmailHeroEnabled","value":["on"]}]" > </div> </div> <div class="form-group"> <label for="ioEmailHeroSubtitle">Подзаголовок главного изображения</label> <div class="input-group"> <textarea class="form-control" name="ioEmailHeroSubtitle" id="ioEmailHeroSubtitle" rows="2" data-rules="[{"name":"ioEmailHeroEnabled","value":["on"]}]" >Thanks for signing up. Your account is ready and we have a few things to help you get the most out of it.</textarea> </div> </div> <p class="h5 blue mb-3">Блок изображения</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailImageEnabled" name="ioEmailImageEnabled" > <label class="custom-control-label" for="ioEmailImageEnabled">Включить блок изображения</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailImageUrl">URL-адрес изображения</label> <div class="input-group"> <input type="url" name="ioEmailImageUrl" id="ioEmailImageUrl" class="form-control" placeholder="https://example.com/hero.png" aria-label="https://example.com/hero.png" value="https://placehold.co/560x280/png?text=Hero+Image" data-rules="[{"name":"ioEmailImageEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailImageAlt">Текст альтернативного описания изображения</label> <div class="input-group"> <input type="text" name="ioEmailImageAlt" id="ioEmailImageAlt" class="form-control" value="Product screenshot" data-rules="[{"name":"ioEmailImageEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">Блок основного текста</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailBodyEnabled" name="ioEmailBodyEnabled" checked > <label class="custom-control-label" for="ioEmailBodyEnabled">Включить блок основного текста</label> </div> </div> <div class="form-group"> <label for="ioEmailBodyText">Основной текст</label> <div class="input-group"> <textarea class="form-control" name="ioEmailBodyText" id="ioEmailBodyText" rows="4" data-rules="[{"name":"ioEmailBodyEnabled","value":["on"]}]" >Click the button below to finish setting up your account. It only takes a couple of minutes and you will be up and running in no time. If you have any questions, reply to this email and someone on our team will get back to you.</textarea> </div> <small class="form-text form__help-text text-muted"> Каждая пустая строка начинает новый абзац. </small> </div> <p class="h5 blue mb-3">Блок кнопки</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailButtonEnabled" name="ioEmailButtonEnabled" checked > <label class="custom-control-label" for="ioEmailButtonEnabled">Включить кнопку с призывом к действию</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailButtonLabel">Метка кнопки</label> <div class="input-group"> <input type="text" name="ioEmailButtonLabel" id="ioEmailButtonLabel" class="form-control" value="Get Started" data-rules="[{"name":"ioEmailButtonEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailButtonUrl">URL кнопки</label> <div class="input-group"> <input type="url" name="ioEmailButtonUrl" id="ioEmailButtonUrl" class="form-control" value="https://example.com/getting-started" data-rules="[{"name":"ioEmailButtonEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">Разделитель и подвал</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailDividerEnabled" name="ioEmailDividerEnabled" checked > <label class="custom-control-label" for="ioEmailDividerEnabled">Включить разделитель между основным текстом и подвалом</label> </div> </div> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailFooterEnabled" name="ioEmailFooterEnabled" checked > <label class="custom-control-label" for="ioEmailFooterEnabled">Включить блок подвала</label> </div> </div> <div class="form-group"> <label for="ioEmailFooterText">Текст подвала</label> <div class="input-group"> <textarea class="form-control" name="ioEmailFooterText" id="ioEmailFooterText" rows="2" data-rules="[{"name":"ioEmailFooterEnabled","value":["on"]}]" >You are receiving this email because you signed up at example.com.</textarea> </div> </div> <div class="form-group"> <label for="ioEmailFooterAddress">Адрес подвала</label> <div class="input-group"> <textarea class="form-control" name="ioEmailFooterAddress" id="ioEmailFooterAddress" rows="2" data-rules="[{"name":"ioEmailFooterEnabled","value":["on"]}]" >Acme Inc. - 123 Market Street, Suite 100, San Francisco, CA 94105</textarea> </div> </div> <input type="hidden" name="trp-form-language" value="ru"/></form> </div> <div class="card-footer"> <form action="#" id="html-email-template-generator-in_footer" autocomplete="off" onsubmit="return false;" class="html-email-template-generator d-flex flex--rtl gap-2" data-trp-original-action="#"> <button class="btn btn-default" data-toggle="tooltip" title="Очистить входные данные и сбросить все параметры" data-name="ioClearInputs" onclick="IOTools.resetForm('form.form-in'); return false;" > <span class="btn__icons"> <i class="ti ti-refresh" data-no-translation=""></i> </span> Перезагрузить </button> <input type="hidden" name="trp-form-language" value="ru"/></form> </div> </div> </div> <div class="col-md-6" data-cols="6"> <div class="card sticky-top"> <div class="card-header"> <div class="h3 card-title font-weight-bold">ВЫХОД</div> <div class="card-tools"> <span data-toggle="tooltip" data-placement="left" title="Этот инструмент работает прямо на вашем устройстве или браузере. Не волнуйтесь, он не будет отправлять ваши входные данные через интернет и ничего не будет хранить на наших серверах." class="badge badge-pill badge-success"><i class="ti ti-device-desktop" data-no-translation=""></i> Клиентская сторона</span> <div class="dropdown d-inline-block ml-1"> <a href="#" role="button" data-toggle="dropdown" aria-expanded="false" aria-label="Настройки инструмента"> <i class="ti ti-settings" data-no-translation=""><i class="ti ti-chevron-down small" data-no-translation=""></i></i> </a> <div class="dropdown-menu"><a href="#" class="dropdown-item" onclick="IOTools.toggleFullwidth();return false;"><i class="ti ti-arrow-autofit-width" data-no-translation=""></i> <span>Переключить ширину</span></a><a href="#" class="dropdown-item" data-card-widget="maximize"><i class="ti ti-maximize" data-no-translation=""></i> <span>Вход/выход из полноэкранного режима</span></a></div> </div> </div> </div> <div class="card-body"> <form action="#" id="html-email-template-generator-out" autocomplete="off" onsubmit="return false;" class="html-email-template-generator form-out" data-trp-original-action="#"> <div class="form-group" id="ioEmailPreview" data-name="ioEmailPreview"> <div class="email-preview-empty">Настройте блоки слева, чтобы увидеть живую предварительную версию здесь.</div> </div> <div class="form-group"> <label for="ioEmailHtml">Инлайн-HTML письма с CSS</label> <div class="input-group"> <pre class="form-control" ><code data-name="ioEmailHtml" id="ioEmailHtml" class="language-html" data-no-translation="" ></code></pre> <div class="input-group-append"> <button class="btn btn-primary" type="button" onclick="IOTools.copyCode('#ioEmailHtml'); return false;" data-toggle="tooltip" title="Копировать HTML-код" aria-label="Копировать HTML-код" > <i class="ti ti-copy" data-no-translation=""></i> </button> <button class="btn btn-primary" type="button" onclick="IOTools.downloadEmailHtml(); return false;" data-toggle="tooltip" title="Скачать .html" aria-label="Скачать .html" > <i class="ti ti-download" data-no-translation=""></i> </button> </div> </div> <small class="form-text form__help-text text-muted"> Готовый HTML с условиями MSO и встроенными стилями для клиентов электронной почты. </small> </div> <input type="hidden" name="trp-form-language" value="ru"/></form> </div> </div> </div> </div> <script defer> setTimeout(() => { const highlight = () => document.querySelectorAll('pre code').forEach(el => hljs.highlightElement(el)); document.readyState === 'complete' ? highlight() : document.addEventListener('DOMContentLoaded', highlight); }, 1000); </script> <div class="aw aw-below_tool text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">Реклама · <a tabindex="-1" target="_blank" href="https://iotools.cloud/ru/pricing/" title="Перейти к рекламе без рекламы" style="text-decoration: underline;color: #9f9f9f;">УДАЛИТЬ?</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741343828950-4_123456"] { min-width: 300px; min-height: 50px; } } @media only screen and (min-width: 900px) and (min-height: 0px) { div[id^="bsa-zone_1741343828950-4_123456"] { min-width: 468px; min-height: 90px; } } </style> <div id="bsa-zone_1741343828950-4_123456"></div> </div> <div class="card card--related card--has-list"> <div class="card-header card-header--heading"> <h2 class="card-title" data-card-widget="collapse"><i class="ti ti-circles-relation" data-no-translation=""></i> Связанные инструменты</h2> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="Переключить заголовок" title="Переключать"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pb-md-3 pt-0"> <p>Некоторые другие инструменты, похожие на <b>Генератор шаблона электронной почты на языке HTML</b> которые могут оказаться вам полезными.</p> <div class="row"> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/css-nesting-converter/" class="card-image card-image--icon" aria-label="CSS Nesting Converter"> <i class="ti blue" style="--icon-hex:'\ebcc'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/ru/tool/css-nesting-converter/"> <h3 class="h5 mb-0 black">CSS Nesting Converter<span class="io-badge io-badge--new" style="background-color: #f59e0b30;color:#f59e0b" data-toggle="tooltip" title="Новый" data-content="New"></span></h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>Разработчик</span><span data-tag-slug="text" class="badge badge-pill mr-2 tag-ico tag-ico--green"><i class="ti ti-tag" data-no-translation=""></i>Текст</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="Закладка"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="337280" data-siteid></span> <button class="io-favorite-button" aria-label="Закладка" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/api-secret-scanner-redactor/" class="card-image card-image--icon" aria-label="API Secret Scanner & Redactor"> <i class="ti blue" style="--icon-hex:'\ed58'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/ru/tool/api-secret-scanner-redactor/"> <h3 class="h5 mb-0 black">API Secret Scanner & Redactor</h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>Разработчик</span><span data-tag-slug="security" class="badge badge-pill mr-2 tag-ico tag-ico--yellow"><i class="ti ti-tag" data-no-translation=""></i>Безопасность</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="Закладка"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="334040" data-siteid></span> <button class="io-favorite-button" aria-label="Закладка" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/xml-to-yaml-converter/" class="card-image card-image--icon" aria-label="XML to YAML Converter"> <i class="ti blue" style="--icon-hex:'\f1f4'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/ru/tool/xml-to-yaml-converter/"> <h3 class="h5 mb-0 black">XML to YAML Converter</h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="data" class="badge badge-pill mr-2 tag-ico tag-ico--gray"><i class="ti ti-tag" data-no-translation=""></i>Данные</span><span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>Разработчик</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="Закладка"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="333132" data-siteid></span> <button class="io-favorite-button" aria-label="Закладка" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> </div> </div> </div> <div class="card generic-content" id="tool-doc"> <div class="card-header card-header--heading"> <h2 class="card-title" data-card-widget="collapse"><i class="ti ti-book" data-no-translation=""></i> Гид</h2> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="Переключить заголовок" title="Переключать"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pt-0"> <div class="toc-wrapper position-relative" style="overflow: hidden;border-radius: 10px"> <div class="position-absolute toc-image"> <img decoding="async" class="exclude--lazy-load" src="https://iotools.cloud/wp-content/uploads/2026/06/html-email-template-generator-featured-400x512.jpg" alt="Генератор шаблонов HTML-письма" title="Генератор шаблонов HTML-письма 1"> </div> <div class="toc-content position-relative" style="z-index: 1"> </div> </div> <h3 class="wp-block-heading">Генератор шаблона электронной почты на языке HTML</h3> <p>Создайте адаптивный HTML-электронный письмо с встроенными стилями, собирая модульные блоки — заголовок, главный блок, изображение, текст тела, кнопку, разделитель и подвал — с живым предварительным просмотром на рабочем столе и мобильном устройстве. Результат использует таблицы и условия MSO, чтобы корректно отображался в Outlook, Gmail, Apple Mail и других почтовых клиентах.</p> <h3 class="wp-block-heading">Как использовать</h3> <ul class="wp-block-list"> <li>Установите заголовок письма, предзаголовок, семейство шрифтов и бренд, цвет фона и текста на верхней части формы.</li> <li>Включите или отключите нужные блоки и заполните содержимое каждого блока — логотип и слоган, заголовок и подзаголовок главного блока, URL изображения, абзацы текста, кнопка с призывом к действию, разделитель и подвал.</li> <li>Следите за обновлением живого предварительного просмотра справа. Переключайтесь между шириной рабочего стола и мобильного устройства, чтобы проверить оба варианта отображения.</li> <li>Нажмите <strong>Копировать HTML-код</strong> чтобы получить встроенный CSS HTML, или <strong>Скачать .html</strong> чтобы сохранить его как файл, готовый к вставке в вашу систему доставки писем, отправителя или инструмент для кампаний.</li> </ul> <h3 class="wp-block-heading">Возможности</h3> <ul class="wp-block-list"> <li><strong>Модульные блоки</strong> — Включайте или отключайте заголовок, главный блок, изображение, текст тела, кнопку, разделитель и подвал независимо.</li> <li><strong>Встроенный CSS вывод</strong> — Все стили встроены и основаны на таблицах, поэтому нет внешних стилей и нет проблем с отображением в Outlook или Gmail.</li> <li><strong>Условия MSO</strong> — Включены специальные элементы для Microsoft Outlook (движок Word), чтобы сохранить правильные ширины и интервалы на Windows Outlook.</li> <li><strong>Живой предварительный просмотр</strong> — Предварительный просмотр на рабочем столе (600 пикселей) и мобильном устройстве (360 пикселей) отображается в изолированном iframe.</li> <li><strong>Настройка бренда</strong> — Цветовые палитры для акцентов, фона и текста, а также четыре шаблона шрифтов.</li> <li><strong>Один клик для экспорта</strong> — Скопируйте HTML в буфер обмена или скачайте готовый к отправке файл <code data-no-translation="">.html</code> файл.</li> <li><strong>Работает в вашем браузере</strong> — Ничего не загружается или не сохраняется. Генерация происходит полностью на стороне клиента.</li> </ul> </p> </div> </div> <div class="card generic-content" id="tool-faq"> <div class="card-header card-header--heading"> <h3 class="card-title" data-card-widget="collapse"><i class="ti" data-no-translation=""></i> Часто задаваемые вопросы</h3> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="Переключить заголовок" title="Переключать"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pt-0"> <div id="rank-math-faq" class="rank-math-block"> <ol class="rank-math-list"> <li id="faq-question-1780668428000" class="rank-math-list-item"> <h4 class="rank-math-question">Почему HTML-письма используют таблицы вместо современных систем flexbox или grid?</h4> <div class="rank-math-answer"> <p>Многие почтовые клиенты — особенно Microsoft Outlook на Windows — отображают сообщения с помощью движка Word, который поддерживает очень ограниченный набор CSS и игнорирует flexbox, grid и большинство правил позиционирования. Вложенные таблицы остаются единственной системой разметки, которая корректно отображается во всех клиентах, включая Gmail, Outlook, Apple Mail, Yahoo и мобильные почтовые сервисы. Именно поэтому производственные HTML-письма выглядят как веб-макеты из 2003 года: это наименьший общий знаменатель, который выживает в каждом движке отображения.</p> </div> </li> <li id="faq-question-1780668428001" class="rank-math-list-item"> <h4 class="rank-math-question">Что такое MSO-условия и почему письма нуждаются в них?</h4> <div class="rank-math-answer"> <p>MSO-условия — это HTML-комментарии, которые интерпретируются только Microsoft Outlook (движок Word). Они выглядят так: <code data-no-translation=""></code> и позволяют отправлять разметку или стили, специально настроенные для Outlook, без влияния на другие клиенты. Они часто используются для установки фиксированной ширины контейнера с помощью "призрачной таблицы", исправления VML для кнопок и фонов и отключения функций, которые Outlook отображает неправильно. Без них разметка часто сжимается или растягивается неправильно в Outlook, даже если она выглядит идеально во всех других клиентах.</p> </div> </li> <li id="faq-question-1780668428002" class="rank-math-list-item"> <h4 class="rank-math-question">Почему CSS в письмах должен быть встроен, а не объявлен в теге style?</h4> <div class="rank-math-answer"> <p>Несколько крупных почтовых клиентов — особенно Gmail в прошлом — удаляют <code data-no-translation=""><style></code> блоки или применяют их неравномерно, особенно на мобильных устройствах и в пересылаемых письмах. Встраивание перемещает каждое правило на элемент, к которому оно относится через атрибут <code data-no-translation="">style</code> , который уважается всеми клиентами. Стоит отметить, что это приводит к увеличению объёма кода и сложности поддержки, поэтому существуют инструменты — включая этот генератор — для автоматического встраивания стилей из более высокого уровня шаблона.</p> </div> </li> <li id="faq-question-1780668428003" class="rank-math-list-item"> <h4 class="rank-math-question">Что такое предзаголовок и как он влияет на открытие писем?</h4> <div class="rank-math-answer"> <p>Предзаголовок — это краткий фрагмент текста, который отображается после заголовка в большинстве предпросмотров ящика. По умолчанию он берётся из первого видимого текста в теле письма, что часто является вступлением или шаблоном, который не использует этот слот. Включение скрытого элемента предзаголовка в начале HTML позволяет точно контролировать, что отображается там. Хорошо написанный предзаголовок дополняет заголовок и коррелирует с более высокими показателями открытия в большинстве тестов A/B, проведённых крупными системами доставки писем.</p> </div> </li> </ol> </div> </div> </div> </div> <div class="col aw--col-300 side-content"> <a href="https://iotools.cloud/ru/pricing/" class="info-box mb-3" style="background-color: var(--io-color-blue, #464aff);letter-spacing:0;min-height:70px;padding-top:5px;"> <div class="info-box-content"> <span class="info-box-text text-sm white">Хотите убрать рекламу?</span> <span class="info-box-number white" style="font-weight: 500;"> <span class="white"><u>Откажитесь от рекламы сегодня</u></span> </span> </div> <span class="info-box-icon white" style="width:50px"> <i class="ti" data-no-translation=""></i> </span> </a> <div class="card card-body pb-0"> <h2 class="h5 blue mb-1"> <i class="ti" data-no-translation=""></i> Установите наши расширения </h2> <p class="mb-2"> Добавьте инструменты ввода-вывода в свой любимый браузер для мгновенного доступа и более быстрого поиска </p> <div class="text-center pt-1 pb-3"> <div id="io-browser-extension-d41d8cd9" class="d-none d-lg-block"> <div class="io-browser-extension-container d-flex justify-content-center"> <a href="https://chromewebstore.google.com/detail/io-tools-quick-access/ngfigjoligkblljadlbojinhoiofkdld" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="Добавить в Chrome" style="cursor: pointer;"> в <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/chrome.svg" width="18" height="18" alt="Расширение Chrome" class="img-fluid"> </a> <a href="https://microsoftedge.microsoft.com/addons/detail/io-tools-quick-access/daapkanhnnjodjpobfmkopolagbkcccb" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="Добавить в Edge" style="cursor: pointer;"> в <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/edge.svg" width="18" height="18" alt="Расширение края" class="img-fluid"> </a> <a href="https://addons.mozilla.org/en-US/firefox/addon/iotools-quick-access/" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="Добавить в Firefox" style="cursor: pointer;"> в <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/firefox.svg" width="18" height="18" alt="Расширение Firefox" class="img-fluid"> </a> <a href="https://addons.opera.com/en/extensions/details/io-tools-quick-access/" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="Добавить в Оперу" style="cursor: pointer;"> в <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/opera.svg" width="18" height="18" alt="Расширение Opera" class="img-fluid"> </a> <style> #io-browser-extension-d41d8cd9 .io-browser-extension-container { gap: 10px; margin-left: -1px; } #io-browser-extension-d41d8cd9 .io-browser-extension-btn { display: flex; padding: 3px 5px 1px 6px;; background-color: white; border: 1px solid #dee2e6; border-radius: 12px; text-decoration: none; transition: all 0.2s ease; font-size: 12px;; color: #000!important; align-items: center; justify-content: center; gap: 2px; flex-grow: 1;; } #io-browser-extension-d41d8cd9 .io-browser-extension-btn img { transform: translateY(-1px); } #io-browser-extension-d41d8cd9 .io-browser-extension-btn:hover { background-color: #f8f9fa; border-color: #ced4da; color: #333; text-decoration: none; } </style> </div> </div> </div> </div> <div class="card card-body pb-0"> <h2 class="h5 blue mb-1"> <i class="ti" data-no-translation="">恵</i><a href="https://scoreboard.iotools.cloud/" target="_blank" rel="noopener"> Табло результатов прибыло!</a> </h2> <p class="mb-2"> <a href="https://scoreboard.iotools.cloud/" target="_blank" rel="noopener">Табло результатов</a> — это интересный способ следить за вашими играми, все данные хранятся в вашем браузере. Скоро появятся новые функции! </p> </div> <div class="aw aw-side_content_1_desktop text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">Реклама · <a tabindex="-1" target="_blank" href="https://iotools.cloud/ru/pricing/" title="Перейти к рекламе без рекламы" style="text-decoration: underline;color: #9f9f9f;">УДАЛИТЬ?</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342473519-9_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342473519-9_123456"] { min-width: 200px; min-height: 250px; } } </style> <div id="bsa-zone_1741342473519-9_123456"></div> </div> <div class="card card-body pb-0"> <div class="d-flex justify-content-between align-items-center mb-3"> <h2 class="h5 blue mb-0"><i class="ti" data-no-translation=""></i> Подписаться на новости</h2> <a class="text-muted small blue" href="https://iotools.cloud/ru/tags/must-try/"><u>все</u></a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/imagekit/background-remover/" class="card-image card-image--icon" aria-label="Удаление фона"> <i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i> </a> <span class="card-image card-image--icon" data-toggle="tooltip" title="Набор инструментов: ImageKit" ><i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i></span> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/imagekit/background-remover/"> Удаление фона </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/ai-image-editor/" class="card-image card-image--icon" aria-label="Редактор изображений на базе ИИ"> <i class="ti blue" style="--icon-hex:'\fa32'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/ai-image-editor/"> Редактор изображений на базе ИИ<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="Тулс" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/ai-image-generator/" class="card-image card-image--icon" aria-label="Генератор изображений на основе ИИ"> <i class="ti blue" style="--icon-hex:'\ffb0'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/ai-image-generator/"> Генератор изображений на основе ИИ </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/imagekit/" class="card-image card-image--icon" aria-label="ImageKit"> <i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/imagekit/"> ImageKit<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="Тулс" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/pdf-converter/compress-pdf/" class="card-image card-image--icon" aria-label="PDF-компрессор"> <i class="ti blue" style="--icon-hex:'\ed44'" data-no-translation=""></i> </a> <span class="card-image card-image--icon" data-toggle="tooltip" title="Набор инструментов: PDF-конвертер" ><i class="ti blue" style="--icon-hex:'\f7ac'" data-no-translation=""></i></span> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/pdf-converter/compress-pdf/"> PDF-компрессор </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/image-converter/" class="card-image card-image--icon" aria-label="Конвертер изображений"> <i class="ti blue" style="--icon-hex:'\fd9f'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/image-converter/"> Конвертер изображений<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="Тулс" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/one-time-link/" class="card-image card-image--icon" aria-label="Одноразовая ссылка"> <i class="ti blue" style="--icon-hex:'\f7bd'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/one-time-link/"> Одноразовая ссылка </a> </div> </div> <div class="aw aw-side_content_2_desktop text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">Реклама · <a tabindex="-1" target="_blank" href="https://iotools.cloud/ru/pricing/" title="Перейти к рекламе без рекламы" style="text-decoration: underline;color: #9f9f9f;">УДАЛИТЬ?</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342696932-0_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342696932-0_123456"] { min-width: 200px; min-height: 250px; } } </style> <div id="bsa-zone_1741342696932-0_123456"></div> </div> <div class="card card-body pb-0"> <div class="d-flex justify-content-between align-items-center mb-3"> <h2 class="h5 blue mb-0"> <i class="ti" data-no-translation=""></i> Новые поступления </h2> <a class="text-muted small blue" href="https://iotools.cloud/ru/tools/"><u>все</u></a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/certificate-transparency-log-lookup/" class="card-image card-image--icon" aria-label="Certificate Transparency Log Lookup"> <i class="ti blue" style="--icon-hex:'\ed76'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/certificate-transparency-log-lookup/"> Certificate Transparency Log Lookup </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/hsts-preload-header-generator/" class="card-image card-image--icon" aria-label="HSTS Preload Header Generator"> <i class="ti blue" style="--icon-hex:'\ed58'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/hsts-preload-header-generator/"> HSTS Preload Header Generator </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/argon2-hash-generator/" class="card-image card-image--icon" aria-label="Argon2 Hash Generator"> <i class="ti blue" style="--icon-hex:'\eac7'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/argon2-hash-generator/"> Argon2 Hash Generator </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/cidr-overlap-checker/" class="card-image card-image--icon" aria-label="CIDR Overlap / Subnet Conflict Checker"> <i class="ti blue" style="--icon-hex:'\edff'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/cidr-overlap-checker/"> CIDR Overlap / Subnet Conflict Checker </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/css-nesting-converter/" class="card-image card-image--icon" aria-label="CSS Nesting Converter"> <i class="ti blue" style="--icon-hex:'\ebcc'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/css-nesting-converter/"> CSS Nesting Converter </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/oauth-authorization-url-builder/" class="card-image card-image--icon" aria-label="OAuth 2.0 Authorization URL Builder"> <i class="ti blue" style="--icon-hex:'\eade'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/oauth-authorization-url-builder/"> OAuth 2.0 Authorization URL Builder </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/ru/tool/har-to-curl-extractor/" class="card-image card-image--icon" aria-label="HAR to cURL Commands Extractor"> <i class="ti blue" style="--icon-hex:'\ebef'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/ru/tool/har-to-curl-extractor/"> HAR to cURL Commands Extractor </a> </div> <p class="small text-muted mb-3 text-center"><b>Обновлять:</b> Наш <a href="https://iotools.cloud/ru/tool/certificate-transparency-log-lookup/" class="text-muted"><u>последний инструмент</u></a> was added on Июн 26, 2026</p> </div> <div class="aw aw-dashboard_sidebar text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">Реклама · <a tabindex="-1" target="_blank" href="https://iotools.cloud/ru/pricing/" title="Перейти к рекламе без рекламы" style="text-decoration: underline;color: #9f9f9f;">УДАЛИТЬ?</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741781122639-0_123456"] { min-width: 300px; min-height: 50px; } } @media only screen and (min-width: 900px) and (min-height: 0px) { div[id^="bsa-zone_1741781122639-0_123456"] { min-width: 200px; min-height: 200px; } } </style> <div id="bsa-zone_1741781122639-0_123456"></div> </div> <div class="card card-body io-no-scrollbar" style="max-height:700px;"> <h2 class="h5 blue mb-3"><i class="ti" data-no-translation=""></i> новости <small class="black">с техническими моментами</small></h2> <div data-load-more-id="side-news" class="exclude--translation" data-no-translation=""> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> </div> <script class="exclude--lazy-load" async> // Immediately load news from session storage document.querySelectorAll('[data-load-more-id="side-news"]').forEach(function(element) { const dailyNewsHtml = sessionStorage.getItem(`dailyNewsHtml`); if (dailyNewsHtml) { element.innerHTML = dailyNewsHtml; } }); </script> <p class="text-center"> <button class="btn--load-more" data-load-more="{"target":"side-news","postType":"wprss_feed_item","offset":3}">Покажи мне больше!</button> </p> </div> <h2 class="h5 blue text-right mt-5"><i class="ti ti-heart-handshake" data-no-translation=""></i> Примите участие</h2> <div class="text-right mb-4"> <p>Помогите нам продолжать предоставлять ценные бесплатные инструменты</p> <div class="d-lg-flex justify-content-end"> <a href="https://buymeacoffee.com/iotools" target="_blank" rel="noopener"><img width="180" height="50" src="https://iotools.cloud/wp-content/themes/iotools/assets/images/yellow-button.png" alt="Купи мне кофе" class="img-fluid"></a> </div> </div> <div class="aw aw-side_content_sticky_desktop sticky-top text-center"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">Реклама · <a tabindex="-1" target="_blank" href="https://iotools.cloud/ru/pricing/" title="Перейти к рекламе без рекламы" style="text-decoration: underline;color: #9f9f9f;">УДАЛИТЬ?</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342751312-1_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342751312-1_123456"] { min-width: 120px; min-height: 600px; } } </style> <div id="bsa-zone_1741342751312-1_123456"></div> </div> </div> </div> </div> </main>  <footer class="main-footer text-sm text-center text-xl-left d-flex flex-xl-nowrap flex-column-reverse flex-xl-row"> <span>Copyright © 2026 <a href="https://iotools.cloud/ru/" class="exclude--translation" data-no-translation=""><u>iotools.cloud</u></a>. Все права защищены.</span>  <ul class="navbar-nav d-flex flex-row ml-xl-auto justify-content-center flex-wrap"> <li class="nav-item"> <a href="https://iotools.cloud/ru/" class="text-muted">Дом</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/ru/about/" class="text-muted">О</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/ru/contact/" class="text-muted">Контакт</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/ru/pricing/" class="text-muted">Ценообразование</a> </li> <li class="nav-item blue mb-2 mb-xl-0"> • </li> <li class="nav-item"><a href="https://iotools.cloud/ru/community-tools/" rel="nofollow" class="text-muted">Инструменты сообщества</a></li> <li class="nav-item"><a href="https://iotools.cloud/ru/journal/" class="text-muted">Журнал Хаб</a></li> <li class="nav-item blue mb-2 mb-xl-0"> • </li> <li class="nav-item"><a href="https://iotools.cloud/ru/privacy-policy/" class="text-muted">политика конфиденциальности</a></li> <li class="nav-item"><a href="https://iotools.cloud/ru/terms-of-service/" class="text-muted">Условия обслуживания</a></li> <li class="nav-item"><a href="https://iotools.statuspage.io/" target="_blank" rel="noopener" class="text-muted">Состояние системы</a></li> <li class="nav-item"><a href="https://iotools.cloud/ru/sitemap/" class="text-muted">Карта сайта</a></li> <li class="nav-item blue mb-2 mb-xl-0 d-none d-lg-block"> • </li> <li class="d-block w-100 d-lg-none"></li> <li class="nav-item"><a href="https://x.com/io_tools" target="_blank" rel="noopener" class="text-muted" aria-label="Х"><i class="ti ti-brand-x" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.facebook.com/iotools.cloud" target="_blank" rel="noopener" class="text-muted" aria-label="Фейсбук"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.youtube.com/@io-tools" target="_blank" rel="noopener" class="text-muted" aria-label="Ютуб"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.tiktok.com/@iotools" target="_blank" rel="noopener" class="text-muted" aria-label="ТикТок"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.linkedin.com/company/io-tools/" target="_blank" rel="noopener" class="text-muted" aria-label="linkedin"><i class="ti ti-brand-linkedin" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.producthunt.com/products/io-tools" target="_blank" rel="noopener" class="text-muted" aria-label="охота за продуктами"><i class="ti ti-brand-producthunt" data-no-translation=""></i></a></li> </ul> </footer> <div class="bsa-gap d-none d-xl-block" style="height: 110px;"> </div> <div class="bsa-gap d-xl-none" style="height: 60px;"> </div> <style> body:has(>.bsa_fixed-leaderboard[style*="display: none"]) .bsa-gap { display: none !important; } </style> </div> <template id="tp-language" data-tp-language="ru_RU"></template><script type="speculationrules"> {"prerender":[{"source":"document","where":{"and":[{"href_matches":"/ru/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/iotools/*","/ru/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prerender, .no-prerender a"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"moderate"}]} </script> <style> #ioEmailHtml { font-size: 12px; line-height: 1.5; max-height: 320px; overflow: auto; } #ioEmailPreview { margin-bottom: 14px; border: 1px solid #ced4da; border-radius: 12px; background-color: #fff; overflow: hidden; min-height: 360px; } #ioEmailPreview .email-preview-empty { color: #6c757d; font-style: italic; padding: 24px 18px; text-align: center; font-family: var(--bs-font-sans-serif), sans-serif; } #ioEmailPreview .email-preview-header { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background-color: #f8f9fa; border-bottom: 1px solid #e9ecef; font-family: var(--bs-font-sans-serif), sans-serif; font-size: 0.8rem; color: #495057; } #ioEmailPreview .email-preview-header strong { font-weight: 600; color: #212529; } #ioEmailPreview .email-preview-toolbar { margin-left: auto; display: flex; gap: 4px; } #ioEmailPreview .email-preview-btn { font-size: 0.75rem; padding: 2px 8px; border: 1px solid #adb5bd; background-color: #fff; border-radius: 4px; cursor: pointer; color: #212529; } #ioEmailPreview .email-preview-btn:hover { background-color: #f1f3f5; } #ioEmailPreview .email-preview-btn.is-active { background-color: #464aff; border-color: #464aff; color: #fff; } #ioEmailPreview iframe { display: block; width: 100%; border: 0; background-color: #fff; transition: max-width 0.15s ease; } #ioEmailPreview .email-preview-stage { background-color: #eef0f3; padding: 12px; } #ioEmailPreview .email-preview-stage iframe { margin: 0 auto; background-color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.08); } </style> <script type="text/javascript" src="https://iotools.cloud/wp-content/plugins/duracelltomi-google-tag-manager/dist/js/gtm4wp-form-move-tracker.js?ver=1.22.3" id="gtm4wp-form-move-tracker-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/plugins/translatepress-multilingual/assets/js/trp-clickable-ls.js?ver=2.9.12" id="trp-clickable-ls-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-includes/js/underscore.min.js?ver=1.13.7" id="underscore-js"></script> <script type="text/javascript" id="theme-js-js-extra"> /* <![CDATA[ */ var IOTools = {"ajaxUrl":"https://iotools.cloud/wp-admin/admin-ajax.php","assetsUrl":"https://iotools.cloud/wp-content/themes/iotools/assets/","homeUrl":"https://iotools.cloud/ru/","isMobile":"","currentPostId":"314379","turnstileSiteKey":"0x4AAAAAABroE5_aI0mWeJ_q","algoliaAppId":"1P44EFZA6Z","algoliaApiKey":"430f43bbda2ef03c2d61fbdf33bae284","urlRequests":"/requests/","creditsCap":"10","pondUploader":null,"tagColors":{"Accessibility":"indigo","AI":"red","arithmetic":"blue","Art":"orange","Backend":"red","base conversion":"blue","Base64":"blue","Beta":"red","Binary":"blue","Calculator":"blue","Character Classes":"blue","Color":"yellow","Couple":"blue","Creator":"blue","Cryptography":"yellow","CSS":"indigo","CSV":"green","Data":"gray","decimal":"blue","Decode":"yellow","Decrypt":"red","Designer":"cyan","Developer":"orange","devops":"blue","DnD":"blue","Education":"lime","Encode":"indigo","Encoding":"blue","Encryption":"blue","evaluation":"blue","Fantasy":"lime","Fiction":"blue","Finance":"green","Frontend":"red","Fun":"violet","Gaming":"blue","Generator":"blue","Git":"blue","Graphics":"red","Health":"orange","hex":"blue","History":"green","HTML":"green","Ideas":"orange","Identity":"lime","Image":"orange","instant calculation":"blue","integer":"blue","IPv6":"blue","Javascript":"orange","JPG":"blue","JSON":"yellow","logarithm":"blue","Lookup":"gray","MAC address":"blue","Magic":"yellow","Markdown":"blue","Marketing":"orange","mask":"blue","Match":"blue","Math":"yellow","MD5":"indigo","Minecraft":"blue","Music":"blue","Must Try":"red","Mythical":"blue","Networking":"blue","number systems":"blue","obfuscate":"blue","octal":"blue","PDF":"yellow","Performance":"green","Planning":"yellow","PNG":"blue","privacy":"blue","Productivity":"green","programming":"blue","Random":"red","Scheduling":"blue","Science":"blue","Security":"yellow","SEO":"orange","Social":"indigo","Sports":"blue","Statistics":"green","string":"blue","SVG":"orange","sysadmin":"blue","Testing":"orange","Text":"green","Time":"blue","trigonometry":"blue","ULA":"blue","Utilities":"blue","Video":"indigo","Wellness":"orange","Wizard":"blue","World":"blue","XML":"orange","YAML":"blue"},"translations":{"copiedDeepLink":"\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043b \u0433\u043b\u0443\u0431\u043e\u043a\u0443\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u0432 \u0431\u0443\u0444\u0435\u0440 \u043e\u0431\u043c\u0435\u043d\u0430!","copiedText":"\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u0432 \u0431\u0443\u0444\u0435\u0440 \u043e\u0431\u043c\u0435\u043d\u0430!","copiedImage":"\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u0432 \u0431\u0443\u0444\u0435\u0440 \u043e\u0431\u043c\u0435\u043d\u0430!","generatedContentAppearsHere":"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0437\u0434\u0435\u0441\u044c...","confirmOverwriteContent":"\u0422\u0435\u043a\u0443\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u043c\u0435\u043d\u0435\u043d?","invalidBase64String":"\u041d\u0435\u0432\u0435\u0440\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430 base64","timeoutReached":"\u0414\u043e\u0441\u0442\u0438\u0433\u043d\u0443\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f \u043d\u0430\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u0445\u0435\u0448\u0430.","allCombinationsTried":"\u0412\u0441\u0435 \u043a\u043e\u043c\u0431\u0438\u043d\u0430\u0446\u0438\u0438 \u043f\u0435\u0440\u0435\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043d\u044b, \u043d\u043e \u0445\u044d\u0448 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d. \u041e\u0442\u0440\u0435\u0433\u0443\u043b\u0438\u0440\u0443\u0439\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0438 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0435\u0449\u0435 \u0440\u0430\u0437.","useThisFont":"\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u044d\u0442\u043e\u0442 \u0448\u0440\u0438\u0444\u0442","noFileTypesDetected":"\u0422\u0438\u043f \u0444\u0430\u0439\u043b\u0430 \u043d\u0435 \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0435\u043d. \u0418\u0441\u0445\u043e\u0434\u043d\u043e\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u043c \u0444\u0430\u0439\u043b\u043e\u043c \u0438\u043b\u0438 \u0441\u0442\u0440\u043e\u043a\u043e\u0439.","noResults":"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u044b.","loadMore":"\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0435","decodedString":"\u0420\u0430\u0441\u0448\u0438\u0444\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430","yes":"\u0414\u0430","no":"\u041d\u0435\u0442","team":"\u041a\u043e\u043c\u0430\u043d\u0434\u0430","detectedFile":"\u041e\u0431\u043d\u0430\u0440\u0443\u0436\u0435\u043d\u043d\u044b\u0439 \u0444\u0430\u0439\u043b","download":"\u0421\u043a\u0430\u0447\u0430\u0442\u044c","converting":"\u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435...","compressing":"\u0421\u0436\u0430\u0442\u0438\u0435...","tapToRemove":"\u041d\u0430\u0436\u043c\u0438\u0442\u0435, \u0447\u0442\u043e\u0431\u044b \u0443\u0434\u0430\u043b\u0438\u0442\u044c","serverUploaded":"\u0417\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043e \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440","validationPassed":"\u041f\u0440\u043e\u0448\u0435\u043b \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443","validationFailed":"\u041d\u0435 \u043f\u0440\u043e\u0439\u0434\u0435\u043d\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430","validationIndependently":"\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e","pokemon":{"generation":"\u041f\u043e\u043a\u043e\u043b\u0435\u043d\u0438\u0435","hp":"\u043b.\u0441.","speed":"\u0421\u043a\u043e\u0440\u043e\u0441\u0442\u044c","attack":"\u0410\u0442\u0430\u043a\u0430","defense":"\u041e\u0431\u043e\u0440\u043e\u043d\u0430","spAttack":"\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u0430\u0442\u0430\u043a\u0430","spDefense":"\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u0437\u0430\u0449\u0438\u0442\u0430"},"browserInfo":{"userAgent":"\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0430\u0433\u0435\u043d\u0442","language":"\u042f\u0437\u044b\u043a","windowSize":"\u0420\u0430\u0437\u043c\u0435\u0440 \u043e\u043a\u043d\u0430","pdfViewerEnabled":"\u041f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0449\u0438\u043a PDF-\u0444\u0430\u0439\u043b\u043e\u0432 \u0432\u043a\u043b\u044e\u0447\u0435\u043d","javascriptEnabled":"Javascript \u0432\u043a\u043b\u044e\u0447\u0435\u043d","cookiesEnabled":"\u0424\u0430\u0439\u043b\u044b cookie \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u044b","browser":"\u0411\u0440\u0430\u0443\u0437\u0435\u0440","browserMajorVersion":"\u041e\u0441\u043d\u043e\u0432\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430","browserVersion":"\u0412\u0435\u0440\u0441\u0438\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430","layoutEngine":"\u0414\u0432\u0438\u0436\u043e\u043a \u043c\u0430\u043a\u0435\u0442\u0430","deviceMemory":"\u041f\u0430\u043c\u044f\u0442\u044c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430","maxTouchPoints":"\u041c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0442\u043e\u0447\u0435\u043a \u043a\u0430\u0441\u0430\u043d\u0438\u044f","screenSize":"\u0420\u0430\u0437\u043c\u0435\u0440 \u044d\u043a\u0440\u0430\u043d\u0430","orientation":"\u041e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u044f","colorDepth":"\u0413\u043b\u0443\u0431\u0438\u043d\u0430 \u0446\u0432\u0435\u0442\u0430","pixelRatio":"\u0421\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435 \u043f\u0438\u043a\u0441\u0435\u043b\u0435\u0439","os":"\u041e\u0421","osVersion":"\u0412\u0435\u0440\u0441\u0438\u044f \u041e\u0421","deviceType":"\u0422\u0438\u043f \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430","deviceVendor":"\u041f\u043e\u0441\u0442\u0430\u0432\u0449\u0438\u043a \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430","deviceModel":"\u041c\u043e\u0434\u0435\u043b\u044c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430"},"splits":"\u0428\u043f\u0430\u0433\u0430\u0442\u044b","noImagesSelected":"\u041f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430, \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u0445\u043e\u0442\u044f \u0431\u044b \u043e\u0434\u0438\u043d \u0444\u0430\u0439\u043b.","errorOccurredAI":"\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442 AI. \u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0435\u0449\u0435 \u0440\u0430\u0437.","errorOccurredExtractText":"\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0438\u0437\u0432\u043b\u0435\u0447\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0444\u0430\u0439\u043b\u0430. \u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0435\u0449\u0435 \u0440\u0430\u0437.","errorOccurredPokemon":"\u041f\u043e\u043a\u0435\u043c\u043e\u043d\u044b, \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u0437\u0430\u0434\u0430\u043d\u043d\u044b\u043c \u043a\u0440\u0438\u0442\u0435\u0440\u0438\u044f\u043c, \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u044b.","errorCannotConvert":"\u041d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u044c","autoComplete":{"Tools":"\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b","Modules":"\u041c\u043e\u0434\u0443\u043b\u0438","SearchForATool":"\u041d\u0430\u0439\u0434\u0438\u0442\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442, \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044e \u0438\u043b\u0438 \u0442\u0435\u0433...","NoToolsFoundForThisQuery":"\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u044b.","SubmitARequest":"\u041f\u043e\u0434\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441","WeWillMakeIt":"\u0438 \u043c\u044b \u0441\u043f\u0440\u0430\u0432\u0438\u043c\u0441\u044f!","CategoriesFilter":"\u0424\u0438\u043b\u044c\u0442\u0440 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0439","NoCategoriesFoundForThisQuery":"\u041f\u043e \u0434\u0430\u043d\u043d\u043e\u043c\u0443 \u0437\u0430\u043f\u0440\u043e\u0441\u0443 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u044b.","TagsFilter":"\u0424\u0438\u043b\u044c\u0442\u0440 \u0442\u0435\u0433\u043e\u0432","NoTagsFoundForThisQuery":"\u0422\u0435\u0433\u0438 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u044b.","ToNavigate":"\u0434\u043b\u044f \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438","ToSelect":"\u0432\u044b\u0431\u0440\u0430\u0442\u044c","ToClose":"\u0437\u0430\u043a\u0440\u044b\u0442\u044c","ToCancel":"\u041e\u0442\u043c\u0435\u043d\u0430"}},"defaultSwatches":["#264653","#2a9d8f","#e9c46a","rgb(244,162,97)","#e76f51","#d62828","navy","#07b","#0096c7","#00b4d880","rgba(0,119,182,0.8)"]}; //# sourceURL=theme-js-js-extra /* ]]> */ </script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/dist/main.min.js?ver=eee286b8e098df42c396cba29264f11c" id="theme-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/dist/modules/61ea48838d56c794fb1748cfb9bebdfd.min.js?ver=fc3340d2aa99d4f53093da055aeb58b0" id="theme-js-61ea48838d56c794fb1748cfb9bebdfd-js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js?ver=eee286b8e098df42c396cba29264f11c" id="highlight-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/assets/libraries/Coloris-0.24.0/dist/coloris.min.js?ver=eee286b8e098df42c396cba29264f11c" id="coloris-js-js"></script> <script id="wp-emoji-settings" type="application/json"> {"baseUrl":"https://s.w.org/images/core/emoji/17.0.2/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/17.0.2/svg/","svgExt":".svg","source":{"concatemoji":"https://iotools.cloud/wp-includes/js/wp-emoji-release.min.js?ver=6.9.1"}} </script> <script type="module"> /* <![CDATA[ */ /*! This file is auto-generated */ const a=JSON.parse(document.getElementById("wp-emoji-settings").textContent),o=(window._wpemojiSettings=a,"wpEmojiSettingsSupports"),s=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const a=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===a[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,a){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!a(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,a){let r;const o=(r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),s=(o.textBaseline="top",o.font="600 32px Arial",{});return e.forEach(e=>{s[e]=t(o,e,n,a)}),s}function r(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}a.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),c.toString(),p.toString()].join(",")+"));",a=new Blob([e],{type:"text/javascript"});const r=new Worker(URL.createObjectURL(a),{name:"wpTestEmojiSupports"});return void(r.onmessage=e=>{i(n=e.data),r.terminate(),t(n)})}catch(e){}i(n=f(s,u,c,p))}t(n)}).then(e=>{for(const n in e)a.supports[n]=e[n],a.supports.everything=a.supports.everything&&a.supports[n],"flag"!==n&&(a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&a.supports[n]);var t;a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&!a.supports.flag,a.supports.everything||((t=a.source||{}).concatemoji?r(t.concatemoji):t.wpemoji&&t.twemoji&&(r(t.twemoji),r(t.wpemoji)))}); //# sourceURL=https://iotools.cloud/wp-includes/js/wp-emoji-loader.min.js /* ]]> */ </script> <script type="text/javascript">(function (undefined) {let scriptOptions={"_localizedStrings":{"redirect_overlay_title":"Hold On","redirect_overlay_text":"You are being redirected to another page,<br>it may take a few seconds.","webview_notification_text":"The selected provider doesn't support embedded browsers!"},"_targetWindow":"prefer-popup","_redirectOverlay":"overlay-with-spinner-and-message","_unsupportedWebviewBehavior":""}; /** * Used when Cross-Origin-Opener-Policy blocked the access to the opener. We can't have a reference of the opened windows, so we should attempt to refresh only the windows that has opened popups. */ window._nslHasOpenedPopup = false; window._nslWebViewNoticeElement = null; window.NSLPopup = function (url, title, w, h) { /** * Cross-Origin-Opener-Policy blocked the access to the opener */ if (typeof BroadcastChannel === "function") { const _nslLoginBroadCastChannel = new BroadcastChannel('nsl_login_broadcast_channel'); _nslLoginBroadCastChannel.onmessage = (event) => { if (window?._nslHasOpenedPopup && event.data?.action === 'redirect') { window._nslHasOpenedPopup = false; const url = event.data?.href; _nslLoginBroadCastChannel.close(); if (typeof window.nslRedirect === 'function') { window.nslRedirect(url); } else { window.opener.location = url; } } }; } const userAgent = navigator.userAgent, mobile = function () { return /\b(iPhone|iP[ao]d)/.test(userAgent) || /\b(iP[ao]d)/.test(userAgent) || /Android/i.test(userAgent) || /Mobile/i.test(userAgent); }, screenX = window.screenX !== undefined ? window.screenX : window.screenLeft, screenY = window.screenY !== undefined ? window.screenY : window.screenTop, outerWidth = window.outerWidth !== undefined ? window.outerWidth : document.documentElement.clientWidth, outerHeight = window.outerHeight !== undefined ? window.outerHeight : document.documentElement.clientHeight - 22, targetWidth = mobile() ? null : w, targetHeight = mobile() ? null : h, left = parseInt(screenX + (outerWidth - targetWidth) / 2, 10), right = parseInt(screenY + (outerHeight - targetHeight) / 2.5, 10), features = []; if (targetWidth !== null) { features.push('width=' + targetWidth); } if (targetHeight !== null) { features.push('height=' + targetHeight); } features.push('left=' + left); features.push('top=' + right); features.push('scrollbars=1'); const newWindow = window.open(url, title, features.join(',')); if (window.focus) { newWindow.focus(); } window._nslHasOpenedPopup = true; return newWindow; }; let isWebView = null; function checkWebView() { if (isWebView === null) { function _detectOS(ua) { if (/Android/.test(ua)) { return "Android"; } else if (/iPhone|iPad|iPod/.test(ua)) { return "iOS"; } else if (/Windows/.test(ua)) { return "Windows"; } else if (/Mac OS X/.test(ua)) { return "Mac"; } else if (/CrOS/.test(ua)) { return "Chrome OS"; } else if (/Firefox/.test(ua)) { return "Firefox OS"; } return ""; } function _detectBrowser(ua) { let android = /Android/.test(ua); if (/Opera Mini/.test(ua) || / OPR/.test(ua) || / OPT/.test(ua)) { return "Opera"; } else if (/CriOS/.test(ua)) { return "Chrome for iOS"; } else if (/Edge/.test(ua)) { return "Edge"; } else if (android && /Silk\//.test(ua)) { return "Silk"; } else if (/Chrome/.test(ua)) { return "Chrome"; } else if (/Firefox/.test(ua)) { return "Firefox"; } else if (android) { return "AOSP"; } else if (/MSIE|Trident/.test(ua)) { return "IE"; } else if (/Safari\//.test(ua)) { return "Safari"; } else if (/AppleWebKit/.test(ua)) { return "WebKit"; } return ""; } function _detectBrowserVersion(ua, browser) { if (browser === "Opera") { return /Opera Mini/.test(ua) ? _getVersion(ua, "Opera Mini/") : / OPR/.test(ua) ? _getVersion(ua, " OPR/") : _getVersion(ua, " OPT/"); } else if (browser === "Chrome for iOS") { return _getVersion(ua, "CriOS/"); } else if (browser === "Edge") { return _getVersion(ua, "Edge/"); } else if (browser === "Chrome") { return _getVersion(ua, "Chrome/"); } else if (browser === "Firefox") { return _getVersion(ua, "Firefox/"); } else if (browser === "Silk") { return _getVersion(ua, "Silk/"); } else if (browser === "AOSP") { return _getVersion(ua, "Version/"); } else if (browser === "IE") { return /IEMobile/.test(ua) ? _getVersion(ua, "IEMobile/") : /MSIE/.test(ua) ? _getVersion(ua, "MSIE ") : _getVersion(ua, "rv:"); } else if (browser === "Safari") { return _getVersion(ua, "Version/"); } else if (browser === "WebKit") { return _getVersion(ua, "WebKit/"); } return "0.0.0"; } function _getVersion(ua, token) { try { return _normalizeSemverString(ua.split(token)[1].trim().split(/[^\w\.]/)[0]); } catch (o_O) { } return "0.0.0"; } function _normalizeSemverString(version) { const ary = version.split(/[\._]/); return (parseInt(ary[0], 10) || 0) + "." + (parseInt(ary[1], 10) || 0) + "." + (parseInt(ary[2], 10) || 0); } function _isWebView(ua, os, browser, version, options) { switch (os + browser) { case "iOSSafari": return false; case "iOSWebKit": return _isWebView_iOS(options); case "AndroidAOSP": return false; case "AndroidChrome": return parseFloat(version) >= 42 ? /; wv/.test(ua) : /\d{2}\.0\.0/.test(version) ? true : _isWebView_Android(options); } return false; } function _isWebView_iOS(options) { const document = (window["document"] || {}); if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("fullscreenEnabled" in document || "webkitFullscreenEnabled" in document || false); } function _isWebView_Android(options) { if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("requestFileSystem" in window || "webkitRequestFileSystem" in window || false); } const options = {}, nav = window.navigator || {}, ua = nav.userAgent || "", os = _detectOS(ua), browser = _detectBrowser(ua), browserVersion = _detectBrowserVersion(ua, browser); isWebView = _isWebView(ua, os, browser, browserVersion, options); } return isWebView; } function isAllowedWebViewForUserAgent(provider) { const facebookAllowedWebViews = [ 'Instagram', 'FBAV', 'FBAN' ]; let whitelist = []; if (provider && provider === 'facebook') { whitelist = facebookAllowedWebViews; } const nav = window.navigator || {}, ua = nav.userAgent || ""; if (whitelist.length && ua.match(new RegExp(whitelist.join('|')))) { return true; } return false; } function disableButtonInWebView(providerButtonElement) { if (providerButtonElement) { providerButtonElement.classList.add('nsl-disabled-provider'); providerButtonElement.setAttribute('href', '#'); providerButtonElement.addEventListener('pointerdown', (e) => { if (!window._nslWebViewNoticeElement) { window._nslWebViewNoticeElement = document.createElement('div'); window._nslWebViewNoticeElement.id = "nsl-notices-fallback"; window._nslWebViewNoticeElement.addEventListener('pointerdown', function (e) { this.parentNode.removeChild(this); window._nslWebViewNoticeElement = null; }); const webviewNoticeHTML = '<div class="error"><p>' + scriptOptions._localizedStrings.webview_notification_text + '</p></div>'; window._nslWebViewNoticeElement.insertAdjacentHTML("afterbegin", webviewNoticeHTML); document.body.appendChild(window._nslWebViewNoticeElement); } }); } } window._nslDOMReady(function () { window.nslRedirect = function (url) { if (scriptOptions._redirectOverlay) { const overlay = document.createElement('div'); overlay.id = "nsl-redirect-overlay"; let overlayHTML = ''; const overlayContainer = "<div id='nsl-redirect-overlay-container'>", overlayContainerClose = "</div>", overlaySpinner = "<div id='nsl-redirect-overlay-spinner'></div>", overlayTitle = "<p id='nsl-redirect-overlay-title'>" + scriptOptions._localizedStrings.redirect_overlay_title + "</p>", overlayText = "<p id='nsl-redirect-overlay-text'>" + scriptOptions._localizedStrings.redirect_overlay_text + "</p>"; switch (scriptOptions._redirectOverlay) { case "overlay-only": break; case "overlay-with-spinner": overlayHTML = overlayContainer + overlaySpinner + overlayContainerClose; break; default: overlayHTML = overlayContainer + overlaySpinner + overlayTitle + overlayText + overlayContainerClose; break; } overlay.insertAdjacentHTML("afterbegin", overlayHTML); document.body.appendChild(overlay); } window.location = url; }; let targetWindow = scriptOptions._targetWindow || 'prefer-popup', lastPopup = false; document.addEventListener('click', function (e) { if (e.target) { const buttonLinkElement = e.target.closest('a[data-plugin="nsl"][data-action="connect"]') || e.target.closest('a[data-plugin="nsl"][data-action="link"]'); if (buttonLinkElement) { if (lastPopup && !lastPopup.closed) { e.preventDefault(); lastPopup.focus(); } else { let href = buttonLinkElement.href, success = false; if (href.indexOf('?') !== -1) { href += '&'; } else { href += '?'; } const redirectTo = buttonLinkElement.dataset.redirect; if (redirectTo === 'current') { href += 'redirect=' + encodeURIComponent(window.location.href) + '&'; } else if (redirectTo && redirectTo !== '') { href += 'redirect=' + encodeURIComponent(redirectTo) + '&'; } if (targetWindow !== 'prefer-same-window' && checkWebView()) { targetWindow = 'prefer-same-window'; } if (targetWindow === 'prefer-popup') { lastPopup = NSLPopup(href + 'display=popup', 'nsl-social-connect', buttonLinkElement.dataset.popupwidth, buttonLinkElement.dataset.popupheight); if (lastPopup) { success = true; e.preventDefault(); } } else if (targetWindow === 'prefer-new-tab') { const newTab = window.open(href + 'display=popup', '_blank'); if (newTab) { if (window.focus) { newTab.focus(); } success = true; window._nslHasOpenedPopup = true; e.preventDefault(); } } if (!success) { window.location = href; e.preventDefault(); } } } } }); let buttonCountChanged = false; const googleLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="google"]'); if (googleLoginButtons.length && checkWebView()) { googleLoginButtons.forEach(function (googleLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(googleLoginButton); } else { googleLoginButton.remove(); buttonCountChanged = true; } }); } const facebookLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="facebook"]'); if (facebookLoginButtons.length && checkWebView() && /Android/.test(window.navigator.userAgent) && !isAllowedWebViewForUserAgent('facebook')) { facebookLoginButtons.forEach(function (facebookLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(facebookLoginButton); } else { facebookLoginButton.remove(); buttonCountChanged = true; } }); } const separators = document.querySelectorAll('div.nsl-separator'); if (buttonCountChanged && separators.length) { separators.forEach(function (separator) { const separatorParentNode = separator.parentNode; if (separatorParentNode) { const separatorButtonContainer = separatorParentNode.querySelector('div.nsl-container-buttons'); if (separatorButtonContainer && !separatorButtonContainer.hasChildNodes()) { separator.remove(); } } }) } });})();</script> <div id="io-modal-login" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Требуется вход</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Закрывать"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> Пожалуйста <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/ru/account/"><i class="ti ti-user-circle" data-no-translation=""></i> войти</a> или <a rel="nofollow" href="https://iotools.cloud/ru/register/"><u>зарегистрироваться</u></a> для управления закладками. Это бесплатно! </div> </div> </div> </div> <div id="io-modal-request" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Требуется вход</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Закрывать"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> Пожалуйста <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/ru/account/?redirect_to=https://iotools.cloud/ru/account/request-tool/"><i class="ti ti-user-circle" data-no-translation=""></i> войти</a> или <a rel="nofollow" href="https://iotools.cloud/ru/register/?redirect_to=https://iotools.cloud/ru/account/request-tool/"><u>зарегистрироваться</u></a> чтобы подать заявку на инструмент. Это бесплатно! </div> </div> </div> </div> <div id="io-modal-community" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Требуется вход</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Закрывать"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> Пожалуйста <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/ru/account/?redirect_to=https://iotools.cloud/ru/account/byo/"><i class="ti ti-user-circle" data-no-translation=""></i> войти</a> или <a rel="nofollow" href="https://iotools.cloud/ru/register/?redirect_to=https://iotools.cloud/ru/account/byo/"><u>зарегистрироваться</u></a> чтобы создать свой собственный инструмент. Это бесплатно! <div class="card mt-4 mb-0"> <div class="card-body"> <h5><i class="ti ti-info-circle" data-no-translation=""></i> О Build Your Own (BYO) Builder</h5> <p>Наша функция BYO Builder позволяет вам создавать собственные инструменты без каких-либо знаний в области кодирования. Вы можете:</p> <ul> <li>Создавайте инструменты на базе искусственного интеллекта, используя наш простой интерфейс</li> <li>Поделитесь своими инструментами с сообществом</li> <li>Получайте отзывы и улучшайте свои инструменты</li> <li>Помогите другим решить проблемы с помощью ваших творений</li> </ul> <p class="mb-0">Присоединяйтесь к нашему <a href="https://iotools.cloud/ru/community-tools/"><u>сообщество</u></a> сегодня и начните создавать инструменты, которые изменят мир!</p> </div> </div> </div> </div> </div> </div> <div id="cf-turnstile" data-sitekey="0x4AAAAAABroE5_aI0mWeJ_q" data-appearance="execute"></div> </body> </html>