Что нового WordPress 3.8? Dashicons иконки заменяют привычные картинки

wpviz-fonts

Сегодня речь пойдёт о довольно устаревшем обновлении WordPress 3.8. Что сподвигло меня на написании статьи о версии далекого 2013, спросите вы?

Очень многие пользователи WordPress и знать не знали о том, что же нового сделали для нас разработчики! Да да, даже будучи обновленные до версии 4.4.2. Не мне судить о причинах сего — но я попытаюсь это исправить и наверстать упущенное 

И так, ближе к делу. Разберемся по порядку:

Нововведения в WordPress 3.8

  1. Внешний вид. Да, разработчики позаботились непосредственно о администраторах блогов. В этом обновлении внешний вид улучшился:
    • Новый крупный шрифт Open Sans;
    • векторные иконки
    • 8 различных цветовых схем;
    • адаптивность панели администрированияШрифт Open Sans WordPress
  2. Интерфейс работы с темами. Действительно, интерфейс теперь очень дружелюбен и удобен.
  3. Новая стандартная тема Twenty Fourteen. Та самая тема. с которой, уверен, все мы начинали . Напомню, что сейчас она является самой популярной в WordPress.

На этом релиз обновления на официальном сайте заканчивается.

Я выделил пункт, в котором заходит речь про иконки. Но, заметьте, речь шла панели управления, но никак о внешнем виде нашего сайта!

Так вот, эти самые иконки:

Dashicons WordPress

И это, как вы понимаете, лишь малая часть!

В версии WordPress 3.8 были введены порядка 150 векторных иконок. Они подразделены на 15 категории:

  1. Admin Menu;
  2. Welcome Screen;
  3. Post Formats;
  4. Media;
  5. Image Editing;
  6. TinyMCE;
  7. Posts Screen;
  8. Sorting;
  9. Social;
  10. WordPress.org Specific: Jobs, Profiles, WordCamps;
  11. Products;
  12. Taxonomies;
  13. Widgets;
  14. Notifications;
  15. Misc.

Они представляют из себя векторные иконки, которые обернули в специальные веб-шрифты, описанные в CSS.

В этой подборке можно найти множество иконок на любой вкус и любые цели 

 

Подключение Dashicons

Подключить необходимый CSS файл необходимо таким образом:


  1. Этот способ, как вы уже догадались, с помощью функции. Для тех, кто не знает это нужно вставить в ваш файл functions.php

Как же их использовать? Выбрав симпатичную иконку здесь, можно пойти по двум пути:

  1. Получив CSS нашей иконки. Полученный параметр необходимо вставить в нужный нам блок. К примеру вот так:

    Про префиксы webkit и ~moz и других расскажу немного позже подробно — это очень важно и требует отдельного урока.
  2. Получив HTML-фрагмент кода. Это может выглядеть примерно так:

    Вот и всё! Изменять размер, цвет иконок, и другие свойства — также легко можно, обратившись как к самому CSS иконки, так и в своём CSS!

dashicons на Drogin.ru

 

Надеюсь я помог вам разобраться с этим и сделать свой проект удобнее и лучше.

 

Подписывайтесь, скоро будет много интересного! 


6+
Подписаться на новости

Отправить ответ

Оставьте первый комментарий!

Уведомить о
wpDiscuz