Используем нестандартные шрифты в WordPress

Простой и красивый, а самое главное, правильный способ использовать любые шрифты на вашем WordPress болге, при помощи плагина.

На картинке можно увидеть пример, заголовки постов сделаны при помощи этого плагина.

wordpresser посты

Плагин основан на методе под названием sIFR, подробнее о нем на русском, на английском.

Кратко о том как работает метод:

  1. После загрузки страницы javascript определяет, установлен ли flash плагин у пользователя.
  2. Если flash плагин не установлен, пользователь увидит обычную html страницу, без флеш, без предложения установить flash плеер, весь текст будет виден в соответствии с css стилями.
  3. Если flash плагин установлен, js заменяет стандартный текст у требуемых элементов на флэш-вставку, с тем же текстом, но с установленным вами шрифтом и параметрами текста настроенными вами в плагине.
    Этот способ считается одним из лучших способов использования нестандартных шрифтов на сайте и полностью соответствует стандартам W3C.

Преимущества данного метода:

  • Пользователь увидит текст не зависимо от того, работает у него js и flash или нет.
  • Поисковики видят обычный <h2>Заголовок</h2> текст, можно назвать этот способ seo-ориентированным.

Недостатки:

  • sIFR, непредназначен для замены больших объемов текста.
Установка

На обычных сайта установка sIFR хоть и достаточно проста, но, тем не менее, требует определенных знаний. Нам повезло, для WordPress существует плагин, который сделает большую часть работы за нас, для нас работа сводится к установке плагина и необходимых шрифтов.

Для начала нам нужно скачать и установить плагин WP sIFR.

Следующий шаг, выбираем понравившийся русский TTF шрифт и переводим его во flash формат, TTF шрифты можно легко найти в интернете. На картинке выше используется шрифт Calibri Bold (CALIBRIB.TTF) который идет вместе с Windows XP.

Шрифт выбран, теперь необходимо переделать его в swf формат, понятный плагину. Для этого есть специальный сайт-генератор swf шрифтов sifrgenerator.com. Закачиваем свой шрифт, для того, что бы успешно работали русские буквы, настройки генерации шрфитов следует делать как показанно на картинках.

вордпресс шрифты

wp sIFR

Скачиваем получившийся swf файл, кладем его в папку fonts используемой вами темы, например /wp-content/themes/default/fonts/calibrib.swf

Заходим в настройки плагина “Параметры –> WP sIFR

WP sIFR

В списке должен появится добавленный шрифт. Ставим напротив него галочку “Activate this font”, в “Settings” указываем к каким элементам применять этот шрифт. Для заголовков постов достаточно оставить “h2”, загловок блога обычно “h1”. Можно использовать css-селекторы по типу “div#sidebar h2, li” и т.п. Там же указыавем размер, цвет и другие параметры нашего flash-текста.

Нажимает “Save changes” и идем любоваться, тем, что у нас получилось.

Ложка дёгтя

Сайт sifrgenerator.com заточен под англоязычные шрифты, при генерации русскоязычных шрифтов размер файла шрифта с 15-20кб для англоязычного шрифта распухает до 50-200кб для шрифта с “Full character set”, т.е. с поддержкой всех символов включая русские буквы. Решение в поиске.

Похожие посты:

  1. Правильный RSS в WordPress с BetterFeed
  2. Будущие посты 2.0
  3. Обзор интересных плагинов для WordPress
  4. Подборка плагинов слайдеров для шаблонов WordPress
  5. Проверка совместимости плагинов с WordPress 2.8

11 Комментариев к статье Используем нестандартные шрифты в WordPress

Avatar

Marcellus

23rd Июнь 2009 в 18:34

Интересно, спасибо!
По поводу русских символов – все можно сделать самому, явно указав русский алфавит без лишних символов, но я не знаю, существуют ли бесплатные программы для создания флеша, может быть какие то варианты…

Avatar

Wordpresser

23rd Июнь 2009 в 18:47

@Marcellus
Есть вариант сделать flash шрифт через саму Adobe Flash, но у меня её нет, не знаю можно ли там выбрать нужные символы

Avatar

Wordpresser

24th Июнь 2009 в 12:26

В процессе поиска как сделать использование sIFR лучше, была найденна хорошая альтернатива WP-Cufon http://wordpress.org/extend/plugins/wp-cufon WP-Cufon делает шрифты без использованиея flash, на чистом js и canvas. Генератор шрифтов позволяет сделать шрифты только с русскими буквами.

Avatar

Yeva

9th Июль 2009 в 18:24

Здраствуйте!
Спасибо за статью: очень долго и безрезультатно пыталась заставить работать на WP обычный sifr.
Теперь установила плагин, настроила по инструкции но, увы, никаких изменений в теме не произошло((
Подскажите, пожалуйста, как это можно поправить?

Avatar

Wordpresser

10th Июль 2009 в 06:27

@Yeva
Возможно дело в теме, попробуйте переключится на стандартную тему и проверить.

А вобще WP-Cufon о котором выше писал получше будет, советую попробовать его :)

Avatar

Monster

23rd Ноябрь 2009 в 01:00

а как зайти в настройки плагина?

Avatar

Wordpresser

23rd Ноябрь 2009 в 09:18

Monster, в статье написано

Заходим в настройки плагина Параметры –> WP sIFR

Avatar

Анна

17th Январь 2011 в 20:32

«Скачиваем получившийся swf файл, кладем его в папку fonts используемой вами темы, например /wp-content/themes/default/fonts/calibrib.swf»

Где эта папка находится?
«Файлы этой темы расположены в /themes/baltimore-phototheme.»
Я набираю в адресной строке: ***.ru/wp-content/themes/baltimore-phototheme/
Но у меня выплывает ошибка «Удаленный сервер или файл не найден»
Объясните пожалуйста понаглядней, куда кидать файл swf?

Avatar

Wordpresser

18th Январь 2011 в 18:01

Анна, в эту папку нужно попадать через ftp

Avatar

Joliat

12th Март 2011 в 23:17

Есть вопросик. А как сделать несколько шрифтов с разными настройками. Например, для ul, для li и h2 были совершенно разные параметры?

Avatar

Анна

8th Декабрь 2011 в 14:50

в эту папку нужно попадать через ftp – поясните, как?

Оставить комментарий к "Используем нестандартные шрифты в WordPress"

Наверх