Установка WordPress. Информационные технологии, интернет, веб программирование, IT, Hi-Tech, …
Сайта (консоли). Поэтому авторизуемся и входим в административную панель. В меню консоли ищем пункт «Параметры»
. При наведении на него курсором, выпадает меню пункта «Параметры». Для удобства работы кликаем по пункту «Параметры», все меню пункта полностью раскрывается в консоли.
Для начала сделаем общие настройки параметров WordPress
В общих настройках нужно заполнить следующие пункты.
Общие настройки WordPress
Название сайта
Название сайта должно содержать не более 10-60 символов и четко отражать тематику сайта. Надо помнить, что название сайта, заполненное в этой строке, будет отражаться в тегах
кода главной страницы сайта. Название сайта должно быть связано с ключевыми словами семантического ядра всего сайта и четко показывать посетителю и поисковикам о чем ваш сайт.</p><h4><b>Краткое описание
</b></h4><p>Общие настройки параметров WordPress содержат кроткое описание. Краткое описание это meta тег <og:description> для поисковых машин. Размер краткого описания должен быть не более 160 -170 знаков. Это оптимальный размер тега <og:description>. Краткое описание должно описывать весь сайт WordPress <b>полностью
</b>. должны входить в краткое описание сайта.</p><h4><b>Адрес WordPress (URL) и адрес сайта (URL)
</b></h4><p>Общие настройки параметров WordPress содержат два пункта настроек URL сайта. В одном пункте нужно вписать URL сайта WP, загруженного в корневой каталог. Например, <i>http://exempl.com
</i>. Если вы установили WordPress не в корневую папку сайта, а предположим в папку Sait, то во втором пункте этой настройки надо указать, именно этот URL. То есть, второй URL пункта общие настройки должен выглядеть так: <i>http://exempl.com/Sait
</i>.</p><h4><b>Адрес e-mail
</b></h4><p>Адрес e-mail. В этот пункт настройки нужно вписать ваш административный Email –адрес. По нему вам будут отправляться восстановленные пароли, сообщения о комментариях и другая системная информация по событиям на сайте.</p><h4><b>Членство
</b></h4><p>Этим пунктом вы можете открыть или зарыть сайт для регистрации пользователей сайта. Если вы разрешаете регистрацию пользователей, то в следующем пункте нужно определить роль посетителей на сайте после регистрации.
</p><h4><b>Роль нового пользователя
</b></h4><p>Здесь вы можете определить права нового пользователя на сайте. Выбрать нужно из: Подписчик, Администратор, Редактор, Автор, Участник. Управление пользователями сайта WP осуществляется в пункте «Пользователи» консоли.</p><p><b>Пункты настроек: Часовой пояс; Формат даты; Формат времени; Первый день недели
</b> заполните в соответствии с вашим географическим положением или с местом нахождения ваших подписчиков. По настройкам часового пояса будут публиковаться статьи и отправляться письма подписчикам. Если ваша аудитория находится в Америке, то лучше установить их часовой пояс.</p><p>Переходим к пункту «Настройки публикации»
</p><h3>Настройки публикации</h3> <br><img src='https://i2.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-05.png' width="100%" loading=lazy> Настройки публикации WordPress <p>Настройки публикации это небольшой, но важный пункт в «Настройки параметров WordPress». Если вы хотите, чтобы WordPress внутренними инструментами проверял HTML коды материалов, в соответствующем пункте поставите галочку.</p><p>В настройке <b>«Опубликовать»
</b> вы видите функциональную закладку. Предназначена она для быстрой публикации постов в блоге/сайте WordPress. Чтобы ей воспользоваться, «мышью» компьютера перетащите эту закладку на панель закладок или избранное своего браузера. Теперь вы сможете публиковать статьи, заметки, ссылки в ваш сайт WordPress непосредственно из браузера, без открывания консоли своего сайта WP.</p><p><img src='https://i0.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-07.png' width="100%" loading=lazy></p><h4>Настройка почтового клиента</h4><p>Настройки параметров WordPress включают пункт настроек почтового клиента. Это настройкой можно создать возможность публикации статей в сайт WordPress по почте Email. Для его заполнения вы должны работать с любым почтовым сервисом с POP3 доступом. Для детальной информации по этому материалу нужна отдельная статья. Обязательно напишу позже.</p><h4>Сервисы обновления</h4> <img src='https://i2.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-01.png' height="603" width="561" loading=lazy> Сервисы обновления WordPress <p>Это интересный пункт настроек WordPress. Настройки параметров WordPress позволяют при публикации новых статей уведомлять сервисы, следящие за обновлениями в интернет, об этой публикации. Такое сообщение называется пингование постов (Ping). По умолчанию WordPress будет уведомлять один сайт слежения http://rpc.pingomatic.com/.</p><p>Не стоит ограничиваться одним Ping сервисом. Приведу список выверенных, на момент публикации статьи, сервисов для пингования новых записей в WordPress. Хотя вы можете его проверить сами.</p><p>Важно!
не будет переводить URL уже написанных статей. Он начинает работать только для статей написанных после его установки.</p><p><b>Примечание:
</b> Некоторые хостинги запрещают пингование статей. Чаще всего это бесплатные хостинги с доменами третьего уровня.</p><p>Итак список сервисов для пингования статьей (нужно периодически проверять).</p><ul><li>http://rpc.pingomatic.com/</li><li>http://api.feedster.com/ping</li><li>http://ping.blogs.yandex.ru/RPC2</li><li>http://xping.pubsub.com/ping/</li><li>http://ping.blo.gs/</li><li>http://ping.feedburner.com</li><li>http://ping.syndic8.com/xmlrpc.php</li><li>http://rpc.weblogs.com/RPC2</li><li>http://www.blogdigger.com/RPC2</li><li>http://www.blogstreet.com/xrbin/xmlrpc.cgi</li><li>http://coreblog.org/ping/</li><li>http://bulkfeeds.net/rpc</li><li>http://ping.bitacoras.com</li><li>http://ping.bloggers.jp/rpc/</li><li>http://blog.goo.ne.jp/XMLRPC</li><li>//blogsearch.google.com/ping/RPC2</li><li>http://ping.bloggers.jp/rpc/</li>
</ul><p>Вставьте этот список в пункт настроек <b>«Сервисы обновления»
</b> и сохраните все сделанные изменения. Можно переходить к «Настройке чтения».</p><h3>Пункт настройки параметров «Настройки чтения»</h3><p>Эти настройки параметров WordPress, позволяют настроить внешний вид своего сайта WP, который увидят посетители при открытии главной страницы сайта.</p> <img src='https://i2.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-08.png' height="530" width="520" loading=lazy> Настройки чтение WordPress <p>Здесь возможны два варианта настроек.</p><ol><li>В первом варианте, при выборе, <b>«Ваши последние записи»
</b> посетители будут видеть ваши записи в прямой последовательности публикаций. Каждая новая статья будет отображаться выше предыдущих. Количество статей на главной странице можно настроить здесь же пунктов ниже: «На страницах блога отображать не более»</li><li>Второй вариант настройки главной страницы сайта WordPress это сделать статичную страницу. В ней вы можете расказать о своем сайте или продукте, который вы продвигаете. Рассказать о разделах сайта дать ссылки на разделы и т.п.</li>
</ol><p>Добавить статическую страницу просто. Открываете пункт консоли <b>Страницы→Добавить новую
</b></p><p><img src='https://i2.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-02.png' height="123" width="372" loading=lazy></p><p>Здесь делаете свою статическую страницу вашего сайта WordPress. Наполняете ее фотографиями, ссылками, роликами и т.п. Даете странице название. Публикуете страницу. Возвращаетесь в Параметры → Чтение.</p><p>Выбираем<b> «Главная страница»
</b> и выпавшем списке названий страниц выбираете страницу, которую вы создали чуть выше. Теперь при открытии вашего сайта по домену будет открываться ваша статическая страница.</p><p><img src='https://i2.wp.com/wordpress-abc.ru/wp-content/uploads/2013/01/Obshhie-nastroyki-WP-16.png' width="100%" loading=lazy></p><p>В пункте «Чтение» нужно заполнить, сколько записей вы хотите видеть на главной странице и в RSS ленте. Чтобы в ленте RSS отражались только анонсы статей, выберете пункт «Анонс».</p><p>Здесь же можете запретить поисковикам вообще видеть ваш сайт, включить так называемый режим личного дневника. <b>Не забывайте сохраниться.
</b></p><p>Все! Настройки параметров WordPress закончены. Сайт WordPress готов к публикации статей и открыт для поисковых систем.</p>
<p>Из этой статьи вы узнаете, как создать сайт на WordPress. С помощью пошагового руководства сделаете качественный и функциональный ресурс, пригодный для привлечения и конвертации трафика.</p>
<h2>Почему WordPress – что это такое и 5 причин его использовать для сайта или блога</h2>
<p>WordPress - это самая популярная система управления контентом (CMS). По данным Web Technology Surveys , на этом движке по состоянию на ноябрь 2018 года работает 32,3 % от общего числа существующих сайтов, а также 59,5 % сайтов, использующих CMS. В 2015 году WordPress использовали только 24 % ресурсов на CMS. Ниже перечислены основные причины популярности WordPress.</p><p>Бесплатный «движок»
CMS WordPress распространяется по открытому лицензионному соглашению (GNU GPL). Вы можете свободно использовать этот продукт в любых целях, включая коммерческие.
Практически неограниченные возможности
С помощью WordPress можно создать интернет-магазин, личный блог, корпоративный сайт, информационный портал, отраслевой ресурс, галерею мультимедиа.
Гибкая настройка внешнего вида и функциональности
Владельцам сайтов на WordPress доступны платные и бесплатные шаблоны, с помощью которых можно кастомизировать внешний вид. А с помощью плагинов можно решать технические задачи, обеспечивать необходимую функциональность сайта.
Простота администрирования
Чтобы работать с WordPress, не нужны специальные знания. Принципы работы с движком понятны на интуитивном уровне.
Возможность создать сайт и опубликовать первый контент в течение 5 минут
Конечно, придется потратить гораздо больше времени, чтобы превратить шаблонный продукт во что-то новое и интересное. Но на первую публикацию потратите не больше 5 минут.
</p>
<p>Ну что, решили сделать сайт на WordPress? Тогда переходите к пошаговому руководству.</p>
<h2>Шаг № 1: как выбрать хостинг и зарегистрировать домен</h2>
<p>Если у вас некоммерческий проект, выбирайте бесплатный хостинг. Например, делиться с миром фотографиями котиков или вести дневник молодого бодибилдера можно на платформе WordPress. Адрес сайта будет выглядеть так: primer.wordpress.com. Если реализуете коммерческий проект, например, создаете тематический блог, корпоративный сайт или планируете зарабатывать с помощью ресурса любым способом, выбирайте платный хостинг.</p>
<p>Чтобы выбрать надежного хостинг-провайдера, . Если на это нет времени, воспользуйтесь услугами одной из перечисленных ниже компаний:</p>
<p>Выбор доменной зоны не влияет на технические характеристики ресурса или позиции в поисковой выдаче. Однако теоретически этот параметр может влиять на доверие аудитории. При прочих равных пользователи охотнее верят сайтам с адресом vasya-pupkin.ru или vasya-pupkin.com, чем ресурсам типа vasya-pupkin.wordpress.com или vasya-pupkin.blogspot.com. Поэтому для коммерческих проектов старайтесь выбирать домены верхнего уровня, например, .com, .info, .org, .net, .ru, .ua, .by и т.п. Обратите внимание на появившиеся недавно домены первого уровня, например, .club, .guru, .ninja, .expert и другие.</p>
<h2>Шаг № 2: как установить WordPress своими руками</h2>
<p>После покупки хостинга и регистрации доменного имени установите WordPress. Обратите внимание, некоторые хостинг-провайдеры предлагают тарифные планы с предустановленной CMS. Если вы выбрали один из них, сразу переходите к третьему шагу руководства. Если вы приобрели хостинг без установленного движка, следуйте инструкциям:</p>
<p>Перейдите на сайт WordPress и скачайте дистрибутив.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/3.jpg' width="100%" loading=lazy></p>
<p>Распакуйте архив.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/4.jpg' width="100%" loading=lazy></p>
<p> <br><img src='https://i1.wp.com/texterra.ru/upload/img/26-11-2018/27.jpg' width="100%" loading=lazy></p>
<h3>Как русифицировать тему WordPress</h3>
<p>Русифицировать тему удобно с помощью бесплатной программы Poedit . Скачайте и установите ее на компьютер. Затем скачайте на компьютер языковые файлы выбранного шаблона. Для этого потребуется доступ к FTP. Его можно получить с помощью FTP-клиента, например, FileZilla, а также с помощью плагинов, например, File Manager . Если вы установили данный плагин, действуйте по описанному ниже алгоритму.</p>
<p>В консоли выберите меню FileManager – Configuration. Настройте конфигурации, как указано на иллюстрации.</p>
<p> <br><img src='https://i1.wp.com/texterra.ru/upload/img/26-11-2018/28.jpg' width="100%" loading=lazy></p>
<p>В меню FileManager – FileManager выберите папку wp-content – themes.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/29.jpg' width="100%" loading=lazy></p>
<p>Выберите папку темы, которую хотите русифицировать. В ней откройте папку languages.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/30.jpg' width="100%" loading=lazy></p>
<p>Скачайте на компьютер файлы en.mo и en.po. Если таких файлов нет, скачайте на компьютер файл с расширением.pot.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/31.jpg' width="100%" loading=lazy></p>
<p>Откройте программу Poedit и выберите опцию «Создать новый перевод».</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/32.jpg' width="100%" loading=lazy></p>
<p>Откройте файл перевода и укажите код языка.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/33.jpg' width="100%" loading=lazy></p>
<p>Приступайте к переводу. В поле «Исходный текст» программа отображает текст на английском языке. В поле «Перевод» нужно добавить текст на русском.</p>
<p> <br><img src='https://i1.wp.com/texterra.ru/upload/img/26-11-2018/34.jpg' width="100%" loading=lazy></p>
<p>Сохраните перевод. Программа загрузит на жесткий диск вашего ПК два файла: ru_Ru.mo и ru_RU.po. С помощью функции Upload files загрузите файлы в папку languges вашего шаблона.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/35.jpg' width="100%" loading=lazy></p>
<p>Вы русифицировали шаблон.</p>
<p>Вместо программы для ПК Poedit можно использовать плагин Loco Translate . После установки и активации надстройки интерфейс для перевода шаблонов появляется прямо в админке сайта.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/36.jpg' width="100%" loading=lazy></p>
<h2>Шаг № 5: решаем практические задачи с помощью плагинов для WordPress</h2>
<p>Плагины – одна из болезней начинающих владельцев сайтов на WordPress. Едва зарегистрировав ресурс, новоиспеченные вебмастера ищут в «Яндексе» статьи типа «100 лучших плагинов для WordPress» . Они устанавливают десятки расширений. Это негативно влияет на развитие ресурса. Дело не в замедлении работы сайта, хотя избыточное число плагинов может вызывать такую проблему.</p>
<p>Вопрос в концентрации внимания и усилий владельца сайта. Вместо создания и публикации качественного контента он часами ищет плагины, устанавливает их и настраивает. Такой вебмастер не видит леса за деревьями: он забывает, что плагины нужны для решения конкретных практических задач.</p>
<p>Чтобы успешно развивать сайт, пользуйтесь плагинами с осторожностью. Устанавливайте расширения только тогда, когда хотите решить конкретную задачу. С помощью плагинов можно сделать следующее:</p>
<ul><li>Обеспечить безопасность сайта.</li>
<li>Бороться со спамом.</li>
<li>Оптимизировать ресурс к требованиям поисковых систем.</li>
<li>Повысить функциональность и улучшить юзабилити.</li>
</ul><h3>Как с помощью плагинов обеспечить безопасность сайта на WordPress</h3>
<p>Сайт подвергается двум глобальным угрозам. Первая – вы сами. Стремление к совершенству и инновациям может заставить вебмастера пойти на рискованные эксперименты с кодом и программами, которые могут привести к потере информации. Защититься от этого можно с помощью плагинов, создающих резервные копии сайта.</p>
<p>Вторая угроза – несанкционированный доступ к ресурсу. Злоумышленники могут пытаться получить доступ к вашему сайту, чтобы установить на него вредоносный код или просто украсть его.</p>
<p>Чтобы регулярно создавать резервные копии сайта, воспользуйтесь одним из перечисленных плагинов:</p>
<p>Чтобы установить выбранный плагин, войдите в меню «Плагины – Добавить новый». Введите название расширения в поле поиска в правом верхнем углу и нажмите «Ввод». Также вы можете скачать плагин с сайта разработчика и установить его с помощью функции «Загрузить плагин» в верхней части экрана административной панели.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/37.jpg' width="100%" loading=lazy></p>
<p>Нажмите кнопку «Установить». После установки активируйте плагин. Теперь настройте параметры резервного копирования. Выберите меню «Инструменты – WP DB BackUp». Нажмите Create New Database BackUp. Вы создали резервную копию по требованию.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/38.jpg' width="100%" loading=lazy></p>
<p>Настройте регулярное создание резервных копий по расписанию. Перейдите на вкладку Sheduler, включите автоматическое создание резервных копий, выберите частоту создания архивов.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/39.jpg' width="100%" loading=lazy></p>
<p>На вкладке Destination включите автоматическое сохранение архива на Google Drive или отправку на электронную почту.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/40.jpg' width="100%" loading=lazy></p>
<p>Чтобы защитить сайт от несанкционированного доступа, воспользуйтесь плагином Loginizer Security . Надстройка надежно защищает сайт от взлома методом перебора или брутфорсинга.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/41.jpg' width="100%" loading=lazy></p>
<h3>Как бороться со спамом на сайте WordPress</h3>
<p>Плагины для борьбы со спамом актуальны, если вы пользуетесь дефолтной системой комментирования WordPress. Сторонние системы комментирования , например, Disqus, защищаются от спама самостоятельно.</p>
<p>Защититься от спама можно с помощью плагинов, например, Akismet или Antispam Bee . После установки Antispam Bee плагин работает в фоновом режиме. Обычно подходят дефолтные настройки, но если нужно что-то поменять, перейдите в меню админки «Настройки – Antispam Bee».</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/42.jpg' width="100%" loading=lazy></p>
<h3>Как обеспечить SEO сайта на WordPress</h3>
<p>WordPress – SEO-дружественная CMS по умолчанию. Но есть задачи, без которых сайт нельзя считать полностью соответствующим требованиям поисковых систем. Вот они:</p>
<ul><li>Создание и обновление карты сайта.</li>
<li>Канонизация URL.</li>
<li>Оптимизация title страниц.</li>
<li>Автоматическая генерация мета-данных страниц.</li>
<li>Блокирование индексации дублированного контента.</li>
<li>Создание микроразметки страниц .</li>
</ul><p>Чтобы решить эти задачи, вы установите по одному SEO-плагину из трех групп: программы для создания карты сайта, программы для технической оптимизации ресурса и программы для создания микроразметки. Для создания карты сайта используйте один из следующих плагинов:</p>
<ul><li>Google XML Sitemaps.</li>
<li>Simple WP Sitemap.</li>
<li>Google Sitemap.</li>
</ul><p> Google XML Sitemap . Для настройки плагина перейдите в меню «Настройки – XML-Sitemap».</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/43.jpg' width="100%" loading=lazy></p>
<p>Начинающим вебмастерам лучше оставить настройки по умолчанию. После активации плагин создал карту сайта, добавил ее адрес в файл robots.txt и приготовился уведомлять поисковые системы об обновлениях ресурса.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/44.jpg' width="100%" loading=lazy></p>
<p>Если вы считаете себя опытным вебмастером, можете изменить настройки плагина. В разделе «Дополнительные страницы» можно вручную включить в карту сайта URL, которые не были включены в нее автоматически. В разделе «Приоритет статьи» определите способ вычисления приоритетности индексирования контента. В разделах «Изменить частоты» и «Приоритеты» можете рекомендовать поисковым роботам наиболее приоритетные по вашему мнению типы контента.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/45.jpg' width="100%" loading=lazy></p>
<p>Для технической оптимизации ресурса воспользуйтесь одним из следующих плагинов:</p>
<ul><li>All in One SEO Pack.</li>
<li>WordPress SEO by Yoast.</li>
<li>Platinum SEO Pack.</li>
</ul><p>Установите и активируйте выбранный плагин, например, All in One SEO Pack . Используйте настройки по умолчанию, если вы только знакомитесь с WordPress. Если считаете себя продвинутым веб-мастером, можете изменить некоторые настройки SEO-модуля. Для этого выберите меню All in One SEO в консоли движка.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/46.jpg' width="100%" loading=lazy></p>
<p>Обратите внимание на перечисленные ниже настройки.</p>
<p>В разделе «Основные настройки» уберите флажок напротив пункта Use Schema.org Markup. Размечать страницу лучше с помощью отдельного плагина.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/47.jpg' width="100%" loading=lazy></p>
<p>Если в качестве главной используете страницу записей, в разделе «Настройки главной страницы» укажите title, description и keywords. Если в качестве главной используется статическая страница, установите флажок в поле «Включить».</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/48.jpg' width="100%" loading=lazy></p>
<p>В разделе «Настройки для вебмастера» укажите код верификации ресурса в кабинете для вебмастеров Google. Для этого добавьте в «Инструменты для вебмастеров» новый ресурс, выберите альтернативные методы верификации. Скопируйте часть кода HTML, указанную на иллюстрации.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/49.jpg' width="100%" loading=lazy></p>
<p>Вставьте ее в поле «Инструменты вебмастера Google» на странице настройки плагина.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/50.jpg' width="100%" loading=lazy></p>
<p>Сохраните параметры плагина. В кабинете для вебмастеров нажмите кнопку «Подтвердить».</p>
<p>Для разметки страниц воспользуйтесь одним из следующих плагинов:</p><p>Связка WPSSO и WPSSO JSON
Первый плагин базовый, а второй представляет собой расширение . С помощью базового решения на сайт можно добавить разметку Open Graph. С помощью второго с помощью JSON-LD реализуется разметка Schema.org.
WP SEO Structured Data Schema
С помощью данного плагина на сайт можно добавить несколько типов разметки Schema.org, включая Article, BlogPosting и Review. Разметка реализуется с помощью JSON-LD.
Плагин Schema App
С помощью этой программы на сайт можно добавить разные типы разметки Schema.org. Она реализуется через JSON-LD. Бесплатная версия поддерживает базовые типы разметки. Также разметку можно реализовать с помощью онлайн-генератора Schema.org JSON-LD Generator .
</p><p>Установите и активируйте плагины WPSSO и WPSSO JSON. В консоли на странице настроек плагинов в разделе Essential Settings укажите информацию о сайте, а также сведения для разметки Open Graph. Не меняйте другие настройки.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/51.jpg' width="100%" loading=lazy></p>
<p>Перейдите в раздел Schema Markup. В полях Organization Logo Image URL и Organization Banner URL укажите URL логотипа и баннера сайта. Эти изображения могут использоваться на странице поисковой выдачи.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/52.jpg' width="100%" loading=lazy></p>
<p>С помощью выпадающего меню выберите базовый тип разметки для страницы записей блога, статической главной страницы. Вам нужны следующие типы: Blog и Website соответственно.</p>
<p>Выберите тип разметки для страниц публикаций, статических страниц и страниц медиафайлов. Для страниц записей подходят типы разметки Article и BlogPosting. Выбор зависит от формата публикаций в блоге.</p>
<p>Тип разметки BlogPosting – производное Article. Кроме BlogPosting, к частностям Article относится тип разметки News Article или «Новость». То есть BlogPosting содержит все семантические данные разметки Article.</p>
<p>Используйте тип BlogPosting, если публикуете небольшие заметки, личные наблюдения и впечатления. Используйте тип Article, если публикуете обзоры, аналитические статьи, руководства. Вот пример: для публикаций в блоге «Текстерры» подходит тип разметки Article, а для дневника Екатерины Безымянной в ЖЖ подходит тип BlogPosting. Для статических страниц и страниц медиафайлов укажите тип разметки WebPage.</p>
<p> <br><img src='https://i0.wp.com/texterra.ru/upload/img/26-11-2018/53.jpg' width="100%" loading=lazy></p>
<p>После сохранения настроек плагин будет автоматически добавлять на страницы сайта выбранный тип разметки. В том числе семантические данные появятся на существующих страницах. Убедиться в этом можно с помощью инструмента проверки структурированных данных Google.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/54.jpg' width="100%" loading=lazy></p>
<p>Что делать, если вы публикуете материалы разного типа: лонгриды, небольшие заметки и новости? В этом случае для каждой публикации лучше выбрать подходящую разметку. Вместо надстройки WPSSO JSON воспользуйтесь плагином WP SEO Structured Data Schema.</p>
<p>После установки и активации плагина на странице редактирования постов появится дополнительный раздел. С его помощью можно выбрать тип разметки и указать структурированные данные.</p>
<p> <br><img src='https://i2.wp.com/texterra.ru/upload/img/26-11-2018/55.jpg' width="100%" loading=lazy></p>
<p>Недостаток плагина – необходимость размечать каждую публикацию вручную. А к преимуществам можно отнести поддержку дополнительных типов разметки, например, Review, Product и Aggregate Ratings. Бесплатная версия WPSSO JSON не поддерживает эти типы.</p>
<h3>Как повысить функциональность и юзабилити ресурса</h3>
<p>Повышать функциональность и юзабилити можно и нужно постоянно. Как отмечалось выше, некоторые владельцы сайтов на WordPress так увлекаются этим процессом, что устанавливают десятки и даже сотни плагинов. Чтобы избежать этой ошибки, начинайте повышение функциональности и улучшение юзабилити не с плагинов, а с определения проблем и задач, которые хотите решить.</p>
<p>Здравствуйте уважаемые посетители сайта . В этой статье мы рассмотрим первоначальные настройки wordpress сайта (блога), который только что был создан (имеется в виду важность этих настроек и необходимость их выполнения на самом начальном этапе развития вашего блога, если же ваш сайт уже существует некоторое время, то вам также может пригодиться данный материал для улучшения различных аспектов работы сайта).</p>
<h3>Внешний вид панели управления сайтом (или вид админки wordpress)</h3>
<p>Для начала можно настроить вид самой панели управления (админки) wordpress. Для этого щелкните справа вверху “Опции отображения” и в раскрывшемся меню оставьте только необходимые пункты. Я отключил все кроме “Текущее состояние блога” и “Последние комментарии”:</p>
<h3>Изменение общих настроек сайта на wordpress</h3>
<p>Чтобы изменить общие настройки сайта wordpress, зайдите в пункт “Настройки” меню админки, расположенного слева (данный пункт находится в самом низу):</p>
<p><img src='https://i1.wp.com/okitgo.ru/images/menu-nastroyki-adminki-wordpress.jpg' height="69" width="140" loading=lazy></p>
<p>По умолчанию подпункт “Общие” настроек блога на движке вордпресс является первым, так что сразу попадете в раздел общих настроек сайта:</p>
<p><img src='https://i0.wp.com/okitgo.ru/images/obshie-nastroyki-sayta-wordpress.jpg' width="100%" loading=lazy></p>
<p>Здесь можно изменить заголовок сайта (если вам не нравится тот, который ввели при установке wordpress), задать краткое описание сайта, например, “Мой первый блог на CMS WordPress!”, это описание в теме по умолчанию будет под заголовком сайта сверху. Также здесь указываются Адрес WordPress (URL) и Адрес сайта (URL). Если вы , то здесь у вас будет прописано в обоих адресах http://127.0.0.1/myfirstblog.ru, а если бы сайт был не локальный, то был бы указан адрес сайта в интернете – например, http://myfirstblog.ru. Менять эти адреса нет необходимости, общий принцип такой, что в обоих полях этих полях должен быть прописан адрес вашего блога, за исключением некоторых случаев, о которых я здесь не упоминаю. Адрес email будет тот, который был вами указан при установке cms. Флаг “Членство” по умолчанию снят, и устанавливать его следует только в случае, если вы хотите разрешить пользователям регистрироваться на сайте. Я ее снял, т.к. мне это не зачем. Если этот флаг не установлен, то параметр “Роль нового пользователя” не работает. Также в общих настройках wordpress блога можно указать часовой пояс – выберите в соответствии с настройками часового пояса вашей операционной системы, чтобы время локального сайта совпадало с временем в ОС. (Если часовой пояс выбран правильно, то справа от выбора часового пояса в строке “Локальное время” будет указано правильное местное время – но это произойдет не сразу, а только после сохранения измененных общих настроек). Собственно, чтобы изменения вступили в силу, надо нажать на кнопку “Сохранить изменения”. На этом этапе можно считать, что с первоначальными общими настройками сайта на wordpress покончено и в дальнейшем вам вряд ли придется что-либо в них менять.<br></p>
<h3>Настраиваем человеко-понятные ссылки (ЧПУ) блога на движке wordpress</h3>
<p>Настройка ЧПУ (Человеко-Понятных Урлов) является важным пунктом первоначальных настроек сайта на движке вордпресс. Качаем (либо с официального сайта , хотя плагин уже давно не обновляется, но на всякий случай можете проверить наличие более свежей версии), распаковываем архив и закидываем файл rus-to-lat.php в корневая_папка_сайта\wp-content\plugins\ (например, в примере статьи по эта директория называлась myfirstblog.ru. Затем заходим в админку движка WP (wordpress), щелкаем пункт меню “Плагины”, находим плагин RusToLat и кликаем “Активировать”:</p>
<p><img src='https://i0.wp.com/okitgo.ru/images/plagini-wordpress.jpg' width="100%" loading=lazy></p>
<p>Далее заходим в меню админки “Настройки”, щелкаем подменю Постоянные ссылки (ЧПУ), в общих настройках “постоянных ссылок” переключаем на “Произвольная структура” (“Custom structure”) и прописываем формат, например такой: “/%category%/%postname%/” – в этом случае в адресе старницы блога будет прописываться категория (рубрика) и название статьи. Далее щелкаем “Сохранить изменения”:</p>
<p><img src='https://i0.wp.com/okitgo.ru/images/nastroyka-postoyannih-chpu-ssilok.jpg' width="100%" loading=lazy><br></p>
<h3>Настройка привлекательной (а не отталкивающей посетителей) страницы 404</h3>
<p>Если вы попробуете ввести адрес несуществующей страницы вашего блока, например (в случае локального сайта на wordpress, созданного, как описано в примере выше) http://127.0.0.1/myfirstblog.ru/abracadabra (подразумевается, что у вас действительно нет такой страницы), то попадете на страницу с заголовком примерно таким: “Страница не найдена | Мой первый блог”:</p>
<p><img src='https://i0.wp.com/okitgo.ru/images/stranica-ne-naydena-oshibka-404.jpg' width="100%" loading=lazy><br>
Содержимое страницы будет иметь заголовок типа “Это как-то неприятно, не так ли?”, далее будет идти поисковая форма по сайту, последние записи, самые используемые рубрики, архивы и т.д. – короче говоря, внешний вид данной страницы будет определяться текущей темой оформления блога. У меня при установке блога из архива, указанного в самом начале статьи по в комплекте шло две темы: первая – the WordPress team на 1.2: Twenty Eleven (она же текущая), и вторая – the WordPress team на 1.2: Twenty Ten. Доступные темы вы можете посмотреть из админки, выбрав пункт основного меню “Дизайн”, сразу выберется первый подпункт “Темы”, а справа будет идти сначала “Текущая тема оформления”, а затем список доступных тем оформления:</p>
<p><img src='https://i1.wp.com/okitgo.ru/images/dostupnie-temi-wordpress.jpg' width="100%" loading=lazy></p>
<p>Посмотрев, какая у вас текущая тема, например у меня это, как я уже писал, была тема “Twenty Eleven”, идем в корневую папку вашего сайта, находим там подпапку wp-content, а в ней – подпапку themes, там, кстати хранятся все доступные темы, которые были описаны в админке. Находим директорию текущей темы, в моем случае это twentyeleven (в будущем, если вы решите сменить тему на другую – например, на новую тему, скачанную с интернета, то последовательность действий по настройке страницы ошибки 404 аналогичная), открываем эту директорию, и в ней находим файл 404.php. Это и есть файл, описывающий контент страницы 404, которая будет открываться всякий раз, когда посетитель перейдет по ссылке на страницу вашего сайта, которая не существует. Ну и редактируете данный файл, как вам хотелось, чтобы выгядела ваша страница 404. Кстати, когда я открыл файл 404.php для своей темы, то сильно удивился – весь текст там был на английском, при этом страница была полностью на русском языке! Оказалось, что все предложения на английском языке пропускаются через функцию _e, которая в свою очередь вызывает функцию translate и выпоняет еще некоторые действия, ладно не будем лезть в дебри API wordpress, дабы статья все-таки посвящена начальной настройке wordpress. Если в двух словах, то эта функция _e и отвечает за перевод текущей темы на русский язык. Итак, вопрос про настройку страницы 404 думаю можно считать решенным.</p>
<p>Добавлю только, что в некоторых шаблонах тем для wordpress страницы 404.php нет, в этом случае, если вы включите ЧПУ (как настроить ЧПУ ссылки было написано выше), то следует обязательно создать данную страницу – в корневой папке шаблона, поскольку при включенных ЧПУ ссылках движок wordpress будет перенаправлять посетителя, который ввел адрес несуществующей страницы вашего блога, именно на эту самую страницу 404.</p>
<p>Как создать страницу ошибки <span>404-страница-не-найдена
</span>, если ее нет в текущей теме сайта? В каждом шаблоне темы имеется страница – образец, файл которой находится в той же корневой папке темы (напомню путь к папке темы: корневая_директория_сайта\wp-content\themes\папка_темы\), и называется этот файл страницы-шаблона page.php . Если вы откроете этот файл в текстовом редакторе, то сможете в этом убедиться, поскольку в описании файла будет написано на английском языке примерно следующее (добавил от себя несколько дополнений, чтобы было понятнее): Образец для отображения всех страниц. Это образец (шаблон), который показывает вид страницы данной темы по умолчанию. Имейте в виду, что это шаблонная конструкция страниц WordPress и что другие страницы на вашем WordPress сайте будут использовать отличные от данного шаблоны и иметь другой вид. Короче говоря, создаете копию этого файла в той же корневой папке темы и переименовываете эту копию в 404.php , а затем уже редактируете на свое усмотрение и по ходу дела проверяете вид получаемой страницы – набрав несуществующий адрес для вашего блога в браузере.</p>
<p>Также есть возможность управления реакцией на ошибку 404 через файл htaccess, в случае если сайт работает на веб сервере Apache, в этом случае можно в этом файле прописать, что следует отображать при попытке доступа к несуществующей странице вашего сайта на wordpress. Подробности можете найти в описании структуры файла htaccess.<br></p>
<h3>Настройка написания в админке wordpress</h3>
<p>Щелкнув на пункте меню “Написание” админки движка wordpress и выбрав подпункт<br>
“Написание”, окажетесь на странице настроек написания контента для вашего блога:</p>
<p><img src='https://i1.wp.com/okitgo.ru/images/nastroyki-napisaniya-kontenta-dlya-bloga-na-wordpress.jpg' width="100%" loading=lazy></p>
<p>Тут есть несколько подразделов. В настройках написания вордпресс можно изменить размер области ввода текста при написании статьи и некоторые другие параметры, далее идут настройки удаленной публикации статей – без этого можно в принципе обойтись на этапе начальных настроек wordpress, а вот в конце идет весьма важный пункт, который стоит <i>настроить с самого рождения вашего блога
</i> – “Сервисы обновления”. В общем-то там кратко написано, для чего эти сервисы обновлений нужны – для быстрого оповещения других сайтов о новом контенте, который появился у вас на сайте. В текстовое поле ввода необходимо ввести адреса пинг-серверов. Тут сразу сделаю оговорку, если на данный момент вы делаете , то данное поле адресов сервисов пинга необходимо очистить – понятно, зачем кого-то оповещать о новом контенте на локальном сайте? Ведь все равно никто не сможет на этот локальный сайт зайти. А ваш все равно будет пытаться пинговать прописанные сервисы, так что лучше поле очистить. Если же ваш сайт уже находится на хостинге и доступен всем в интернете, то в это поле необходимо ввести адреса сервисов обновления. Предлагаю следующий . Можете просто скопировать содержимое данного текстового файла в поле ввода адресов сервисов пинга wordpress. Ну и наконец, необходимо нажать кнопку “Сохранить изменения”, чтобы настройки написания wordpress вступили в силу.<br></p>
<h3>Настройка чтения для сайта на wordpress</h3>
<p>Настройки чтения wordpress находятся в админке движка (как собственно и все остальные настройки cms), в пункте меню “Настройки” – “Чтение”:</p>
<p><img src='https://i2.wp.com/okitgo.ru/images/nastroyki-chteniya-wordpress.jpg' width="100%" loading=lazy></p>
<p>Здесь можно настроить следующие параметры:</p>
<ul><li>что будет отображаться на главной странице блога: либо это будут последние записи, либо статическая страница, которую вы выбираете из раскрывающегося списка “Главная страница” (этот вариант можно использовать при создании обычного сайта на wordpress, а не блога, где принято выводить последние опубликованные записи). Если вы выберете статическую страницу в качестве главной, то можете указать страницу записей – на ней будут выводиться последние посты.</li>
<li>количество записей, отображаемых на странице записей (это будет главная страница по умолчанию, если вы не сделали ее статичной). При наличии большего количества записей появится ссылка “Предыдущие записи”, т.е. все записи будут разбиваться на страницы по указанному количеству записей.</li>
<li>сколько последних записей отображать на RSS лентах</li>
<li>что выводить в RSS ленту – статью целиком или только анонс (здесь лучше указать анонс, чтобы вашим контентом не воспользовались сайты с автогенерацией содержимого из RSS лент)</li>
<li>какую кодировку использовать для страниц и лент rss – этот параметр лучше не менять, о чем красноречиво написано в описании данной настройки:Кодировка Вашего сайта (рекомендуется UTF-8, но если Вы любите приключения, можете попробовать другие кодировки)</li>
</ul><p>После осуществления настройки чтения вашего блога не забудьте кликнуть кнопку “Сохранить изменения”.</p>
<p>Спасибо за внимание!.</p>
<p>Вордпресс — несложный движок, рассчитанный для начинающих и опытных «игроков» сайтостроения. В нем легко разобраться.</p><blockquote><p>Но чтобы движок работал качественно, важно чтобы у вас была правильная начальная настройка WordPress после добавления его на хостинг.</p>
</blockquote><p>Если этого не сделать, у вас в дальнейшем появится масса проблем, которые непонятно как решать. И по каждой возникшей проблеме придется отдельно высиживать в Интернете в поисках решения. Потому чтобы вы не мучились в дальнейшем, ниже приведена инструкция по настройке Вордпресс после установки сайта на хостинг.</p><h2>Как лучше настроить Вордпресс после установки сайта на сервер</h2><p>Учтите, что приведенные ниже параметры настройки движка — это лишь один из вариантов конфигурации. Вы можете настроить его по-своему, но приведенные материалы помогут вам сориентироваться.</p> <h3>Настройка профиля</h3><p>Сразу после установки сайта на хостинг стоит перейти в «админку», в настройки профиля. Для начала деактивируйте визуальный редактор. Для этого нажмите галочку возле пункта «Редактор». Возможно, вам будет проще с визуальным редактором, но вебмастеры предпочитают видеть все так, как есть — то есть исходный код, а не то, что он дает. Кроме того, порой при переходе между текстовым и визуальным редактором случается сбой данных — расстановка тегов сбивается, и пропадает ваши html-теги. Порой это очень сильно злит и будоражит психику вебмастеров, так как можно написать много тегов, случайно переключить редатор — и все пропадет.</p><p>В настройках профиля вы выберете цветовое оформление админпанели. Далее обязательно впишите свои имя и фамилию, а также ник, который будет отображаться. Не забудьте указать имейл — это обязательно; а также аккаунт Гугл Плюс. Лучше нажмите гагочку возле пункта «Верхняя панель» — она отвечает за отображение административного сайдбара сверху, который упростит вам доступ к настройкам Вордпресс. Пункт «Горячие клавиши» также может быть полезным — сможете во время редактирования выделять текст разными форматами при помощи нажатия определенной комбинации кнопок на клавиатуре.</p><p>Рекомендуется после ввода имени и фамилии также написать как будет отображаться ваш ник. Это нужно, если вы хотите, чтобы ваше имя числилось под вашими статьями. Не каждому это понадобится, но на всякий случай (для подтверждения авторства) все же внесите ваш публичный ник. Он будет сформирован из имени и фамилии — вам нужно будет выбрать его из выпадающего списка (Вордпресс сгенерирует свои варианты).</p><p>И последние особенности настройки профиля после установки сайта на хостинг — это редакция пароля. Важно, чтобы он был сложным — имел много знаков (лучше от 10-ти), состоял из больших и маленьких букв, а также из цифр.</p> <h3>Общие настройки</h3><p>Это важный пункт настроек. От того, как вы его заполните, будет зависеть то как будет раскручиваться ваш сайт после установки его на сервер. Вот самые важные параметры, которые вам предстоит отредактировать:</p><ul><li>Название сайта. Лучше заранее определите направление, в котором будет работать ваш сайт. Если сделать название с ключевиками, то поисковые роботы будут лучше индексировать страницы ресурса. Название сайта будет отображаться в специально отведенном месте, которое определяются согласно особенностям установленной темы. Потому после установки шаблона не забудьте отредактировать расположение элементов.</li><li>Краткое описание — это еще один важный элемент для СЕО-продвижения вашей площадки. В этом пункте вы должны указать самые важные ключевики и человекопонятным языком объяснить пользователям, о чем ваш ресурс.</li><li>Адрес Вордпресс и сайта — этот пункт оставьте нетронутым, так как он сам заполняется после установки движка на сервер.</li><li>Часовой пояс — заполнять эту строку не обязательно. Обычно часовой пояс выбирается автоматически, но если боитесь, что появятся проблемы потом, то можете его сразу настроить.</li><li>Формат даты и времени — это то, как будет отображаться время публикации материала. Как показывает опыт, пользователи привыкли к стандартному варианту, потому можете его не менять. Порой даже после изменения этой настройки ничего не меняется — сайт все равно отображает свой вариант. Такое бывает, если у вас установлена тема.</li><li>Первый день недели — тут все очевидно. В России это понедельник, а вот в США — воскресенье.</li><li>Язык сайта — на ваше усмотрение.</li>
</ul><h3>Настройки публикаций</h3><p>Настройка WordPress этой категории:</p><ul><li>Преобразование смайлов — сомнительная функция. Люди давно отвыкли от использования специальных комбинаций символов для создания смайлов. Кроме того, не всякий сайт поддерживает эту функцию.</li><li>Исправление некорректного HTML-кода — эту функцию можно оставить включенной, но вы навряд ли заметите ее работу. Вордпресс будет исправлять написанные вами теги, после нажатия публикации — в основном, это исправление касается закрытия тегов.</li><li>Основная рубрика — важный момент. Когда вы добавляете новые публикации, они автоматически распределяются по категориям. В случае, если категорию вы не выбрали, тогда публикация переносится в основную рубрику. Определите раздел, который станет основным.</li><li>Основной формат записей — это можно не трогать. Оставляйте стандартный вариант.</li>
</ul><h3>Настройки чтения</h3><p>Эти пункты настройки нужны для читателей, то есть они определяют как ваши посетители будут видеть сайт. Вот пункты, которые вы сможете настроить:</p><ul><li>На главной странице отображать — тут выбираем либо статический вариант (подходит для интернет-магазинов, сайтов компаний и портфолио), либо выбираем отображение последних записей (это подойдет для блогов и новостных порталов). Также определите какая страница будет считаться главной, а на какой странице будут публиковаться записи (если вы не выбрали публикацию на главной).</li><li>На страницах отображать не более — этот пункт настроит количество записей, которые будет отображать сайт на главной после выбора ее, как динамичной страницы.</li><li>RSS — далее определите количество записей в RSS-лентах. Можно оставить стандартное значение.</li><li>Для каждой статьи отображать — лучше выбрать отображение анонса. Сайт с анонсами записей получает меньше отказов в статистике, и выглядит куда приятнее, чем ресурс, у которого все статьи целиком раскрыты на странице записей.</li><li>Видимость для поисковых систем — не переживайте, этот пункт не принесет вам вреда, даже если отметить галочку запрета индексации. Сайт все равно будет проиндексирован.</li>
</ul><h3>Настройки обсуждения (иногда «Настройки комментариев»)</h3><p>Самые важные пункты в этом разделе настроек:</p><ul><li>Настройки для статьи по умолчанию — лучше отключите первые два пункта настройки, так как они будут прогружать блог, пытаясь оповещать других блогеров о добавлении вами ссылки на их ресурсы.</li><li>Перед появлением комментариев — рекомендуется отметить галочку, чтобы комментарии одобрялись вручную. Иначе ваш сайт превратится в спам-помойку.</li><li>Другие настройки комментариев — чтобы обсуждения публикаций не путались, отметьте галочку возле древовидных комментариев.</li><li>Отправить мне письмо когда — лучше отключите отправку письма, иначе с сайта вам будет приходить море оповещений.</li>
</ul><h3>Настройки медиафайлов</h3><p>Здесь ничего сложно нет — вам необходимо будет задать стандартные размеры изображений для коррекции картинок под параметры шаблона. Задайте размеры для миниатюры изображений сайта, для среднего и крупного образца. Потом после добавления картинок в статью вы сможете автоматически менять их размер.</p><p>Указанные настройки не обязательно должны быть такими же, как вы установите их себе на сайт. Это ваше право менять их, но приведенные параметры являются наиболее удобными, и не вызывают проблем.</p>
<p>Согласно исследованиям проводимым Google, более 50% поисковых запросов по всему миру производятся с мобильных телефонов. В связи с этим стоит убедиться, что ваш сайт на WordPress загружается быстро и выглядит прилично для этой категории производящих поиск пользователей. К счастью, проект Google Accelerated Mobile Pages (AMP) делает эту задачу более легко выполнимой.</p><p>В этом руководстве мы расскажем, как установить WordPress AMP двумя способами:</p><ol><li>Используя плагин AMP for WordPress .</li><li>Через плагин .</li>
</ol><p>Мы также поясним, что такое WordPress AMP и обсудим, как проверить их корректность работы после установки. Погружаемся!</p><i>
</i><h2><span>Что такое WordPress AMP и чем он полезен для вашего сайта
</span></h2><p>Google Accelerated Mobile Pages (AMP) – это библиотека с открытым программным кодом, которая помогает создать быстрые, плавно прокручиваемые и упрощённые версии ваших веб-страниц, которые прекрасно смотрятся на мобильных устройствах. AMP очень дружелюбна, построенная на существующих платформах и фреймворках . К тому же, она полностью совместима с WordPress.</p><p>Если кратко, то Google AMP работает таким образом, что позволяет вам создавать дубликат вашего сайта, используя AMP HTML . Этот процесс исключает большинство элементом, которые могут привести к медленной загрузке вашего сайта (JavaScript, сторонние скрипты др.). Затем Google обрабатывает и “сглаживает” ваш сайт, для ещё более быстрой его загрузки. После этого результаты будут выглядеть где-то так:</p><p><img src='https://i1.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/amp-website-example.jpg' align="center" width="100%" loading=lazy></p><p>Google AMP обеспечивает множество преимуществ, хотя он имеет некоторые недостатки. Давайте изучим обе стороны медали. Начнём с преимуществ:</p><ul><li><b>Улучшение поисковой оптимизации (SEO).
</b>Наиболее очевидным преимуществом Google AMP является прирост скорости. Так как скорость – это критический фактор , когда речь идёт о рейтинге ваших страниц в результатах поиска (Search Engine Results Pages – SERPs), это может помочь сделать ваш сайт более заметным. Google AMP гарантирует, страницы вашего сайта будут показаны в новостной карусели Google (Google News carousel), в приоритетном расположении вверху в не требующей прокрутки области результатов поиска на мобильных (ещё больше повышает SEO позиции).</li><li><b>Улучшенный интерфейс пользователя.
</b>Было подсчитано, что 33% всех потенциальных продаж теряются , если веб-сайт не оптимизирован под мобильные устройства. Ещё более тревожные результаты исследований показывают, что 57% пользователей интернета не станут рекомендовать бизнес с сайтом, который не адаптирован для мобильных устройств. Google AMP делает такую оптимизацию простой и возможной и тем самым позволяет избежать этой опасности.</li><li><b>Повышенная производительность сервера
</b>. Google AMP извлекает выгоду из некоторых ключевых функций оптимизации Google. Уменьшает трафик от изображений до 50% без потери качества и снижает нагрузку на работу сервера. Снижая нагрузку на сервер, AMP помогает улучшить производительность вашего сайта.</li>
</ul><p>С другой стороны, у Google AMP есть и свои недостатки:</p><ul><li><b>Ограничения каскадных таблиц стилей (Cascading Style Sheets – CSS) и JavaScript.
</b>Хотя Google AMP позволяет вам достичь молниеносного времени загрузки, это может вам стоить отдельных элементов сайта. AMP удалит графику очень высокого качества, сложную анимацию и другие яркие элементы, которые используют CSS и JavaScript.</li><li><b>Отображаются только страницы из кэша.
</b>Высокая скорость Google AMP также является следствием того, что Google включает отображение версии ваших страниц из кэша . По этой причине ваши пользователи не всегда смогут получить доступ к последним версиями контента.</li><li><b>Ограниченные возможности доступа к рекламным объявлениям.
</b>Не смотря на то, что Google AMP поддерживает рекламу , процесс её описания очень сложен. Он также имеет ограниченные возможности интеграции с внешними рекламными платформами.</li>
</ul><p>Если этих недостатков достаточно, чтобы задуматься, вы можете обратить своё внимание на адаптивный веб дизайн для своего сайта. Хотя, если вы ищете быстрое и простое решение сделать свои страницы функциональными для мобильных устройств, Google AMP остаётся лучшим вариантом.</p><p>В следующем разделе мы опишем два метода установки WordPress AMP при помощи нескольких удобных плагинов для ускорения мобильных страниц в WordPress.</p><h2><span>Как установить WordPress AMP при помощи двух плагинов
</span></h2><p>Для установки AMP на вашем сайте вам потребуется плагин WordPress AMP. Прежде чем продолжить с этим или следующим методом мы рекомендует . После этого у вас всё готово к началу.</p><h3><span>Вариант 1: Используем плагин AMP для WordPress
</span></h3><h3><br><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMP-for-WordPress-Plugin-Page.jpg' align="center" width="100%" loading=lazy></h3><p><img src='https://i1.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMP-for-WordPress-on-the-WordPress-plugins-page.png' align="center" width="100%" loading=lazy></p><p><img src='https://i0.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/The-WordPress-customizer-page-design-tab..jpg' align="center" width="100%" loading=lazy></p><p>На этой странице вы можете настраивать вид своего сайта WordPress AMP по своему предпочтению и просматривать предварительно любые изменения, перед тем как опубликовать их. Вы можете настраивать текст своего сайта, ссылки и цвет фона. Плюс, мы можете выбрать, какую цветовую схему вы хотите использовать – светлую или тёмную (т.е. черную или белую) для своего сайта. Когда внесённые настройки вас будут полностью устраивать просто нажмите <b>Publish
</b> вверху страницы.</p><p>Ещё вы можете установить, где записи, страницы или и те и другие будут располагаться в WordPress AMP. Чтобы это сделать, просто вернитесь в консоль WordPress и перейдите в <b>AMP
</b> <b>> General
</b>:</p><p><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/AMP-for-WordPress-Plugin-General-Settings-page-screenshot.jpg' align="center" width="100%" loading=lazy></p><p>На этой странице отметьте рядом с настройкой <b>Post Type Support
</b> те види публикаций, которые вы хотели бы видеть на сайте WordPress AMP и нажмите на <b>Save Changes
</b>.</p><p>Вы наверняка обратили внимание, что здесь не так уж много настроек. К счастью, есть несколько плагинов, которые вы можете использовать для расширения вашего выбора. Например, вы можете использовать Glue for Yoast SEO & AMP для интегрирования с плагином Yoast SEO с вашей установкой AMP.</p><p>Перейдите в <b>Плагины
</b> <b>›
</b> <b>Добавить новый
</b>, найдите, установите и активируйте Yoast SEO:</p><p><img src='https://i1.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/The-Yoast-SEO-plugin-displayed-on-the-WordPress-plugin-page-screenshot-1.jpg' align="center" width="100%" loading=lazy></p><p>После этого сделайте тоже самое с плагином Glue for Yoast SEO & AMP. Затем перейдите в <b>SEO
</b> <b>›
</b><b>AMP
</b> в админ консоли. Здесь вы можете выбрать, хотите ли вы включить записи и медиа типы данных в поддержку AMP:</p><p><img src='https://i0.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/The-Glue-for-Yoast-SEO-Post-Types-Page-screenshot.jpg' align="center" width="100%" loading=lazy></p><p>После этого нажмите кнопку <b>Save changes
</b>. Дополнительные настройки можно найти на вкладке <b>Design
</b>. Здесь вы можете установить иконку для сайта WordPress AMP, подобрать цветовую схему и даже добавить свой CSS:</p><p><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/Glue-for-Yoast-SEO-Design-Tab-Screenshot.jpg' align="center" width="100%" loading=lazy></p><p>Плагин AMP for WordPress прекрасный, если вы хотите добавить базовую функциональность AMP на свой сайт. Однако, если вы хотите больше настроек внешнего вида вашего сайта WordPress AMP (и возможность их расширять в будущем) наш следующий плагин для ускоренных мобильных страниц WordPress может больше подойти для вашего случая.</p><h3>Вариант 2: Установка плагина AMP для WP – Ускоренные мобильные страницы </h3><h2><br><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/AMP-for-WP-Accelerated-Mobile-Pages-WordPress-plugin-page-screenshot.jpg' align="center" width="100%" loading=lazy></h2><p>В дополнение для обеспечения привлекательного и удобного для начинающих интерфейса настройки страниц этот плагин WordPress AMP может интегрироваться с множеством других инструментов. Среди них: WooCommerce (ведущий плагин для электронной коммерции в WordPress), Alexa metrics , OneSignal push button notifications и другие.</p><p>Для использования этого плагина AMP для WordPress, вначале нужно перейти в <b>Плагины
</b> > <b>Добавить новый
</b> в вашей консоли. Найти “<b>AMP for WP”
</b>, установить и активировать плагин:</p><p><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMP-for-WP-Accelerated-Mobile-Pages-Plugin-WordPress-plugin-page.png' align="center" width="100%" loading=lazy></p><p>Далее перейдите на новую вкладку AMP в админ панели WordPress. Вы увидите подпункты меню с разделами <b>Settings
</b>, <b>Design
</b>, <b>Extensions
</b>и другие. Давайте подробнее посмотрим на настройки в <b>Settings
</b>:</p><p><img src='https://i1.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/AMPforWP-Plugin-Settings-page.jpg' align="center" width="100%" loading=lazy></p><p>Скорее всего вы захотите начать с раздела руководства со ссылками <b>Getting Started
</b> на этой страница. Это поможет вам самым лучшим образом настроить свой WordPress AMP. После этого, вы можете запускать разные опции AMP для WP, включая:</p><p>Нажмите на <b>Save Changes
</b>для каждой настройки выше, как только вы закончите с ней. После этого выберите вкладку <b>Design
</b>:</p><p><img src='https://i0.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/07/AMPforWP-Themes-option.jpg' align="center" width="100%" loading=lazy></p><p>Собственно здесь вы можете управлять внешним видом своего сайта WordPress AMP. Для этого выберите конкретную тему AMP из списка в меню <b>Theme Selector
</b>.</p><p>После выбора темы вы можете настраивать её внешний вид. Вы найдёте настройки дизайна для цветовой схемы и шрифта (вкладка <b>Global
</b>), выбор отображения заголовка и подвала, слайдер на главной странице и многое другое. В разделе <b>Social
</b> вы можете также выбрать, какие кнопки социальных сейте вы желаете отображать на своём сайте WordPress AMP.</p><p>Если вы довольные видом своего AMP-сайта, сохраните все изменения. Вы также можете предварительно их посмотреть, если перейдёте в <b>Appearance
</b>><b> AMP:
</b></p><p><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMPforWP-Appearance-AMP-preview.jpg' align="center" width="100%" loading=lazy></p><p>Бесплатная версия AMP для WP содержит широкий набор функций. Однако, вы можете значительно улучшить внешний вид и функциональность вашего сайта AMP с платными расширениями. Есть расширения для описания рейтинга (будет полезным для товаров или профилей недвижимости), интеграции с AMP WooCommerce Pro , использования пользовательских типов записей и другого:</p><p><img src='https://i1.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMPforWP-Extensions-page.jpg' align="center" width="100%" loading=lazy></p><p>Платные темы AMP также доступны после оплаты. Посмотреть их можно в разделе <b>Design
</b> > <b>Themes
</b> в вашей админ консоли. Есть специальные настройки, которые подойдут для определённых видом сайтов, как например, сайтов новостей, журналов и так далее. Плюс, есть несколько замечательных многоцелевых тем:</p><p><img src='https://i1.wp.com/hostinger.com/tutorials/wp-content/uploads/sites/2/2018/05/AMPforWP-premium-themes-page-screenshot.jpg' align="center" width="100%" loading=lazy></p><p>Если вы желаете попробовать ещё больше дополнительных функций, то для вас целый ряд тарифных планов Pro plans доступных для этого плагина. Диапазон от плана <i>Personal
</i> (обслуживание одного сайта за $149 в год) до плана <i>Agency
</i> (обслуживание неограниченного количества сайтов за $499 в год).</p><h2><span>Как проверить корректность работы своего сайта WordPress AMP
</span></h2><p>Когда вы настроили любой из плагинов AMP для WordPress, вы подошли к ещё одному шагу. Вам нужно проверить работу WordPress AMP, чтобы убедиться, что он доступен и залинкован на supported platforms . Проверка – это также удобный путь посмотреть ошибки AMP с целью их устранения.</p><p>Один их быстрых и простых способов проверить AMP – использовать инструмент разработчика в браузере. Для этого вам нужно открыть страницу AMP в вашем браузере (в нашем примере мы используем Google Chrome). Дальше вам нужно добавить следующее в конце URL:</p><p><i>#development=1
</i></p><p>Как только вы это сделаете, откройте консоль инструментов разработчика в браузере. Для Google Chrome это Chrome DevTools console . Если найдены ошибки, они будут подсвечены красным, вместе с анализом их причин.</p><p>Обычно ошибки проверки вызваны неверными префиксами, некорректным форматированием кода и/или неподдерживаемыми тегами. В большинстве случаев, будут присутствовать настройки исправления ошибок. Кроме этого, проект Google AMP также описывает метод устранения распространённых ошибок проверки , если авто-исправление отсутствует.</p><p>Другой эффективный способ проверки AMP – использование расширения AMP Validator для Google Chrome и Opera :</p><p><img src='https://i2.wp.com/hostinger.ru/rukovodstva/wp-content/uploads/sites/8/2018/08/AMP-Validator-Extension-for-Google-Chrome.jpg' align="center" width="100%" loading=lazy></p><p>Этот инструмент обеспечивание простое определение ошибок (красные иконки), равно как и их причин. К тому же, если вы запустили проверку AMP на своей не AMP странице, голубая иконка расширения покажет вам ссылку перенаправления на версию станицы AMP. Эта настройка предлагает удобный способ оценки элементов темы вашего сайта, которые могут помешать правильному отображению вашего WordPress AMP.</p><h2>Заключение
</h2><p>Даже несколько дополнительных секунд времени загрузки могут значительно снизить рейтинг вашего сайт в поисковиках (и ваш коэффициент конверсии). К счастью, как мы уже видели, использование Google AMP может помочь вам убедиться, что страницы вашего сайта загружаются молниеносно на мобильных устройствах. Что ещё, конфигурация и тонкая настройка AMP для WordPress – это просто и понятно, если вы используете правильный плагин WordPress для ускоренных мобильных страниц.</p><p>У вас остались вопросы о том, как установить какой-либо плагин WordPress AMP? Дайте нам знать в комментариях!</p>
<script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+
escape(document.referrer)+((typeof(screen)=="undefined")?"":
";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?
screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+
";"+Math.random()+
"border='0' width='1' height='1' loading=lazy>");</script>
</div>
</article>
<div class="related-posts">
<h3 class="title text-uppercase text-center">Еще на эту тему:</h3>
<div class="row">
<div class="post article-wrp with-border col-sm-6 col-md-4">
<div class="article-in-loop">
<a class="thumb-title" href="/top-programm-dlya-udaleniya-draiverov-skachat-driver-sweeper/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i2.wp.com/pc-assistent.ru/wp-content/uploads/2017/06/driver_sweeper_200x175.png" class="img-responsive" alt="Скачать Driver Sweeper – программа для удаления драйверов из OC Windows Скачать программу для удаления драйверов карты" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
</span>
<span class="title">
Скачать Driver Sweeper – программа для удаления драйверов из OC Windows Скачать программу для удаления драйверов карты </span>
</a>
</div>
</div>
<div class="post article-wrp with-border col-sm-6 col-md-4">
<div class="article-in-loop">
<a class="thumb-title" href="/vykidyvaet-na-rabochii-stol-sniper-elite-v2-vykidyvaet-na-rabochii-stol-sniper-elite-v2-chto/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i2.wp.com/i.rutab.net/upload/tech_issues/audio_check.png" class="img-responsive" alt="Выкидывает на рабочий стол Sniper Elite V2 Что делать если лагает sniper elite 3" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
</span>
<span class="title">
Выкидывает на рабочий стол Sniper Elite V2 Что делать если лагает sniper elite 3 </span>
</a>
</div>
</div>
<div class="post article-wrp with-border col-sm-6 col-md-4">
<div class="article-in-loop">
<a class="thumb-title" href="/kak-naiti-kartinu-po-fotografii-poisk-pohozhei-fotografii-v-internet-poisk/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i2.wp.com/kompukter.ru/wp-content/uploads/2018/03/klikaem-po-znachku-foto-v-gugl.png" class="img-responsive" alt="Поиск похожей фотографии в интернет" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
</span>
<span class="title">
Поиск похожей фотографии в интернет </span>
</a>
</div>
</div>
</div>
</div>
</div>
<aside id="sidebar" class="col-sm-4 col-sidebar hidden-xs" role="complementary">
<div class="content-menu bs-docs-sidebar">
<div class="progress-right" id="progress-right">0%</div>
<script>
window.onscroll = function() {
var scrolled = window.pageYOffset || document.documentElement.scrollTop;
var scrollprogress = Math.round(scrolled / ((document.documentElement.scrollHeight - document.documentElement.clientHeight) / 100));
document.getElementById('progress-right').innerHTML = scrollprogress + '%';
}
</script>
<div class="ad clearfix text-center">
</div>
</div>
<script>
/**
* Скрипт закріплення блоку при прокрутці
*/
(function() {
var a = document.querySelector('#sidebar'),
b = null,
P = 0;
window.addEventListener('scroll', Ascroll, false);
document.body.addEventListener('scroll', Ascroll, false);
function Ascroll() {
if (b == null) {
var Sa = getComputedStyle(a, ''),
s = '';
for (var i = 0; i < Sa.length; i++) {
if (Sa[i].indexOf('overflow') == 0 || Sa[i].indexOf('padding') == 0 || Sa[i].indexOf('border') == 0 || Sa[i].indexOf('outline') == 0 || Sa[i].indexOf('box-shadow') == 0 || Sa[i].indexOf('background') == 0) {
s += Sa[i] + ': ' + Sa.getPropertyValue(Sa[i]) + '; '
}
}
b = document.createElement('div');
b.style.cssText = s + ' box-sizing: border-box; width: ' + a.offsetWidth + 'px;';
a.insertBefore(b, a.firstChild);
var l = a.childNodes.length;
for (var i = 1; i < l; i++) {
b.appendChild(a.childNodes[1]);
}
a.style.height = b.getBoundingClientRect().height + 'px';
a.style.padding = '0';
a.style.border = '0';
}
var Ra = a.getBoundingClientRect(),
R = Math.round(Ra.top + b.getBoundingClientRect().height - document.querySelector('#content').getBoundingClientRect().bottom); // селектор блока, при достижении нижнего края которого нужно открепить прилипающий элемент
if ((Ra.top - P) <= 0) {
if ((Ra.top - P) <= R) {
b.className = 'stop';
b.style.top = -R + 'px';
} else {
b.className = 'evr-sticky';
b.style.top = P + 'px';
}
} else {
b.className = '';
b.style.top = '';
}
window.addEventListener('resize', function() {
a.children[0].style.width = getComputedStyle(a, '').width
}, false);
}
})()
</script>
<style>
/* Додаємо відступ вгорі, щоб було на одному рівні із змістом */
body.single #breadcrumbs {
margin-bottom: 5px;
}
#content article {
padding-top: 15px;
}
#sidebar .evr-sticky {
position: fixed;
z-index: 101;
}
#sidebar .stop {
position: relative;
z-index: 101;
}
#div-gpt-ad-30906309 {
margin-top: 20px;
}
#sidebar .evr-sticky #div-gpt-ad-30906309,
#sidebar .stop #div-gpt-ad-30906309 {
margin-top: 20px;
}
#sidebar .content-menu {
transition: 0.5s all;
}
#sidebar .content-menu .title {
padding-top: 15px;
font-size: 20px;
margin: 0 0 15px 0;
}
#sidebar .content-menu .title .glyphicon {
padding-right: 5px;
}
#sidebar .content-menu ul {
padding: 0;
margin: 0;
overflow: auto;
}
#sidebar .content-menu .nav li {
margin: 0;
clear: both;
margin-bottom: 4px;
}
/* Bullet before text */
#sidebar .content-menu .nav li a:before {
content: "●";
position: absolute;
font-size: 17px;
color: #dedede;
left: 0;
top: -1px;
}
#sidebar .content-menu .nav li a {
position: relative;
display: inline-block;
font-size: 15px;
color: #000;
line-height: 1.2;
padding: 3px 0 0 18px;
overflow: hidden;
text-decoration: none !important;
}
#sidebar .content-menu .nav li.active:focus>a,
#sidebar .content-menu .nav li.active:hover>a,
#sidebar .content-menu .nav li.active>a,
#sidebar .content-menu .nav li a:hover {
text-decoration: none;
font-weight: normal;
color: #c23085;
background-color: transparent;
border-left: 0 none;
}
/* Bullet before text */
#sidebar .content-menu .nav li.active>a:hover:before,
#sidebar .content-menu .nav li.active>a:before {
-moz-transform: scale(1.3);
-webkit-transform: scale(1.3);
transform: scale(1.3);
left: 1px;
color: #c23085;
background: transparent;
}
#sidebar .content-menu .nav li a:hover:before {
color: #c23085;
background: transparent;
}
#sidebar a.go-top {
display: block;
margin-top: 5px;
padding: 14px 0 5px 0;
text-align: center;
text-transform: lowercase;
font-size: 17px;
color: #666;
background: transparent url(/wp-content/themes/sk-Evrikak/i/go-top-in-sidebar.png) no-repeat 50% 50%;
opacity: 0;
transition: 0.2s all;
}
#sidebar a.go-top:hover {
color: #000;
text-decoration: none;
}
/* Якщо блок зафіксовний */
#sidebar .evr-sticky a.go-top {
opacity: 1;
}
#sidebar .evr-sticky {
box-shadow: -9px 0 10px 0 rgba(0, 0, 0, 0.08) !important;
}
</style>
<script>
jQuery(document).ready(function() {
// (c) http://jsfiddle.net/gableroux/S2SMK/
// підсвітка активного пункту меню, bootstrap
jQuery('body').scrollspy({
target: '.bs-docs-sidebar',
offset: 70
});
// даємо висоту меню, щоб зробити прокрутку
jQuery(window).bind("load resize", function() {
var body_w = jQuery("body").width(); // визначаємо ширину вікна
var window_h = jQuery(window).height(); // визначаємо висоту вікна
//alert(window_h);
if (body_w > '767') { // якщо ширина більша 767
window_h = window_h - 375; // коригуємо висоту блоку з меню. віднімаємо висоту блоку «наверх», у перспективі треба буще ще відняти інші-нові блоки
var menu_h = jQuery('#sidebar .content-menu').height();
//if(menu_h > window_h) { // якщо висота усього сайдбару більше висоти екрану, то вказуємо висоту для меню. Воно автоматично розтягне висоту сайдбару, з’явиться прорутка у меню, і сайдбар займе усю висоту вікна
jQuery('#sidebar .content-menu ul.nav').css('height', window_h);
//}
}
});
// парсимо контент і формуємо меню
jQuery('#content .evr-section').each(function() {
var evr_section_id = jQuery(this).attr('id');
var evr_section_title = jQuery(this).find(':header:first').text();
var txt = '<li class="content-menu-item added-by-js"><a href="#' + evr_section_id + '">' + evr_section_title + '</a></li>';
//var txt = txt.unwrap();
//txt = jQuery('li', txt).unwrap;
//txt = txt.unwrap('h3');
//txt = jQuery(txt).wrap('<li>');
jQuery('#sidebar ul.nav').append(txt); // Insert
});
// Додаємо спеціальний клас для посилання на відео
jQuery('#sidebar .content-menu').find("a[href='#entry-video']").addClass('link-to-video');
// навігація по статті (плавна прокрутка до потрібного блоку)
jQuery('#sidebar .content-menu .nav a').click(function() {
jQuery.scrollTo(this.hash, {
offset: -10, // Відступ вгорі
duration: 750
});
return false;
});
// перейти вгору (плавна прокрутка вгору)
jQuery('#sidebar a.go-top').click(function() {
jQuery.scrollTo(this.hash, {
offset: 0, // Відступ вгорі
duration: 450
});
return false;
});
});
</script>
<link type="text/css" href="/wp-content/themes/sk-Evrikak/scroll-Pane/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<script type="text/javascript" src="https://battlecase.ru/wp-content/themes/sk-Evrikak/scroll-Pane/jquery.mousewheel.js"></script>
<script type="text/javascript" src="https://battlecase.ru/wp-content/themes/sk-Evrikak/scroll-Pane/jquery.jscrollpane.min.js"></script>
<script>
// Прокрутка оновлюється при зміні висоти вікна
jQuery(function() {
jQuery('#sidebar .content-menu ul.nav').each(
function() {
jQuery(this).jScrollPane({
showArrows: jQuery(this).is('.arrow')
});
var api = jQuery(this).data('jsp');
var throttleTimeout;
jQuery(window).bind("load resize", function() {
// IE fires multiple resize events while you are dragging the browser window which
// causes it to crash if you try to update the scrollpane on every one. So we need
// to throttle it to fire a maximum of once every 50 milliseconds...
if (!throttleTimeout) {
throttleTimeout = setTimeout(
function() {
api.reinitialise();
throttleTimeout = null;
},
50
);
}
});
}
)
});
</script>
<style>
/* Styles specific to this particular page */
.scroll-pane {
overflow: auto;
height: 400px;
}
.jspTrack {
background: #dedede;
}
.jspVerticalBar {
width: 6px;
}
.jspDrag {
background: #309dc6;
}
</style>
</aside>
</div>
</div>
<div class="other-posts">
<div class="container">
<h3 class="title text-uppercase text-center h">Другие статьи:</h3>
<div class="row articles">
<div class="post article-wrp with-border col-sm-6 col-md-4 col-lg-3">
<div class="article-in-loop">
<a class="thumb-title" href="/samyi-moshchnyi-telefon-v-mire-na-dannyi-moment-samye-moshchnye-smartfony-top-10/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i1.wp.com/technosova.ru/wp-content/uploads/2018/10/2-2.jpg" class="img-responsive" alt="Самые мощные смартфоны Топ 10 самых мощных телефонов" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
Самые мощные смартфоны Топ 10 самых мощных телефонов </span>
<span class="title">
Современные технологии позволяют уместить в обычном смартфоне мощность и производительность... </span>
</a>
</div>
</div>
<div class="post article-wrp with-border col-sm-6 col-md-4 col-lg-3">
<div class="article-in-loop">
<a class="thumb-title" href="/kak-udalitsya-iz-moego-mira-kak-udalit-stranicu-i-akkaunt-v-moem-mire/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i1.wp.com/socialnie-seti.info/wp-content/uploads/2012/09/galochki-dlya-ydaleniya-stranici.jpg" class="img-responsive" alt="Как удалить страницу и аккаунт в моем мире" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
Как удалить страницу и аккаунт в моем мире </span>
<span class="title">
Бывает так, что человек пройдя регистрацию понимает, что эта социальная сеть не для него и хочет... </span>
</a>
</div>
</div>
<div class="post article-wrp with-border col-sm-6 col-md-4 col-lg-3">
<div class="article-in-loop">
<a class="thumb-title" href="/ne-udalyaetsya-avast-chto-delat-kak-udalit-avast-s-kompyutera-esli-on-ne/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i2.wp.com/vellisa.ru/wp-content/uploads/2018/05/2-1.jpg" class="img-responsive" alt="Как удалить аваст с компьютера если он не удаляется" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
Как удалить аваст с компьютера если он не удаляется </span>
<span class="title">
Сейчас мы разберем, как удалить Аваст, чтобы после деинсталляции антивируса, на компьютере не... </span>
</a>
</div>
</div>
<div class="post article-wrp with-border col-sm-6 col-md-4 col-lg-3">
<div class="article-in-loop">
<a class="thumb-title" href="/kak-podklyuchit-nokia-lyumiya-800-k-kompyuteru-podklyuchenie-nokia-lumia-k/">
<span class="embed-responsive embed-responsive-16by9 vertical-align-block thumb">
<span class="embed-responsive-item">
<span class="super-wrp">
<span class="span-table">
<span class="span-table-row">
<span class="span-table-row-cell">
<img src="https://i2.wp.com/sms-mms-free.ru/sites/default/files/images/Specifications_Nokia_800_Zune.jpg" class="img-responsive" alt="Подключение Nokia Lumia к ПК" loading=lazy>
</span>
</span>
</span>
</span>
</span>
</span>
<span class="date">
Подключение Nokia Lumia к ПК </span>
<span class="title">
Статьи и Лайфхаки
впервые могло разочаровать всех, кто недавно приобрёл данное мобильное... </span>
</a>
</div>
</div>
</div>
</div>
</div>
<style>
/* Додаємо відступ внизу */
body.single #content .ad {
margin-bottom: 20px;
}
/* Додаємо відступ вгорі */
body.single #sidebar .ad {
margin-top: 20px;
}
</style>
<footer id="footer" class="clearfix">
<noindex>
<div class="container row-1 hidden-xs">
<nav class="nav">
<div class="menu menu-footer">
<ul id="menu-podval" class="menu">
<li class="menu-item type-custom object-custom home "><a href="/">Главная</a></li>
<li class="menu-item type-post_type object-page "><a href="">О проекте</a></li>
<li class="menu-item type-post_type object-page "><a href="">Рекламодателям</a></li>
<li class="menu-item type-post_type object-page "><a href="/sitemap.xml">Карта сайта</a></li>
<li class="menu-item type-post_type object-page "><a href="/feedback/">Обратная связь</a></li>
</ul>
</div>
</nav>
</div>
<div class="border-blue clearfix"></div>
<div class="container row-2">
<div class="row">
<div class="col-sm-6">
<div id="text-2" class="block widget-container widget_text">
<div class="textwidget">
<div class="sn">
<a href="https://www.facebook.com/sharer/sharer.php?u=https://battlecase.ru/ustanovka-wordpress-informacionnye-tehnologii-internet-veb-programmirovanie-it-hi-tech/" target="_blank"><img src="https://battlecase.ru/wp-content/themes/sk-Evrikak/i/sn/facebook.png" alt="" class="img-responsive" loading=lazy></a>
<a href="https://vk.com/share.php?url=https://battlecase.ru/ustanovka-wordpress-informacionnye-tehnologii-internet-veb-programmirovanie-it-hi-tech/" target="_blank"><img src="https://battlecase.ru/wp-content/themes/sk-Evrikak/i/sn/vkontakte.png" alt="" class="img-responsive" loading=lazy></a>
<a href="https://youtube.com/" target="_blank"><img src="https://battlecase.ru/wp-content/themes/sk-Evrikak/i/sn/youtube.png" alt="" class="img-responsive" loading=lazy></a>
</div>
<style>
.sn a {
display: inline-block;
margin: 0 10px 0 0;
width: 55px;
}
@media (max-width:767px) {
.sn {
text-align: center;
}
.sn a {
margin: 0 7px;
width: 43px;
}
}
.sn a:hover {
opacity: 0.9;
}
</style>
</div>
</div>
</div>
</div>
</div>
<div class="border-3 clearfix"></div>
<div class="container row-3">
<div class="row">
<div class="col-sm-8 col-txt col-txt-1">
Размещенные на сайте материалы, могут содержать информацию для пользователей старше 18 лет. </div>
<div class="col-sm-4 col-txt col-txt-2 text-right">
<div class="project-by-um">
© 2012 - 2018 <img src="https://battlecase.ru/wp-content/themes/sk-Evrikak/i/svg/logo-ukr-media.svg" width="90" class="img-responsive" loading=lazy>
</div>
</div>
</div>
</div>
</noindex>
</footer>
</div>
<div class="modal fade" id="modal-search" tabindex="-1" role="dialog" aria-labelledby="modal-searchLabel">
<div class="modal-dialog modal-lg itc-container" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Закрыть"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="modal-searchLabel">Поиск по сайту</h4>
</div>
<div class="modal-body">
<form role="search" method="get" class="form-search" id="modal-searchform" action="/">
<div class="form-group">
<input type="search" autocomplete="off" spellcheck="false" placeholder="Введите текст поиска" value="" name="s" id="modal-s" class="input-lg form-control">
</div>
</form>
<div class="modal-search-results"></div>
</div>
</div>
</div>
</div>
<link rel='stylesheet' id='dashicons-css' href='/wp-includes/css/dashicons.min.css?ver=4.9.1' type='text/css' media='all' />
<link rel='stylesheet' id='thickbox-css' href='/wp-includes/js/thickbox/thickbox.css?ver=4.9.1' type='text/css' media='all' />
<script type='text/javascript' src='https://battlecase.ru/wp-content/plugins/decomments/templates/decomments/assets/js/decom.min.js?ver=1513648647'></script>
<script type='text/javascript' src='https://battlecase.ru/wp-content/themes/sk-Evrikak/js/modernizr-2.8.3.min.js?ver=4.9.1'></script>
<script type='text/javascript' src='https://battlecase.ru/wp-content/plugins/visualizer/js/lib/clipboardjs/clipboard.min.js?ver=3.0.4'></script>
<script type='text/javascript' src='https://battlecase.ru/wp-content/plugins/mistape/assets/js/mistape-front.js?ver=1.3.3'></script>
<script type='text/javascript' src='https://battlecase.ru/wp-content/plugins/lazy-load/js/jquery.sonar.min.js?ver=0.6.1'></script>
<script type='text/javascript' src='https://battlecase.ru/wp-content/plugins/lazy-load/js/lazy-load.js?ver=0.6.1'></script>
<script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.9.1'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var thickboxL10n = {
"next": "\u0414\u0430\u043b\u0435\u0435 \u2192",
"prev": "\u2190 \u041d\u0430\u0437\u0430\u0434",
"image": "\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435",
"of": "\u0438\u0437",
"close": "\u0417\u0430\u043a\u0440\u044b\u0442\u044c",
"noiframes": "\u042d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0438 \u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0438\u0445 \u0444\u0440\u0435\u0439\u043c\u043e\u0432. \u0423 \u0432\u0430\u0441 \u043e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u044b \u0442\u0435\u0433\u0438 iframe, \u043b\u0438\u0431\u043e \u0432\u0430\u0448 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u0445 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442.",
"loadingAnimation": "http:\/\/battlecase.ru\/wp-includes\/js\/thickbox\/loadingAnimation.gif"
};
/* ]]> */
</script>
<script type='text/javascript' src='/wp-includes/js/thickbox/thickbox.js?ver=3.1-20121105'></script>
<div id="mmenu_res" style="display:none;width:100%;height:40px;line-height:40px;background:#FD6A93;color:#FFFFFF;position:fixed;text-align:center;font-size:23px;;z-index:100000000">
<a class="mmenu_open" href="#irevoltmenu">
<span class="mmenu-icon-bar"></span>
<span class="mmenu-icon-bar"></span>
<span class="mmenu-icon-bar"></span>
</a> Рубрики
</div>
<div class="modal fade" id="modalAd" tabindex="-1" role="dialog" aria-labelledby="modalAdLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<div class="ad text-center">
</div>
</div>
</div>
</div>
</div>
<link rel="stylesheet" href="/wp-content/themes/sk-Evrikak/ad/ad_popup-and-bottom/show-ads.css">
<script src="/assets/jquery1.cookie1.js"></script>
<script src="https://battlecase.ru/wp-content/themes/sk-Evrikak/ad/ad_popup-and-bottom/show-ads.js"></script>
</body>
</html> 