sozdanie_shablona_drupal7x

Создание шаблона сайта Друпал7
В ПСД документах показано какой вид должен иметь сайт с разбиением
элементов на блоки. Ниже подан список типов страниц с описанием
каждого типа. На стр.3 подан список элементов/блоков, как общих для
типов страниц и так и различных (уникальных).
Общие параметры для всех страниц:
1. Дизайн резиновый, растягивается по ширине экрана. Минимальная
ширина 1200 (см. Twitter Bootstrap).
2. Фон на всех страницах одинаков, но может меняться редактором
сайта. Само изменение фона будет решено на уровне кода. Фон по
умолчанию тот, который представлен в ПСД.
3. Зона контента: всегда занимает 100% ширины, по высоте
расширяется пропорционально при растягивании окна браузера
(наверное, устанавливается с помощью джаваскрипт функции
onresize).
4. Меню:
a. «Go Mental»
b. «Radio»
c. «Share»
5. Кнопка «Sign in» с отображением формы логин/пароль в Lightbox
режиме
6. Поле для поиска поиска.
7. Кнопка «Shout out» - по ней раскрывается вниз окно с сообщениями
модуля Shoutout box или Chatroom (в процессе определения какой
модуль будет использоваться).
3 вида страниц с контентом:
1. Главная варианты
a. Тизер (template-teaser.png) – то, что видит пользователь
первый раз при загрузки сайта. Только один раз. Через
установку кукис, при повторной загрузке пользователь будет
видеть только видео.
Тизер состоит из фона такого же размера что и видео плеер и
кнопки, по нажатию на которую тизер исчезает с экрана. Эта
функциональность будет реализована программно. Главный
момент, что размеры тизера и видео плеера будут
одинаковые.
b. Видео плеер (template-page-videoplayer.png)– код ютюб плеера,
который загружается в страницу програмно по ID контейнера.
См template2.png
i. Меню. Меню будут реализованные в виде блоков и к
ним будут приписаны стили с помощью
https://drupal.org/project/block_class . В block.tpl.php
необходимо заменить стандартный код блока на
<div id="block-<?php print $block->module .'-'. $block->delta; ?>"
class="clear-block block block-<?php print $block->module ?> <?php
print block_class($block); ?>">
Поэтому стили (кроме праймари меню) желательно
прописывать уникальными классами, и указать их на
дизайне, т.е. какой класс описывает какой блок. Блоки
открываются по наведению (hover). Примеры в файле
template-content-menu-dropdown.png
ii. Primary menu является меню «Go Mental».
iii. Радио меню (иконка справа от зоны «спонсор»). По
наведеню (hover) выпадает меню с пунктами.
iv. Шаринг меню (кнопка Share). Выпадает меню, в 3
колонки расположены иконки для шаринга.
v. Кнопка «Назад» будет представлена логотипом сайта
(flash файл).
vi. Кнопка Credits (внизу слева) – при наведении
открывается (появляется) блок с текстом.
2. Страница артиста. Шаблона готового еще нет но он будет на 90%
похож на template-content.png с некоторыми отличиями:
a. На странице артиста отображается слайдшоу (с кнопками
влево-право) его фото и видео материалов. По клацу на
фото/видео оно открывается на полный экран (либо же по
максимуму насколько позволяет разрешение фото) в Lightbox
окне.
b. Справа от слайдшоу располагается видео из поля
featured_video. По клацу оно также открывается в Lightbox –
будет реализовано программно.
c. Внизу под слайдшоу находится веб-форма для обратной связи
с артистом – реализовано через модуль webform.
d. 4 рекламных блока : 3 по 125х25 и 1 по 468х33
3. Шаблон с текстовым-графическим контентом
a. Шаблон template-content.png
b. На этой странице отображаются все другие виды контента и
вьюхи (которые не включены в первые 2 шаблона).
c. При растяжении ширина центральной части (с текстовым
контентом) устанавливается по ширине 80%. Блоки слева и
право от центральной части находятся в фиксированных
позициях.
d. 4 рекламных блока : 3 по 125х25 и 1 по 468х33
Общие элементы для страниц
Тип
Блоки меню
Рекламные
страницы
блоки
Тизер
Главная
+
+
Страница с
+
+
контентом
Страница
+
+
артиста
Shoutouts
Signin/search
+
+
+
+
+
+