Как добавить правый сайдбар в тему No Sidebar Pro
Брайан Гарднер сделал очередную отличную тему, которая называется No Sidebar Pro. В ней все хорошо, кроме одного — естественно, отсутствует сайдбар. Давайте попробуем его туда добавить.
Чтобы добиться этой цели, мы
- уберем код, который де-регистрирует Primary Sidebar.
- не будем де-регистрировать раскладку content-sidebar Genesis.
- изменим код так, чтобы форсировать раскладку content-sidebar на страницах архивов и отдельных постов, а на остальных страницах оставим раскладку контента на всю ширину.
- отредактируем CSS, чтобы для компьютеров основное содержимое было слева, а сайдбар справа, а при меньших разрешениях — чтобы содержимое показывалось сначала, а сайдбар — потом.
Шаг 1
В файле functions.php темы No Sidebar Pro:
Закомментируйте или удалите
а) unregister_sidebar( 'sidebar' );
б) genesis_unregister_layout( 'content-sidebar' );
Замените код
|
1 |
add_filter( 'genesis_site_layout', '__genesis_return_full_width_content' ); |
на
|
1 2 3 4 5 6 7 8 |
add_filter( 'genesis_site_layout', 'sk_genesis_site_layout' ); function sk_genesis_site_layout() { if ( is_archive() || is_singular( 'post' ) ) { // if this is Posts page or an archive page.. return 'content-sidebar'; } else { // for all other views.. return 'full-width-content'; } } |
Шаг 2
В файле single.php замените код
|
1 |
add_action( 'genesis_entry_header', 'ns_single_featured_image', 1 ); |
на
|
1 |
add_action( 'genesis_before_content', 'ns_single_featured_image', 1 ); |
Шаг 3
Отредактируйте файл style.css.
А именно, над разделом с media добавьте:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
.content-sidebar-wrap { background-color: #fff; overflow: hidden; } .content-sidebar .content { float: left; width: 65%; } .sidebar-primary { float: right; width: 35%; padding: 70px 0 100px 0; border-left: 1px solid #eee; } .sidebar-primary .widget { padding: 0 60px; margin-bottom: 80px; } .content-sidebar-wrap .content, .content-sidebar-wrap .sidebar { margin-bottom: -99999px; padding-bottom: 99999px; } @media only screen and (max-width: 1024px) { .content-sidebar .content, .sidebar-primary { width: 100%; float: none; } .content-sidebar-wrap .content, .content-sidebar-wrap .sidebar { margin-bottom: 0; padding-bottom: 0; } .sidebar-primary { border-left: none; border-top: 1px solid #eee; } .sidebar-primary .widget { padding: 0 15%; } } |
Напоминаю, что для внесения изменений такого рода рекомендуется использовать FTP, а не встроенный редактор WordPress, или как минимум иметь мгновенный доступ к сайту по FTP. Иначе любая опечатка или лишняя запятая могут привести к «белому экрану», при котором доступа к админке сайта не будет. Если это произойдет, нужно использовать FTP для того, чтобы вернуть редактировавшийся файл к исходному состоянию.
А вообще правильно будет сначала скопировать на локальный компьютер исходный файл, а потом уже проводить с ним изменения на сервере.
Добавить комментарий