суббота, 25 марта 2017 г.

14. Разделить Footer на части

Как это не странно, но я потратила пол дня по такому запросу: разделить футер на сайт - бары, как поделить футер, изменить количество столбцов в футере, wp footer разделить на колонки  и т.д.
И по моему запросу выходили или просто статьи на тему: изменить ссылки , убрать кодировки или самописный шаблон wp.
Оказалась фишка в том. что нужно было искать ВИДЖЕТЫ, ( кто бы знал)....
А запрос поисковой машине давать не по поиску колонок  в футере , а по добавлению в футер виджетов...

Для примера, у меня в шаблоне только один сайт БАР... Но мне нужно чтоб было 3, как минимум ...
Напомню, что я чайник в CSS и PHP, поэтому все делаю методом проб и ошибок. И этот способ установки дополнительных сайтбаров у меня сработал.

Нашла вот такой бесплатный конструктор для форм CSS. На нем можно сразу проверть как работает код.
https://www.w3schools.com/css/tryit.asp?filename=trycss_link_advanced 

Итак самое первое правило:
ДЕЛАЕМ РЕЗЕРНУЮ КОПИЮ ВСЕЙ ТЕМЫ! 
ИЛИ ТЕХ ФАЙЛОВ, в которые вы вносите изменения. 
Вам потребуется доступ к админке через FTP  и конечно же ваш сайт WP.
Помните, пока вы не дойдете до последнего шага - ваш сайт может быть в полной "отключке". Я эксперементирую или ночью или на локалке, если есть возможность.

Идем в админку FTP и в файле functions.php регистрируем именно то количество сайдбаров, которое вам нужно. На многих шаблонах регистрация идет через  функцию functions. 
Он лежит в папке: www/wp-content/thems/ВАША ТЕМА/functions.php 

1. Находим строчки соотвествующие сайтбару или подключения к Footer и добавляем сайтбары


У меня  в шаблоне было так: 

//подключаем виджеты
 function gpress_widgets_init() {
  if ( function_exists('register_sidebar') )
        register_sidebar(array(
     'name' =>  __( 'Сайдбар', 'gpprime' ),
     'id' => 'sidebar-1',
  'before_title' => ' <span class="side-title">',
        'after_title' => '</span> ',
'before_widget' => '<div class="side-blok"> ',
        'after_widget' => '</div> ',
    ));
 }
add_action( 'widgets_init', 'gpress_widgets_init' );


Чтобы все было по-теме добавляем внизу этого кода строку:


if (function_exists('register_sidebars')) register_sidebars(4);
Помните, что — register_sidebars(4) — значит, что это количество зарегистрирванных сайт-баров новых у меня будет 3

2.  Создаем нужное нам количество сайтбаров с помощью Notepad++ или простого тестового редактора три файла PHP (соотвествующих вашим новым сайтбарам):


1) sidebar_a.php,     2)  sidebar_c.php,   3)    sidebar_r.php 


Итак, 
Начинка для каждого: 
1. sidebar_a.php

<div class="sidebar1">

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(2) ) : else : ?>

<?php endif; ?>

</div>

+++++++++++++++++++++++++++++++++++++++++++++++++
2. sidebar_c.php

<div class="sidebar2">

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(3) ) : else : ?>

<?php endif; ?>

</div>
+++++++++++++++++++++++++++++++++++++++++++++++++
3. sidebar_r.php



<div class="sidebar3">

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(4) ) : else : ?>

<?php endif; ?>

</div>
++++++++++++++++++++++++++++++++++++++++++++++++++++++
И закидываем их в папку основной темы:
www/wp-content/thems/ВАША ТЕМА/СЮДА 

3. Меняем основной сайтбар 

Находим sidebar.php
Он как правило у вас уже есть. www/wp-content/thems/ВАША ТЕМА/sidebar.php

И прописываем туда наши сайтбары

<?php include (TEMPLATEPATH . "/sidebar_a.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_c.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_r.php"); ?>

В итоге, у меня получилось вот так - 
ПОЛНЫЙ ВИД ОСНОВНОГО САЙТБАРА:

<div class="sidebar">
<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(1) ) : else : ?>
<?php include (TEMPLATEPATH . "/sidebar_a.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_c.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_r.php"); ?>
<?php endif; ?></div>
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>

</div><!-- end sidebar -->
Получилось, что внутри одного сайтбара лежит сразу три. 

4.  Выводим наши сайтбары в Футере 

Для этого находим футер (подвал)  нашего сайта по адресу:  www/wp-content/thems/ВАША ТЕМА/footer.php
И прописываем туда наши сайтбары:

<?php include (TEMPLATEPATH . "/sidebar_a.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_c.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_r.php"); ?>

Мой выглядит сейчас так -
ПОЛНЫЙ ВИД ОСНОВНОГО FOOTER:

<div class="sidebar">
<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(1) ) : else : ?>
<?php include (TEMPLATEPATH . "/sidebar_a.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_c.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar_r.php"); ?>
<?php endif; ?></div>
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>

</div><!-- end sidebar -->


5. Прописываем каждому сайтбару классы в CSS

.sidebar1 {float:left; width: 33%; margin-left:5px;
margin-right:5px; }
.sidebar2 {float:left; width: 33%; margin-right:5px;}
.sidebar3 {float:left; width: 33% }


 Если нужно дописывайте необходимые функции.
В итоге у вас должно появиться три сайт бара.  И один основной ( Я его оставила пустым), а вот 2,3,4 - у меня работают как часы.


Надеюсь, что у вас все получится. 


Комментариев нет:

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