ЯК переробити шаблон сайту

Найпростіше створити сайт за допомогою шаблону. Однак щоб ресурс став виділятися, необхідно змінити стандартне оформлення. І тут без елементарних знань html і css не обійтися.

Інструкція

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

Навіть якщо повністю переробляти шаблон ви не збираєтеся, замініть більшість зображень, а особливо ті, що розташовані в якості логотипу. Замініть кожну картинку таким способом:

- відкрийте графічний файл в програмі Фотошоп;
- в меню «Зображення» - «Розмір зображення» подивіться його параметри;
- відкрийте новий аркуш з точно такими ж розмірами;
- створіть потрібне зображення з використанням інструментів програми;
- виконайте зведення всіх шарів і збережіть (не для web) нову картинку під тим же ім'ям і в тій же папці, задавши вихідний формат.

Таким чином, замість одного зображення повинне з'явитися інше.

Як тільки змініть всі картинки, заархівуйте папку з файлами (у випадку з Joomla) і завантажте її через адмінку сайту в меню «Розширення». Подивіться, чи коректно відображається тема з новими ілюстраціями.

Міняти інші параметри слід в style.css. Причому робити це набагато зручніше не через панель адміністратора, а на комп'ютері. Для якнайшвидшого перегляду результату перетворень розумно використовувати локальний хост (Денвер). Це дозволить уникнути необхідності довантажувати результат на сервер щоразу з метою перегляду результатів після чергової правки.

Скачайте безкоштовний плагін FireBug для Mozilla Firefox. Після установки в правому верхньому куті браузера з'явиться ікона жовтого жука. Клацніть по ній або натисніть клавішу F12 і в нижній частині екрана з'явиться код сторінці в згорнутому варіанті. Його можна розкрити, для цього потрібно навести миша на плюсики. А якщо натиснути на рядок елемента, у верхній частині екрану він виділиться. У правій стороні вікна з кодом ви знайдете стилі із зазначенням рядків, які відповідають за зовнішній вигляд. І відразу стане ясно, де потрібно відредагувати файл зі стилями, щоб змінити дизайн.

Відкрийте style.css в Notepad ++. Можна використовувати й інші програми, призначені для правки коду, проте з цією метою не можна застосовувати стандартний «Блокнот», інакше будуть помилки через кодування. За допомогою FireBug знайдіть потрібні параметри, підлягають зміни, і одночасно їх правте в Notepad ++.

Збережіть підсумковий варіант css і завантажте файл на сервер.