Здравствуйте, читатели канала Сам Себе Веб-Мастер.
Продолжаем адаптировать шаблон ZeroFour под движок MyEngine. В этой статье мы будем корректировать штатный модуль Новостная лента. Если открыть страницу Новости, на которую выводятся превью всех созданных новостей, то она выглядит так
Страница самой новости выглядит так
На этой странице выведен блок комментариев.
Все это необходимо привести к общему виду с шаблоном. В движке заложена возможность изменить вид страницы превью новостей и страницы самой новости. Для этого необходимо создать шаблоны вывода превью и контента новости. Шаблон для превью новости прописывается в файле news.prev.template.php. Этот файл можно создать самостоятельно или скопировать его из папки deftpl с дефолтным шаблоном. Открываем файл, удаляем его содержание и прописываем новый код шаблона превью, который имеет вот такой вид.
Шаблон контента новости прописывается в файле news.content.template.php. Этот файл берем так же в дефолтном шаблоне и прописываем в нем такой код.
Загружаем эти файлы на сервер в папку с шаблоном zerofour. Теперь страница превью новостей обрела вот такой вид
Страница самой новости так же изменилась.
А вот блок комментариев не изменился.
Это произошло по тому, что для этого блока мы пока еще ничего не сделали. В шаблоне zerofour нет стилей css блока. Эти стили можно взять в таблице стилей css дефолтного шаблона. Вот эти стили.
Прописываем эти стили в файле main.css нашего шаблона и загружаем на сервер. Смотрим, что получилось.
Как вам? Мне лично не очень. Поэтому, немного по колдовав над этими стилями, я получил вот такой результат.
Вот эти стили css.
По моему, получился отличный блок комментариев, абсолютно гармоничный с общим стилем шаблона.
Идем дальше. На странице превью у нас может выводится меню листинга страниц, если количество превью новостей превышает число, установленное в настройках модуля новостной ленты. Сейчас это меню имеет такой вид.
Оно выглядит так все по той же причине, в шаблоне нет стилей css для этого меню. Берем эти стили в дефолтном шаблоне.
Нам класс .news в нашем шаблоне не нужен. Поэтому, мы его убираем и к эти стилям добавляем еще одно правило.
span.date-page {
display: block;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.065em;
font-size: 1.1em;
color: # 696969;
margin: 0 0 0.25em 0;
}
Это правило отвечает за вывод даты на странице новости. В целом эти стили css будут выглядеть так.
Вставляем эти стили в файл main.css и загружаем на сервер, смотрим результат.
Вроде все у нас получилось. Но, чего не хватает. Мне лично, не хватает меню категорий в боковом блоке, т.к. это меню не выводится на страницах новостей. Нужно сделать, чтобы выводилось.
Код этого меню у нас уже есть в шаблоне, правда в другом блоке.
Нам нужно сделать так, чтобы этот код выводился в боковом блоке всех страниц с новостями. Для этого его нужно еще раз прописать в шаблоне под условием, что он будет выводится только на страницах новостей. Вот это условие
<?php if($URI[1] == 'news'){?>
// Здесь код меню
<?php }?>
Вставлять это условие с кодом меню категорий будем ниже вывода поля поиска по страницам сайта, вот здесь
Вставляем в файл шаблона, загружаем его на сервер и смотрим результат.
Замечательно. Теперь меню категорий новостей будет присутствовать на всех страницах.
На этом все. Надеюсь, что вы проделали все действия вместе со мной и получили такой же результат. Если нет, то скачайте готовый шаблон с Яндекс Диск и установите на свой тестовый сайт.
До свидания. Не забывайте подписываться на канал Сам Себе Веб-Мастер.
Другие публикации на эту тему:
Адаптация html-шаблона под MyEngine. Часть 1
Адаптация html-шаблона под MyEngine. Часть 2
Адаптация html-шаблона под MyEngine. Часть 3
Адаптация шаблона под MyEngine. Часть 4
Адаптация html-шаблона под MyEngine. Часть 5