Управление шаблоном uCoz. Шаблоны и Скрипты для ucoz Как делать шаблоны для ucoz

В наше время с процедурой создания сайтов знакомы очень многие. Сейчас это достаточно популярно, так как многие зарабатывают этим на жизнь. Что же мы должны знать о том, как создать свой шаблон для сайта ucoz, прежде чем начинать это делать? Самое основное - это то, что контенты для создания шаблонов сайтов существую платные и бесплатные .

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

Основные способы создания шаблонов

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

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

1. Первым и самым распространенным является создание шаблона с нуля. Шаблон обычно рисуют в программе Photoshop , затем его необходимо подверстать и адаптироваться под систему сайта uCoz.

2. Также можно создать шаблон из HTML-шаблона . Один из самых простых способов создания шаблона, так уже имеется готовый шаблон и нам необходимо его лишь разметить согласно правилам создания каркасного шаблона uCoz.

3. Еще один способ создания - это шаблон из PSD-макета . Достаточно нелегкий способ, который требует дополнительных знаний. У Вас имеется шаблон в виде PSD-файла . Его нужно открыть в программе Photoshop , разрезать и адаптировать, сохраняя файлами jpg , png , gif . После этого, верстать как обычную html-страницу .

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

Начинается с его тщательного планирования. Чтобы создать сайт необходимо определиться с его тематикой, подобрать дизайн, который будет эту тематику отражать. Создать сайт на uCoz проще, так как в саму систему уже встроено множество интересных дизайнов, которые Вы просто можете изменить под свои нужды.

Шаблон сайта - совокупность оформленных и сверстанных в HTML страниц, графических и служебных файлов, которые могут использоваться для создания типового сайта любой направленности. Как правило, шаблоны сайтов состоят из графических файлов дизайна распространенных форматов (PNG, JPEG, GIF), помещенных в отдельную папку; статических html-страниц и файлов таблицы стилей (CSS), а в некоторых случаях ещё и Flash.

Проще говоря, шаблон — это внешний вид (дизайн) Вашего сайта, который одинаковый на однотипных страницах. Благодаря существованию шаблонов, Вам не нужно на каждой странице прописывать один и тот же код: вставлять логотип сайта, делать заглавия одного цвета и т.д.

Шаблон сайта обычно состоит из каркаса и собстенно дизайна. Каркас — это основа, как скелет: блоки, линии, таблицы, куда будет нанизываться дизайн. А дизайн это красота Вашего сайта (цветовая гамма текста, шрифт, фон, картинки и т.д.). На сегодняшний день, чтобы не изобретать велосипед, можно скачать уже множество готовых шаблонов для любого сайта.

Сайты uCoz — Управление дизайном

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

Сверху, самым первым расположен Глобальный блок . Это основа Вашего дизайна.Блок этот состоит из контейнеров, и их количество зависит от дизайна Вашего сайта.

Верхняя часть сайта — редактируется шапка сайта, графика, рисунки и т.д.

Нижняя часть сайта — редактируется нижняя часть сайта, сюда можно поставить счетчики.

Первый контейнер (левый) — редактируются блоки, который находятся слева.

Второй контейнер (правый) — редактируются блоки, который находятся справа.

В Первый и Второй контейнеры вмешиваться нет вообще никакого смысла, так как их намного удобнее редактировать с помощью Конструктора в Админ-баре с самого сайта. (В статье «Управление сайтом. Первое редактирование «)

Шаблоны страниц сайта Ucoz

Почти каждый модуль сайта uCoz состоит из следующих шаблонов страниц:

Главная страница модуля — страница, на которой отображаются материалы всех разделов и категорий (общий список материалов)

Страница со списком материала раздела — страница, на которой отображаются материалы одного раздела (сколько разделов — столько страниц, на сайте uCoz может не быть ни одного раздела)

Страница со списком материала категории — страница, на которой отображаются материалы одной категории (на сайте должна быть хотя бы одна категория)

Все перечисленные выше страницы имеют практически одинаковый внешний вид.

Страница материала и комментариев к нему — страница, на которой непосредственно расположен добавленный Вами материал (статья, файл, фотография и т.д.)

Вид материалов — как будут выглядеть материалы в списке материалов на перечисленных первых трех страницах: Главная страница модуля, Страница со списком материала раздела и Страница со списком материала категории.

Страница добавления/редактирования материалов — форма добавления материала.

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

Очень скоро Вы поймете что и к чему!

Вот простой пример : допустим Вы хотите, чтобы на ВСЕХ страницах Вашего сайта было написано Ваше имя. Для этого Вам всего навсего нужно написать свое имя в шаблоне «Редактора страниц» и на всех страницах автоматически появится Ваше имя.

Или, Вы хотите, чтобы все файлы скачивались путем нажатия определенной кнопки, Вам достаточно один раз прописать это в соответствующем месте (Каталог файлов — Вид материала и комментария к нему) и больше не возвращаться к этому вопросу.

Но это простые примеры, на самом деле возможности эти намного-намного обширнее. Более того в интернете существует уже масса готовых примеров, где Вы просто копируете код и вставляете в свой шаблон, и Ваш сайт может обрести те функции которые Вы хотите.

На самом деле это действительно очень удобно. И как только Вы попробуете что-то менять, и у Вас начнет получатся, думаю, что вскоре Ваш сайт быстро измениться до неузнаваемости, например этот сайт — это переделанный стандартный дизайн uCoz №839.

Если Вы хотите первыми узнавать о новых статьях на сайте!!!

Расскажу на конкретном примере, как я сделал шаблон для uCoz. Это не подробная инструкция и не призыв к действию, это простой рассказ о том, как я сделал шаблон. Напишу о последнем шаблоне, есть даже видео. Хотел заснять весь процесс полностью, но как-то не стал тратить на это время, да и секретов пока не стал раскрывать, снял только создание макета и верстку.
У меня есть список идей для материалов и статей, которые нужно когда-то добавить на сайт, в этом списке сейчас 20 пунктов, мне же из этого списка нравится больше подобные темы, где не нужно давать инструкций, где я свободно говорю о том о сем.

1. Определился с тематикой
Хотел сделать что-то в тоже время нужное и не сложное. Кстати, у меня есть еще один список – это список тематик шаблонов.

2. Сделал макет (2 часа)
По структуре решил сделать простой и понятный шаблон. Заранее определился что вообще будет, а расположение элементов только примерно. Открыл фотошоп, посмотрел несколько аналогов, это интерфейсы на тему образования.

3. Сверстал (4-5 часов)
Тут все понятно. Сначала просто сверстал как есть, а потом добавил адаптивность под мобильные телефоны. Для этого случая не делал макет, придумывал на ходу. В видео есть момент, когда из-за ошибки у меня получился не такой вид материалов, как в макете, но мне он понравился, я его оставил.

4. Натянул шаблон на uCoz
Ну, не просто натянул и все, по плану было дорабатывать тему прямо в панели управления uCoz. Я так всегда делал и буду делать. Тщательно страницы не продумывал, но не считаю, что сделал как попало. Скорее, по простому, но и стандартными оставлять не хотел.

5. Собрал архив шаблона: раскидал код по файлам и написал инструкцию
Где-то 2 дня я писал инструкцию и распределял код по файлам и папкам. Это, думаю, можно было сделать за 2-3 часа.

6. Создал демо-сайт
Да, для шаблона сделал еще один сайт, чтобы проверить установку шаблона, проверить инструкцию. Обнаружил ошибки как в инструкции, так и в самом шаблоне. К тому же в это время проверял тему в разных браузерах, нашел еще больше ошибок. Все исправил.

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

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

Обычно я все долго, шаблон делаю в течении месяца, не торопясь. Тут я работал более интенсивно, в течении 10 дней. В этом промежутки есть дни, когда я никак не продвигал работу. Делаю долго не просто по своей лени, а из-за загруженности на учебе. С сайтом, в общем-то такая же ситуация.

Расскажу на конкретном примере, как я сделал шаблон для uCoz. Это не подробная инструкция и не призыв к действию, это простой рассказ о том, как я сделал шаблон. Напишу о последнем шаблоне, есть даже видео. Хотел заснять весь процесс полностью, но как-то не стал тратить на это время, да и секретов пока не стал раскрывать, снял только создание макета и верстку.

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

1. Определился с тематикой

Хотел сделать что-то в тоже время нужное и не сложное. Кстати, у меня есть еще один список – это список тематик шаблонов.

2. Сделал макет (2 часа)

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

Вот видео, как это было.

Видео изъято.

3. Сверстал (4-5 часов)

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

Видео изъято.

4. Натянул шаблон на uCoz

Ну, не просто натянул и все, по плану было дорабатывать тему прямо в панели управления uCoz. Я так всегда делал и буду делать. Тщательно страницы не продумывал, но не считаю, что сделал как попало. Скорее, по простому, но и стандартными оставлять не хотел.

5. Собрал архив шаблона: раскидал код по файлам и написал инструкцию

Где-то 2 дня я писал инструкцию и распределял код по файлам и папкам. Это, думаю, можно было сделать за 2-3 часа.

6. Создал демо-сайт

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

7. Сделал презентацию шаблона

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

8. Добавил шаблон на uTemplate

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

Обычно я все долго, шаблон делаю в течении месяца, не торопясь. Тут я работал более интенсивно, в течении 10 дней. В этом промежутки есть дни, когда я никак не продвигал работу. Делаю долго не просто по своей лени, а из-за загруженности на учебе. С сайтом, в общем-то такая же ситуация.