Дизайн сайта определяется шаблоном. Когда мы говорим «шаблон» , то имеем в виду расширение для Joomla!, позволяющее отображать информацию в том или ином виде.
Для Joomla! разработано такое огромное количество готовых шаблонов - как бесплатных, так и коммерческих, - что глаза разбегаются. И это является единственной трудностью при выборе нужного варианта. Для своих сайтов я использовала как совсем простенькие бесплатные шаблоны, так и "накрученные" клубные. В любом случае, я их "дорабатывала" под тематику сайта и свои личные оформительские предпочтения. К сегодняшнему дню мною сделан вывод: надо выбирать шаблоны, сложность которых минимальна при максимальной привлекательности. Чем проще шаблон по своей структуре, тем проще его редактировать.
Но редактирование шаблона - это отдельная тема, она не для новичков и не для нашего урока. Сегодня нам важно познакомиться с шаблоном, как одним из видов расширений Joomla!.
И первое, что мы должны узнать, так это то, что входит в Joomla-шаблон. "Начинка" у каждого из них своя, но в каждом обязательно присутствуют следующие файлы :
- файл index.php, определяющий базовую структуру страниц Joomla!-сайта;
- файл CSS-стилей, который позволяет регулировать оформление блоков страницы Joomla! (цвета, размеры шрифтов и т.д. и т.п.)
- XML-файл для установки шаблона через администраторскую панель Joomla!
- графический файл предпросмотра шаблона Joomla!
- файлы изображений (хранятся в папке images шаблона)
Все шаблоны хранятся в папке "templates" корневого каталога Joomla, так что вы легко можете просмотреть их пакеты хотя бы ради любопытства:
Иллюстрация 1
Управление шаблонами
Управлять шаблонами - это значит устанавливать новые шаблоны, удалять ненужные, привязывать шаблоны к отдельным пунктам меню, выбирать шаблон сайта по умолчанию. Все эти процедуры с легкостью выполняются из админки, и мы рассмотрим их по шагам:
Шаг 1. Авторизуемся в админке.
Шаг 2. Открываем менюРасширения>>Менеджер шаблонов:
Иллюстрация 2
Шаг 3. Базовый пакет Joomla! содержит три шаблона. С помощью картинки предпросмотра мы можем определить "внешность" каждого. Для этого достаточно подвести курсор к имени шаблона:
Иллюстрация 3
Сейчас на нашем Демо-сайте шаблоном по умолчанию установлен rhuk_milkyway (на это указывает желтая звёздочка в графе "По умолчанию") :
Иллюстрация 4
Нажав на название шаблона, мы попадём в его настройки. Вы видите, что их у него совсем немного, но можно хотя бы изменить цветовую схему и фоновое оформление. Из выпадающего списка я выбрала "зелёный" и нажала на кнопку "Применить" :
Иллюстрация 5
Шаг 4. Открываем в браузере новую вкладку с лицевой панелью сайта и смотрим, как выглядит наш Демо-сайт в новом цветовом оформлении:
Иллюстрация 6
Можете повторять Шаги 3 и 4 до тех пор, пока не подберёте для себя лучший вариант.
Ну как, убедились, что всё беспредельно просто? Тогда давайте усложним задачу и попробуем привязать шаблон к пунктам меню.
Привязка шаблона к отдельным пунктам меню
Особенность Joomla! состоит в том, что каждому пункту меню можно назначить отдельный шаблон (или наоборот). Наверное, делать это лучше тогда, когда ваш сайт большой, в нём много разделов и, чтобы подчеркнуть их какие-либо отличительные особенности, требуется привязать к ним "свои" шаблоны. Для разнообразия, в общем.
Как привязать Joomla- шаблон к отдельным пунктам меню ?
Шаг 1. В административной панели открываем меню Расширения>>Менеджер шаблонов.
Шаг 2. В Менеджере шаблонов откроем настройки шаблона Beez, просто нажав в списке шаблонов на его имя.
Шаг 3. В панели "Привязка к пунктам меню" нажимаем на кнопку "Выберите из списка", а затем в списке нажать на выбранный для привязки пункт меню. Для примера я выбрала пункт вопросов и ответов "FAQ" , а затем для сохранения нажала на кнопку "Сохранить" :
Иллюстрация 1
Если вы хотите сделать привязку шаблона сразу к нескольким пунктам меню, то зажмите на клавиатуре кнопку "Ctrl" и отмечайте левой кнопкой мыши все нужные вам пункты в списке.
Шаг 4. Открываем в браузере вкладку с лицевой панелью Демо-сайта. В Main Menu нажимаем на пункт меню "FAQ" :
Иллюстрация 2
Шаг 5. Если вы повторили за мной шаги этого урока, то вот что должны сейчас увидеть:
Иллюстрация 3
Установка нового шаблона
Новый шаблон для сайта - это как свадебное платье: им любуется не только сама невеста, но и собравшиеся на свадьбу гости. Новый шаблон - это новый дизайн: меняются картинки, шрифты, модульные позиции. Если в прежнем шаблоне у вас, скажем, были позиции right и left, то в новом может оказаться только одна из них. Если ваши модули были раскиданы и справа, и слева, то установив шаблон с какой-то односторонней позицией, вы должны будете переписать параметры модулей. Поэтому не спешите отказываться от понравившегося нового шаблона, попробуйте сначала сделать "регулировку".
Так как шаблон - это расширение Joomla!, то его установка и удаление происходят по обычному в таком случае пути.
Как установить новый шаблон Joomla ?
Шаг 1. Через меню Расширения>> Установить/Удалить>> Обзор>>Выбрать файл>> Загрузить & Установить загружаем и устанавливаем zip-архив с шаблоном на сайт.
Шаг 2. Открываем меню Расширения>>Менеджер шаблонов, находим в списке только что установленный шаблон, нажимаем на радиокнопку слева от его названия, а затем - на жёлтую кнопку-звезду "По умолчанию" в правом верхнем углу панели.
Шаг 3.Переходим в браузере на вкладку с лицевой панелью, обновляем страницу ..... и любуемся на новое оформительское решение.
Таким путём вы можете примерять шаблоны как угодно долго, не боясь что-либо разрушить. Используйте время обучения и имеющийся у вас Демо-сайт: ведь "примерками" лучше всего, конечно, заниматься сначала в примерочной мастерской, т.е. на локалхосте.
Раскладка (позиции) шаблона
На этом занятии мы разберемся с понятием "Joomla Layout". В переводе с английского слово Layout означает "раскладка, показ, планировка, расположение". Когда вы будете выбирать шаблон, то обязательно встретитесь с этим понятием. Как правило, к коммерческому шаблону обязательно прилагается раскладка в виде графического изображения. С бесплатными шаблонами в этом смысле сложнее: позиции его придётся искать самостоятельно, и ниже мы разберёмся, как это делается.
Важный вопрос: а зачем вообще надо знать раскладку (позиции) шаблона?
Дело в том, что материалы сайта, или контент, выводится на обозрение читателей не только в виде обычных статей, но и в виде модулей. Что вы видите первоначально, зайдя на любой сайт? - конечно, статью, - в силу того, что она занимает бОльшую часть окна. А со всех сторон от неё расположена другая информация, выводимая с помощью модулей: менюшки, голосования, вход на сайт, последние статьи, самые популярные статьи, баннеры, галереи, и т.д. и т.д. Все эти модули раскиданы по разным местам. Эти места не хаотичны, они строго прописаны в шаблоне, и именно эта роспись называется раскладкой.
Пример: допустим, вам понравился какой-то шаблон. На его демо-версии вы видите, что статьи выводятся слева, справа расположены модули меню. Вы сравниваете этот шаблон с другим и обнаруживаете, что теперь менюшки расположены слева, а статья передвинулась в правую часть. Так вот, это означает, что в первом случае в шаблоне не прописана позиция "left", т.е. сколько бы вы ни пытались перенести свои модули влево от статьи, у вас ничего не получится. То же самое и со вторым случаем, только наоборот.
Вывод: если вам важно, в каком именно месте должны на вашем сайте располагаться модули, то при выборе шаблона в первую очередь ориентируйтесь не на картинку (которую всегда можно заменить на свою), а на позиции для модулей.
Таким образом, расположение позиций вашего Joomla-сайта зависит от того шаблона, который вы используете. Ниже на рисунке изображены позиции стандартного шаблона, который установлен на Joomla! изначально, т.е. "по умолчанию". Он называется rhuk_milkyway. Рисунок и короткие объяснения к нему ниже помогут вам лучше понять структуру раскладки, чтобы вы представляли, как можно эту структуру изменить. Забегая вперёд, скажу, что изменить её можно с помощью Менеджера модулей (Расширения>>Менеджер модулей): выбираем здесь модуль и назначаем ему позицию. Как это делается,будет рассмотрено в разделе "Модули". В этом уроке мы просто познакомимся со стандартными позициями шаблона, которые обозначены цифрами с 1 по 10:
Иллюстрация 1
Увидеть позиции любого шаблона можно, набрав в браузерной строке название сайта и добавив к нему /?tp=1
Например, http://localhost/demo/?tp=1. Нажмите Enter, и вы увидите эти позиции.
Наиболее распространенные из них называются top, user1 - user6, left, right, header, footer, breadcrumb и newsflash.
1. В "top"- позиции модули "Banners" и "Newsflash" располагаются по умолчанию.
Модуль Баннеры позволяет вам разместить картинку, которая ведет на какой-либо URL. С баннерами мы работаем сначала через меню Компоненты>>Баннеры, где прописываем установки для них, а затем показываем созданный баннер с помощью модуля Баннер через Расширения>>Менеджер модулей нашей админки.
Модуль Newsflash показывает краткое содержание (или заголовок) одной, или нескольких статей в горизонтальной или вертикальной конфигурации. Через админку вы укажете, статьи из какой категории будут показаны в модуле Newsflash.
2. Модуль Top menu показывается в позиции "user3" по умолчанию .
3. Модуль Breadcrumbs размещается в позиции "breadcrumb" . Он показывает навигацию для посетителей сайта, - страницу, на которой посетитель находится в данный момент, и полный путь к этой странице.Это очень удобно для посетителей, особенно в случаях, когда меню содержит ряд подменю.
4. Модуль Search располагается в позиции "user4" . Он дает посетителям возможность поиска по сайту.
5. Несколько модулей располагаются слева, т.е. в позиции "left". В этой позиции вы можете разместить вертикальные меню, форму "Войти на сайт", другие модули, - в зависимости от своих нужд.
6. Модуль Latest News размещается в позиции "user1" . В нем показываются заголовки последних статей, добавленных на сайт. Вам только надо будет указать, из какой категории будут эти статьи, или не указывать категорию, и тогда будут показываться новые статьи из всех категорий. Очень удобно для тех, кто посещает ваш сайт часто.
7. Модуль "Popular" располагается в позиции "user2" . В нём показываются заголовки статей, которые читаются посетителями чаще всего. Иначе говоря, это заголовки популярных материалов сайта.
8. Это главная арена, предназначенная для публикации статей .
9. Модуль "Polls" - голосования - публикуется справа, т.е. в позиции "right" . Создать голосования можно через Компоненты>>Голосования, а потом опубликовать их в модуле "Голосования" через Менеджер модулей.
10. Модули "Banners" и "Footer" располагаются в позиции "footer". Вы можете использовать модуль "Footer" для показа полезных линков, копирайта, другой полезной информации в самой нижней части вашего сайта.
Позиции, что мы рассмотрели выше, относятся к стандартному шаблону Joomla!
под названием rhuk_milkyway. Когда вы будете подбирать шаблон для своего сайта, обращайте внимание не только на цветовое оформление, но и на раскладку: на одном шаблоне есть и правая, и левая позиции, на другом - только левая(правая). Есть шаблоны с четырьмя позициями, есть с более, чем тридцатью. Поэтому прежде, чем приступить к поиску, продумайте заранее, что хотите найти, и - вперёд! Предлагаю начать поиски с сайта Siteground.com . Здесь вы найдёте более ста бесплатных качественных шаблонов.
Комментировать материал через:
- Joomlalessons.ru
- Вконтакте
Поделиться: