Як змінити ширину шаблону 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"
Оцініть, будь ласка статтю