Собственный шаблон сайта на Joomla 3 за 2 вечера. Урок 1. Создание файловой структуры

Приветствую вас в мини курсе по созданию собственного шаблона для системы управления контентом Joomla. Шаблон отвечает за внешний вид вашего сайта, а значит, если вы хотите создать уникальный сайт с уникальным дизайном, вы должны использовать уникальный шаблон на своем сайте. И здесь сразу же возникает вопрос: «Где же взять уникальный шаблон сайта для CMS Joomla?» Конечно, в данный момент на просторах интернета можно отыскать множество различных шаблонов, скачав и установив который вы сможете использовать его на своем сайте.



Собственный шаблон сайта на Joomla 3 за 2 вечера. Урок 1. Создание файловой структуры

Используя используя готовые шаблоны с интернета вы не обеспечиваете уникальность дизайна вашего сайта потому как, наряду с вами данный шаблон могут скачать другие пользователи интернета и также использовать на своем сайте. Поэтому для обеспечения уникальности дизайна вашего сайта лучше создавать шаблоны для вашего сайта с абсолютного нуля, используя верстку макета шаблона. То есть, к примеру в фотошопе вы создаете дизайн вашего сайта, то есть вы отрисовываете макет вашего будущего сайта. Используя данный макет, вы верстаете его и получаете уже шаблон в виде html-страницы, то есть как бы статический сайт. То есть html страничка вашего макета, то есть вёрстка вашего макета. Используя верстку макета мы с вами научимся в данном мини-курсе создавать шаблон, который можно использовать в системе управления контентом Joomla. То есть создав шаблон на основе вашего дизайна вы обеспечиваете уникальность вашего сайта потому, что дизайн вы придумали сами, вы его сами нарисовали, и вы таким образом обеспечиваете то, что в интернете не будет уже другого сайта, который будет идентичен с вашим по дизайну.

Подготовка к созданию шаблона сайта на Joomla 3

Давайте поговорим о том что нам нужно для собственной работы. Во первых нам нужна Joomla. Я ее уже скачал и установил. На момент записи данного урока это версия 3.3.1. Как видите в пользовательской части используется стандартный шаблон Protostar. Никаких данных здесь нет, то есть контента нет, - Джумла абсолютно пуста и, в принципе, нам сейчас это и нужно. Нам не нужно сейчас добавлять еще не какие данные. Данные мы будем добавлять далее по ходу мини-курса. Шаблон впоследствии мы с вами сменим и установим свой собственный, а Protostar отключим. Для работы нам еще потребуется нам потребуется верстка макета, собственно верстка которую мы с вами будем использовать для данного мини-курса: несложный шаблончик.

Это 2 колоночный сайт, где в центральной колонке у нас выводится контент, в правой колоночке у нас выводится блок вспомогательного меню. Здесь мы будем выводить с вами категории нашего сайта, но вы можете выводить здесь все то, что вам нужно.

Из каких элементов состоит шаблон сайта на Joomla 3

Во первых это верхний элемент, который состоит из непосредственно меню (главное меню нашего сайта: «О компании», «Услуги», «Работы») и логотип сайта, то есть логотип той компании, которую представляет данный сайт.

Дальше шапочка нашего сайта где выводится изображение компании, которую представляет данный сайт, а также изображение меньшего размера и небольшое описание либо слоган (девиз той компании которую представляет данный сайт).

Дальше, центральная область и левая колоночка и футер, в котором расположены логотип, копирайты и кнопочки социальных сетей. Такой вот сайт мы с вами и будем создавать, а именно мы создадим шаблон сайта который и установим на систему управления контентом Joomla.

Структура шаблона сайта на Joomla 3

Давайте посмотрим структуру данного шаблона. Данный шаблон состоит из двух файлов это файл index.html, который мы с вами просматриваем в браузере. И css файл стилей, его код мы можем посмотреть в текстовом редакторе. И папочка images, которая содержит все изображения которые, используются в данном шаблоне.

Такая вот не сложная структура шаблона, и в данном уроке мы с вами начнем с того что разберем файловую структуру шаблона Джумла и составим вспомогательный файл для шаблона, который содержит в себе всю информацию о будущем шаблоне, который устанавливается в системе управления контентом Джумла. Данный файл содержит информацию об имени шаблона, об авторе который составил данный шаблон, о различных файлах, о файловой структуре данного шаблона, о позициях модулей.

Создадим новую папку, где и будем разрабатывать собственный шаблон, под названием companylogo.

Давайте поговорим о файловой структуре шаблона Джумла. Шаблон Joomla состоит из следующих элементов…


Для продолжения изучения того, как сверстать шаблон сайта CMS Joomla, смотрите видео-урок канала WebForMySelf на YouTube.

Продолжение → «Урок 2. Локализация шаблона»

Заберите ссылку на статью к себе, чтобы потом легко её найти!
Раз уж досюда дочитали, то может может есть желание рассказать об этом месте своим друзьям, знакомым и просто мимо проходящим?
Не надо себя сдерживать! ;)

Старт! Горячий старт на просторы интернета
Старт! Горячий старт на просторы интернета
Старт! Меню