Теперь рассмотрим следующую группу инструментов.
Инструменты заливки
Заливка. Щелкните по этому инструменту и удерживайте левую клавишу мыши, раскроется меню выбора: градиент и заливка.
Здесь можно выбрать необходимое.
Ведро - заливает изображение (выделение) цветом или текстурой.
Итак, для заливки имеем следующие параметры:
Заливка (fill) - определяет, что использовать в качестве "краски": основной цвет (foreground)зальет основным цветом, шаблон (узор - pattern) зальет некоторым узором.
Шаблон (pattern) - узор для заливки.
Режим (mode) - способ наложения пикселов, значений много и рассматриваться будут по мере необходимости.
Непрозрачность (opacity) - определяет степень прозрачности заливки.
Допуск (tolerance) - диапазон цветов для заполнения.
Галочка сглаживание означает смягчить края перехода.
Попробуем на деле:
Возьмите инструмент заливка (щелкните по ведру), подведите его вовнутрь выделения, сделанного на предыдущем шаге, и щелкните мышкой. Наше выделение окрасится в цвет переднего плана (по умолчанию - черный).
Теперь на панели параметров выберете: Заливка -> Узор, Узор -> любой понравившийся.
Снова подведите наше ведро вовнутрь выделения и щелкните. Теперь оно залито шаблоном и выглядит так:
Обратите внимание, в открывающемся окне шаблонов, представлена лишь небольшая их часть. Если щелкнуть по стрелочке справа, то откроется меню, внизу которого указаны другие коллекции шаблонов. Их можно добавить к имеющимся.
Градиент. Создает заливку с плавным переходом между двумя или несколькими цветами.
Рассмотрим панель параметров:
Если щелкнуть по срелочке справа, то откроется палитра с вариантами градиента, при двойном щелчке перед стрелкой откроется окно редактирования градиента (здесь можно настроить свои варианты градиента).
Определяет вид градиента (слева направо - линейный, радиальный, угловой, отраженный, ромбовидный).
Инверсия (reverse)- галочка указывает геометрически перевернуть градиент.
Дизеринг (глубина - dither) - галочка указывает сгладить для уменьшения сегментации.
Прозрачность (transparency) - галочка указывает на использование прозрачности.
Попробуем на деле:
Создайте новый файл, возьмите инструмент прямоугольное выделение и растяните его в виде прямоугольника, затем на панели инструментов щелкните по иконке градиента, на панели параметров щелкните по стрелочке и выберите понравившийся градиент, правее выберите вид градиента (любой).
Обратите внимание на первые два квадратика в открывающемся окне выбора градиента. Они используют цвета, установленные вами, как цвета переднего плана и фона (цветные квадратики внизу панели инструментов). Первый градиент осуществляет плавный переход из основного цвета в фон, второй - из основного цвета в прозрачность.
Теперь подведите курсор мыши к середине левой стороны нашего выделения, нажмите левую клавишу мыши и, не отпуская, протяните линию до середины правой стороны(рис.1)
Теперь протяните линию градиента по диагонали (рис.2)
А теперь сверху вниз (рис.3)
Посмотрите на разницу и поэкспериментируйте с различными градиентами и их видами.
Сохранение изображения
Наш урок подходит к концу, осталось только научиться сохранять наши шедевры.
Щелкните пункт меню Файл (File), в отрывающемся меню вы увидите привычный пункт -Сохранить Как (Save As)- и новый - Сохранить для Web (Save for Web). Разберемся какой для чего.
Если вы работаете над изображением и хотите иметь возможность изменять его в будущем, то следует выбрать пункт меню - Сохранить Как (Save As)
Где сохранять и какое имя дать - ваше личное дело, а вот формат будет *.PSD;*.PDD. Именно в этом формате сохраняются все ваши настройки (у нас их пока нет, но позже появятся). Таким образом, сохраняется не картинка целиком, а сохраняются ее части, каждую из которых вы сможете изменить когда захотите.
Если же ваше изображение готово, то выбирайте пункт меню - Сохранить для Web (Save for Web). Изображение будет сохранено оптимизированным для Интернета (т.е. с наилучшим сочетанием качество\размер файла). Отрывшееся окно сохранения следует рассмотреть подробнее:
Четыре вкладки наверху предлагают посмотреть варианты изображения:
Оригинальный (original) - изображение как оно есть. Как правило, большой размер файла, недопустимый для web.
Оптимальный (optimized) - оптимальное соотношение качества и размера файла с точки зрения программы.
2-up, 4-up - соответственно два и четыре варианта изображения рядом, внизу каждого указан размер. Вы можете выбрать оптимальный на ваш взгляд.
В правом верхнем углу этого окна задаются дополнительные настройки:
Здесь можно выбрать формат сохраняемого изображения. Общие рекомендации - используйте форматы JPEG и PNG для фотографий с тонкими реалистичными цветовыми переходами, формат GIF - для контрастных, малоцветных рисунков. Кстати, все рисунки на этой страницы сохранены в формате GIF.
Если вы используете вкладки, рассмотренные выше, то настраивать эту часть окна необязательно, по крайней мере, на этом этапе.
Итак, выбирайте самое оптимальное изображение на ваш взгляд и щелкайте по кнопке Сохранить (Save). Откроется уже привычное окно сохранения, где следует указать Папку (куда сохранить) и Имя файла, остальное будет уже указано, снова щелкаем по Сохранить (Save). Изображение для web готово.
На этом первый урок закончен. Вы научились создавать новый файл, выделять области и заливать их различными способами (цветом, шаблоном и градиентом), а также сохранять изображения в нужном формате.
Чтобы закрепить эти навыки, поэкспериментируйте (создавайте разные по форме области и заливайте их различными способами).
На следующем уроке вы научитесь работать с текстом и познакомитесь с основным понятием программы - слоями.
После установки системы управления Joomla на локальный или виртуальный сервер, перед нами встаёт вопрос: как установить шаблон и где его скачать? В этом уроке мы рассмотрим, как же установить шаблон в Joomla и какие способы установки шаблонов существуют. Выбор и установка шаблона, является важным этапом, которому стоит уделить особое внимание. Так же я приведу примеры и решение проблем, которые могут появиться во время установки шаблона.
- перейти к просмотру
Руководство по установке шаблона в Joomla 3 версии смотрите по ссылке выше!
Установить шаблон в Joomla можно двумя способами: с помощью стандартной установки Joomla установить/удалить и вручную, путем копирования файлов шаблона в папку templates.
Способ первый. Устанавливаем шаблон в Joomla стандартным установщиком.
Для начала скачиваем шаблон который хотим установить. После того, как архив с шаблоном скачан, необходимо убедиться, что в скачанном архиве находится именно шаблон, а не архив с шаблонами или как очень часто бывает, что в архиве, содержится еще несколько архивов. Архив Шаблона Joomla должен иметь расширение zip, а в архиве обязательно должны находится файлы:
- templateDetails.xml - используется для инсталляции шаблона в административном интерфейсе;
- index.php - содержит всю структуру (код) шаблона.
- params.ini - необходим Joomla для сохранения ваших настроек
Так же убедитесь, что в архиве находятся папки:
- css - содержит таблицы стилей
- images - в этой папке содержатся изображения, использующиеся в шаблоне
- js - файлы сценариев JavaScript (jquery.js , mootools.js , scripts.js )
В примере не все файлы и папки которые находятся в шаблоне Joomla. Количество файлов и папок зависит от самого шаблона, я лишь перечислил только те, которые в основном есть во всех шаблонах joomla и без которых шаблон не будет работать.
Например, если вы скачали шаблон, а в архиве находится еще несколько архивов, тогда по этим признакам можно легко определить, какой из архивов является шаблоном и установить его.
Следует отметить, что выбирая шаблон, нужно обращать внимание на дату его выпуска и насколько он соответствует той версии Joomla, с которой Вы работаете.
Например, некоторые из шаблонов более раннего выпуска уже не работают в версии Joomla 1.5 или отображаются некорректно.
Примечание: Архив с шаблоном для установки через стандартный установщик установить/удалить должен иметь расширение.zip или.tar.gz
В административной панели выберите "Расширения" - "установить/удалить" Далее выберите архив с вашим шаблоном на вашем компьютере и нажмите кнопку "Загрузить файл & Установить ". Если шаблон соответствует вашей версии Joomla через несколько секунд шаблон будет загружен и установлен, вы увидите сообщение, что шаблон успешно установлен.
После того, как шаблон установится выберите "Расширения" - "Менеджер шаблонов". В Менеджере шаблонов вы увидите все установленные шаблоны и шаблон который только что установили. (По умолчанию, в Joomla уже установлены два стандартных шаблона: rhuk_milkyway и JA_Purity) Выберите нужный шаблон установив переключатель напротив шаблона и нажмите кнопку "По умолчанию".
Второй способ установки шаблона в Joomla
Этот способ можно использовать когда необходимо установить большое количество шаблонов или просто бывают случаи когда шаблон не устанавливается стандартным способом установить/удалить.
Для установки шаблона этим способом нужно распаковать архив с шаблоном в папку (имя папки может быть любое, главное английскими буквами) . Далее запускаем FTP - клиент и открываем папку /templates на сайте для которого устанавливаем шаблон и закачиваем в нее нашу папку с шаблоном.
Если ваш сайт находится на локальном сервере, тогда нужно просто скопировать нашу папку в папку /templates/. Если хотите изменить название шаблона, тогда в папке шаблона нужно найти файл templateDetails.xml, открыть его блокнотом или любым текстовым редактором и найти строчку с тегом
Как я уже говорил, что по умолчанию, в Joomla уже установлены два, иногда три стандартных шаблона: rhuk_milkyway и JA_Purity, которые вы можете смело использовать при создании вашего проекта.
На сегодняшний день выбор шаблонов для сайта очень велик, и разработчики даже делят их по тематике: шаблоны для бизнес сайтов, для развлекательных порталов, праздничные, недвижимость, музыка, социальные сети, кино, видео, спорт, туризм и многие другие.
Стоит отметить, что некоторые из шаблонов созданы на коммерческой основе и, прежде чем их использовать, необходимо оплатить разработчику, в противном случае это будет считаться нарушением авторских прав. Поэтому прежде чем устанавливать на сайт тот или иной шаблон проверьте автора, их сейчас огромное количество, и на каких условиях он предоставляет шаблон для использования.
Если шаблонов загружено большое количество, а Вы не помните название нужного шаблона, то при наведении на ссылку с названием каждого из списка, Вы можете просмотреть его миниатюру.
При выборе шаблона также нужно обращать внимание на его структуру, блоки и позиции, которые он в себя включает. Ведь прежде, чем создавать сайт, наверняка Вы уже спланировали , что и где будет на нем располагаться: будет ли хедер (обычно это картинка, размещенная сверху, его еще называют шапка сайта), логотип, верхнее или вертикальное меню, количество блоков на странице и т.д.
Для того, чтобы проверить позиции в том или ином шаблоне можно набрать в адресной строке браузера http://ваш сайт/?tp=1 и перед Вами предстанут все возможные позиции шаблона и их названия.
WordPress — это целая система управления контентом сайта с открытым кодом. А это значит, что пользователь не столкнется с ограничениями в доработке, модифицировании и усовершенствовании продукта. Как считают сами разработчики, если на WordPress, это позволит в будущем избавиться от многих ошибок и недоработок.
Прежде чем мы приступим непосредственно к установке выбранного вами на хостинг, для начала выясним, что же такое движок и насколько просто с помощью него управлять сайтом.
Полученный ZIP-файл необходимо распаковать при помощи любого архиватора. Вот так выглядят разархивированные файлы:
- Этап 2: домен и хостинг
Чтобы приступить к установке всех необходимых файлов на сайт, для начала необходимо приобрести хостинг и домен.
Домен - это адрес или имя сайта, который непосредственно привязан к хостингу. Он должен отражать деятельность создаваемого сайта, легко восприниматься на слух, интуитивно ассоциироваться и запоминаться. Зарегистрированный домен полностью принадлежит его владельцу. Как правило, хостинговые компании предоставляют полный пакет услуг по обслуживанию сайтов в сети. Поэтому, скорее всего, вам повезет зарегистрировать домен и приобрести хостинг в одном месте.
Домен к хостингу привязывается при помощи DNS-серверов. С помощью них выдается информация как компьютерам искать друг друга посредством интернет. При наборе адреса сайта в браузере, провайдер осуществляет его проверку через сервер доменных имен (DNS).
Каждый сервер в сети имеет свой IP-адрес (это определенный набор цифр, к примеру - 192.168.0.1). Доменное имя не всегда может иметь один и тот же IP, яркий тому пример - перенос сайта на другой хостинг. Смена хостинг-провайдера - фактически переезд на другой сервер. Именно поэтому механизм обнаружения сайта в интернете выглядит таким образом:
http://www.your-site.ru – DNS-сервер - 192.168.0.1 - получение содержимого сайта
После покупки хостинга пользователь получает все необходимые доступы для управления сайтом, в том числе адреса DNS-серверов, которые после необходимо прописать в настройках домена.
- Этап 3: копирование файлов движка на FTP-сервер
На первом этапе установки мы скачали и разархивировали пакет CMS WordPress. Заливаем полученные файлы на хостинг.
Что необходимо:
- Доступ на FTP-сервер (выдается провайдером после покупки хостинга);
- FTP-менеджер (с помощью него файлы заливаются на сервер).
FTP-менеджер (или FTP-клиент) - специальная программа для более простого доступа к FTP-серверу, отображает файлы на удаленном сервере. Наиболее известные клиенты для доступа к удаленному серверу - FileZilla, Total Commander и др.
При помощи FTP-клиента необходимо скопировать полученные файлы движка в корневую директорию сервера PUBLIC_HTML или WWW.
- Этап 4: создание базы данных
После того как файлы WordPress движка установлены, к нему необходимо подключить базу данных, но для начала ее необходимо создать.
У разных хостинг-провайдеров механизм создания базы данных может немного отличаться, но в целом является однотипным.
MySQL – одна из самых популярных и распространенных баз данных c открытым исходным кодом. СУБД обеспечивает максимальное быстродействие, которое достичь другими средствами было бы значительно тяжелее. Однако настоящую популярность MySQL получила благодаря великолепному взаимодействию с PHP (специальный язык программирования для создания веб-страниц).
В панели управления хостингом в пункте меню MySQL предстоит выполнить несколько шагов по установке.
- ввести имя базы данных;
- создать пользователя базы данных (администратора) - их может быть несколько;
- прописать имя и пароль;
- обозначить права (привилегии) доступа пользователей к базе данных.
- Этап 5: редактирование файла wp-config-sample.php
Один из шагов установки WordPress на хостинг - изменение некоторых параметров, необходимых для доступа к MySQL.
В файлах, загруженных на сервер находим wp-config-sample.php и переименовываем его в wp-confiq.php. Открываем файл для редактирования.
- DB_NAME – название базы данных
- DB_USER – пользователь базы данных
- DB_PASSWORD – пароль для пользователя
- DB_HOST – адрес сервера БД, у многих localhost, но не всегда
- DB_CHARSET – кодировка по умолчанию utf8, ее менять не нужно
Здесь необходимо указать имя загруженной базы данных, имя пользователя, пароль и не забыть сохранить изменения.
- Этап 6: инсталляция WordPress
Запускаем скрипт установки WordPress. В строке браузера необходимо набрать http://www.your-site.ru/wp-admin/install.php, где www.your-site.ru - имя вашего сайта.
(желательно на русском)
Здесь вводим имя сайта и e-mail и жмем «Установить WordPress».
Способ 1
После того, как выбор шаблона сделан, например, и архив с файлами темы перед вами, приступаем к процессу его установки на сайт. В административной части сайта во вкладке «Внешний вид» выбираем пункт «Темы» и переходим на страницу управления шаблонами.
Следуем на вкладку «Установить темы» — «Загрузить».
Осталось только активировать установленный на сайт WordPress шаблон.
Способ 2
Еще один способ установки шаблона на сайт - воспользоваться FTP-клиентом. Соединяемся с сервером хостинга, после чего в папку с темами распаковываем нужный архив. Установленные темы сайта можно найти здесь:
/www/your-site.ru/wp-content/themes/
Активация темы осуществляется через Консоль движка.
Сразу же после установки сайта на хостинг необходимо осуществить несколько базовых настроек. Все они доступны через административную панель сайта, попасть в которую совсем не сложно: your-site.ru/wp-admin.
- Общие настройки (Общие)
В меню «Параметры» в разделе «Общие настройки» необходимо ввести название сайта, краткое описание к нему, адрес, выбрать часовой пояс, формат даты, времени и т.д.
С настройками данного раздела не должно возникнуть особых проблем, однако для нормального функционирования сайта нужно сделать это обязательно.
- Настройки публикации (Написание)
Размер текстового поля. Общее количество строчек окна, в котором создается текст статей. При превышении этого значения, появляется прокрутка окна.
Форматирование.
Галочка напротив преобразования смайлов в картинки позволит заменять стандартные обозначения «улыбочек» в картинки из базового набора WordPress.
Автоматическое исправление некорректного XHTML-кода позволит WordPress самостоятельно прописывать более правильный код с точки зрения валидации. Однако включение данной функции чаще всего создает массу проблем, поэтому рекомендовано все же ее не включать.
Основная рубрика. Из списка существующих на сайте рубрик можно выбрать одну наиболее используемую. При написании новой статьи для сайта, указанная рубрика будет выбрана автоматически.
Публикация через e-mail. Публикация статей посредством электронного ящика. Для этого необходимо указать почтовый сервер, логин, пароль и рубрику для публикации. Что важно отметить, почта должна иметь POP3 доступ.
Удаленная публикация. Использование внешнего редактора (блог-клиента) для написания статей и их редактирования.
Сервисы обновления. Список необходимых сервисов поможет значительно ускорить индексацию ресурса, увеличить скорость попадания каждой новой публикации в индекс поисковиков.
- Настройки чтения (Чтение)
На главной странице отображать. Отметка напротив «Ваши последние записи» позволит выводить на Главную страницу сайта последние публикации. Статическая страница чаще всего используется на сайтах небольших объемов с редко обновляемым контентом.
На страницах блога отображать. Для установления количества записей на странице сайта, необходимо учитывать его дизайн. Обычно это значение меняется уже после наполнения ресурса контентом.
В RSS-лентах отображать. Подписчики RSS-ленты будут получать последние записи в указанном здесь количестве.
Для каждой статьи в ленте отображать. «Полный текст» удобен подписчикам возможностью сразу прочесть полный текст последних опубликованных записей, при условии, что их количество не так велико в ленте.
«Анонс» (усеченный текст публикации) удобен владельцу сайта для повышения посетителей.
Кодировка страниц и лент. Кодировка страниц - набор симоволов, с помощью которых сайт будет отображаться в сети. Значение UTF-8 по умолчанию рекомендуется не менять.
- Настройки обсуждения (Обсуждение)
В данном разделе настраиваются оповещения других ресурсов о публикации новых статей, комментарии, черный список, аватары и т.д.
Сложностей в настройке данного раздела возникнуть не должно. Практически к каждому пункту имеются небольшие описания.
- Настройки медиафайлов (Медиафайлы)
Данный раздел отвечает за размещение и отображение медиафайлов на сайте, которые были загружены на сервер при помощи панели управления WordPress.
Размеры изображений. При загрузке изображений на сайт пользователь сможет выбрать, в оригинальном размере или в одном из двух предложенных уменьшенных разместить его на страницах ресурса.
Объекты. В данном пункте можно выбрать внедрение медиа файла на страницу сайта по заданным параметрам.
По умолчанию все загруженные файлы будут размещаться в папке wp-content/uploads. При включении опции «Помещать загруженные мной файлы в папки по месяцу и году» WordPress автоматически будет создавать подкаталоги по дате загрузки медиафайлов.- Настройки приватности (Приватность)
Блокировка поисковых систем удобна в том случае, когда ваш сайт находится на стадии разработки.
- Настройки постоянных ссылок (Постоянные ссылки)
Настройки WordPress позволяют выбрать один из четырех вариантов для отображения URL-адресов.
В «Общих настройках» в пункте «Произвольно» есть возможность прописать специальные теги, которые будут отвечать за отображение элементов в ссылке. Ссылки можно настроить на свое усмотрение, прописав определенные теги:
%year% - год;
%monthnum% - месяц;
%day% - день публикации статьи;
%hour% - час;
%minute% - минута;
%second% - секунда;
%postname% - заголовок;
%post_id% - порядковое число статьи;
%category% - рубрика (категория);
%tag% - тэг (метка);
%autor% - имя автора.
Важно: во избежание ошибок в случае использования вышеописанных тегов, необходимо установить плагин Rus-to-Lat. Данное приложение для правильного формирования ссылок способно переводить буквы русского алфавита в латиницу.
Рассажу-ка, как залить (загрузить) сайт на хостинг. Причем выложу две инструкции:
- КРАТКАЯ СПРАВКА - для тех, кто шарит, просто им нужна подсказка;
- ПОДРОБНАЯ ИНСТРУКЦИЯ - для тех, кто в танке и вообще не понимает ничегошеньки. Все мы такие были - это нормально. Выложила все, с том числе ссылки и картинки. Пользуйтесь на здоровье!
Краткая справка как залить сайт на хостинг
Быстро и по сути:1) Покупаете хостинг (). Там есть пробный период (по-моему 5 дней), кстати - как раз потренироваться заливать сайты и страницы. С покупкой вы получаете три параметра: Хост, логин и пароль. Их используют для подключения и загрузки.
2) Скачиваете FTP-клиент (программа). Самая популярная и удобная - FileZilla . Запускаете. И да, если FileZilla не устанавливается (бывает на древних компах и нетбуках), то пробуйте Total Commander. Принцип работы тот же, но интерфейс DOSовский. А так все одинаково.
3) Вводите в верхнее поле: Хост (или Сервер), Имя пользователя (или Логин) и Пароль. Их высылает хостер при покупке хостинга. См. e-mail.
4) ЛЕВАЯ ЧАСТЬ показывает проводник и содержание папок в компьютере. ПРАВАЯ ЧАСТЬ показывает проводник и содержание папок на хостинге. От том, что вы подключились будет сообщение, а также в окне справа появиться папка с названием сайта (доменом).
5) Слева откройте папку, откуда будете заливать файлы на хостинг. Справа зайдите в папку с названием сайта на стороне хостинга, например, "mysite.com". Затем папку "www".
6) Слева выбираете файл для заливки, нажимаете на него правой кнопкой мышки и жмете "Закачать на сервер". Поздравляю, вы залили страницу в Интернет! Теперь можете проверить, как она отображается в браузере.
ОБРАТИТЕ ВНИМАНИЕ:
ВАЖНО №1: Корневая папка сайта - "www" . В ней должна лежать - ГЛАВНАЯ СТРАНИЦА САЙТА, то есть файл index.html или index.php. А также другие файлы и папки соответственно, если они есть.
ВАЖНО №2: при последующих заливках обратите внимание, в какую именно папку вы заливаете файл! если, например, вы хотите залить картинку в папку images, убедитесь, что именно она открыта со стороны хостинга!
Вот собственно и все о том, как добавить сайт в Интернет . Если не получилось по короткой инструкции или что-то непонятно, читайте полное руководство ниже.
ПОДРОБНАЯ ИНСТРУКЦИЯ как закачать сайт на хостинг
Для тех, кто ничего не понял, со всеми деталями, картинками, пояснениями и скриншотами!
Так сказать инструкция для девушек (блондинок, брюнеток и рыжих, поскольку дамы с дредами и синими волосами и так знают, как это сделать).
Дорогие мои, никого не хотела обидеть, но первое предложение с приметками отсеяло всех мужиков:Р. Что важно!
В последнее время несколько раз сталкивалась с тем, что закончившие онлайн курсы по дизайну не знают как заливать сайты на хостинги.
Для меня когда-то загрузка сайта в Интернет тоже была тайной за семью печатями... Но стоит раз попробовать и ситуация проясняется.
Сайт на самом деле - это папка с файлами, которые могут быть сверстаны в форматах HTML и иногда плюс PHP* и скрипты (программная часть в виде кода).
По умолчанию мы берем ситуацию:
- У вас УЖЕ ЕСТЬ ГОТОВЫЙ сайт, просто он на домашнем компе, а не в Интернете.
- Вы купили домен к нему, а возможно, и хостинг. ( - но вы можете выбрать любую контору. Принцип размещения сайтов в Интернете одинаковый везде).
Тут чуточку остановимся для объяснений.
Сайт может выглядеть так:
1. index.html (или index.php) – главная страница сайта (название index дается главной странице сайта и любой папке по умолчанию на всех сайтах в интернете)
2. index.css – файл, где прописан стиль страницы (цвет подложки, размер окон, шрифт)
3. папка images – картинки для дизайна страниц
4. page1.html (или page1.php) – любая страница сайта, но не главная
5. page2.html (или page2.php) – любая страница сайта, но не главная
6. page3.html (или page3.php) – любая страница сайта, но не главная
Допустим, такого вида:
ПОМНИТЕ! ВЫ ЗАЛИВАЕТЕ ТЕ ПАПКИ, КОТОРЫЕ ВАМ ДАЛ ПРОГРАММИСТ! Этот набор мы берем просто для примера.
Итак, у вас есть уже купленный домен и хостинг . Обычно их продают одни и те же товарищи в Интернете (хостеры). Но можно покупать у разных. Мне лично нравиться компания Ukraine.com.ua - у них недорогие доменные имена + хорошая техническая поддержка, что важно, когда возникают вопросы по работе хостинга.
Домен – это имя сайта в интернете, например: mysite.com, http://freetravel.com.ua , ukr.net.
Хостинг – это тот «жесткий диск» в Интернете, где ваша папка с файлом будет лежать и будет доступна всем пользователям Интернета круглосуточно.
Итак, вы покупаете себе доменное имя. Его присваивают Вам дня два. Затем покупаете на сайте Ukraine.com.ua хостинг. У них, кстати, есть 5 дней бесплатного использования хостинга - на пробу, чуть что.
Если вы уже купили хостинг, Вам высылают письмо с названием сервера, логином и паролем для использования хостинга:
Для доступа по FTP*** используйте следующие реквизиты:
Сервер: mysite.ftp.ukraine.com.ua
Логин: mysite _ftp
Пароль: А0а0А0А
Эти пароли используются не на сайте хостинга, а для для FTP-клиентов (программ, которые позволяют залить сайт на хостинг, а по сути – в Интернет).
Основных две:
FileZilla – РЕКОМЕНДУЮ!
Total Commander – использовать, если ваш комп – дрова и FileZilla на него не устанавливается.
Скачайте программу FileZilla, вводите свои пароли и подключаетесь.
Пошагово о том, как загрузить сайт на хостинг.
Заливка файлов на хостинг через FileZilla:
О том, что вы подключены сообщает появление папки вашего домена на поле справа:
Справа появилась папка с вашим доменом. Заходите в нее, а потом в папку www!
Файл index (главная страница сайта) должен лежать в папке www(!!!). Чтобы его залить, нужно справа открыть папку www! Затем нажимаете правой кнопкой мышки на нужный файл и выбираете «Закачать на сервер».
Важно, чтобы папки с обоих сторон четко совпадали. Если вы хотите допустим, добавить новую картинку в папку images, то в FileZilla с обоих сторон должна быть открыта папка images.
После того, как вы закачали файл через FileZilla – вы можете все проверить по Интернет, просто забив адрес в браузер. Все должно работать. Если что-то не отображается, значит вы его не залили! Обязательно проверяйте залитые файлы онлайн.
Решение проблем загрузки сайта на сервер.
Если подключение не произошло – вопрос может быть в динамичном IP. Актуально для тех, кто пользуется мобильным или чужим интернетом.
Дело в том, что хостинг Украина делает для своих пользователей дополнительную защиту по IP вашего интернета. Если он меняется, значит, его нужно также менять на сайте Ukraine.com.ua в личном кабинете в разделе БЕЗОПАСНОСТЬ. Собственно, это еще одна причина, по которой хостинг мне нравиться, ведь чтобы зайти на сайт, нужно пройти идентификацию и через СМС-код. А значит, до моего сайта никто не доберется))).
Как изменить прописанный IP!
Авторизуйтесь. Заходим в личную панель управления на хостинге:
Зайдите в раздел Безопасность
Слева на белом фоне указаны IP, которые могут вносить изменения, а справа указан ваш текущий IP:
Если они не совпадают – добавьте его на белое поле:
Должно появиться:
Теперь можно закачать сайт на хостинг с момощью программы FileZilla (или Total Commander). Последовательность указана выше.
Кстати Total Commander используеться также, как файлзилла, но там немного другой интерфейс (досовский, чуть что). Но в принципе, владельцу сайта "не шашечки нужны, а ехать", то есть - залить страницу в интернет!
________________________________________ ____
Справка:
*Форматы HTML или PHP. У файлов соответствующие расширения: index.html или index.php Если вы можете открыть страничку index браузером - это HTML:) Файлы PHP можно открыть только на сервере (хостинг в интернете или локальный сервер, который устанавливаеться на рабочий комп - но если вы не разработчик - вам это не надо).
**Системы управления сайтом используются теми пользователями, которые не могут (или не хотят) писать коды для страницы самостоятельно. По сути это просто использование удобного интерфейса.
*** FTP (File Transfer Protocol - протокол передачи файлов). Заливка сайта на хостинг это тоже самое, что залить их на чужой комп. Кто ж такое любому позволит. Для этого используют FTP – он позволяет залить определенные файлы в определенное место и все.
Прежде чем перейти к процессу установки необходимо найти подходящий дизайн. Я бы рекомендовал использовать шаблоны только из проверенных источников, таких как: официальный магазин от uCoz или же на сайтах, которые специализируются на данном направлении.
В этом случае вы можете быть уверены в качестве шаблона и его работоспособности. Безусловно, можно нагуглить или использовать различные варезники - но очень часто на них попадаются рипы, нерабочие дизайны или еще хуже файлы с вирусами. Поэтому подойдите к вопросу выбора источника со всей серьезностью, так как от этого зависит не только успех проводимой операции, но и безопасность вашего сайта. В рамках этой статьи я буду устанавливать бесплатный шаблон DesktopChaos с uTemplate.pro.
Загрузка файла с шаблоном
Итак, загружаем архив с шаблоном:
Внутри архива находятся несколько вложенных папок:
- папка с изображениями (images, img);
- папка со скриптами (js);
- папка со стилями (css);
- папки с кодами Глобальных блоков, Информеров и т.д.
Также в архиве, как правило, присутствуют:
- инструкция.txt (ReadMe.txt) - настоятельно рекомендую обязательно прочитать;
- конструктор шаблонов.txt (tmpl.txt) - общий код каркаса;
- таблица стилей.txt (css.txt, style.txt) - файл с набором стилей;
- вид материалов.txt - содержит код вида материалов;
- и др. текстовые файлы с кодами, которые нужны для полной установки шаблона.
Примечание: содержимое вашего архива может отличаться от моего шаблона (это зависит от типа, структуры, сложности шаблона и других факторов).
Делаем резервную копию текущего шаблона
Прежде чем приступить к установке нового шаблона рекомендую сделать бэкап текущего шаблона (на всякий случай)
Для этого - заходим в "Панель управления" своего сайта - "Дизайн" - "Резервное копирование шаблонов":
Нажимаем в правом верхнем углу кнопку "Создать резервную копию", после чего вы увидите появившийся резервный архив с вашим текущим шаблоном вида "1372338464.zip" с датой создания в скобках:
И, еще один момент: перед установкой нового шаблона рекомендую активировать все необходимые модули : те, которые вы в данный момент хотите использовать и те, которые возможно вы захотите использовать в будущем. Это делается для того, что бы ваш новый шаблон корректно установился и отображался во всех модулях.
Пошаговая инструкция по установке шаблона на uCoz:
Установка шаблона делается согласно той инструкции, которая находится внутри вашего архива с шаблоном . Как я уже говорил в рамках этой статьи я буду показывать установку шаблона DesktopChaos .
Шаг-1.
Загружаем папку с изображениями images к себе на сервер. Это можно сделать двумя способами.
Первый способ - через FTP-клиент, например, FileZilla. Скачиваем и устанавливаем программу: http://filezilla.ru/get/ .
После этого, на главной странице Панели Управления жмем и задаем новый пароль:
После этого открываем ftp-менеджер FileZilla, в самом верху вводим Хост, Имя пользователя и Пароль, нажимаем "Быстрое соединение":
В левой части менеджера находим папку с картинками своего шаблона, жмем на ней правой кнопкой мышки, в появившемся меню нажимаем "Закачать на сервер". Готово. Теперь картинки находятся на нашем сервере.
Данным способом удобно пользоваться если нужно закачать много изображений, или других файлов.
Второй способ - загрузка изображений через Файловый менеджер . Переходим на главную страницу ПУ и нажимаем на "Файловый менеджер":
В право верхнем углу жмем Создать папку, вводим название images и нажимаем Enter:
Заходим в эту папку. Что бы закачать в нее картинки нажимаем "Выберите файл", выбираем картинку и жмем Загрузить файл. Зеленым плюсиком можно добавлять поля для нескольких файлов.
Таким образом закачиваем на сервер все картинки из папки images.
Шаг-2.
Устанавливаем (если нужно) значение тега . Заходим в "ПУ (Панель Управления)" - "Настройки" - "Общие настройки" и в соответствующее поле вставляем код:
Шаг-3.
Устанавливаем Таблицу стилей. Для этого, находим в архиве файл "Таблица стилей.txt", открываем и копируем из него весь код (Ctrl+A, Ctrl+C) и вставляем его вместо старого кода в "ПУ" - "Дизайн" - "Управление дизайном (CSS)" - "Таблица стилей (CSS)":
Шаг-4.
Устанавливаем код из файла "Конструктор шаблонов". Открываем файл из архива "Конструктор шаблонов.txt", копируем все содержимое и вставляем его в "ПУ" - "Дизайн" - "Конструктор шаблонов", нажимаем кнопку "Создать шаблоны":
Шаг-5.
Теперь, аналогичным образом переносим содержимое файла "Вид материалов.txt" в вид материалов модулей: "Новости сайта", "Блог", "Каталог файлов", "Каталог статей". Идем в "ПУ" - "Дизайн" - "Управление дизайном (шаблоны)":
Код из файла "Вид комментраиев.txt” аналогично копируем в "Комментарии" - "Вид комментариев".
Шаг-6.
Создаем Глобальный блок. Переходим в "ПУ" - "Дизайн" - "Управление дизайном (шаблоны)" - "Глобальные блоки":
В правом верхнем углу жмем "Добавить блок", в появившемся поле пишем названия блока INFO и нажимаем "Добавить":
Находим в архиве папку "Глобальные блоки" и открываем файл "INFO.txt", копируем содержимое файла и вставляем в только что созданный глобальный блок INFO, сохраняем:
Шаг-7.
Устанавливаем необходимые значения:
- Название информера: Последние новости;
- Раздел: Новости сайта (либо "Блог", либо "Каталог файлов", либо "Каталог статей");
- Тип данных: Материалы;
- Способ сортировки: Дата добавления материала D;
- Количество материалов: 5;
- Количество колонок: 1.
Жмем "Создать".
После этого чуть ниже появляется блок с созданным нами информером, справа в нем видим иконки, выбираем первую из них "Управление дизайном информера" и в появившееся окно вставляем из папки "Информеры" содержимое файла "Последние новости", сохраняем:
Код данного информера $MYINF_1$ вставляем в созданный нами ранее глобальный блок INFO .
Информер для форума создается похожим образом.
На этом установка шаблона DesktopChaos завершена.
К стати, если вы так и не разобрались с установкой нового шаблона на свой сайт, то в официальном магазине uTemplate.pro можно заказать услугу по установке шаблона.