Как сделать уникальный шаблон для wordpress своими руками за час. Создание простой Wordpress темы

08.07.2019

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

Что выберете вы — это полностью ваше решение.

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

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

Почему лучше писать сайт на движке Вордпресс

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

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

  • поддерживать PHP (уточняйте версию в зависимости от обновления движка);
  • MySQL (аналогично проверьте соответствие версии);
  • содержать модуль mod_rewrite для человекопонятных ссылок (по желанию);
  • хостинг должен принимать удаленные соединения.

Планирование перед запуском сайта

Вам необходимо создать собственную карту действий. Неважно, создаете вы сайт бесплатно или инвестируете в него деньги. Разработка будет безуспешной, если вы все не спланируете. Стоит расписать пошагово план действий. Первым делом убедитесь, что хостинг соответствует требованиям, что указаны выше. Если не получается разобраться в этом вопросе, можете отыскать в Интернете подходящий форум, где излагается список подходящих хостинг-провайдеров. Либо посоветуйтесь об этом со знакомыми, у которых уже есть свой сайт на WordPress.

После выполнения определенного пункта подготовительно плана вносите изменения на вашу карту действий, чтобы видеть ситуацию в общем. Следующим шагом придумайте логин и пароль как для сервера, так и для движка. Рекомендуется использовать разные пароли для разных аккаунтов: на движке один «пассворд», на сервере — другой. Иначе повысится вероятность взлома админки.

Далее подготовьте программную составляющую — скачайте все необходимое ПО на компьютер, чтобы потом не делать это в спешке. Во-первых, установите правильный текстовый редактор. Он может понадобиться для редактирования отдельных элементов вашего проекта. Не волнуйтесь, в Интернете есть инструкция для всех этапов создания чего-либо для сайта, будь то дизайн, плагин или виджет. Лучшие редакторы — это Kwrite, Notepad++, Website Editor, JEdit и Coda. Кроме программы для редактуры кода, вам понадобится также FTP-клиент для переноса и изъятия данных с сервера. Лучший в своем роде — это FileZilla. Установите его или какой-либо другой.

Установка Вордпресс

Прелесть сайта на основе Вордпресс — это упрощенная установка. Вам не понадобится пользоваться помощью платного специалиста, чтобы переместить движок на хостинг — вы сможете сделать все своими руками. Сами создатели этой платформы утверждают, что установить ядро можно за 5 минут. И самое главное, что это бесплатно!

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

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

В распакованном дистрибутиве вы найдете файл wp-config-sample.php. Вам необходимо переименовать его, оставив только wp-config.php. Именно на этом этапе вы и воспользуетесь помощью предустановленного ранее текстового редактора. Чтобы сайт на движке заработал, необходимо правильно указать информацию о базе данных, созданной на хостинге. Вам предстоит кое-что добавить в файле wp-config.php (писать много не придется):

  • напротив DB_NAME впишите имя БД (базы данных);
  • возле DB_USER укажите имя пользователя;
  • там где DB_PASSWORD пропишите пароль;
  • около DB_HOST обычно нужно указывать localhost, но не всегда (воспользуйтесь помощью поддержки сервера, чтобы это узнать);
  • DB_CHARSET (также выясняйте в службе поддержки);
  • DB_COLLATE (если не требуется, то не меняйте эту строку).

Теперь займитесь переносом вашего движка на сервер. Особая инструкция на этом этапе вам не понадобится — это легко сделать своими руками при помощи FTP-клиента, который вы ранее скачали. Если хотите, чтобы весь сайт был на ядре WordPress, тогда разместите его в корневой директории.

Если вы следовали данным шагам, значит вы уже вплотную подобрались к завершающему пункту установки. Теперь вам следует перейти по ссылке http://доменное_имя.ру/ wp-admin/install.php. URL будет иметь такой вид, если вы разместили движок в корневой папке. Если это не так, то возможно в данную цепочку нужно будет добавить еще пару названий директорий, куда вы загрузили дистрибутив.

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

Настройка движка после установки

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

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

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

Добавление новой темы

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

Новая тема оформления устанавливается на сайт пошагово:

  1. Скачайте и разархивируйте шаблон на компьютере.
  2. Создайте на хостинге в разделе wp-content/themes папку с названием скачанной темы.
  3. Переместите файлы шаблона при помощи FTP-клиента на хостинг.
  4. Войдите в административную панель в профиль пользователя с правами админа.
  5. Откройте вкладку «Внешний вид», раздел «Темы».
  6. Выберите нужный шаблон из доступных тем.
  7. Активируйте его.

Как создать форум, блог соавторов и другой формат сайта? Как добавить новые функции?

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

Как создать форум на Вордпресс при помощи плагинов

Нет ничего сложного в том, чтобы превратить ваш ресурс в форум. В Интернете есть ни один бесплатный плагин для этих целей. Разберем несколько модулей, которые вам подойдут (платные и бесплатные). Лидером среди подобных дополнений считается WP Symposium. Чтобы активировать его, вам даже не придется влазить в директории на сервере. Достаточно зайти в административную панель во вкладку «Плагины». Там вы увидите кнопку «Добавить новый» и «Загрузить». Нажимаете и указываете расположение модуля на компьютере. После его загрузки на движок вы сможете активировать его.

У каждого плагина есть свои особенности. Чтобы добавить форум при помощи WP Symposium, вам необходимо будет воспользоваться шорткодами. Это короткие коды-отсылки, которые активируют функции модуля в нужном месте на сайте. Инструмент сам сгенерирует такой код. Вам необходимо будет лишь разместить его в положенном месте в структуре страницы. После добавления шорткода на сайте появится форум с множеством категорий, веток и целым перечнем возможностей пользователя.

bbCode — это другой популярный инструмент, который поможет вам бесплатно создать форум на страницах сайта. Эта разработка вполне заменит целый комплекс плагинов, так как позволяет создать полностью автоматизированный сервис обсуждений и переписки людей. В модуле есть встроенная защита от взломов аккаунтов и функция борьбы со спамерами. Вы сможете добавить до 7 различных виджетов на сайт. Также есть функция прикрепления отдельных постов сверху страницы, для выделения важных тем. bbCode хорошо работает с интеграцией каких-либо БД, потому сможете загрузить в него любое содержимое. В итоге получите замечательный форум.

Еще один популярный формат форума, разработка, пришедшая в Рунет из Запада — это сайты вопросов/ответов. Ныне такие ресурсы пользуются огромной популярностью и хорошо индексируются поисковиками. Потому если создать хороший и интересный проект, вполне вероятно, что пользователи сами раскрутят его. А поможет в создании плагин CM Answers, который как раз и предназначен для генерации вопросно-ответного форума.

Как добавить карту и другие функциональные элементы на сайт WordPress

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

Главное, что вам необходимо усвоить — это то, что не имеет границ в своей функциональности. Как только вы поставите себе цель, загляните в Гугл в поисках решений — и наверняка найдете нужный ответ! Этот движок подходит для реализации любой задачи. Вы сможете справиться с достижением цели, какой бы сложной и непонятной она была! Теперь, когда вы знаете как создать сайт на WordPress, нет ничего невозможного. Приступайте!

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

В WordPress можно создавать страницы (page) и записи (post). Отличаются они тем, что записи: попадают в ленту на главной странице; для записей указываются категории; записи не могут быть древовидными, а страницы: используются для такого содержимого как "Обо мне", "Контакты", "Карта сайта"; не имеют категорий, а имеют древовидную структуру. Записи обычно предназначены для хронологической информации (по времени добавления), а страницы для древовидной структуры не зависимой от времени. Для примера, эта статья опубликована как "запись" в рубрике "Кодекс", а ссылки в меню шапки ведут на страницы: Функции .

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

Создание страниц в WordPress

Часто нужно создать отдельный шаблон страницы, чтобы вывод информации отличался от остальных страниц. Создавая шаблон страницы в WordPress, можно совершенно изменить страницу: удалить сайдбар, подвал, шапку, можно изменить страницу до неузнаваемости. Например, на этом сайте так изменяется страница на которой выводятся коды файлов WordPress .

Способ 1: шаблон страницы через файл с произвольным названием и подключением его в админ-панели (классический способ)

Это самый распространенный способ создать шаблон страницы в WordPress. Для этого нужно создать.php файл, например, tpl_my-page.php в папке темы и в самом начале файла вписать пометку, что созданный файл является шаблоном для страниц:

Теперь при создании страницы в админ-панели в блоке «Свойства страницы» мы сможем выбрать "шаблон":

С версии WordPress 4.7. такие шаблоны страниц можно создать для любого типа записи, а не только для page. Для этого дополните комментарии строкой: Template Post Type: post, page , где post, page - это названия типов записей к которым относится шаблон.

/* Template Name: Мой шаблон страницы Template Post Type: post, page, product */

Преимущества:

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

  • Можно получить только записи с указанным шаблоном. Например, можно вывести все страницы с шаблоном «Услуги» (файл servises.php). Иногда это удобно. Название файла шаблона хранится в метаполе _wp_page_template , поэтому чтобы вывести страницы с указанным шаблоном нужно создать запрос по метаполю (см. WP_Query).

Недостатки:

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

Как это работает:

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

Template Name: ***

Строка может располагаться где угодно и как угодно в файле.

Все файлы с подобными строками собираются и выводятся в выбор шаблона в блок "Атрибуты страницы".

При публикации страницы, в произвольное поле _wp_page_template записывается название файла шаблона или default , если шаблон не указан:

Wp_page_template = default
_wp_page_template = tpl_my-page.php

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

Способ 2: шаблон страницы через файл с конкретным названием (иерархия файлов шаблона)

При создании страницы ей устанавливается ярлык (слаг, альтернативное название). Он используется в УРЛ страницы. И его можно изменить:


Для создание шаблона этим способом, вам нужно узнать слаг страницы и создать файл в папке темы. Допустим, наш слаг как на картинке равен contacts , тогда создадим в теме файл page-contacts.php . и заполним его нужным кодом (можно скопировать содержимое из файла шаблона page.php и отредактировать под себя). Все, теперь при посещении страницы мы должны увидеть новый шаблон. Аналогично можно взять ID (пусть 12) страницы и создать файл page-12.php .

Достоинства:

Нет необходимости заходить в админ-панель и устанавливать файл шаблона. Шаблон начинает работать сразу после создания файла. Удобно при разработке.

Недостатки:

Шаблон создается только для одной, конкретной страницы. Зависит от слага страницы, если он изменится шаблон работать не будет. Если использовать ID, то зависимость от слага пропадает, но становится непонятно в файла темы, к какой странице относится шаблон (если несколько шаблонов с ID).

Практически бесполезен при написании шаблонов, а тем-более плагинов. Его можно использовать, когда правишь свой сайт, в котором слаг или ID страницы известны заранее.

Как это работает:

WordPeress подбирает какой файл использовать в следующем порядке (файлы должны быть в корне темы):

  • {любое_название}.php (когда используется шаблон страницы)
  • page-{ярлык_записи}.php
  • page-{ID_записи}.php
  • page.php
  • singular.php
  • index.php

Способ 3: шаблон страницы через фильтр "template_include" (коддинг)

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

// фильтр передает переменную $template - путь до файла шаблона. // Изменяя этот путь мы изменяем файл шаблона. add_filter("template_include", "my_template"); function my_template($template) { # аналог второго способа // если это страница со слагом portfolio, используем файл шаблона page-portfolio.php // используем условный тег is_page() if(is_page("portfolio")){ if ($new_template = locate_template(array("page-portfolio.php"))) return $new_template ; } # шаблон для группы рубрик // этот пример будет использовать файл из папки темы tpl_special-cats.php, // как шаблон для рубрик с ID 9, названием "Без рубрики" и слагом "php" if(is_category(array(9, "Без рубрики", "php"))){ return get_stylesheet_directory() . "/tpl_special-cats.php"; } # шаблон для записи по ID // файл шаблона расположен в папке плагина /my-plugin/site-template.php global $post; if($post->ID == 12){ return wp_normalize_path(WP_PLUGIN_DIR) . "/my-plugin/site-template.php"; } # шаблон для страниц произвольного типа "book" // предполагается, что файл шаблона book-tpl.php лежит в папке темы global $post; if($post->post_type == "book"){ return get_stylesheet_directory() . "/book-tpl.php"; } return $template; }

Такой код нужно разместить в файл темы functions.php или в плагин, или подключить как-то еще. Как видно из примера во время фильтра template_include уже работают условные теги, установлены глобальные переменные: $wp_query , $post и т.д.

Достоинства:

    Можно установить шаблон для любой страницы или группы страниц. Практически полный карт-бланш в действиях.

  • Можно создать шаблон при написании плагина.

Недостатки:

Необходимость писать код и отдельно его подключать (например, в functions.php темы).

(Последнее обновление: 11.03.2019)

Приветствую вас, дорогой читатель! Сегодня, друзья, у нас будет пост - как создать свой сайт/блог самостоятельно на CMS WordPress пошаговая инструкция . Вся информация будет на одной странице, то есть, полное руководство шаг за шагом. От покупки домена, хостинга и до входа в панель управления вашим новым сайтом. Пишу вордпресс, так, как она самая популярная платформа (№1 в мире, 33% веб-ресурсов работают на данной CMS), но вы можете использовать другую систему управления контентом например, Joomla!, Drupal или другую CMS.

Создание сайта на WordPress , дело не сложное, доступно всем - от школьника и до домохозяек. Следуйте моему бесплатному уроку (не надо покупать всяких курсов, видео уроков и так далее) и у вас всё получится. И так, усаживайтесь поудобней и начнём создавать свой личный сайт или блог с нуля .

Создание сайта на WordPress

Хорошая новость : Теперь можно зарегистрировать домен сразу на сервисе Бегет, так, как он стал аккредитованным регистратором доменных имён. Новая подробная инструкция (более лёгкая для новичков) - как создать сайт, инструкция с картинками и видео находится .

Что такое ВордПресс (WordPress)?

WordPress - свободное программное обеспечение, которое поможет вам создать красивый сайт, блог или веб-приложение. Красивый дизайн, впечатляющие возможности и свобода создавать всё, что вы захотите. WordPress одновременно бесплатен и бесценен.

33% всех сайтов мира работают на WordPress, от личных блогов до крупнейших новостных агентств. Более 60 миллионов людей выбрали WordPress для своего «дома» в сети - присоединяйтесь к семье.

Расширьте WordPress с помощью более 45 000 плагинов, чтобы сайт соответствовал вашим потребностям. Добавьте интернет-магазин, галереи, списки рассылки, форумы, аналитику и многое другое.

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

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

Как подобрать и зарегистрировать домен для сайта

Для этого, я использовал сервис по регистрации доменов 2domains. Зарегистрировать одно доменное имя в зоне ru или рф стоит всего 99 рублей в год Регистрация моментальная и ваш домен становится доступен сразу. Чтобы зарегистрировать домен, нужно выполнить следующее: заходим на сайт 2domains и регистрируемся:


Регистрация домена на сервисе 2domains

Все ваши домены, как русские так и международные, будут в одной панели управления и вы сможете ими управлять из одного места. Вам достаточно один раз зарегистрироваться в системе (создать аккаунт) и в дальнейшем вы сможете быстро регистрировать домены. После успешной регистрации, зайдите в свой аккаунт и создайте свой профиль. Для этого, в верхнем меню нажмите на "Профили" и далее выберите какой профиль вы хотите создать - для RU/SU/РФ доменов на физическое или юридическое лицо или профиль для регистрации международных доменов (com, net, и прочих):


Создайте свой профиль

Заполните открывшуюся форму согласно примерам, которые располагаются рядом с каждым полем и сохраните данные. В случае выявления ошибок - исправьте их. После у вас появится список Профилей и созданный вами Профиль отобразится в списке. Если у вас уже есть созданные Профили - пропустите этот пункт. Затем пополните свой баланс. Для этого перейдите в верхнем меню в раздел "Баланс" и выберите "Пополнить баланс".

Посчитайте какая сумма вам необходима для регистрации (для этого умножьте количество доменов на цену регистрации одного домена. Цену можно узнать нажав на ссылку "Прайс лист" в меню). После этого вам будет предложено выбрать метод, которым вы хотите пополнить баланс. Укажите сумму пополнения и пополните баланс нужным методом (WebMoney, Яндекс деньги и т. п.):


После того, как ваш баланс пополнен и создан профиль, переходите в верхнем меню в раздел "Домены" - "Подобрать домен":


Перед вами откроется страница где вы можете подобрать нужный, красивый, подходящий домен по ключевому слову для вашего сайта (задача не из лёгких). Просто введите главное и/или дополнительное ключевое слово на английском или на русском языке (в зоне РФ), на основе которого вы хотели бы подобрать домен!:


Подбор домена по ключевому слову для сайта

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

Перед вами откроется список вариантов имен

Далее, можно зарегистрировать домен из корзины, но сначала его нужно проверить (пока вы подбирали имена, домен могли уже занять). В поле для ввода доменов будут отображаться ваши выбранные имена которые вы хотите зарегистрировать. Нажмите кнопку "Проверить":

Ваши домены будут проверены и если они свободны, откроется форма заказа доменов. Здесь сложного ничего нет, установить галочку в "Использовать DNS-сервера регистратора бесплатно" - тогда у домена будут установлены DNS-сервера регистратора, потом в любое время сможете их поменять на нужные. Далее выберите профиль, на данные которого будут зарегистрированы домены (который вы ранее создали). И нажмите "Продолжить".

Внимание! Перед завершением регистрации проверьте правильность написания имени домена (что именно такой и нужен и нет опечаток), что выбран нужный и правильный профиль. В случае если вы ошибетесь с доменом - изменить потом уже будет нельзя:


Всё, ваши домены поставлены в очередь на регистрацию и будут зарегистрированы в течение нескольких минут. Зарегистрированный вами домен появится в списке всех ваших доменов (Мои домены) и вы сможете его детально настроить - сменить DNS, внести записи в DNS и т. п.. Теперь переходим к следующему шагу, для создания сайта нужен надёжный хостинг.

Покупка хостинга. Надёжный хостинг BeGet

Я использую данный хостинг уже приличное время и очень им доволен. Поэтому и вам предлагаю выбрать его. Хостинг бегет не дорогой, понятная панель управления, а также хостинг заточен для работы наиболее популярных CMS (систем управления сайтом). Таких как: Joomla!, WordPress, Drupal и многие другие, как платных так и бесплатных CMS . Все бесплатные движки для сайта устанавливаются автоматически (об этом речь будет чуть ниже), вообщем любому новичку, то, что нужно.

Цены на хостинг очень даже выгодные, в том числе для тарифов, на которых можно размещать 5 (как у меня) и более сайтов одновременно. Представляется возможность 30 дней тестового периода, то есть, бесплатно. Если вы решили разместить сайт на этом хостинге, то вам необходимо зайти на сайт beget.com . Выбрать подходящий тарифный план. Вполне хватит тариф START на пять сайтов, 10 Гб дискового пространства и многое другое:


Базовые тарифы на хостинг. Выбираем Start

Заполните форму регистрации аккаунта. Заполняем все необходимые поля и кликаем - Зарегистрировать аккаунт:


Зарегистрировать аккаунт

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

Делается это очень легко и просто. Зайдите в свой аккаунт 2domains, выберите в меню на главной странице "Домены" и из выпадающего списка нажмите на "Мои домены":


На главной странице "Домены" и из выпадающего списка нажмите на Мои домены

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


Ваши зарегистрированные домены

После этого, появится меню управления доменом. Я свои все зарегистрированные домены, прикреплял к IP адресу хостинга. Узнать IP-адрес сервера, на котором расположен ваш аккаунт, можно в разделе DNS панели управления хостингом. А - запись вашего технического домена содержит нужный адрес. Технический домен имеет вид ваш_логин.beget.tech . Вот тут:


Значение А-записи по умолчанию можно посмотреть у технического домена

Поверьте мне, этот способ самый легкий и простой из всех.

В меню управления доменом выберите из списка "Управление DNS-серверами / Делегирование":

Управление DNS-серверами / Делегирование

В открывшейся форме поставьте галочку "Использовать DNS-сервера регистратора" и нажмите на кнопку "Изменить":


Затем, опять вызовите меню управления доменом нажав на нужный домен. Выберите из предоставленного списка "Управление зоной DNS":

Управление зоной DNS
  1. Для первой в качестве поддомена укажите www , выберите тип записи А , в качестве данных укажите IP адрес (в панели управления хостингом Бегет/Beget, с левой стороны), к которому нужно прикрепить домен.
  2. Для второй записи укажите знак @ (собака) в качестве поддомена и так же выберите тип А и укажите тот же IP адрес хостинга .
  3. Для третьей записи в качестве поддомена укажите знак * (звёздочку) и так же выберите тип А и укажите тот же адрес IP .

Затем, нажмите кнопку "Добавить". Всё. Готово. Теперь вам нужно подождать, пока изменения вступят в силу и ваш сайт будет открываться с этого IP адреса. Это может занять от 4 до 48 часов. Так, последние маленькие шаги и ваш сайт готов к большому путешествию по Сети.

Важно : Теперь можно регистрировать домены с октября 2016 г. непосредственно через Бегет. Зарегистрировали домен и сразу можно создавать сайт .

Как добавить домен и установить CMS WordPress на хостинг Beget

В качестве примера я буду использовать движок WP, так как сам сижу на нём и это самая популярная система управления контентом для ведения собственного сайта. WordPress бесплатен и свободен к распространению. И так, зайдите в панель управления вашим хостингом. Для добавление существующего домена необходимо зайти в раздел "Домены и поддомены":


Раздел Домены и поддомены

Добавление доменов и поддоменов. В поле введите ваш домен/ы. При добавлении домена нужно указать:Создать новый сайт для домена.
В данном случае под сайтом подразумевается директория на диске. Например, если мы заказываем домен mydomain.ru и выбираем "Создать новый сайт ", на диске будет автоматически создана директория ~/mydomain.ru , а в ней директория public_html , куда и необходимо будет загружать файлы сайта. Например:


Добавление уже зарегистрированного домена

После выполнения этой операции вам необходимо подождать 10-15 минут (это время необходимо для того, чтобы домен успешно прописался на DNS-серверах). Вот и всё. Готово.

Сайт вы создали, но он работать пока не будет. Для полного счастья не хватает только движка для вашего нового сайта. Будем устанавливать его на хостинг. В панели управления хостингом выбираем раздел "Автоматическая установка CMS ". Раздел CMS позволит быстро установить любую из более чем 30 популярных CMS (Content Managment System - Система Управления Контентом):


Системы управления контентом (CMS)

После открытия раздела (на моём скриншоте будет два списка, у вас только тот сайт на который нужно установить движок) вы увидите два списка: сайты на которые уже установлены CMS:


Список установленных CMS и Установка CMS

Нажимаете WordPress, в примере будет вордпресс, а вы можете установить движок любой, какой вам нужен. После нажатия на логотип CMS вы можете в диалоговом окне выбрать сайт, на который она будет установлена, а также ввести необходимые данные для установки.

Логин администратора : для входа в панель управление блога; Пароль администратора : потом можно в настройках блога; E-mail администратора и название сайта на латинице (потом поменяете на русское если надо, в админпанели вашего нового сайта). Нажимаете кнопочку "Установить":


Автоматическая установка CMS WordPress. Данные для управления сайтом

Установка происходит в течение минуты и появляется информация для вашего сайта. Я только затёр на скрине мои данные (сами знаете почему):


Здесь, нужная вам вся информация о сайте, вы можете в любой момент посмотреть её, вдруг вы забудете или потеряете логин и пароль для входа в административную панель сайта.

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

Для входа в панель управления вашего только, что созданного сайта нажмите ссылку (информация сайта) "ваш сайт.ru/wp-admin ". Введите свои данные:

Вход в панель управления сайтом

Войдите и вы в консоле управления своего нового сайта или блога на движке WordPress:


Админпанель сайта WordPress

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

Только следует учесть, что вордпресс генерирует некоторые классы, которые должны присутствовать в таблице стилей. К примеру классы aligncenter, alignleft и alignright служат для выравнивания изображений и блочных элементов, и их нужно включить в свою таблицу стилей (можно скопировать из таблицы стилей дефолтной темы):


.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}

Следующие классы используются для выравнивания изображений, которые имеют подписи (можно скопировать из дефолтной темы, в дальнейшем при необходимости поправить):


.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* необязательные параметры, которые сделают скругленные углы в поддерживаемых браузерах*/
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

Кроме того, существует еще несколько классов WordPress, которые необязательно описывать в таблице стилей, но, т.к. WordPress генерирует страницы с их использованием, можно и им задать стиль:


.categories {...}
.cat-item /* Этот класс присваивается всем категориям */}
.current-cat {/* стиль текущей категории */}
.current-cat-parent {/* стиль для предка(ов) текущей категории */}
.children {/* класс для потомка */}
.pagenav {/* постраничная навигация */}
.page_item {/* любой элемент списка */}
.current_page_item {/* этот класс присваивается в списке страниц к текущей активной странице */}
.current_page_parent {/*класс для родительской страницы по отношению к текущей */}
.current_page_ancestor {/* любая страница верхних уровней по отношению к данной */}
.widget {/* все виджеты обворачиваются в этот класс */}

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

К примеру в дальнейшем мы подключим поисковую форму на сайт через спец. тег wordpress , в результате чего wordpress выведет такую форму:

Поэтому учитываем это при верстки темы.

И последнее, что нужно добавить в style.css это информацию о себе любимом и о созданной теме. Информация размещается в начале файла в коментах:

/*
Theme Name: Придумайте уникальное имя темы
Theme URI: http://ссылка-на-домашнюю-страницу-темы
Description: Описание темы
Author: Автор темы
Author URI: http://ссылка-на-страницу-автора
Template: название-темы-предка
Tags: теги темы - только из списка предлагаемого wordpress.org
Version: версия
Ну и здесь текст лицензии
*/

Также не забудьте сделать screenshot.png и положить его в папку с шаблоном (в корень). Информация, размещенная таким образом в таблице стилей, будет отображаться в админке в разделе Управление «темами» . Сверстанный шаблон тестируем в браузерах, если все норм, можно идти далее.

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

Принцип работы wp-темы :

Если вы откроете папку темы по умолчанию (wp-content/themes/default), вы увидите множество файлов PHP (файлы темы) и одного файла style.css. Когда мы просматриваем блог, WP подключает файлы темы (index.php <

На этом предварительная подготовка закончена и мы можем перейти к созданию темы из имеющегося исходного материала.

Шаг 1:
Для начала в директории тем вордпресса (wp-content/themes) создайте папку с именем нашей темы. Пусть это будет ruseller_lessons . Затем из папки темы по умолчанию (wp-content/themes/default) скопируйте файлы comments.php, search.php и 404.php в папку нашей темы. Эти файлы отвечают за комментарии и поиск на блоге. Затем в ruseller_lessons скопируйте таблицу стилей style.css нашего шаблона, screenshot.png (300x225) и папку images .

Теперь файлы нашего шаблона нужно "распилить", т.е. вытащить в отдельные файлы footer, sidebar и header. Схема показывает упрощенный вид файла index.php с метками, согласно которым будем его пилить:

Шаг 2 - Header.php
Открываем index.html и вырезаем все, что находится до коментария , создаем новый файл header.php и вставляем в него вырезанный код, сохраняем в директории нашей темы ruseller_lessons :






index.html






Теперь идем в папку с дефолтной темой, открываем header.php и копируем оттуда теги , <link>, <h1>, and <div class=description> </b>и ими заменям соответствующие строки в нашем <b>header.php </b>.</p> <p>Затем все теги <li>, находящиеся <b>id="nav" </b>(список страниц в верхней части блога) заменям на функцию вордпресса</p> <p><b> <?php wp_list_pages("sort_column=menu_order&depth=1&title_li=");?> </b></p> <p>В итоге получаем:</p><p> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br> <html xmlns="http://www.w3.org/1999/xhtml"><br> <head><br> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br> <title><?php wp_title("«", true, "right"); ?> <?php bloginfo("name"); ?>
" type="text/css" media="screen" />
" />





Шаг 3 - Sidebar.php
Возращаемся к файлу index.htm. Первым делом удаляем всю форму поиска, затем вырезаем из него все от