Содержание
Настройка шрифтов для проекта
TILDA HELP CENTER
Как подключить абсолютно любой шрифт
Шрифты задаются в настройках сайта. Это значит, что параметры (гарнитура, насыщенность, размер, цвет) будут применятся глобально: ко всем блокам на всех страницах сайта. Таким образом поддерживается общий стиль и аккуратность.
Чтобы перейти к настройке шрифтов сайта, перейдите в Настройки сайта → Шрифты и цвета.
Вы увидите галерею шрифтов. Ее можно пролистать и задать шрифт для сайта, нажав на кнопку «Выбрать». Шрифт будет назначен для заголовков и для текста.
Если вы хотите использовать сторонний шрифт или использовать разные шрифты для заголовка и текста, то нажмите на кнопку «Расширенные настройки».
На вкладке Библиотека вы можете выбрать разные шрифты для заголовков сайта и для основного текста. В коллекции находятся более 20 стандартных и премиум-шрифтов от партнеров (type.today, Paratype и Rentafont), которые предоставляются бесплатно при подписке на Тильду. Если вы хотите подключить другие шрифты из библиотеки Rentafont, то перейдите в инструкцию «Как подключить шрифт от Rentafont».
На вкладках Google Fonts, Adobe Fonts и Загрузить шрифт вы можете загрузить шрифт из внешнего источника. Прочитайте подробные статьи ниже:
Google Fonts
Коллекция бесплатных шрифтов от Google
Перейти к инструкции
Загрузить шрифт
Абсолютно любой шрифт в форматах .woff и .woff2
Перейти к инструкции
Adobe Fonts
Большая библиотека компании Adobe
Перейти к инструкции
CSS-файл
Добавление ссылки на CSS-файл на стороннем сервере
Перейти к инструкции
Установка размеров и шрифтов заголовка и текста сайта
Внизу настроек установки шрифта на вкладке «Шрифты и цвета» располагаются настройки стандартного размера, насыщенности и цвета заголовков и текста. Данные параметры устанавливаются глобально ко всем стандартным блокам на сайте, если в них жестко не установлены другие настройки шрифтов.
В стандартных блоках вы можете указать параметры шрифта в настройках блока → Типографика или выделить текст в редакторе и поменять его параметры через верхнюю панель настроек шрифта.
Установка параметров шрифтов через панель настройки текста в редакторе
Установка параметров текстовых элементов через настройки блока → Типографика
Настройки подгрузки шрифтов
По умолчанию текст сайта показывается после того, как подгрузится файл шрифта, это может происходить с определенной задержкой в зависимости от скорости соединения.
В настройках сайта → Шрифты и цвета → Продвинутые настройки вы можете установить настройку показа системного шрифта при загрузке, чтобы текст показывался сразу, но сначала системным шрифтом, а потом тем, который вы выбрали. Это может вызывать короткое мерцание текста и изменение размера текстовых элементов, поэтому используйте эту настройку только если уверены, что так ваш сайт выглядит лучше при загрузке.
Ошибки при подключении шрифтов и варианты решения
Читайте также:
Как выбрать правильный шрифт для сайта и статьи
Руководство, которое поможет выбрать шрифт, не погружаясь в теорию.
Читать статью |
Подключение шрифта к сайту на Тильде
Ни для кого не секрет, что шрифт — один из самых важных составляющих сайта. Именно он, зачастую, может полностью перевернуть дизайн сайта. В поиске вы сможете найти довольно много вариантов шрифтовых пар, как для кириллицы, так и для латиницы.
Давайте вместе рассмотрим всевозможные варианты работы со шрифтами внутри конструктора Тильды.
Чтобы начать работу со шрифтами, для начала нужно перейти в настройки сайта:
Ищите в левой боковой панели вам нужно найти «Шрифт и цвета»:
Переходите и нажимайте на кнопку «Расширенные настройки»:
В открывшемся окне вы найдете вкладки библиотек шрифтов, с помощью которых можно выбрать шрифт или загрузить свой:
О всех вариантах по-порядку.
Стандартные шрифты в Тильде
Во вкладке «Basic Fonts» вы можете выбрать отдельно шрифт для заголовков и для текста. Эти шрифты установятся на ваш сайт по-умолчанию и их можно будет поменять в любой момент на другие в настройках каждого блока.
Вам предоставляется на выбор 26 шрифта. Некоторые из них системные. Какие-то шрифты из библиотеки GoogleFonts. Есть шрифты, которые предоставляются партнером Тильды — Paratype (шрифт отключается, если платная подписка не продлится, в том числе при экспорте сайта).
Как только подобрали нужную шрифтовую пару, сохраняйте настройки, публикуйте все страницы и переходите на ваш сайт, чтоб увидеть все изменения.
Библиотеки шрифтов Adobe fonts и Google fonts
Adobe Fonts
Перейдите на сайт https://fonts.adobe.com/fonts и зарегестрируйтесь. Вам нужно иметь активную платную подписку Creative Cloud, чтобы иметь возможность добавлять шрифты в проект. Оплатить можно по ссылке https://www.adobe.com/creativecloud/plans. html
После оплаты вы сможете выбирать шрифт из огромнейшей библиотеки Adobe.
Этапы:
- Найдите подходящий шрифт и активируйте его, а затем перейдите на его страницу.
- Нажмите на «Add to Web Project», чтобы добавить шрифт в существующий или новый проект.
- После добавления шрифтов в проект перейдите в настройки проекта.
- Внутри вашего проекта вы можете посмотреть Project ID и название шрифта, которое нужно вставить в Тильду.
- Вернитесь в Тильду, в Настройки сайта → Шрифты и цвета → Расширенные настройки → Typekit.
- Укажите Project ID и пропишите шрифт для заголовка и для текста точно так, как он называется в Adobe Fonts.
Подробная инструкция по ссылке: https://help-ru.tilda.ws/fontsadobe
Google Fonts
В отличие от Adobe Fonts эти шрифты полностью бесплатны.
Переходите на сайт https://fonts.google.com/. Выберите нужный шрифт и зайдите в него. Для примера я выбрал шрифт Nunito. ЕГо я буду применять к тексту на сайте.
В окне шрифта вы увидите следующее:
Вы можете нажать на кнопку «Download Family» в правом верхнем углу. Тогда вы скачайте архив со всеми начертаниями этого шрифта. Потом вы сможете загрузить в Тильду нужные начертания. Об этом я расскажу чуть позже в этой статье.
На этой же странице вы можете стразу выбрать начертание шрифта, нажав на кнопку «Select this style», как показано на картинке выше.
Как только вы добавляете начертание шрифта, справа появляется окно с настройками вашего выбора. Вы можете продолжить выбирать начертания. Я выбрал два и получил следующее:
Обратите внимание на подчеркнутую ссылку. Эту ссылку вы можете копировать и вставлять в Тильду, чтоб подключить шрифт.
Но давайте сначала рассмотрим вариант сложнее. Я хочу подключить второй шрифт. Для этого возвращаемся назад на страницу всех шрифтов и ищем подходящий. Я выбрал Jura для заголовков и проделал те же действия, как и для шрифта Nunito.
Теперь видим такую картину:
Копируйте подчеркнутую ссылку и возвращайтесь в настройки Тильды.
В поле CSS LINK нужно вставить скопированную ссылку.
Поле HEADING FONT FAMILY NAME — тут вы задаете шрифт для заголовков. Вставьте сюда точное название шрифта из Google fonts, в моем случае Jura.
Поле BODY TEXT FONT FAMILY NAME — — тут вы задаете шрифт для обычного текста. Вставьте сюда точное название шрифта из Google fonts, в моем случае Nunito.
Если вы загружали только один шрифт, то в оба поля вставляйте одно название.
Нажимаем сохранить изменения и публикуем все страницы сайта. На своем сайте у меня получились такие изменения шрифта заголовка и текста:
Загрузить свой шрифт в Тильду
Для подключения своих шрифтов вам нужно перейти во вкладку «Your Own Font» в Тильде в Настройки сайта → Шрифты и цвета → Расширенные настройки:
Если вы качали шрифты с Google Fonts, то формат их не будет поддерживаться Тильдой. Чтобы это исправить, можно воспользоваться этим онлайн-конвертором или этим конвертором и переформатировать файлы шрифта в . woff
Когда шрифт уже скачан, нажимайте на кнопку «Загрузить файлы шрифта»:
Тут вы увидите 6 возможных начертаний, которые можно загрузить 6 файлов одного шрифта: Thin (100), Light (300), Normal (400), Medium (500), Semi-Bold (600) и Bold (700).
Далее в поле «УКАЖИТЕ НАЗВАНИЕ ШРИФТА» впишите точное название вашего шрифта. Ниже вы можете сразу назначить этот шрифт для всех заголовков и/или текста по-умолчанию.
Нажмите кнопку «Сохранить» и потом кнопку «Вернуться к настройкам сайта».
Дальше вас вернет на страницу настроек шрифта:
На этой странице вы увидите, сколько начертаний вы подгрузили (потом можно удалить какие-то начертания или добавить новые). Укажите в полях ниже точное название загруженного шрифта для заголовков и текста.
Сохраните изменения, опубликуйте все страницы и проверяйте изменения на сайте.
[blognotice text=»Вы можете таки образом загрузить два шрифта. К примеру, в начертания THIN, LIGHIT и NORMAL можно загрузить файлы первого вашего шрифта, а в MEDIUM, SEMI-BOLD и BOLD добавить второй ваш шрифт. В настройках блоков вы сможете выбирать нужное начертания и тем самым менять шрифт.»]
Другие настройки шрифтов
Как вы могли заметить, в Настройки сайта → Шрифты и цвета → Расширенные настройки, есть еще несколько важных полей:
Здесь вы можете задать настройки по-умолчанию для всех страниц:
- выбрать начертание шрифта для обычного текста;
- назначить шрифт для текста;
- выбрать начертание шрифта для заголовков
На этой же странице ниже вы сможете задать цвет для заголовков и текста, цвет ссылок и цвет фона для всех блоков.
Если остались еще какие-то вопросы по подключению шрифтов к Тильде, советую пересмотреть видео ниже. В нем я все детально описываю на конкретных примерах.
Тильда ~ символ в Word, Excel, PowerPoint и Outlook
Шрифты, Microsoft 365, Microsoft Excel, Microsoft Office, Microsoft Office для Mac, Microsoft OneNote, Microsoft Outlook, Microsoft Powerpoint, Microsoft Word, Office 2007, Office 2010, Office 2013, Office 2016, Office 2019, Office 2021 / Office LTSC, Office 365 /
Символы и эмодзи в Microsoft Office, Windows и Mac /
Введите тильду ~ в Microsoft Word, Excel, PowerPoint или Outlook. Как в Office для Windows, так и в Office для Mac. Плюс альтернатива эмодзи Тильде.
Тильда используется для обозначения «приблизительно», например, «~30 минут опоздания». В математике это означает «подобный порядок величины», например. « а ~ б ».
- Как Тильда ~ выглядит в разных шрифтах.
- Тильда – как эмодзи – Волнистая черточка
- Тильда ~ коды
- Word, Excel, PowerPoint и Outlook
- Окна
- В MacOS и Office для Mac вставка символов
Тильда ~ символ проста на большинстве клавиатур (в основном вверху слева), но если на других клавиатурах нет тильды, есть другие варианты.
Как Тильда ~ выглядит в разных шрифтах.
Вот несколько примеров того, как Тильда ~ выглядит в распространенных шрифтах Office.
Тильда – как смайлик – Волнистая черточка
Нет смайлика Тильда, но есть волнистая черточка 〰️ (Unicode 3030
), которая выглядит похожей. Он доступен на панели эмодзи Windows и средстве просмотра символов MacOS.
Тильда ~ коды
Это важные кодовые числа или значения, которые вам понадобятся для ввода тильды или ~
Десятичный: 126 Шестнадцатеричный: 007E или просто 7E
Веб: ˜ или ~ или ~
(веб-коды не используются в Microsoft Office, мы включили их для полноты картины.)
Word, Excel, PowerPoint и Outlook
Вставка | Символы | Символ и найдите символ тильды.
Windows
В Windows есть несколько ярлыков для ввода символа тильда ~ в любую программу, но они используют цифровую клавиатуру , а не числовой ряд над буквами.
Alt + 126
Карта символов Windows
Аксессуар Карта символов Windows во всех выпусках Windows
Карта символов имеет функцию поиска, чего-то не хватает во вкладке Вставка | Символ в офисе.
MacOS и Office для Mac вставка символов
На большинстве (всех?) клавиатур Mac тильда будет находиться в верхней левой клавише. Если нет,
- сочетание клавиш Command + Control + пробел, чтобы открыть средство просмотра символов.
- Найдите «тильду», и программа просмотра найдет нужный вам символ.
Несмотря на название «Средство просмотра символов», системный инструмент Apple также позволяет вставлять символы в любую программу, включая Office для Mac.
Введите символы бесконечности ∞ в Word, Excel, PowerPoint и Outlook
Символ градуса Фаренгейта ℉ в Word, Excel, PowerPoint и Outlook
Символ градуса Цельсия ℃ в Word, Excel, PowerPoint и Outlook
Символ биологической опасности для Word, PowerPoint и др.
Символ зарегистрированной торговой марки ® в Word и Office
Символ торговой марки в Word, Excel, PowerPoint и Outlook
Office for Mere Mortals — это место, где тысячи людей могут найти полезные советы и рекомендации по работе с Word, Excel, PowerPoint и Outlook.
Попробуйте. Вы можете отписаться в любое время. Мы никогда не спамили и не продавали адреса с тех пор, как мы начали более двадцати лет назад.
Неверный адрес электронной почты
Быстро посмотреть, какое приложение OneNote у вас установлено в Windows Экономия заряда аккумулятора в Apple Pencil
Ввод обоих символов тильда ~ ∼ в Word, Excel, PowerPoint и Outlook
Шрифты, Microsoft Office, Microsoft Office для Mac, Microsoft Outlook, Microsoft Word, Office 2007, Office 2010, Office 2013, Office 2016, Office 2019, Office 2021 / Office LTSC, Office 365 /
Символы и эмодзи в Microsoft Office, Windows и Mac /
Как вставить любой из символов тильда ~ ∼ в Microsoft Word, Excel, PowerPoint или Outlook. Как в Office для Windows, так и в Office для Mac.
Тильда Символ ∼ легко набирается на некоторых клавиатурах, но для других клавиатур нет специальной клавиши для тильды.
Два символа тильды
В системе Unicode есть ДВА символа тильды. Один для регулярного использования и специальный для формул. Для большинства из нас разница не имеет значения и достаточно использовать стандартные ~ .
То, что мы будем называть «обычной» тильдой ~ , которая есть на большинстве клавиатур. Юникод U+007E или в Word 7E , затем Alt + X . Правильное имя просто Тильда .
И есть математическая версия для формул. «Математика» Тильда ~ — это Unicode U+223C или в Word 223C , затем Alt + X . Имя собственное — Тильда Оператор .
Также есть символ Перевернутая тильда ∽ в Word, Excel, PowerPoint и Outlook
Как две тильды ~ ∼ выглядят в разных шрифтах.
Вот несколько примеров того, как каждая тильда ~ ∼ выглядит в распространенных шрифтах Office.
«Математика» Тильда недоступна в большинстве шрифтов. Word переключится на шрифт Cambria Math, если символ недоступен в выбранном шрифте.
Word и Outlook
Обычный знак тильды ∼ НЕ имеет встроенного ярлыка в Word, но обычно он не нужен, потому что он находится на клавиатуре. Но 7E, то Alt + X будет работать, если это необходимо.
Математическая тильда, используйте стандартное сочетание клавиш Word Alt + X 223C + Alt + X
Попав в документ, вы можете скопировать его в автозамену и создать свой собственный ярлык.
Word, Excel, PowerPoint и Outlook
Вставка | Символы | Символ и ищите символ Тильды.
Windows
В Windows есть несколько ярлыков для ввода символа тильды ∼ в любую программу, но они используют цифровую клавиатуру , а не числовой ряд над буквами.
Alt + 8764
Панель эмодзи Window 11
Панель эмодзи Windows 11 имеет символ тильды ∼. Используйте Вин+. (точка/точка), чтобы открыть панель.
Выберите вкладку «Символы» (пятый значок в верхнем ряду), затем раздел «Математические символы». Чтобы найти символ тильды, прокрутите список вниз.
Карта символов Windows
Дополнительная карта символов Windows во всех выпусках Windows.
Карта символов имеет функцию поиска, чего-то не хватает во вкладке «Вставка | Символ в офисе.