правый сайдбар twenty fifteen

Настраиваем Twenty Fifteen: правый сайдбар вместо левого

Здравствуйте, сегодня будем перенастраиваем стандартную wordpress тему, а именно: перенесем сайдбар (боковую колонку) слева направо.

Скачать исходники для статьи можно ниже

1. Создаем дочернюю тему.

1.1. Нужно создать папку с названием нашей дочерней темы (в нашем примере “twentyfifteen-child”) в папке “themes”:

– public_html
-wp-content
-themes (папка со всеми темами)
– twentyfifteen (папка родительской темы Twenty Ten)
– twentyfifteen-child (папка нашей дочерней темы; может быть названа как угодно)

1.2. Далее создадим в папке дочерней темы (twentyfifteen-child) 2-а файла: файл стилей style.css и файл функции темы – functions.php

Для создание этих 2-х файлов вам понадобиться редактор кода – можно воспользоваться бесплатным – NotePad++ – скачать его можно здесь – “notepad-plus-plus.org/download”

Файл стилей будет выглядеть так:

/*
Theme Name: Twenty Fifteen Child
Description: Дочерняя тема для темы Twenty Fifteen
Author: Ваше имя
Template: twentyfifteen
*/

А файл functions.php так:

<?php

add_action( 'wp_enqueue_scripts', 'twenty_fifteen_child_right_enqueue_styles');
function twenty_fifteen_child_right_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

В файле functions, мы указали родительские стили для нашей дочерней темы.

2. Прописываем в файле стилей (style.css) еще строчки:

@media screen and (min-width: 59.6875em) {
    .site-content {
        float: left; margin-left: 0px; width: 70.5882%;
    }   
    
    .sidebar {
        float: right; margin-right: 0px; max-width: 413px; position: relative !important; width: 29.4118%; background: #fff; box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
    }

    body:before { 
        right: 0; left:auto;
    }       
    .site-footer { 
        margin: 0 0 0 6.1%;
    }
}

Активируем дочернюю тему (админка – пункт “Внешний вид” – подпункт “Темы”).

Все готово!

PS: Можете скачать уже готовую дочернюю тему с правым сайдбарам для Twenty Fifteen с моего сайта по следующей ссылке – дочерняя тема с правым сайдбарам темы Twenty Fifteen.

Вот ещё одна альтернативная дочерняя темя с правым сайдбаром – “tipsandtricks-hq.com/wp-content/uploads/themes/2015-child-right-sidebar.zip”

О дочерних темах, как их создать, можно почитать тут – “codex.wordpress.org/Дочерние_темы”

Введите свой email адрес для того, чтобы подписаться на мой блог:


knopkisoc

Настраиваем Twenty Fifteen: правый сайдбар вместо левого: 1 комментарий

  1. Иван

    Здравствуйте. После замены сайдбара с левой стороны на правую, у него появляется бесконечная прокрутка вместе с лентой. Есть ли какой-либо вариант убрать эту бесконечную прокрутку? Заранее спасибо!

Добавить комментарий