Twenty twelve налаштовуємо стандартну тему wordpress, soft settings

Привіт, сьогодні спробуємо переробити стандартну тему wordpress - Twenty Twelve: задамо розмір мініатюрі, помістимо мініатюру під заголовок, видалимо непотрібні мета теги на головній сторінці, відредагуємо кнопку "Читати далі", видалимо посилання в підвалі.

Стандартні теми wordpress: Twenty Eleven, Twenty Twelve, Twenty Ten, Twenty Thirteen, Twenty Fourteen - є відмінним framework (фреймворк. Структура, каркас), на основі яких кожен день створюються нові, багатофункціональні wordpress теми.

Спочатку стандартна тема wordpress - Twenty Twelve (версія 1.3) виглядає так:

Приступимо до її виправлення:

1. Задамо розмір мініатюри (thumbnail).

Чомусь розмір мініатюри не обмежений - що дуже не зручно, так як при завантаженні картинок різного розміру - мініатюри також будуть різними.

Для цього заходимо в панель управління сайтом на wordpress, в лівому меню вибираємо пункт "Зовнішній вигляд" і його підпункт "Редакор", праворуч в списку шаблонів вибираємо файл functions.php (Функції теми) і шукаємо в його коді наступний рядок:

Саме вона і задає розмір мініатюри в темі Twenty Twelve (621 - це ширина, а 9999 - це висота мініатюри в px), давайте наприклад виправимо її на наступну сходинку:

І у нас повинно вийти наступне:

2. Перемістимо мініатюру під заголовок.

Для цього заходимо в панель управління сайтом на wordpress, в лівому меню вибираємо пункт "Зовнішній вигляд" і його підпункт "Редакор", праворуч в списку шаблонів вибираємо файл content.php і шукаємо в його коді наступний рядок:

Дана точки відповідає за відображення мініатюри.

Її перенесемо трохи нижче за Сточки:

Також обгорнемо код виведення мініатюри в окремий блок і пропишемо до нього стилі оформлення - для того, щоб зробити відступ від заголовка зверху, в результаті повинно вийти наступне:

Тобто ми обернули код виведення мініатюри в блок з id "tumba".

Для блоку tumba пропишемо наступний код у файлі стилів - style.css - відкриваємо його: заходимо в панель управління сайтом на wordpress, в лівому меню вибираємо пункт "Зовнішній вигляд" і його підпункт "Редакор", праворуч в списку шаблонів вибираємо файл style.css і в самий його низ вставляємо наступний код:

Тобто ми створили відступ в 30px зверху.

В результаті у нас вийде наступне:

3. Вилучимо непотрібні мета теги.

Знову повертаємося до файлу content.php - для цього заходимо в панель управління сайтом на wordpress, в лівому меню вибираємо пункт "Зовнішній вигляд" і його підпункт "Редакор", праворуч в списку шаблонів вибираємо файл content.php і видаляємо в ньому такі рядки:

У підсумку ваш файл content.php повинен виглядати так:

Після чого сайт буде виглядати вже так:

Як бачите нічого зайвого.

4. Відредагуємо кнопку "Читати далі".

Для цього достатньо знову перейти в файл стилів - style.css і додати в самий низ його коду наступні рядки:

До кнопці "Читати далі" можна також прописати фонове зображення за допомогою наступної точки:

А для того, щоб кнопка "Читати далі" відображалася справа, а не зліва можна вставити наступний код:

В результаті у нас вийшло наступне:

5. Вилучимо посилання в підвалі.

Для цього заходимо в панель управління сайтом на wordpress, в лівому меню вибираємо пункт "Зовнішній вигляд" і його підпункт "Редакор", праворуч в списку шаблонів вибираємо файл footer.php і видаляємо в ньому наступний код:

В результаті файл footer.php буде виглядати так:

PS: Завантажити перероблену тему Twenty Twelve (версія 1.3) - можете з мого сайту - завантажити Twenty Twelve (виправлено mnogoblog.ru).

Схожі статті