Совет 1: Как изменить ширину шаблона joomla

Joomla является одной из самых настраиваемых и дружелюбных по отношению к пользователям CMS. Используя возможности данной системы управления сайтами можно не только наполнять сайт различным функционалом, но и изменять его внешний вид на основе установленных шаблонов.
Инструкция
1
Откройте главную страницу вашего сайта. В меню используемого браузера выберите функцию просмотра исходного кода страницы. В Google Chrome данный инструмент расположен в «Инструменты» - «Просмотр исходного кода», в Firefox – «Веб-разработка» - «Исходный код». Если вы используете Opera, то для просмотра HTML-кода выберите «Вид» - «Средства разработки» - «Исходный код».
2
Найдите дескриптор и посмотрите все div и их названия. Откройте файл template.css вашего шаблона при помощи любого текстового редактора и найдите блок, в котором явно задана ширина width. Например, если после стоит , то в файле template ищите название block. Для упрощения поиска можно воспользоваться функцией «Правка» - «Найти» окна редактора. Просмотрите все div, указанные в исходном коде страницы.
3
В параметре width введите нужное значение в процентах или пикселях. Просмотрите остальные блоки, которые имеют такие же значения ширины, и аналогичным образом измените их. Например, если вы в главном слое прибавили к ширине 200 пикселей, то нужно прибавить эти же 200 пикселей и в другие блоки.
4
После окончания внесения изменений сохраните файл и посмотрите полученный результат, при необходимости подредактируйте template.css еще раз. Если в качестве фона блоков в шаблоне применяются изображения, то скорее всего придется изменить и их размер. Также для каждого div вы можете задать собственный фоновый цвет, который может заменить однотонную картинку. Если в дизайне сайта присутствует логотип, то его вы сможете растянуть при помощи любого графического редактора. В шаблонах также можно использовать свои изображения.

Совет 2: Как отредактировать шаблон joomla

Для придания индивидуальности сайту веб-мастером устанавливается оригинальный шаблон, ведь дизайн — это лицо сайта. Большое количество сверстанных макетов сегодня можно скачать из интернета, причем они будут иметь вполне приятный вид. Обычно шаблоны, которые были скопированы из сети, редактируют, чтобы сайт был уникальным.
Вам понадобится
  • - программа просмотра изображений;
  • - FileZilla;
  • - текстовый редактор Notepad++.
Инструкция
1
Для просмотра и редактирования файлов своего шаблона воспользуйтесь программой FileZilla. С ее помощью вы можете работать с конфигурационными файлами в online-режиме. Как правило, для изменения дизайна сайта обрабатывают 3 файла: index.php, template.css и templateDetails.xml.
2
«Шапкой» сайта называется элемент страницы, который идет от самого верха до начала контента, отсюда и такое название. Также его называют хедером (header). Как правило, в «шапке» сайта подлежит замене только логотип или любое другое изображение (logo.jpg). Расположение логотипа сайта находится в файле template.css. Откройте его при помощи Notepad++.
3
Для выполнения поиска какого-либо значения необходимо воспользоваться опцией «Поиск элемента»: нажмите сочетание клавиш Ctrl + F и в пустом поле введите искомое значение. Если вы хотите изменить ширину или высоту изображения в «шапке», введите в строке поиска слово header и нажмите клавишу Enter.
4
Ниже искомого слова вы увидите строки: Height (высота) и Width (ширина). Измените эти значения, затем нажмите сочетание клавиш Ctrl + S, чтобы сохранить изменения. В появившемся диалоговом окне FileZilla нажмите кнопку «Да».
5
Перейдите на сайт, чтобы просмотреть изменения. Если вас они не устраивают, вернитесь к файлу и введите новые значения.
6
Для изменения размера и наименования шрифта на главной странице сайта, воспользуйтесь поиском. Введите слово body и нажмите клавишу Enter. Ниже этого оператора есть строки font-family (наименование) и font-size (размер или кегль). Измените их значения, сохраните изменения и перейдите к сайту, чтобы их просмотреть.
7
Для изменения характера отображения ссылок необходимо в поисковой форме ввести поочередно значения a: link (стандартная ссылка), a: visited (посещенная ссылка) и a: hover (активная ссылка). Нажмите Enter, чтобы найти эти элементы в файле template.css.
8
Отредактируйте параметры font-size (размер шрифта) и color (цвет ссылки). После их изменения вы наверняка заметите, что не все ссылки приобрели другой цвет или размер шрифта. В этом случае вам необходимо искать альтернативные варианты размещения ссылок. К примеру, те, которые остались неизменны, располагаются в главном меню, следовательно, вам необходимо произвести поиск созвучного элемента.
9
Введите в поиск слово «Главное» и нажмите Enter. Скорее всего, вы окажетесь рядом с элементами left col link и left col current link, значение которых вам необходимо изменить. После их редактирования сохраните результат и перейдите к странице сайта, все ссылки, находящиеся на загруженной странице, должны внешне измениться.
Видео по теме
Обратите внимание
Помните, что каждый блок размещается в другом блоке, а потому зачастую необходимо изменить размер и других div-ов.
Полезный совет
Все файлы шаблонов находятся в корневой директории сайта, в папке Templates. Там же лежит файл template.css.
Источники:
  • как изменить joomla шаблоны
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500