Joomla index html files

Joomla шаблон – структура, каталоги, файлы, формат

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

По шаблону пользователь должен сразу определить тематику сайта, а специфические элементы дизайна шаблона должны удержать его на сайте. Например, сайты медицинской тематики: сайты больниц и поликлиник, персональные сайты врачей, лендинг пейдж медицинской тематики.

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

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

Типовая структура каталогов шаблона

Все шаблоны CMS Joomla используют типовую структуру каталогов и файлов, однако она может несколько варьироваться от шаблона к шаблону.

Напомню, шаблоны нужны для смены внешнего вида сайта. В каталоге сайта шаблоны лежат в папке /templates. Например, если ваш шаблон называется «templateplus», он должен быть помещен в папку:

Path_to_Joomla/templates/templateplus

Кроме фасадного шаблона (front-end) есть шаблоны административной панели (back-end). Они лежат в папке /administrator/templates. Например, если ваш шаблон администратора называется «admintemplateplus», он будет помещен в папку:

Path_to_Joomla/administrator/templates/admintemplateplus

Каталоги Joomla шаблона

Типичный шаблон CMS Joomla! должен включать следующие каталоги:

• css — содержит все .css–файлы
• html — содержит файлы переопределения шаблонов для вывода ядра
• images — содержит все изображения, используемые шаблоном
• languages — содержит дополнительные языковые файлы, используемые шаблоном

В зависимости от сложности и дизайна, в каталоге шаблона может лежать папка:

• javascript, которая содержит поддерживающий JavaScript, используемый шаблоном для добавления ему функциональности.

Пример структуры с файлами

Типичный путь до шаблона вашего сайта: root/public_html/name_domainname/template/название_вашего_шаблона. Шаблон должен содержать следующие базовые каталоги и файлы.

• /css
• /html
• /images
• /javascript
• /language
• component.php
• error.php
• favicon.ico
• index.php
• templateDetails.xml
• template_preview.png

Файлы шаблона

Чаще всего шаблон имеет, как минимум следующие файлы:

• index.php
• component.php
• error.php
• favicon.ico
• template.css
• templateDetails.xml
• template_thumbnail.png (.jpg, .gif)

файл index.php

Обеспечивает логику отображения и позиционирования модулей и компонентов.

component.php

Предоставляет логику отображения страницы, удобной для печати, «Отправьте эту ссылку другу». и т.п.

error.php

Предоставляет метод обработки ошибок, таких как ошибка 404, страница не найдена.

favicon.ico

Файл значка favicon сайта. Иконка сайта.

template.css

Обрабатывает презентационные аспекты шаблона, включая спецификации полей, шрифтов, заголовков, границ изображений, форматирования списка и т. Д. Файлы .css также могут быть расположены в каталоге /css.

templateDetails.xml

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

template_preview.ext – формат .ext может быть заменен на .jpg, .png, .gif. Это скрин (эскиз) шаблона, который вы можете видеть на вкладке расширения>>>Шаблоны. Как правило, изображение размером 600×400 пикселей

templateDetails.xml

Обязательный файл для шаблонов Joomla и его можно найти в корневом каталоге шаблонов любого шаблона внутри Joomla шаблонов. Этот XML-файл содержит основные метаданные, необходимые системе для показа информации о шаблоне в административной панели сайта на вкладке Шаблоны.

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

Он также определяет языковые файлы шаблона, а также параметры и настройки, которые шаблон предложит в backend.

Файл templateDetails использует формат и структуру XML. XML- означает, что данные в этом файле разделяются на разделы и специально отформатированы для визуализации различных частей и параметров. XML-данные считываются и анализируются мощными инструментами Joomla! затем визуализируется для регистрации шаблона и создания отображения в «Менеджере шаблонов». Это предоставляет разработчикам шаблонов относительно простой способ создания настроек и параметров, используемых в шаблоне.

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

Коробочный шаблон Protostar для Joomla 3 служит отличным примером для демонстрации использования этого файла. Ниже описаны различные разделы этого файла.

Формат XML

Две верхние строки каждого файла templateDetails должны начинаться с определения формата XML и типа doctype.

Следующая строка также требуется, поскольку она сообщает Joomla! что данные в этом файле должны использоваться для расширения, в данном случае шаблона.

Между тегами … идут разделы со следующими тегами:

Имя шаблона, будет в списке шаблонов на сайте

Описание шаблона, будет на сайте

Далее в тегах, перечисляются все каталоги и файлы шаблона:

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

Вывод

В этой статье мы посмотрели на Joomla! шаблон «изнутри». Приблизительно такую структуру шаблона будем делать дальше, создавая шаблон Joomla своими руками.

Еще статьи

Источник

Создание базового индексного файла

index.php файл является ядром каждой страницы Joomla!. По сути, вы делаете обычну html-страницу, в которую вставляете PHP код, который будет вставлять содержание вашего сайта. Шаблон создается путем добавления кода в Joomla с указанием позиций модулей и компонентов в соответствующем разделе вашего шаблона. Все, что добавляется в шаблон будет отображаться на всех страницах, кроме разделов сформированных через систему управления сайтами Joomla (или индивидуальным кодом).

На этой странице мы покажем приготовленный базовый код, который Вы можете вырезать и и использовать в вашем дизайне.

Начнем

Шаблон Joomla начинается с следующих строк:

Первая строка предотвращает действия злоумышленников, которые хотели бы использовать код вашей страницы в своих целях.

Вторая строка-это Объявление типа документа (DOCTYPE), который сообщает браузеру (и Веб-краулерам) какой тип HTML-кода используется на вашей странице. Тип документа, используемый здесь совместим с HTML5, новой версией HTML, которая во многом сохраняет обратную совместимость, но содержит много новых возможностей. Вы должны знать, что это не будет хорошо работать в Internet Explorer 8 или более ранних без патчей. Вам стоит продумать это и учесть пожелания ваших клиентов, прежде чем решить, какой Тип документа использовать. Так или иначе указанный тип документа является основным в Joomla версии и более поздних.

Третья строка начинает наш HTML-документ и указывет язык сайта. HTML-документ делится на две части, заголовок (head) и тело (body). Заголовок будет содержать информацию о документе, а тело будет содержать код сайта, который управляет макетом.

Заголовок

  baseurl ?>/templates/system/css/system.css" type="text/css" /> baseurl ?>/templates/system/css/general.css" type="text/css" /> baseurl ?>/templates/template; ?>/css/template.css" type="text/css" /> 

Первая строка просит Joomla вставить соответствующую заглавную информацию. Это включает в себя Заголовок страницы, Мета-данные, а также код JavaScript. Следующие строки создают ссылки на две страницы стилей и собственную таблицу стилей (если это именованный шаблон.в CSS и находится в папке «CSS», в папке вашего шаблона каталога. Так что если ваш шаблон в http://www.mysite.com/templates/my_template/ тогда CSS-файлы будут идти в http://www.mysite.com/templates/my_template/css/ ).

Тело (Основная часть страницы)

Невероятно, но этого будет вполне достаточно! Да, это очень простой макет, но это будет работать. Все остальное будет сделано на Joomla!. Эти линии, обычно называют декларациями jdoc, которые сообщають Joomla запрос на вставку информации из определенных частей системы Joomla. Внимание: убедитесь, что ваше меню готово быть размещено в «верхней» позиции модуля.

Module Positions

Above, the line which says name=»top» adds a module position called top and allows Joomla to place modules into this section of the template. The type=»component» line contains all articles and main content (actually, the component) and is very important. It goes in the centre of the template.

Note: You can add your own module lines anywhere you want in the body, but you have to add a corresponding line to the templateDetails.xml file which sits alongside the index.php of your template.

End

Finish it off — one last bit:

Custom Images

If you want to add any images to the template you can do so like this:

Here the template variable will fill in the name of your template.

Custom CSS

You can add custom css like this:

baseurl ?>/templates/template;?>/css/styles.css" type="text/css" />

Every file which is added must have a line in the templateDetails.xml file for the template, unless it resides in a sub-folder (which can be included in a element).

Источник