Як адаптувати шаблон

Як адаптувати шаблон

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

Вам знадобиться

  • - шаблон сайту;
  • - програма Photoshop;
  • - суфікс для переглядача FireBug;
  • - редактор Notepad++.

Інструкція

1. Знайдіть у інтернеті відповідний шаблон сайту. Вивчіть пропоновані шаблони, звертаючи увагу на можливість їх адаптації до розмірів монітора, особливості розташування колонок і меню. Завантажте вибраний варіант. Перевірте його працездатність, заливаючи файли в корінь створюваного сайту. Якщо шаблон містить помилки, які виявляються в роботі, краще знайти інший варіант.

2. Змініть більшу частину зображень у шаблоні. Кожну картинку замініть наступним чином. Запустіть Photoshop та відкрийте один з графічних файлів шаблону. Перегляньте параметри зображення в меню "Зображення". Відкрийте новий аркуш з тими ж розмірами і створіть на ньому потрібне зображення. Збережіть результат у теку шаблону під назвою графічного файлу. Таким чином необхідно замінити всі значущі зображення.

3. Змінюйте інші параметри з використанням каскадних таблиць style.css - формальної мови програмування, що описує вигляд документа. Такі зміни зручніше вносити через панель адміністратора, а результати краще переглядати на локальному хостингу, щоб не завантажувати на сервер кожне оновлення.

4. Завантажте і встановіть безкоштовне розширення FireBug для свого браузера. У верхньому правому куті вікна переглядача повинна з 'явитися іконка із зображенням жовтого жучка. Натисніть кнопку миші і натисніть кнопку F12. Внизу екрана з 'явиться згорнутий код сторінки. Його можна розкрити, якщо навести курсор на плюсики. Натиснувши на рядок елемента, ви можете побачити, як він виділяється вгорі екрана. У правій частині вікна з кодом містяться стилі, які відповідають за вигляд сторінки.

5. Відкрийте шаблон у редакторі Notepad++. Знайдіть за допомогою FireBug параметри, що підлягають зміні, та відредагуйте їх у Notepad++.

6. Збережіть результат і завантажте створений сайт на сервер.