Рубрики
WordPress Глава 2

Публикация первой записи


Кодекс Источник 1

A first time for everything (все когда то бывает в первый раз)… Именно с этой поговорки, пожалуй стоит начать цикл записей непосредственно по работе с CMS WordPress. Что бы опубликовать свою первую запись на вашем блоге (сайте) необходимо лишь вспомнить один из контрольных вопросов из прошлых записей относительно общих ссылок в панели инструментов и меню навигации. Наверняка вы обнаружили схожесть в создании страниц и записей. Если нет, то обратите внимание при наведении курсора на эти ссылки (смотреть рисунок 1)

Добавляем запись
Рисунок 1

По клику на ссылку «добавить запись / добавить новую» перед вами откроется рабочая область для публикации записи.

Добавляем новую запись

Помните! Что на каждой страничке к вашему распоряжению доступна подробная справка по этой странице («Помощь») и таб «Настройка экрана» с помощью которого мы задаем видимость отображения виджетов в рабочей области определенной страницы.

Обзор полей рабочей области при публикации записи

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

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

Визуальный редактор

Каждая пиктограмма — это HTML тег, по клику на которую выделенный текст оборачивается тем или иным тегом. Для опытных пользователей предусмотрен «чистый» текстовый режим, помещенный в этом режиме текст не будет отформатирован и будет как есть, без тегов, хотя разработчики и вынесли некоторые теги для удобства

Теги в редакторе

Для чего может понадобиться режим тегов (текстовый режим)?

Наверняка вы уже слышали, о возможности простой вставки кода интегрировать на страницы сайта динамические карты от Google или Яндекс, интеграцию виджетов погоды и т.п. Так вот, вставку кода на страницу сайта необходимо производить в режиме «Текст», иначе ваш код попросту не преобразуется 🙂 А вот, например, ссылка с видео-сервиса YouTube благодаря некой системе распознавания, будет автоматически преобразована даже в режиме «Визуально». Поэтому стоит уяснить один момент: если у вас что то некорректно отображается или работает следует поменять режимы редактора и попробовать снова интегрировать код.

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

Все настройки экрана

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

Правый столбец

Блок (окно) «Опубликовать»

— это окно публикации записи (Publish box). Здесь мы можем управлять статусом нашей записи:

  • опубликовано
  • на утверждении
  • черновик

задавать правила для ее видимости:

  • открыто — видно всем
  • защищено паролем — запись будет доступна для чтения после ввода специального пароля
  • личное — видно только администраторам или прочим авторизованным пользователям

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

Не забывайте после внесения изменений «жмакать» кнопку «Обновить».

Блок «Формат» :

  • стандартный
  • заметка
  • изображение
  • видео
  • аудио
  • ссылка
  • галерея

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

Формат видео

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

Блок «Рубрики» (Categories)

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

Блок «Метки» (Post Tags)

У меток есть еще два распространенных синонима: ярлыки и теги. В некоторых системах, таких как Blogger, метки принято называть Ярлыками (что на мой взгляд логичней), а в некоторых использовать иностранное слово — тег. Если назначение рубрик (категорий) — строить сложные взаимоотношения разделов сайта (таксономия), то назначение меток просто связывать записи по похожим признакам. Метки не поддерживают вложенность (иерархию). 

Например, у нас есть три записи из разных категорий. Из категории «одежда» у нас есть запись о красной модной куртке, в рубрике «автомобили» мы опубликовали запись о марке авто «Ferrari», ну и рубрика «Рецепты» у нас имеет запись о блюде из красной рыбы. Какой общий признак у этих записей? Да, это цвет — красный! Поэтому каждой записи мы присваиваем метку «красный» это позволит объединить записи из разных несвязанных логически рубрик. И теперь по клику на метку с названием «красный» будет происходить выборка всех записей с этим ярлыком. Метки очень полезны для сложных каталогов, например, им можно задавать алфавитные значения, что позволит делать выборку записей по буквам алфавита.

Блок «Миниатюра записи»

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

Миниатюры

Что ж, с правой колонкой (столбцом) мы познакомились, теперь давайте рассмотрим левый столбец, две области из которых вам уже знакомы — это поле для заголовка записи (Title/Headline Box) и область для контента (Body Copy Box).

Столбцы слева

Блок «Цитата» (Excerpt)

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

добавить Далее и разорвать запись

Текст который находящийся до линии разрыва будет служить в качестве анонса (цитаты) записи.

Блок «Отправить обратные ссылки» (Send Trackbacks )

Интересная технология преимущественно для блогинга, суть которой заключается в следующем:

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

Блок «Произвольные поля» (Custom Fields)

Эта область больше подойдет для опытных пользователей и разработчиков, так как для ее использования неизбежно придется править программный код системы. Задача произвольных полей состоит в расширении информации о записи или странице, например, если ваш сайт выступает в роли каталога товаров, то к каждому товру вы можете создать поля: «Цена», «Вес», «Цвет» и т.д., некие атрибуты товара. И теперь осталось с помощью специальной функции вызова этих полей задействовать их в шаблоне сайта. Дополнительно можно организовывать поиск (выборку) по этим полям и многое другое. Обо всем этом мы поговорим во втором томе онлайн-книги «Код это поэзия».

Блок «Обсуждения» (Discussion)

Позволяет управлять возможностью комментирования к данной записи и отправкой обратных ссылок и пингов (trackbacks and pingbacks). Если не отмечен флажок в чекбоксе, то функция комментирования работать не будет.

Блок «Комментарии»

Позволяет вести обсуждение прямо из административной части сайта.

Блок «Ярлык»

Иначе «слаг» (slug) позволяет задать записи или страницы уникальное имя, которое будет использоваться в адресной строке (если сделаны соответственные настройки, о которых мы поговорим позже)

Блок «Автор»

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

 Практическое задание

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

Рубрики
WordPress Глава 2

Первый вход в панель администратора WordPress


В предыдущей записи мы с вами установили веб-приложение CMS WordPress. Самое время выполнить вход в панель администратора, от куда и будет производится дальнейшее управление сайтом. Напомню, чтобы увидеть форму входа в «админку» вашего сайта, вам необходимо после основного доменного имени, через слэш, дописать /wp-admin или /wp-login.php и для авторизации ввести свои учетные данные.

Если вы все сделали правильно, то после первого входа вы должны увидеть примерно следующий экран:

Авторизация

Это главная страница панели мониторинга — Dashboard Screen. Здесь мы видим по умолчанию пять областей именуемых — виджетами:

  • Добро пожаловать
  • На виду
  • Быстрый черновик
  • Активность
  • Новости

Добро пожаловать

Этот блок (виджет) содержит наличие ссылок на некоторые из наиболее распространенных задач при создании нового сайта.

На виду

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

Виджет на виду

Информация в нижней части виджета содержит текущую версию WordPress и активную тему, применяемую в данный момент для оформления сайта.

Быстрый черновик

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

Быстрый черновик

Активность

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

Виджет

Новости

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

Новости ВордПресс

Административные панели

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

  1. Меню навигации (main navigation)
  2. Панель инструментов (ранее известная под именем Admin Bar, а ныне Toolbar)
  3. Рабочая область (work area)
  4. Подвал (нижняя часть — footer)

Обзор Dashboard

 

Скриншоты всех экранов WordPress

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

wp-admin-6

Контрольные вопросы

  1. Как управлять отображением виджетов в рабочей области?
  2. Какие общие ссылки и общие действия можно встретить, как в Главном меню навигации, так и в Панели инструментов?
  3. Какую практическую полезность может из себя представлять виджет Быстрый черновик?
Рубрики
WordPress Глава 2

С чего начать создание сайта?


Ну вот мы преодолели путь в одну главу. Уверяю вас, что все самое интересное еще только начинается!

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

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

Выбор хостинга

На сегодняшний день компаний по предоставлению хостинг-услуг насчитывается неприлично большое число, но это не удивительно, вспоминая пословицу: «Был бы спрос, а предложение найдётся». И этот спрос есть! Ведь число веб-сайтов, если я не ошибаюсь, еже превысило число интернет-пользователей. Каждый день рождаются новые проекты, некоторые сразу гаснут, некоторые какое то время горят…

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

Проект «Код это поэзия» рекомендует компанию «ТаймВеб».

Компания «ТаймВеб» существует на рынке c 2006 года, исходя из своего опыта работы с этим хостинг-провайдером, исток которого датируется 2011 годом, я остаюсь до сих пор довольным от качества и условий предоставляемых услуг.

Дата-центр компании ТаймВеб
Дата-центр компании ТаймВеб

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

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

Выбор адреса сайта (доменного имени)

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

http://myname.ru

Сегодня царит полный хаос в системе DNS и принадлежность домена верхнего уровня (это первые символы до первой точки: .RU .COM .NET .ORG .US .SU .IN и т.д.) абсолютно может не соответствовать географическому положению того или иного ресурса по этому адресу. А вообще, изначально была правильная и логичная идеология доменных имен верхнего уровня.

Например, ресурсы расположенные в Италии должны иметь домен верхнего уровня .IT и следовательно все производные адреса сайтов говорят о том, что товар или услуга, или даже персона (если это персональный сайт) находятся непосредственно в Италии. Соответственно .SU — Советский Союз, .RU — Россия и т.д. и т.п. Отмечу, что существуют так же домены общие, такие как .COM, это коммерческие адреса, .NET — для сетей, а .ORG — для некоммерческих организаций. Эти домены существуют, аж с 1985 года и завоевать красивое имя уже не предоставляется возможным, так как за 30 лет в этих доменных зонах всю красоту, естественно, разобрали 🙂

А что получается мы имеем сегодня? Весь этот беспорядок в системе DNS конечно же является жирным и большим минусом. Например, домен верхнего уровня .ME не что иное, как  — национальный домен верхнего уровня для Черногории. Происходит от слова Montenegro — английского названия Черногории. А его смело задействуют для персональных сайтов, так как название домена совпадает с английским словом me (которое можно перевести как «мне», «меня»). В настоящее время существуют такие адреса сайтов, как about.me («про меня»), present.me («покажи мне»), keep2.me («сохрани для меня») и др.

И таких примеров достаточно! Поэтому хорошим тоном будет если вы остановите свой выбор именно на домене верхнего уровня .RU

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

Рубрики
WordPress Глава 1

Сайты и принцип работы CMS


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

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

Предположим у вас интернет-магазин или сайт-каталог с численностью товаров более 10000, по всем законам статических сайтов — это 10000 отдельных файлов html, 10000!  Допустим вам необходимо добавить код от Google Analytics или Яндекс Метрики на каждую страницу, не трудно догадаться с какой проблемой мы столкнемся, да? Что бы это осуществить и добавить на каждую страницу специальный код отслеживания ресурса, нам необходимо открыть все 10000 файлов и в каждый из них добавить этот код. Безумие, не правда ли? А про классификацию, выборку продуктов и прочие интересные вещи я вообще промолчу…

Но другое дело динамический сайт и классическая система MVC (модель-вид-контроллер), где в качестве модели, на примере WordPress, выступает база данных MySQL, в качестве контроллера — ядро ВордПресс, написанное на серверном языке программирования PHP и вид (представление) -шаблоны, включающие в себя теги HTML.

Теперь все обстоит совершенно иначе. Подробно мы с этим познакомимся изучая циклы в WordPress и создавая свою тему с абсолютного нуля, а пока что, если по простому, то теперь наша страница подобна пазлам и собирается за счет серверного языка PHP по тем правилам, которые мы ей зададим. Например, (это применимо к шаблонам WordPress ) в построении всех страниц сайта за верхнюю часть каждой страницы будет отвечать отдельный шаблон — файл header.php, именно с него будут начинаться хоть миллион страниц нашего сайта и поэтому что бы привязать к сайту аналитику от Google, рассмотренную выше, нам необходимо просто добавить ее единожды в файл header.php вот и все! И теперь когда пользователь делает запрос, для него PHP формирует страницу, в момент формирования, мы уже знаем, будет участвовать файл с нашим кодом header.php, а следовательно не будет такой страницы на сайте, где бы он не появился. Примерно так…

А что если вам необходимо осуществить выборку товаров по определенным признакам, например, цвету или весу? Это не предоставляется возможным для статических сайтов, за исключением случаев, когда вы можете начать «изобретать велосипед» и написать парсер (синтаксический анализ) для своего сайта, который будет анализировать все файлы и осуществлять выборку по каким то атрибутам тегов, и здесь опять же будет задействован один из серверных языков программирования. Согласитесь, сложно.

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

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

Критика со стороны программистов

Конечно же без критики никуда. Почти каждый будет хвалить «свое болото», то есть тот продукт с которым привычно и комфортно работать. Армия поклонников CMS Joomla будут защищать и превозносить «Джумлу», разработчики под CMS Drupal, естественно — свой «Друпал», часть программистов, которые работают с фреймворками будут высмеивать CMS — называя их конструкторами для детей (или чаще можно встретить еще обидней высказывание — «для кухарок» ) , ну а если еще программисты «пишут» на другом языке, например Python, то с их стороны можно услышать вообще критику не только на продукт, но и на саму технологию PHP; поэтому мой вам совет не воспринимать и не доверять этой информации без фактов. Все это не более чем холивар.

А факты таковы! CMS WordPress знают по всему миру! По всей планете проводятся регулярные конференции WordCamp и MeetUp, а число сайтов под управлением этой системы составляет около 20%, а это значит что каждый пятый сайт в мире работает на WordPress.

Ссылка на источник HackerTarget.com

Ссылка на источник wpmag.ru

Поэтому с аргументами и фактами у «ВордПресс» все в полном порядке 🙂 Если вы сделали свой выбор в сторону WordPress, то я считаю вы сделали правильный выбор!

Рубрики
WordPress Глава 1

Как работает интернет?


Вроде, кликнули — открылся браузер, еще раз кликнули — и уже читаем новости с сайта… Но на самом деле не так все просто, как кажется.

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

Тим Бернерс-Ли

Тим Бернерс-Ли
В 2015 году Тим Бернерс-Ли отметил свой юбилей — 60 лет. Да, много воды утекло с 80-х годов, когда британский ученый, изобретатель (совместно с Робертом Кайо) изобрел принцип работы Всемирной паутины — сети интернет. Подробнее…

Первый сайт в сети интернет появился 6 августа 1991 года. Вот по истине исторический адрес и размещение информации на нем http://info.cern.ch/

Как все работает?

На самом деле принцип работы Всемирной паутины (World Wide Web) достаточно прост. Предположим у нас есть удаленный сервер, где то в другой части света, а может и неподалеку от вас, не важно. Сервер представляет из себя по сути ту же компьютерную машину, что и у вас дома, которая имеет: оперативную память, систему охлаждения, процессор, дисковый накопитель, операционную систему и т.п., а так же специальное серверное программное обеспечение для взаимодействия с протоколом HTTP (ниже мы познакомимся с этим) и обработкой, операциями над файлами. Место расположения серверов принято называть дата-центром.

За жизнедеятельность веб-сервера отвечает операционная система (семейства Windows или Unix-подобная), в которой установлено специальное ПО, например, сервер Apache в связке с тем модулем (

  • PHP (mod_php)
  • Python (mod python, mod wsgi)
  • Ruby (apache-ruby)
  • Perl (mod perl)
  • ASP (apache-asp)

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

Сервера

1024px-Inside_and_Rear_of_Webserver

Рассмотрим пример на статическом сайте. На сервере расположен веб-документ, который в последствии мы запросим. Веб-документ представляет из себя статическую страничку .html оформленную согласно гипертекстовой разметки HTML (которую понимает ваш веб-обозреватель, браузер).

В промежуточном итоге мы имеем:

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

Не трудно догадаться, что осуществляя запрос, нам необходимо знать адрес, по которому доступен наш документ. Следовательно у всех веб-страниц, файлов есть свой уникальный адрес в сети интернет, именуемый — URL (Uniform Resource Locator) — Единый Указатель Ресурсов и свой, верней своя схема протокола передачи данных — HTTP (HyperText Transfer Protocol) — протокол передачи гипертекста, по правилам которой происходит запрос/ответ серверов (компьютерных машин).

Адреса удаленных машин на самом деле выглядят не  так красиво, как вы привыкли это видеть, ну например, http://apple.com/. Ведь на самом деле адрес сервера на котором расположен сайт выглядит так: 23.74.189.15

Вот пример проверки связи с сервером и обмен пакетами с адресом сайта компании «Apple» и «Яндекс», как мы видим за красивыми адресами, на самом деле скрывается обращение к IP сервера

Пинг

Согласитесь, что намного проще запомнить имя, нежели сочетание цифр и точек 🙂 Поэтому система, с помощью которой происходит преобразование этих IP-адресов в красивые адреса — называется системой DNS, в лице корпорации по управлению доменными именами и IP-адресами (сокращённо ICANN ).

Ну вот, пожалуй и все волшебство, которое происходит за кулисами.

Контрольные вопросы

  1. Что такое веб-сервер и чем он отличается от вашего ноутбука? 
  2. Принцип работы, взаимодействия компьютеров при запросе веб-страницы.
Рубрики
WordPress Глава 1

Введение в веб-технологии


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

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

Разработка веб-приложения, на примере веб-сайта включает в себя ряд взаимосвязанных этапов:

  1. Планирование и прототипирование
  2. Разработку дизайна (веб-дизайн страниц)
  3. Верстку с дизайн-макетов
  4. Веб-программирование
  5. Настройку веб-сервера и тестирование

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

Так какая разница между статичным и динамичным сайтом?

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

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

Да! Достаточно только язык разметки HTML и для художественной свободы в оформлении дизайна — технологии CSS.

HTML — язык разметки информации на страницы по средствам тегов — специальных символов, которые понимает браузер (веб-обозреватель) и при рендере (отрисовке, построении) страницы и поведение этих элементов зависит строго от применяемых тегов согласно спецификации W3. Это справедливо и для технологии CSS, которая дополняет HTML и позволяет задавать правила для каждого элемента на страницы.

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

Технологии HTML и CSS являются базовыми и их уже достаточно для постарения веб-сайта, в принципе можно получить достаточно хороший результат для небольшого информационного сайта, который будет статическим. Одно из преимуществ статических сайтов в том, что бы его построить и опубликовать не нужно знать серверные языки программирования и для его размещения подойдут недорогие хостинг-площадки, вдобавок статический сайт является самым безопасным, так как можно сказать, что нечего в нем «ломать». Ну а минусы очевидны — это отсутствие возможностей взаимодействия с пользователем (отправка форм, регистрация, калькуляторы и т.п.).

Назначение интернета

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

Если вам необходимо как то обозначить свой товар или услугу в сети, то совсем не обязательно использовать для этого дорогой хостинг и «напичканную» , ресурсозатратную CMS. Если вы владеете HTML, CSS, то этих знаний будет достаточно для создания полноценного Landing Page — страницы на которой вы сможете представить свой товар или услугу. Не стоит забывать и о бесплатных возможностях, таких, например, как сервис wix.ru , wordpress.com .

Серверные языки программирования

PHP

 

Python

На самом деле серверных языков программирование приличное количество, которое не ограничивается языком PHP на котором собственно и написана CMC WordPress. Одни из самых популярных это:

  • PHP
  • Python
  • .NET
  • Ruby
  • Perl

При хорошем знании и навыке использования языка, а на это уйдет несколько лет, перед вами открывается возможность построения веб-приложений. Часто функционал приложения чем то схож с уже подобным функционалом, который задействован на других ресурсах, ну например публикация страниц на сайте через интерфейс, или регистрация и роли пользователей, или рубрикация на сайте и создание меню. Согласитесь, что писать функционал с нуля для каждого сайта это бесконечная груда работы, повторяющихся действий… вот именно поэтому вы однажды задумаетесь о неких заготовках функций, которые будет удобно применять в последующих разработках, верно? Радуйтесь! Об этом уже подумали, на эти «грабли» наступили уже до вас!

FRAMEWORK (каркас)

В мире веб-разработки существует достаточно большое количество этих самых заготовок, которые экономят ваши силы, нервы и время 🙂

django-logo-positive

 

Ruby_on_Rails-logo

 

ZendFramework-logo

Одни из самых популярных в мире PHP (написаны на нем) являются:

  • Yii
  • Kohana
  • CodeIgniter
  • Zend Framework
  • CakePHP
  • Symfony

Например, язык «Phyton» представляет «Django», «Ruby» — популярный фреймворк «Ruby on Rails».

Чем сложней в конструкциях и развертывании приложения фреймворк, тем естественнее будет дороже на нем разработка, в силу определенного дефицита специалистов. А вот уже, например, из фреймворка мы можем получить готовый продукт, например, CMS. Вот и добрались мы до этой аббревиатуры!

Друпал

 

ВордПресс

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

Но что если наша CMS имеет в себе еще ряд заготовленных функций для ее расширения? К таким продуктам смело можно отнести «Drupal» и «WordPress», в обеих CMS есть в арсенале прекрасная документация для разработчиков, то следовательно справедливо добавить к аббревиатуре CMS, аббревиатуру — CMF (Content Management Framework). Поэтому как CMS WordPress, так и CMS Drupal имеют полное право использовать двойную аббревиатуру — CMS/CMF, наличие второй предполагает смысл того, что оба продукта уже выступают в роли системы управления содержимым сайта, а так же могут с помощью своей документации расширяться под нужды разработчика.

Контрольные вопросы

  1. Какая разница между статическим и динамическим сайтами?
  2. Для чего нужен HTML, CSS?
  3. Приведите пример серверного языка программирования, его отличие от HTML?
  4. Что такое FRAMEWORK? Примеры фреймворков.
  5. Чем отличается аббревиатура продукта CMS от CMF? 
Рубрики
Глава 1

История WordPress


History of WordPress (файл для скачивания)

Страница истории WordPress на официальном сайте

Вот историческая веб-запись, датированная 23-ем числом, месяца мая, 2003 года, где мы видим первое упоминание о WordPress, как о новом проекте пришедшим на смену проекту b2, разработку которого возложили на свои плечи Matt Mullenweg и Mike Little, тем самым став cоснователями WP.

А уже 27 мая 2003 года вышел первый релиз носивший название WordPress 0.7, именно с этих цифр стартует первая версия «ВордПресс»

Скрин записи

Конечно, если разбираться более детально, то наверно справедливо будет упомянуть и о «движке» b2, на смену которому и пришел WordPress. Поэтому стоит увековечить еще одну дату-исток проекта b2: вот запись сделанная Michel Valdrighi 12 июня 2001 года.

Первая запись b2

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

WordPress сегодня

Это мощная, активно развивающаяся CMS, с большим сообществом по всему миру. По независимым данным 20% всех сайтов в сети интернет работают под управлением «ВордПресс». Впечатляет цифра? А проект wordpress.com насчитывает на своих серверах более 80 миллионов веб-сайтов.

По всей планете силами энтузиастов, из которых и состоят сообщества, проходят встречи — конференции по WordPress — Wordcamp (крупного масштаба) и Meetup (мелкого масштаба), на которых докладчики конференции по средством выступлений делятся знаниями, а так же знакомятся друг с другом открывая тем самым для себя новые горизонты…

Фото-отчет с первой конференции по «ВордПресс» в 2013 году

Видеозаписи WordCamp Russia 2013

Фото с конференции

Фото с конференции

Фото с конференции

Рубрики
Глава 1

Что такое WordPress?


Кодекс Источник 1

WordPress — это система управления содержимым веб-сайта, которая родилась из желания создать удобную и элегантную систему для ведения  личных блогов. WordPress построен на серверных технологиях PHP и MySQL, он автоматизирует многие сложные процессы (функции) и позволяет без специфических знаний создавать динамичные сайты, с удобством изменять информацию на их страницах, управлять их иерархией и прочее.

Благодаря системам управления содержимым веб-сайта (CMS) порог при входе в мир веб-разработки становится намного ниже, что позволяет создавать вполне не плохие сайты даже непрофессионалам.

Основные возможности системы:

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

и прочие функции, неограниченное число которых доступно при задействовании плагинов.

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