Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
теми
Уроки
Хакі

Сьогодні розглянемо, як просто та ефективно покращити роботу з медіа-контентом на вашому сайті. Для реалізації цієї функціональності вам навіть не потрібно буде встановлювати плагін, так як підтримка додавання такого коду є за замовчуванням в самому движку WordPress починаючи з версії 3.4.x, де вперше з'явилася опція. Про це та інші зміни ви можете докладніше почитати в Кодекс.

А йдеться ось про що: коли ви додаєте картинку на сторінку або пост WordPress, ви можете зробити для неї окремий Заголовок. Кожне додане зображення може супроводжуватися власним заголовком і використовувати для форматування заголовків звичайні HTML-теги (Звичайно, ви можете залишити їх порожніми і тоді взагалі жодних заголовків не буде).

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!

Теги, які ви можете використовувати за промовчанням, будуть такими ж, як і теги, які ви використовуєте для коментарів. Наприклад, можна виділяти текст жирним шрифтом за допомогоюсильний>, курсивом за допомогоюem> або закреслювати за допомогоюудар>.

Врахуйте, що WordPress використовує світло-сіру кольорову стилізацію для фону і темно-сіру - для тексту (за замовчуванням). Ці класи задані в CSS як .wp-caption и .wp-заголовок-текст. Якщо ви хочете використовувати свої власні стилі, то увімкніть їх у CSS вашої теми (зазвичай для цього треба внести зміни до style.css).

У нашому випадку для теми треба додати наступний код:

.wp-caption {
    background: #F1F1F1;
    line-height: 18px;
    margin-bottom: 20px;
    padding: 4px;
    text-align: center;
}
.wp-caption-text {
    color: #888;
    font-size: 12px;
    margin: 5px;
}

Врахуйте, що ви завжди можете змінити заголовок, клацнувши на картинці в редакторі постів і перейшовши до параметра Редагувати.

А ось сам код HTML, який я використовую:

<em>This text is italicized.</em> <strong>And this is bold.</strong>

Тепер розглянемо цей приклад у картинках. Ми просто вставляємо картинку в редакторі запису WordPress та вказуємо підпис.

Як додати HTML заголовки до зображень у WordPress

Ось як виглядає заголовок у редакторі:

Як додати HTML заголовки до зображень у WordPress

А ось так виглядає заголовок на сайті:

Як додати HTML заголовки до зображень у WordPress

Ви можете застосовувати HTML теги до підписів на свій розсуд та оформлювати це все додатково за допомогою CSS у файлі style.css.

Джерело: WP.tutsplus.com
inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!
Олексій Шевченко
редактор wpcafe
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/

Коментарі до запису: 0

Додати коментар або відгук