Установка нестандартного шаблона. Управление шаблоном uCoz Как сделать шаблоны для юкоз

Установка нестандартного шаблона

Лучший способ установить нестандартный шаблон, это воспользоваться инструкцией по установке, которая поставляется вместе с шаблоном. Если ее нет, то воспользуйтесь нашей универсальной инструкцией.

Установка шаблона состоит из нескольких шагов:

Загрузка файлов на сайт

Первым делом нужно загрузить на сайт файлы, которые поставляются с шаблоном. При этом важно соблюдать вложенность файлов в папки. Так, все изображения могут находиться в папке img , а скрипты - в js .

Чтобы создать папку, воспользуйтесь , кнопка «Добавить папку»:

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

Установка каркаса сайта

Позволяет сгенерировать однородную структуру для всех разделов сайта. Обычно он поставляется в.txt файлах и может иметь произвольное название ("Каркас.txt", "Конструктор шаблонов.txt" и т.д.).

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

Каркас сайта имеет свои уникальные переменные, которые помогут отличить его среди других файлов шаблона:

Попробуйте выполнить поиск строки или . Если они найдены в тексте, то скорее всего это файл каркаса.

Чтобы установить каркас, перейдите в раздел «Дизайн», в меню слева выберите пункт «Каркас», вставьте код из текстового файла, нажмите на кнопку «Установить» и подтвердите действие:

Вы увидите сообщение об успешном выполнении операции. Значит можно переходить к следующему шагу.

Установка шаблонов сайта

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

Шаблоны поставляются в текстовых файлах и для их размещения на сайте, нужно просто скопировать содержимое файла в редактор шаблона соответствующего модуля. Перейдите в раздел «Дизайн», в меню слева выберите пункт «Редактор». Найдите шаблон, код которого хотите добавить и скопируйте его в редактор. Сохраните изменения.

Повторите данное действие для всех текстовых файлов, которые поставляются с шаблоном. Когда закончите, переходите к следующему шагу.

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

Настройка модулей и расширений

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

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

Я решил написать некий гайд по созданию собственного дизайна на uCoz . Он будет состоять из 2-х частей. Во второй части рассказывается о самой вёрстке шаблона.

Обязательно прочтите о проблемах , которые вы можете встретить при создании 1-ого шаблона.

С чего начать при создании шаблона для uCoz?

Что такое шаблон для uCoz? Это лишь описание расположения элементов сайта и графический вид сайта.

Каким должен быть шаблон сайта ? Шаблон должен быть устроен так, что бы он «обрамлял» контент сайта, ни в коем случае не мешал пользователям. Пытайтесь создать шаблон, уникальный по своей идее, чтобы пользователи запоминали ваш сайт. К примеру, существует огромное кол-во вроде разных, но внешне очень похожих игровых шаблонов (все тёмные, в полоску). Когда пользователь будет открывать такой сайт, ему будет казаться, что здесь он уже был. Придумайте некую изюминку.

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

Советую первый свой шаблон делать фиксированным т.к. при вёрстке вам будет гораздо легче.

Сначала представьте, как будет выглядеть ваш будущий шаблон в общих чертах. Затем возьмите лист А4 и карандашом нарисуйте эскиз будущего дизайна. Так вам будет намного проще, к тому же нередко во время рисование приходят замечательные идеи. Именно на своём эскизе вы должны продумать устройство шаблона.

После чего вы можете смело включать Photoshop . Размер файла выберите равный разрешению вашего экрана (у меня 1280 на 1024 пикселей). Грамотно подойдите к выбору цветовой гаммы вашего будущего шаблона. В основу нужно брать 2-3 цвета, они должны гармонировать между собой. Цвета желательно должны быть естественными. Для выбора естественных цветов отлично подойдёт какая-нибудь фотография. Открываете её в фотошопе и через пипетку смотрите коды цветов.

В подборе цвета вам может помочь специальный сервис Color Wizard . Вводите в спец. поле код цвета и нажимаете «set».

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

Не забудьте хорошо продумать навигацию. Она должна быть удобной и интуитивно понятной

P.S. наткнулся на интересный блог об оптимизации/раскрутке. Нравится тем, что автор ставит опыты над поисковиками.

Создавая свой сайт каждый хочет чтобы его сайт отличался от других. Для этого нужен уникальный дизайн (купить в магазине шаблонов). В этой статье мы рассмотрим как создать свой уникальный дизайн из стандартного дизайна ucoz. Для того чтобы изменить дизайн под себя нужно зайти в раздел «Управление дизайном» в панели управления. Для этого авторизуйтесь в вебтобе системы ucoz и перейдите в раздел Дизайн> Управление дизайном(шаблоны) в панели управления. Откроется соответствующая страница.

В этом окне вы увидите из чего состоит дизайн сайта. Это отдельные компоненты, которые вместе составляют общий рисунок. Чтобы их изменять ucoz предоставил несколько инструментов которые мы сейчас разберём. В верхней части окна есть кнопка «Конструктор» с помощью которого вы сможете редактировать ваш сайт в окне браузера прямо на странице сайта. Пока давайте рассмотрим инструменты которые находятся в панели управления сайтом. Нажмите на кнопку «Верхняя часть сайта» и откроется окошко редактирования данного шаблона дизайна сайта.

Но многие не знают языка html поэтому мы выберем другой путь. Мы воспользуемся визуальным редактором. Нажмите кнопку визуальный редактор в нижней части окна. Откроется визуальный редактор верхней части шаблона.

Сверху вы увидите строку $WDAYS$ $DATE$ $TIME$ мы изменим их порядок так $DATE$ $WDAYS$ $TIME$. Под ней находится строка $USERNAME$, |Группа "$USER_GROUP$" | RSS которая означает что вы зарегистрировались под именем $USERNAME$ и входите в группу "$USER_GROUP$" изменим её на $USERNAME$, |Группа "$USER_GROUP$" | IP: $IP_ADDRESS$

IP: $IP_ADDRESS$ показывает ip зарегистрированного пользователя. Далее идёт запись МОЙ Сайт вы можете изменить её на что угодно в зависимости от того как называется ваш сайт. Далее нажмите кнопку сохранить для сохранения изменений. Таким образом вы можете изменять другие шаблоны входящие в дизайн сайта.
Чтобы без проблем пользоваться отредактированным шаблоном надо создать резервную копию. Она поможет в том случае если вы нечаянно испортите шаблон при редактирование. Чтобы создать резервную копию пройдите в раздел "редактирование шаблонов" и нажмите на кнопку "Backup шаблонов" и нажмите "резервное копирование шаблонов".

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

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

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

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

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

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

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

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

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

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

Минималистские и навороченные, цветные и однотонные, темные и светлые - шаблоны для uCoz , широкий выбор оформления сайтов. Конструктор сайтов uCoz стал популярным из-за своей простоты, доступности и универсальности. Как правило, пользователи этого движка - новички, которые не хотят изучать всякие языки программирования, а просто хотят создать какой-нибудь простенький портал. Сайты создаваемые в системе uCoz это как правило - игровые порталы, онлайн кинотеатры и варезы. Именно их тематике и посвящена большая часть шаблонов на сайте. Правда последнее время, с развитием смартфонов, многие стали уделять серьезное внимание и мобильным версиям сайтов, поэтому PDA-шаблоны - так же не останутся без внимания.

Шаблоны для uCoz можно разделить не только по "жанрам" - игровые, кино, программы, магазины и т.д. Но и по более глобальным разделам, а именно: Бесплатные, Платные, Уникальные, Адаптации. Адаптации хочется отдельно выделить, т.к это очень популярная тематика, поскольку шаблоны сделанные для одних движков - многие хотели бы видеть и на uCoz, или даже шаблоны некоторых сайтов. Я в частности как раз занимаюсь адаптацией шаблонов, отдельных элементов и скриптов со сторонних движков и сайтов - под uCoz.

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

Как устанавливать шаблоны на uCoz?

1. Скачайте архив с шаблоном и извлеките из него все файлы. Зайдите в панель управления и залейте необходимые файлы в корень сайта, через файловый менеджер или FTP.

2. Установка каркаса. Скопируйте код каркаса и вставьте в Конструктор шаблонов.

3. Установка стилей. Если файлы стилей CSS находятся в файловом менеджере, то в шаблон CSS - ничего вставлять не надо. Так например делаю я, поскольку при использовании специального шаблона стилей - есть вероятность что uCoz "сломает" что-нибудь в каркасе например, такой вот косяк системы. Впрочем если в скачанном шаблоне все же используется шаблон "таблица стилей CSS", то находите в вашем архиве соответствующий документ, копируете его содержимое - и вставляете в этот шаблон стилей.

Хотя я бы все же в этом случае порекомендовал создать например файл style.css и вставить все стили в него, а сам файл залить в файловый менеджер в папку css , ну а затем этот файл со стилями прописать в шаблоне или шаблонах между тегами таким образом .

О системе uCoz

UCoz - бесплатный хостинг и конструктор сайтов, созданный еще в 2005 году. На данный момент в системе имеется свыше 20 модулей, которые позволяют создать полноценный сайт самой разной направленности. uCoz быстро обрел популярность за счет своей простоты и доступности, хотя многие его за это и недолюбливают, впрочем недостатки - не отбрасывают преимуществ. Немного статистики: uCoz входит в 20-ку самых популярных интернет ресурсов в России, а также на нем создано уже более 1 миллиона сайтов!