Учебник wordpress: Что такое Цикл WordPress — The Loop

Учебник по JavaScript для SEO для WordPress

Опубликовано: 2021-07-26

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

Большинству владельцев и менеджеров веб-сайтов WordPress не стоит беспокоиться о JavaScript SEO . Большинство плагинов и тем WordPress отлично работают с JavaScript и не вызовут особых проблем с SEO. Но если вы разрабатываете индивидуальные темы или плагины, вам следует убедиться, что вы следуете лучшим практикам и избегаете распространенных ошибок.

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

Оглавление

• Front-end vs back-end технологии
  • HTML, CSS и JavaScript
  • JavaScript в WordPress
    • Соображения производительности
    • Представляем Ajax
    • Ajax в WordPress
    • Админка
• Одностраничные приложения
  • SEO проблемы
  • Проблемы производительности
  • Проблемы с рендерингом
    • Предварительный рендеринг
    • Гидратация
    • Динамический рендеринг
    • Изоморфный / универсальный JavaScript
• Безголовый WordPress
  • Проблемы с безголовым SEO
  • Безголовый SEO в WordPress с Yoast SEO
  • Статические HTML-сайты
  • JAMstack
• В заключение
  • Как выглядит «лучшая практика»?
  • дальнейшее чтение

Front-end vs back-end технологии

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

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

HTML, CSS и JavaScript

Интерфейс представляет собой комбинацию HTML, CSS и JavaScript. HTML создает структуру и содержание (слова и изображения). CSS управляет представлением (цвета, макеты и стили). JavaScript добавляет поведение (интерактивность, движение и отзывчивость).

Когда ваш браузер запрашивает URL-адрес, серверная часть определяет, чем должен ответить сервер. Обычно это пакет (или серия пакетов) файлов HTML, CSS и JavaScript. Ваш браузер загружает и читает эти файлы и использует их для создания интерфейса .

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

Если вы хотите узнать больше о разнице между серверной и интерфейсной разработкой, мы рекомендуем это руководство Криса Кастильоне за месяц.

Фото Грега Ракози на Unsplash

JavaScript в WordPress

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

В WordPress рекомендуется разбивать JavaScript на отдельные файлы и помещать их в очередь с помощью функции wp_enqueue_script () WordPress. Это позволяет плагинам и темам обмениваться ресурсами, объявлять зависимости и управлять версиями (или даже выводить из очереди другие ресурсы).

Когда дело доходит до общих ресурсов, обычно интерфейс тем и плагинов WordPress создается с использованием jQuery; «библиотека» JavaScript, которая действует как среда разработки (и которая включена по умолчанию вместе со многими надстройками и расширениями). Однако jQuery — не единственный вариант, и более современные (или сделанные на заказ) темы могут использовать библиотеки, такие как React. Мы обсудим React и более современные JavaScript-фреймворки позже в этой статье.

Вы можете узнать больше о включении JavaScript в темы и плагины WordPress из этого руководства на wordpress.org.

Фото Лави Перчика на Unsplash

Соображения производительности

С точки зрения SEO важно учитывать производительность при использовании JavaScript.

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

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

Многие популярные плагины кэширования должны справиться с большей частью этого за вас, но всегда полезно проверять показатели Core Web Vitals вашего сайта с помощью отчетов Google PageSpeed ​​Insights.

Вы можете узнать больше о передовых методах оптимизации JavaScript в этой статье KeyCDN Коди Арсо.

Платформа Google web.dev помогает найти узкие места в производительности и предоставляет всю документацию, необходимую для их устранения.

Представляем Ajax

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

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

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

Такая функциональность поддерживает многие интерактивные инструменты и процессы, с которыми мы все знакомы по мере развития Интернета; например, редактирование контента, изучение карт, отправка форм и использование живого чата.

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

Если вы хотите узнать больше об Ajax, мы рекомендуем начать с этого руководства по W3Schools.

Схема того, как работает Ajax, Даниэль Хейшт, через Wikimedia Commons

Ajax в WordPress

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

1. Запрос конечной точки WP REST API
2. Запрос /wp-admin/admin-ajax.php (с действием )

Если вы узнали имя файла admin-ajax.php , возможно, вы видели его в вашем файле robots.txt .

Файл robots.txt WordPress по умолчанию содержит инструкцию, позволяющую явно разрешить сканирование этого URL-адреса, даже если его родительская папка (

/admin-ajax/ ) заблокирована.

User-agent: *
Disallow: /wp-admin/
Allow: /wp-admin/admin-ajax.php

Это связано с тем, что многие темы и плагины настолько сильно полагались на (отправку и) получение данных и контента с этой конечной точки, что большая их часть не могла быть обнаружена. admin-ajax.php по ссылкам на admin-ajax.php точки admin-ajax.php (например, admin-ajax.php?action=get-some-critical-content ), поисковые системы могут сканировать и индексировать «невидимый» контент.

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

В этой статье не будет углубляться в сравнение технических различий между этими подходами, кроме как подчеркнуть, что WP REST API намного превосходит (устаревший) подход admin-ajax. php . С ним легче разрабатывать, он обеспечивает лучшую основу для управления разрешениями и значительно быстрее реагирует на запросы.

Если вы хотите узнать больше о различиях между подходами, вы можете узнать больше об использовании WordPress REST API или сравнить производительность WordPress REST API с admin-ajax.php.

Админка

В 2015 году Мэтт Малленвег (создатель WordPress) умолял сообщество разработчиков «глубоко изучить JavaScript». Это потому, что инструменты и области администрирования WordPress постепенно обновляются; переход от чистого PHP к использованию интерфейсов редактирования на базе JavaScript.

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

Одностраничные приложения

За последние несколько лет появился новый тип веб-сайтов. Поскольку пользователи ожидают, что веб-сайты будут вести себя все больше и больше как приложения, одностраничные приложения (или «SPA») становятся все более распространенными.

SPA — это «приложения», работающие на JavaScript и работающие внутри браузера. Когда вы запрашиваете URL-адрес, вместо того, чтобы сервер возвращал HTML, CSS и JavaScript для страницы, сервер возвращает код приложения. После загрузки приложение берет на себя всю логику загрузки, представления и взаимодействия с контентом.

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

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

Веб-сайты, которые имеют множество движущихся, изменяющихся частей, которые обновляются по мере взаимодействия с ними, хорошо подходят для создания как SPA. Фактически, многие веб-сайты, похожие на приложения, которые вы используете в повседневной жизни, например Gmail , Facebook , Twitter и даже PayPal, используют SPA в своих основных веб-сервисах. Вы заметите, что когда вы просматриваете их представления и взаимодействуете с их инструментами, страница не «перезагружается».

Разработчики создают большинство SPA с помощью фреймворков JavaScript с открытым исходным кодом, таких как Angular, React и Vue.

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

React — один из самых популярных фреймворков JavaScript для написания одностраничных приложений.

SEO проблемы

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

Даже сегодня немногие поисковые системы и социальные сети полностью или эффективно поддерживают JavaScript. Это означает, что, если вы не сделаете все возможное, чтобы раскрыть свой контент, все в вашем SPA может быть «невидимым» для кого-либо, кроме пользователей-людей.

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

Концептуальные проблемы

Одна из ключевых концепций SEO и того, как работает Google, заключается в том, что веб-страница должна быть о чем-то . Данная страница должна иметь четкую тему и четкую направленность. Эта страница находится на URL-адресе, который однозначно идентифицирует ее и не должен изменяться или удаляться.

Так работают большинство обычных веб-сайтов и, конечно же, большинство веб-сайтов на WordPress. Вы пишете страницы по темам .

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

Даже если поисковые системы могут успешно анализировать и «исследовать» приложение JavaScript, им может быть сложно связать темы и релевантность с определенной страницей или URL-адресом. Эти концепции не совсем соответствуют природе платформы.

Проблемы производительности

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

Даже если приложение разделено на более мелкие части, и для запрошенной страницы загружается только необходимый «маршрут», загрузка его может занять гораздо больше времени, чем у обычного «статического» веб-сайта (хотя умные методы, такие как использование WPGraphQL, могут сделать передачу данные из бэкэнда в интерфейс намного проще и быстрее; и даже больше, когда вы интегрируете их с Yoast SEO через этот плагин).

Мало того, что начальная полезная нагрузка может быть медленной, но также может случиться так, что чем больше страница ведет себя как приложение (а не как веб-сайт), тем медленнее она может стать. Это потому, что веб-браузеры, такие как Chrome, принимают разумные решения по таким вопросам, как приоритезация ресурсов, отложенная загрузка и обработка. Если HTML-код является узким местом или запутан, как это часто бывает со сложными приложениями JavaScript, эти процессы могут быть затруднены или потерпеть неудачу.

Проблемы с рендерингом

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

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

Предварительный рендеринг

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

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

Но использование только предварительного рендеринга не решает нашей проблемы. Фактически, это возвращает нас к тому, с чего мы начали. У нас есть сервер, который вместо того, чтобы отвечать браузеру с помощью приложения JavaScript , он отвечает доставкой предварительно обработанных файлов HTML, CSS и JavaScript. Многие из преимуществ, которые мы получали от ответа с приложением, — плавный, динамический контент и возможности — исчезли. Нам нужна золотая середина.

Гидратация

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

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

Динамический рендеринг

Чтобы решить эти проблемы, Google делает особую поправку на концепцию, которую они называют «динамический рендеринг». В этом подходе веб-сайт использует предварительный рендеринг , но предоставляет только предварительно обработанные ответы Google (и другим поисковым системам / ботам и т. Д.). Обычные пользователи получают все возможности приложения JavaScript. Поисковые системы и сканеры получают предварительно обработанную статическую HTML-версию сайта, которую им легче понять.

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

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

Изоморфный / универсальный JavaScript

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

Мы можем достичь всех этих целей, используя «изоморфный» или «универсальный» JavaScript (обычно называемый «рендерингом на стороне сервера»). При таком подходе и серверная часть, и интерфейсная часть могут запускать один и тот же код JavaScript. Это означает, что серверная часть может ответить обработанным HTML-кодом и затем обработать его, но без необходимости определять дополнительный код и управлять им, чтобы определить, как это должно работать.

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

Безголовый WordPress

Удивительно, но сегодня относительно немного веб-сайтов WordPress развернуты как одностраничные приложения. Мы можем предположить, что это может быть связано с сочетанием факторов, в том числе с разными навыками разработчиков (WordPress сильно смещен в сторону PHP и MySQL) и отсутствием широкой поддержки тем / плагинов.

Однако это не означает, что это невозможно. Фактически, REST API WordPress (и / или решения, такие как WP GraphQL) могут использоваться для предоставления данных и внутреннего подключения для SPA. Эта статья на Medium от Бриджеша Дханани показывает, насколько легко создать простой SPA, используя WordPress в качестве серверной части и React для интерфейса.

Мы называем такой подход «безголовым». Сайты без заголовков удаляют все части (переднюю часть) CMS — в нашем случае WordPress, — которые обычный пользователь мог бы видеть и с которыми взаимодействовал бы. Интерфейс полностью поддерживается приложением JavaScript, а контент (и данные) извлекаются «по запросу» из серверной части. Большинство SPA используют автономные системы управления контентом и могут даже использовать несколько серверов и систем, используя JavaScript для взаимодействия с API.

Если вы хотите узнать больше о сайтах WordPress без заголовков, мы рекомендуем заглянуть в Frontity; ведущий фреймворк с отличной документацией.

Проблемы с безголовым SEO

Одним из недостатков сайтов без заголовков является то, что клиентской части сложно понять, как должны работать «SEO-материалы» на странице. Даже на простейших сайтах часто требуется сложная логика, чтобы определить, как страница должна вести себя с точки зрения SEO. Элементы управления сканированием, директивы индексирования, метатеги и структурированные данные должны взаимодействовать правильно, без ошибок.

Для простых сообщений и страниц эта логика не слишком сложна. Но когда вам нужно начать рассматривать архивы сообщений, разбиение на страницы, элементы управления индексированием и другие крайние случаи, это становится намного сложнее. Когда нет «серверной части», SPA должен определять все эти правила и управлять ими с нуля. Даже логика для «простых» компонентов, таких как канонические теги URL, оказывается на удивление сложной, если их определить и построить с нуля. Многие сайты без заголовков и SPA не справляются с этой сложностью и не соответствуют базовым стандартам SEO.

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

Безголовый SEO в WordPress с Yoast SEO

В Yoast мы убеждены, что веб-сайты на JavaScript будут становиться все более популярными, мощными и предпочтительными для пользователей. Но нынешние стандарты и инструменты подвели эти сайты.

Вот почему в Yoast SEO 14.0 (в апреле 2020 года) мы добавили безголовый SEO API. С тех пор сайты WordPress без заголовков, на которых работает наш плагин, автоматически получают весь соответствующий контент <head> для любого типа запроса / страницы, добавленный к своим стандартным запросам WordPress API. Разработчики, которым нужна даже настройка, могут запросить вывод <head> для любого URL-адреса, используя наш специальный синтаксис REST API. Например, этот URL-адрес возвращает все метатеги, которые мы выводим для нашей страницы плагина Yoast SEO.

Вы можете узнать больше о Yoast REST API в нашей документации для разработчиков.

Статические HTML-сайты

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

Это привело к тенденции к разработке статических веб-сайтов.

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

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

Вы можете узнать больше о статических сайтах WordPress у наших друзей в Strattic.

Gatsby помогает создавать быстрые веб-сайты и приложения

JAMstack

Мы знаем этот подход к разработке веб-приложений и приложений как «JAMstack». Это означает JavaScript, API и разметку — технологии, которые эти сайты используют для создания страниц и интерфейсов.

Это совершенно иной технический и концептуальный подход к тому, как может работать обычный веб-сайт WordPress; который часто находится в LAMPstack (Linux, Apache, MySQL и PHP), хотя веб-сайт JAMstack может полагаться на REST API сайта WordPress для контента и внутренних запросов, которые могут использовать LAMPstack.

Вы можете узнать больше о принципах JAMstack здесь.

В заключение

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

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

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

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

Как выглядит «лучшая практика»?

На данный момент лучшая практика для JavaScript SEO в WordPress — делать сайты, которые выглядят, работают и ведут себя как можно больше как «традиционные» сайты.

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

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

Из множества доступных инструментов, библиотек и фреймворков мы рекомендуем использовать более зрелую и полнофункциональную поддержку для SEO и управления рендерингом. На практике, в зависимости от вашей технической среды, это обычно означает React (или его легковесный брат Preact), Next, Nuxt (который использует Vue.js) или Angular (используя Angular Universal).

дальнейшее чтение

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

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

• Руководство Google по основам JavaScript для SEO
• Томек Rudzki «s„Окончательный Справочник по JavaScript SEO“, на Onely блоге
• Руководство Патрика Стокса «JavaScript SEO: что вам нужно знать» в блоге Ahrefs
• Руководство Алексиса Сандерса «Сделайте ваш бот так же хорошо, как и ваш пользовательский» »в блоге Moz

Дайте нам знать, если у вас возникнут вопросы или мы что-то упустили!

Подробнее: пройдите нашу викторину, чтобы оценить техническое SEO вашего сайта »

SEO начинающим | Рубрики | www.wordpress-abc.ru

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

Читать дальше …

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

Читать дальше …

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

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

Читать дальше …

В этой статье познакомимся с историей развития поисковых алгоритмов Яндекс. Магадан, Находка, Арзамас, Снежинск, Конаково, Краснодар…. Более подробно посмотрим на три последних поисковых алгоритма Яндекс: Палех, Баден-Баден, Королёв.

Читать дальше …

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

Читать дальше …

Справедливости ради нужно отметить, что поисковики не только «прессуют» веб-мастеров выпуская всё более жесткие и более санкционные алгоритмы, но и пытаются помогать веб-мастерам и оптимизаторам, постоянно проводя мониторинг и учет, поисковых запросов. Статистика количества поисковых запросов находится в свободном доступе и доступна любому пользователю в режиме фильтров на специальных бесплатных сервисах. Учитывая эту статистику, в SEO введены академические понятия высокочастотных и низкочастотных запросов, о которых и пойдет речь в этой статье.

Читать дальше …

Смена адреса сайта, с точки зрения SEO, это катастрофа и не существует вопроса, просядет сайт в выдаче или нет при смене адреса (домена) сайта. Просядет однозначно. Задача в том, чтобы минимизировать эти потери и, как можно быстрее восстановить поисковую выдачу страниц на новом домене. Для минимизации SEO потерь есть определенные технологии переезда сайта на новый домен, с использованием специальных инструментов веб-мастеров Яндекс и Google. Однако, несмотря на любые «правильные переносы» сайта, самый утешительный прогноз по восстановлению поисковой выдачи и посещаемости сайта это около 180 дней.

Читать дальше …

В теории и практике раскрутки сайта есть понятие пресс-релиз. Это новостная заметка, непосредственно связанная с сайтом, как по тематике, так и ссылками.

Читать дальше …

Чтобы страницы сайта попали в поисковую выдачу, новый сайт должен быть замечен поисковыми роботами и пройти первичную индексацию. Первичная индексация сайта предполагает, что webcrawler, как минимум, занесет главную страницу сайта в свою базу данных.  После этого поисковые боты будут периодически обходить ваш сайт, и заносить полезные страницы сайта, согласно своим алгоритмам, в поисковую выдачу.
Читать дальше …

Как ускорить и оптимизировать сайты WordPress

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

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

Не уверен в WordPress? Исследуйте другие варианты с нашим списком Top

веб хостинг провайдеры. И если вы хотите легко спроектировать сайт, попробуйте эти блестящие Строители сайта Отказ

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

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

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

01. Проверьте текущую скорость

Первый шаг в ускорении веб-сайта — выяснить, насколько хорошо он выполняет начать. Существует множество инструментов, чтобы помочь с этим, включая Insights Google PageSpeed ​​Insights и проверку загрузки страницы Pinggys. Мы будем использовать Gtmetrix. Как он сочетает в себе несколько проверок; Перейдите на сайт и введите URL для веб-сайта.

02. Осмотрите результаты

GTMetrix дает вам быстрый анализ производительности вашего сайта (Кредит на изображение: gtmetrix)

После короткой задержки GTMetrix отобразит результаты проверки и дают несколько баллов от A — F. Это также даст полностью загруженное время и общий размер страницы. Ниже приведено поломка нескольких элементов.

03. Определите самые большие файлы

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

04. Компрессная среда для уменьшения размера

Большая оптовая оптимизация ваших СМИ, чтобы получить скорость повышения (Кредит на изображение: ewww)

Изображения и видео обычно являются крупнейшими предметами на странице. Устраните ненужные фоновые видео и убедитесь, что необходимо кодировать видео с низкой скоростью передачи бити, если он воспроизводится автоматически. Установите плагин Ewww Image Оптимизатор Отказ Из медиа-библиотеки доступна новая опция Optimize Bulk. Запустите это.

Если у вас есть много средств массовой информации, чтобы хранить его безопасно в этих превосходных облачное хранилище опции.

05. Размеры изображений

Усаживает эти массивные изображения, которые получают масштабирование в браузере (Кредит на изображение: WordPress)

Иногда изображения, добавленные на страницу, находятся в высоком разрешении, а затем уменьшаются с CSS. Эта пропускная способность тратить пропускную способность, так как больший размер никогда не используется. Перейти к приборной панели и GT; Настройки и GT; Ewww Image Optimizer и выберите Изменение размера. Отметьте галочку «Изменить размер обнаружения». Теперь страницы, просматриваемые администратором, выделите изображения, которые необходимо изменять. Изменение размера этих изображений в редакторе изображений или с использованием CDN с автоматическим размером исправит эту проблему.

06. Минификация CSS, JS & AMP; HTML

Это процесс удаления символов в коде, который делает его читаемым человеком для уменьшения размера страницы. При использовании третьей стороны тема, плагин, такой как Автоматизировать идеально подходит для этого. Установите его, перейдите к настройкам и GT; Autoptimize & gt; Прокрутите вниз до параметров CSS и отметьте «Оптимизировать код CSS». При работе с темой, которая была настроенными, зачисление на заказ, выполняется с помощью инструментов сборки, такими как глоток.

 CSS:
{
    -webkit-box-Shadow: нет;
    Текстовое украшение: нет;
}

Министерство:
A {-webkit-box-Shadow: Нет; текстовое украшение: нет;} 

07. Объедините CSS & AMP; JS файлы

При использовании темы сторонний плагин Autoptimise может охватывать большинство сценариев, позволяя опцию «Aggregate CSS-файлы». Это объединяет все CSS для каждой страницы в один файл вместо многих меньших.

08. Отложите внешний JavaScript

Инструменты Live Chat, Analytics и отслеживания могут объединить большие файлы JavaScript, которые добавляют все секунды до времени, когда страница принимает, чтобы стать интерактивными. Добавьте атрибут отсрочка на эти скрипты, чтобы они не были выполнены, пока DOM не закончит загрузку.

<код> & lt; script src = «path-to-file.js» Defer & GT;

Как использовать новый редактор блоков WordPress (учебник Гутенберга)

В WordPress 5.0 классический редактор контента был заменен новым редактором блоков под названием Gutenberg.

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

В чем разница между редактором блоков (Гутенберг) и классическим редактором?

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

Вот так выглядит классический редактор в WordPress:

Если вы обновитесь до WordPress 5.0 , новый редактор блоков будет выглядеть так:

Как видите, это два совершенно разных редактора для создания контента в WordPress.

Старый классический редактор — это текстовый редактор, и его кнопки форматирования очень похожи на Microsoft Word.

В новом редакторе используется совершенно другой подход, называемый «блоками» (отсюда и редактор блоков).

Блоки — это элементы содержимого, которые вы добавляете на экран редактирования для создания макета содержимого. Каждый элемент, который вы добавляете в сообщение или страницу, представляет собой блок.

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

Новый редактор блоков WordPress лучше традиционного?

Новый редактор блоков WordPress предоставляет простой способ добавлять различные типы контента в ваши сообщения и страницы.

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

В новом редакторе вы можете просто добавить блок таблицы, выбрать столбцы и строки и начать добавлять содержимое.

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

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

Это дает огромное преимущество всем новичкам WordPress, которые только начинают свой первый блог или создают бизнес-сайт своими руками.

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

Используйте Gutenberg — новый редактор блоков WordPress

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

Давайте начнем с знакомства с основными операциями, которые вы выполняете в классическом редакторе, и с тем, как они выполняются в редакторе блоков.

Используйте редактор блоков, чтобы создать новую запись или страницу в блоге

Вы начнете создавать новые сообщения или страницы в блоге как обычно. Просто нажмите « Статья» » Меню« Написать статью » в админке WordPress . Если вы хотите создать страницу, перейдите в Страница »Добавить новое меню.

Это запустит новый редактор блоков.

Как добавить блоки в Гутенберге

Первый блок каждого сообщения или страницы — это заголовок.

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

По умолчанию следующий блок — это блок абзаца. Это позволяет пользователям сразу же начать писать.

Однако, если вы хотите добавить другой контент, вы можете нажать кнопку «Добавить новый блок» в верхнем левом углу редактора, под существующим блоком или слева от блока.

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

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

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

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

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

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

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

Вы можете перемещать блоки вверх и вниз, просто перетаскивая их или нажимая кнопки вверх и вниз рядом с каждым блоком.

Сохранение и повторное использование блоков в Гутенберге

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

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

Вам будет предложено указать имя этого многоразового блока. Введите название блока и нажмите кнопку «Сохранить».

Теперь редактор блоков сохранит блок как повторно используемый.

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

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

Вы найдете сохраненные блоки на вкладке «Многоразовые». Вы также можете найти его, набрав его название в строке поиска.

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

Все повторно используемые блоки хранятся в базе данных WordPress, и вы можете управлять ими, щелкнув ссылку «Управление всеми повторно используемыми блоками».

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

Публикация и управление параметрами в редакторе блоков Гутенберга

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

Все эти параметры аккуратно размещены в правом столбце экрана редактора.

Параметры плагина Гутенберга

Плагин WordPress может использовать API редактора блоков для интеграции собственных настроек в экран редактирования блока.

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

Вот как Yoast SEO позволяет редактировать настройки SEO в новом редакторе :

WooCommerce также поставляется с блоками виджетов, которые вы можете легко добавить в любые записи и страницы WordPress.

Добавьте несколько общих блоков в новый редактор

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

1. Добавьте изображения в новом редакторе WordPress.

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

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

После добавления изображения вы сможете увидеть настройки блока, в которых вы можете добавить метаданные изображения (такие как замещающий текст, размер и добавление ссылки на изображение).

2. Добавьте ссылку в новый редактор блоков.

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

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

Вы также можете вставить ссылку с помощью сочетаний клавиш, Command + K на Mac и CTRL + K в Windows.

3. Добавьте библиотеку изображений в Gutenberg.

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

4. Используйте Gutenberg для добавления шорткодов в сообщения WordPress.

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

Изучите некоторые из новых блоков контента Гутенберга

Редактор Gutenberg обещает решить некоторые давние проблемы юзабилити WordPress, представив несколько новых модулей.

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

1. Добавьте изображения рядом с текстом в WordPress.

В старом редакторе многие наши пользователи не могут размещать изображения рядом с текстом. Теперь вы можете использовать для этого блок « Медиа и текст» .

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

2. Добавьте кнопки в записи и страницы WordPress.

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

В Gutenberg есть блоки кнопок, которые позволяют быстро добавлять кнопки к любому сообщению или странице.

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

3. Добавьте красивые изображения обложек в сообщения блога и на целевые страницы.

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

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

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

4. Создайте таблицу внутри сетки статей.

В классическом редакторе нет кнопок для добавления таблиц в сообщения WordPress. Вы должны использовать плагин или создать таблицу с пользовательскими CSS и HTML.

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

Теперь вы можете продолжать добавлять данные в строки таблицы. При необходимости вы можете добавить больше строк и столбцов. Также доступны два основных стиля.

5. Создайте несколько столбцов содержания.

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

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

Дополнительные советы по использованию Гутенберга в качестве эксперта

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

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

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

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

1. Переместите панель инструментов блока вверх.

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

Просто нажмите кнопку с тремя точками в правом верхнем углу экрана и выберите опцию «Верхняя панель инструментов».

2. Используйте быстрые клавиши.

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

Просто введите / и начните вводить, и он покажет соответствующие блоки, которые вы можете сразу добавить.

Чтобы получить больше сочетаний клавиш, щелкните меню с тремя точками в правом верхнем углу экрана и выберите «Сочетания клавиш».

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

3. Перетащите медиафайлы, чтобы автоматически создавать медиаблоки.

Gutenberg позволяет перетаскивать файлы в любое место на экране и автоматически создает для вас блок.

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

4. Добавьте YouTube, Twitter, Facebook, Vimeo и другие встраиваемые файлы.

Гутенберг представил новый встроенный блок в редактор блоков. Все поддерживаемые типы встраивания (включая YouTube, Twitter, Facebook и т. Д.) Имеют блокировку.

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

Например, если вы добавите URL-адрес видео YouTube, он автоматически создаст блок для встраивания YouTube и отобразит видео.

Добавьте больше блоков в редактор блоков Гутенберга в WordPress

Новый редактор блоков в WordPress позволяет разработчикам создавать свои собственные блоки. Есть несколько отличных плагинов WordPress, которые предоставляют пакеты блоков для нового редактора.

Вот несколько:

1. продвинутый Гутенберг Продвинутый Гутенберг

Advanced Gutenberg поставляется с несколькими блоками для популярных элементов контента, таких как слайдеры продуктов WooCommerce , отзывы, карты, теги, аккордеоны и т. Д.

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

2. штабелируемый блок Гутенберга

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

Блок редактора 3.Editor Blocks

Editor Blocks — еще одна оригинальная коллекция блоков Гутенберга, которые вы можете использовать. Он поставляется с полезными блоками, такими как информация об авторе, изображение героя, прайс-лист, бренд, функции и т. Д.

Часто задаваемые вопросы о Gutenberg — новом редакторе блоков в WordPress

С тех пор, как Гутенберг стал новым редактором WordPress, мы задаем много вопросов. Вот ответы на некоторые из наиболее часто задаваемых вопросов о Гутенберге.

1. Что будет с моими предыдущими сообщениями и страницами? Могу ли я редактировать?

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

Вы можете редактировать их в старом редакторе или конвертировать старые статьи в блоки и использовать новый редактор блоков.

2. Могу ли я продолжать использовать старый редактор?

Да, вы все еще можете продолжать использовать старый редактор. Просто установите и активируйте плагин Classic Editor .

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

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

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

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

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

4. Как узнать больше советов и приемов Гутенберга?

WP webmaster — лучшее место для изучения нового редактора блоков в WordPress. Мы — влиятельный веб-сайт WordPress в китайском Интернете.

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

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

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

Почему и как создать блок Гутенберга

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

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

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

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

Что такое блоки Гутенберга?

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

Примеры блока Гутенберга

Основное изменение, которое Гутенберг ввел в создание контента в WordPress является то, что, вместо того, чтобы один большой кусок контента (как это было с классическим редактором), веб-страницы в настоящее время сегментированы на более мелкие части, называемые блоками.

Это может быть много разных вещей:

• Пунктах
• Заголовки
• Блок-цитаты
• Изображения и галереи
• Списках
• Встроенные носители
• Кнопки
• Таблицы

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

Почему изменения?

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

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

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

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

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

Итак, зачем создавать свой собственный блок Гутенберга?

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

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

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

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

Это легко?

С технической точки зрения важно отметить, что большинство компонентов блоков Гутенберга написаны в JavaScript. Это идет рука об руку с Мэттом Mullenweg 2015 советы, чтобы узнать язык программирования – глубоко (если вы хотите сделать это, проверьте эти полезные ресурсы).

Сдвиг в сторону JavaScript был очевиден в последние годы, например, в Калипсо. Язык программирования поставляется с тонной преимуществ и JavaScript питаниевеб-приложений, построенных на AIS (как Гутенберг) являются будущим в Интернете.

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

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

Как создать блоки для WordPress Гутенберг редактор

Хорошо, теперь, когда у нас есть теория в сторону, давайте поговорим о том, как создать блок Гутенберга.

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

Для того, чтобы не начать полностью с нуля, мы будем использовать создать guten блок Dev инструментарий Ахмад Аваис. Все, что вы собираетесь прочитать, основано на нем. Кроме того, будет ссылка на официальную документацию Гутенберга, где я считаю это разумным или необходимым.

1. Подготовьте окружающую среду

Одной из первых задач создания блока Gutenberg является настройка среды разработки. Хотя это легко настроить локальную установку WordPress, для того, чтобы возиться с новым редактором вам нужны вещи, как webpack, React, ESLint, Babel, и многое другое.

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

Тем не менее, для того, чтобы использовать его, сначала необходимо установить node.js и npm. Для этого перейдите на официальный сайт node.js и загрузите правильный файл установки для вашей системы.

Как только это будет сделано, выполните и запустите установку. Готов? Отлично, ты только что выполнил первый шаг.

2. Настройка файлов Plugin с

созданием guten блок

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

Первое, что вам нужно сделать, это открыть консоль. В Windows нажмите кнопку Windows, ищите запрос командыи откройте ее. Если вы находитесь на Mac, используйте Cmd’F, а затем ищите консоль. Оба должны открыть что-то вроде этого:

Здесь, первое, что вы хотите сделать, это перейти к плагин каталог вашего местного сайта. Вы можете сделать это с командой CD. Ввод CD «имя каталога» открывает каталог, cd.. восходит к одному каталогу.

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

Оказавшись там, вы хотите запустить следующую команду:

npx создать-guten-блокировать мой блок

npx создавать – Гутен – блок мой мой – блок

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

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

Это займет некоторое время, но когда он будет закончен, вы в конечном итоге с этим:

После того, как сделать с этим, следуйте советам создать guten блок и введите плагин папку (помните, CD “имя каталога”)) и введите npm start .

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

3. Активировать плагин и тест-драйв

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

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

Вы даже можете ввести его на страницу, чтобы найти это на экране:

Неплохо, правда?

4. Отодвить

plugin.php

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

Важные файлы для любых изменений находятся plugin.php внутри плагина каталога, а также три файла внутри src/block blocks.js называется, и editor.scss style.scss .

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

Проще всего изменить plugin.php . Здесь вы найдете плагин заголовок, который содержит всю информацию, увиденную в меню плагина в задней части.

/**
– Плагин Имя: cta-блок – CGB Гутенберг Блок Плагин
– Плагин URI: https://github.com/ahmadawais/create-guten-block/
Описание/ контроль: cta-блок – это плагин Гутенберга, созданный с помощью создания-guten-блок.
Автор: mrahmadawais, maedahbatool
Автор URI: https://AhmadAwais.com/
Версия: 1.0.0
Лицензия: GPL2
Лицензия URI: https://www.gnu.org/licenses/gpl-2.0.txt
*
– @package КГБ
*/

1 2 3 4 5 6 7 8 9 10 11 12

/** – Плагин Имя: cta-блок – CGB Гутенберг Блок Плагин – Плагин URI: https://github.com/ahmadawais/create-guten-block/ Описание/ контроль: cta-блок – это плагин Гутенберга, созданный с помощью создания-guten-блок. Автор: mrahmadawais, maedahbatool Автор URI: https://AhmadAwais.com/ Версия: 1.0.0 Лицензия: GPL2 Лицензия URI: https://www.gnu.org/licenses/gpl-2.0.txt * – @package КГБ */

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

После того, как сделано и сохранены, вы также видите изменения в WordPress.

5. Зарегистрируйте свой блок Гутенберга

После этого вы хотите сделать то же самое для того, как ваш блок отображается в редакторе Гутенберга. Для этого, обратиться к block.js . Он содержит весь код для регистрации блока на сайте WordPress и за то, что он делает на переднем и заднем конце.

Файл по умолчанию для создания guten block очень хорошо аннотирован. Он говорит вам, какая часть несет ответственность за то, что так что вы можете сделать свои собственные изменения. registerBlockTypeявляется то, что регистрирует блок. Функции, следующие edit: и save: описывают содержание и поведение блока внутри Гутенберга и на странице соответственно. Более подробная информация здесь и здесь.

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

Однако для того, чтобы работать с тем, что мы создали до сих пор, мы должны изменить эту часть:

blocks.registerBlockType (‘gutenberg-examples/example-03-editable’,
название: ‘Пример: Editable’,
значок: ‘универсальный доступ-alt’,
категория: «макет»,

блоки . регистрАйТБлокТип (‘gutenberg-примеры/пример-03-editable’,         титул : ‘Пример: Editable’,         значок : ‘универсальный доступ-альт’,         категория : ‘макет’,

В частности, вы хотите изменить:

• Путь регистрации – Это относится к пути, который появляется после blocks.registerBlockType . Он должен соответствовать вашей текущей среде.
• title:– Название блока, как он появится в Гутенберге.
• icon:— значок, связанный с блоком в редакторе. Вы можете использовать дашики. Обязательно вставьте имя без dashicons- префикса. Кроме того, используйте свой собственный файл SVG.
• category:– Под какой категорией появится ваш блок. Некоторые из стандартных категорий: common , formatting , и layout widgets embed .

В моем случае, я просто изменил его на это:

blocks.registerBlockType (‘cgb/block-cta-block’,
название: ‘CTA Block’,
значок: “свидетельство”,
категория: «общие»,

блоки . регистрАйТБлокТип ( ‘cgb/block-cta-block’,         титул : ‘CTA Block’,         значок : ‘свидетельство’,         категория : ‘общие’,

После этого он появляется в редакторе так:

И вот как это выглядит на странице:

Я оставила остальную часть кода, как я его нашел.

6. Отрегулируйте укладку блока

После этого пришло время настроить отображение нового блока. Это происходит внутри editor.scss и style.scss .

Как показывают имена файлов, первый контролирует то, как выглядит ваш блок внутри редактора Гутенберга, второй вывод на переднем конце.

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

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

В моем случае я добавляю следующее в оба файла:

.wp-блок-кгб-блок-кта-блок
фон: #d6f279;
граница: 0.2rem пунктирные #292929;
маржа: 0 авто;
обивка: 1rem;
текстовая выравнивание: центр;
}

. wp – блок – cgb – блок – cta – блок {     фон : #d6f279;     граница : 0.2rem пунктирные #292929;     маржа : 0 авто;     обивка : 1rem;     текст – выровнять : центр; }

И вот результат в редакторе:

И на переднем конце:

Кстати, Гутенберг автоматически присваивает классы CSS блокам в зависимости от их имени, и вы можете узнать, что они с вашими инструментами браузера. Тем не менее, листы стилей из блока guten уже будут содержать имена правильных классов. Кроме того, вы можете определить свой собственный.

7. Закончить

Хорошо, как только вы удовлетворены своим блоком, Есть еще несколько шагов. Первое, что вы хотите сделать, это вернуться к консоли и нажмите Ctrl / Cmd’C, чтобы остановить npm от мониторинга файлов.

После этого запустите следующую команду:

npm запустить построить

npm запустить построить

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

Если вы считаете, что не хотите использовать этот блок в блоке guten, вы также можете ввести npm run eject в . Однако это означает, что отныне вам придется поддерживать проект самостоятельно.

Готовы ли вы создать блок Гутенберга?

Блоки Гутенберга станут новым элементом по умолчанию в WordPress. Они помогают создавать сообщения, страницы, макеты и проекты в модульной форме и предлагают много контроля.

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

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

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

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

Вы уже создавали блок Гутенберга? Каков был ваш опыт? Любые дополнительные советы или комментарии? Препятствуйте нам знать в разделе комментария ниже!

Дни недели на французском. | Французский язык изучение

lundi – понедельник

mardi – вторник

mercredi – среда

jeudi – четверг

vendredi – пятница

samedi – суббота

dimanche – воскресенье

samedi – в субботу (! без предлога)

le samedi – по субботам

Песни, стихи с днями недели

Lundi matin, l’empereur, sa femme et le petit prince

LUNDI matin,
L’Emp’reur, sa fem’ et le p’tit Prince,
Sont venus chez moi
Pour me serrer la pince*.
Comme j’étais parti,
Le p’tit Prince a dit :
Puisque c’est ainsi
Nous reviendrons mardi !

MARDI matin,
L’Emp’reur, sa fem’ et le p’tit Prince,
Sont venus chez moi
Pour me serrer la pince.
Comme j’étais parti,
Le p’tit Prince a dit :
Puisque c’est ainsi
Nous reviendrons mercredi !

MERCREDI matin,
L’Emp’reur, sa fem’ … Etc., etc…
Nous reviendrons jeudi !

JEUDI matin,
L’Emp’reur, sa fem’ … Etc., etc…
Nous reviendrons vendredi !

VENDREDI matin,
L’Emp’reur, sa fem’ … Etc., etc…
Nous reviendrons sam’di !

SAMEDI matin,
L’Emp’reur, sa fem’ … Etc., etc…
Nous reviendrons dimanch’ !

DIMANCHE matin,
L’Emp’reur, sa fem’ … Etc., etc.
Nous ne reviendrons plus !

* serrer la pince = serrer la main

Lundi, tout peti t (jeu de doigts) Le lundi tout petit (joindre le pouce et l’index) Le mardi tout gentil (une main caresse le dos de l’autre main) Le mercredi bien à l’abri (joindre les 2 mains, au dessus de la tête, en forme de toit) Le jeudi tout dégourdi (debout, secouer son corps) Le vendredi bien assis (se rassoir) Le samedi tout endormi (tête posée sur les mains jointes en guise d’oreiller) Le dimanche tout recommence (faire un rond en l’air avec l’index)	à l’abri — в укрытии, «в домике» dégourdi — проворный
Les canards vont à la mare Lundi, les canards vont à la mare, mar, mar… Mardi, ils s’en vont jusqu’à la mer, mer, mer… Mercredi, ils organisent un grand jeu, jeu, jeu… Jeudi, ils se promènent dans le vent, ven, ven… Vendredi, ils se dandinent comme ça, sa, sa… Samedi, ils se lavent à ce qu’on dit, di, di… Dimanche, ils se reposent Et voient la vie en rose La semaine recommencera demain Coin coin!!!	canard, m — утка mare, f — лужа, пруд se dandiner — ходить вразвалку
Le corbeau a sept habits Le corbeau a sept habits. Un pour le lundi, Un pour le mardi, Un pour le mercredi, Un pour le jeudi, Un pour le vendredi, Un pour le samedi, Et celui qui n’a pas de manche, Il le garde pour le dimanche.	corbeau, m — ворон habit, m — одежда, одеяние manche, f — рукав
La semaine de l’escargot Lundi, voilà l’escargot Sa coquille sur le dos. Mardi, il se dit: “Oh ! Oh ! Je vais voir mon ami l’oiseau.” Mercredi, comme il fait chaud, Il s’endort sous un bouleau. Jeudi, sans dire un mot, Il arrive au bord de l’eau. Vendredi, sur un radeau, Il traverse le ruisseau. Samedi, il voit là-haut Son ami l’oiseau. Dimanche, l’escargot Lui donne un joli cadeau	escargot, m — улитка coquille, f — раковина bouleau, m — береза radeau, m — плот
Bonjour Lundi Bonjour Lundi, Comment va Mardi ? Très bien Mercredi. Je viens de la part de Jeudi Dire à Vendredi qu’il se prépare Samedi Pour le voyage de Dimanche
Les 7 souris de la semaine La souris du lundi A mis un chapeau gris La souris du mardi A croqué deux radis La souris du mercredi A dansé toute la nuit La souris du jeudi A lavé son tapis La souris du vendredi A dormi sous son tipi La souris du samedi A ouvert son parapluie Et la souris du dimanche A cueilli mille pervenches.	souris, f — мышь croquer — грызть tapis, m -ковер tipi, m — вигвам parapluie, m — зонтик cueillir — собирать pervenche — барвинок (цветок)
Que mets-tu dans ta soupe ? Dis-moi, tante Ursule, Que mets-tu dans ta soupe ? — Je mets dans ma soupe : 1 chou, 2 choux, 3 choux ! Mais ce n’est pas tout : Lundi, j’y mets 3 céleris Mardi, j’ajoute 3 radis Mercredi, un pied de pissenlit Jeudi, un demi-salsifis Vendredi, un brin de persil Samedi, un peu de pain rassis Avec du hachis. Et le dimanche ? Je la mange !	chou, m — капуста céleri, m -сельдерей pissenlit, m — одуванчик salsifis, m — сладкий корень, козлобородник brin, m — пучок persil, m — петрушка pain,m rassis — черствый хлеб hachis, m — рубленое мясо, рыба, овощи
Les jours de la semaine Lundi, je nage à la piscine Mardi, j’aide dans la cuisine Mercredi, je fais du sport Jeudi, j’aide maman encore Vendredi, j’écoute mes CDs Samedi, je regarde la télé Dimanche, c’est un jour marrant Car, je vois mes grand-parents
La semaine Et comme toujours, jour après jour, les jours s’enchaînent toujours les mêmes… Et ça commence par un lundi qui arrive à pas de souris. Il attend le mardi Qui vient juste après lui. Quant au mercredi, Il se fait tout petit pour faire place au jeudi. Et ainsi petit à petit Apparaît le vendredi. Mais la semaine n’est pas finie, Il reste le samedi Qui attend le dimanche Pour que tout recommence Et comme toujours, jour après jour, les jours s’enchaînent toujours les mêmes…	s’enchaîner — чередоваться

Блог P1ratRuleZZZ — Главная

SSH в Windows

Что происходит, когда Apple добавляет что-то новое в свой продукт? да, Ты прав – они будут рассказывать об этом много раз и повсюду, пытаясь произвести впечатление на людей, рассказывая им, что их изобретенные вещи действительно новы, даже если это не так.. Так, представлять себе, если они только что добавили поддержку SSH в свою Mac OS X, распространят ли они эту новость или нет? Я считаю, что этот вопрос останется без ответа, поскольку OS X (как и любая другая unix-подобная операционная система, уже из коробки поддерживает SSH). Что касается Windows, многие разработчики, которые работают с Windows по какой-то причине, долгие годы ждали этого дня, борясь с Windows, устанавливая двоичные файлы cygwin и git, и пытаясь заставить их полюбить друг друга, но это всегда было сложно. И с 2018 Windows 10 обновление Microsoft фактически добавила OpenSSH для Windows 10!… И никто об этом не знает даже сейчас. Так что если у вас хотя бы винда 10 1903 выпуск, вы можете легко настроить интеграцию с git. Вот что мы будем делать здесь.

Установка git

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

Хорошо, на самом деле я солгал здесь… SSH.exe распространяется с самим git, НО мы не будем его устанавливать. (последний скриншот выше).

Теперь, давайте проверим, доступен ли git. Перейдите на рабочий стол и создайте папку с именем “git-repo-test”. Никаких дополнительных навыков взлома здесь не требуется, просто нажмите RightMouseButton и выберите “Создать папку”.

Преуспеть в этом? КЛАССНО! Теперь откройте эту папку двойным щелчком, нажмите Ctrl + L в открывшемся окне проводника, и вы сможете скопировать путь к папке. Скопируйте это. затем, перейдите на панель поиска слева внизу и введите “CMD” и откройте это.

В открывшейся консоли типа “CD ” (пробел в конце) нажмите правую кнопку мыши, чтобы вставить скопированный текст ( или Shift + Insert). и нажмите ввод.

Теперь введите “git init”.

Так, репо создано!

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

git config user.email "[email protected]"
git config  user.name "John Doe"

echo "h2. This is the readme file." > README.md

git add README.md

git commit -m"Added a readme file".

И добавляем файл лицензии. Для этого, перейти к https://choosealicense.com/ и выберите лицензию для вашего проекта. Я выберу https://selectalicense.com/licenses/mit/, чтобы позволить всем другим разработчикам использовать мой проект в любом случае, как они хотят. Какую лицензию вы не выбираете? Хорошо, это означает, что другие разработчики не смогут использовать ваш проект каким-либо образом, это не будет законным. Так, создать новый файл (с мышкой и блокнотом) и скопируйте текст лицензии, замените в нем год и сохраните.

Проверить статус репо

git status

Добавьте этот файл для включения в коммит и зафиксируйте его.

git add License.txt

git commit

Внимание, на этот раз мы не используем флаг -m для git commit. Откроется окно с блокнотом, в котором вы сможете ввести сообщение для фиксации..

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

Так, мы добавили несколько файлов и зафиксировали их в ЛОКАЛЬНОМ репозитории.

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

OpenSSH материал

Теперь, давайте создадим ключ SSH. В том же консольном окне типа “ssh-keygen -t rsa -b 4096” и нажмите ввод. Когда он запросит пароль – просто нажмите ввод, чтобы сделать его пустым. Хорошо, ключ ssh создан.

Это создаст 2 файлы: открытый ключ(id_rsa.pub) – поделись этим с кем хочешь, сделай тату с этим текстом или напиши его на ковре под дверью – не имеет значения. Совершенно безопасно делиться им.

Но закрытый ключ (id_rsa) – никогда не делись этим ни с кем! Это как ключи от дома или машины. Держи это в секрете!

Просмотрите открытый ключ, набрав “блокнот% userprofile% . ssh id_rsa.pub” . Скопируйте это значение.

Теперь, перейти к github ssh ключ добавить страницу и вставьте свой открытый ключ в текстовое поле, затем нажмите зеленую кнопку, чтобы отправить.

Хорошо, добавлен SSH ключ. Давайте создадим репо и внесем ваши изменения!

Создайте новое репо здесь https://github.com/new

Здесь вы увидите учебник, прокрутите вниз до второго абзаца и скопируйте первую строку (git удаленное добавление…)

Вставьте его в консоль. И перенести все изменения на пульт.

git remote add ... - your line here

git fetch origin

git push --all

Внимание, дальше, чтобы что-то подтолкнуть, вы можете использовать “git push origin main” (где главный – название вашего филиала).

Так, если тебе удалось, вернитесь в github, и вы увидите свои файлы на сайте github.

Надеюсь, этот урок будет вам полезен.

 4,473 всего просмотров,  4 просмотров сегодня

Like Dislike

Как создать учетную запись WordPress.com — Руководства по WordPress для начинающих

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

Какой тип тарифного плана WordPress.com вам подходит?

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

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

---

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

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

Выберите веб-адрес, заголовок и слоган. Веб-адрес вашего сайта похож на адрес вашего дома в Интернете — именно по нему посетители могут вас найти. При регистрации вы получите свой уникальный адрес wordpress.com (например, example.wordpress.com ).Но некоторым нравится убирать часть «wordpress.com». (Ничего страшного, наши чувства не обижены!) Если вы хотите это сделать, вы можете купить собственное доменное имя, например example.com , если оно доступно.

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

Мы спросили ряд пользователей, как они выбрали названия для своих блогов, от Paper and Salt до She’s a Maineiac . Они дают отличные советы, и этот пост о названии сайта предлагает больше идей.

Настройте свой общедоступный профиль. Обновление общедоступного профиля не является обязательным, поскольку некоторые люди предпочитают вести блог анонимно. Но обязательно заполните эти данные, если хотите установить свою личность. Чтобы отредактировать свой общедоступный профиль, щелкните свой Gravatar в правом верхнем углу экрана, чтобы перейти к Мой профиль .Когда вы комментируете сайты на WordPress.com, это информация, связанная с вашей учетной записью.

Не забудьте загрузить Gravatar — миниатюру, которая отображается рядом с комментариями, которые вы делаете на сайте WordPress.com. Это основной образ, который люди будут ассоциировать с вами. Не знаете, какое изображение выбрать? Вот несколько советов по выбору Gravatar.

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

---

Нравится:

Нравится Загрузка…

Руководства для разработчиков WordPress (темы, функции, плагины и многое другое)

WordPress известен своим удобством в использовании. Это платформа, которую может использовать каждый, независимо от его технических знаний. Однако с чего начать, если вы хотите окунуться в воду разработки WordPress? Давайте посмотрим, как начать разработку для WordPress!

Новичок

Руководство для начинающих по разработке темы WordPress 11 мин.

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

Учить больше Средний

Руководство по файлу WordPress Functions.php 13 минут

Файл functions.php — идеальное место для начала разработки WordPress.С его помощью вы можете настроить свой сайт и добавить новые функции с помощью всего нескольких строк кода. Мы рассмотрим файл functions.php более подробно и познакомим вас с некоторыми простыми приемами, которые с его помощью можно выполнить.

Учить больше Средний

Начало работы с разработкой дочерних тем WordPress 11 мин.

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

Учить больше Передовой

Что такое интерфейс командной строки WordPress (и как его использовать)? 13 минут

Интерфейс командной строки WordPress (WP-CLI) — бесценный инструмент для любого разработчика WordPress.Он позволяет обновлять плагины, настраивать установки и многое другое. Мы собираемся внимательно изучить интерфейс командной строки WordPress, что это такое и некоторые способы его использования.

Учить больше Передовой

Руководство разработчика по созданию плагинов WordPress 11 мин.

Плагины

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

Учить больше Передовой

Знакомство с WordPress REST API 11 мин.

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

Учить больше Передовой

Как использовать GitHub для разработки WordPress 12 минут

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

Учить больше

WordPress Tutorial — Namecheap

---

Как использовать WordPress

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

Навигация по WordPress

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

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

• Раздел Activity включает сводку последних действий на вашем сайте.Эта область включает недавно опубликованные страницы и запланированные сообщения, а также последние комментарии читателей вашего блога. Отсюда вы можете модерировать комментарии, прежде чем они станут общедоступными.

• Quick Draft Widget позволяет вам писать быстрые черновики статей и сообщений, используя упрощенную версию редактора сообщений.

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

• Обратите внимание на виджет приветствия , так как он удовлетворяет потребности новых пользователей. Здесь вы найдете ссылки на наиболее распространенные действия, необходимые для создания нового веб-сайта WordPress.

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

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

Настройки WordPress

Общие настройки WordPress позволяют контролировать отображение вашего сайта. Отсюда вы можете изменить заголовок, слоган, язык и видимость вашего сайта.

• Первая настройка, с которой вы столкнетесь, — это Site Title . Изменение заголовка не повлияет на ваш URL-адрес, он используется WordPress для вашей идентификации.Выбранный вами заголовок будет виден вашим читателям в различных местах вашего сайта, например, он будет отображаться, когда ваши подписчики получат уведомления. Он также отображается при просмотре ваших блогов и других блогов, связанных с вашей учетной записью. Заголовок вашего сайта может быть любым, переработанная версия вашего URL-адреса или что-нибудь, что отражает ваши страницы — лучший способ.

• Следующий параметр — Tagline , место, где можно включить краткое описание или что-то броское, чтобы описать, о чем ваш сайт.

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

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

Использование WordPress в качестве CMS

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

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

Сохраняйте безопасность и выполняйте резервное копирование

Чтобы максимально использовать возможности программного обеспечения, важно убедиться, что вы используете самую последнюю версию WordPress.Многие взломанные сайты WordPress не обновились до последней версии. Это не только полезно для безопасности вашего сайта; новейшее программное обеспечение будет включать обновленные основные плагины и темы, дополнительные функции и более практичные функции.

WordPress обновляет свое программное обеспечение, чтобы обеспечить безопасность системы, и по умолчанию он может обновляться, когда доступен второстепенный выпуск. Когда дело доходит до основного выпуска, вы должны инициировать обновление самостоятельно, но вы можете автоматизировать этот процесс.Используйте плагин Easy Updates Manager, чтобы контролировать обновления. Он обеспечивает глобальные обновления на вашем сайте, включая ядро ​​WordPress, плагины и темы, поэтому вам не нужно самостоятельно проверять наличие новых версий.

Помимо регулярных обновлений, резервное копирование является ключевой частью обеспечения безопасности вашего сайта. Существует множество инструментов, которые помогут управлять вашим сайтом, от импорта и экспорта до резервного копирования вашего контента, чтобы обеспечить его безопасность. Vaultpress и Backup Buddy — два популярных плагина для резервного копирования. Благодаря синхронизации с вашим сайтом в реальном времени, эти плагины создают на своих серверах полную реплику, когда вы вносите какие-либо изменения в свой сайт.Таким образом, в случае любого сбоя в работе вашего сайта или данных вы можете автоматически восстановить любую резервную копию вашего сайта за несколько кликов.

Управляемое решение, такое как наше собственное EasyWP, справляется с этим легко, без дополнительных плагинов.

Руководств по WordPress и как изучить WordPress — Центр поддержки хостинга InMotion

WordPress — бесплатная, удобная для новичков система управления контентом (CMS), используемая для создания более 37% всех веб-сайтов в Интернете сегодня. Первоначально предназначенный для блогов, WordPress расширил свои возможности для поддержки электронной коммерции, форумов, пожертвований и многого другого, что позволило ему постоянно набирать популярность благодаря расширяемости и простоте использования.

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

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

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

Если у вас нет большого опыта и вы хотите изучить WordPress, но вам нужно, чтобы полноценный сайт работал быстро, мы рекомендуем более «опыт работы с WordPress Website Builder» с BoldGrid.

Изучение WordPress — основы

Наши базовые учебные пособия по WordPress познакомят вас с основами изучения WordPress.

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

Learn WordPress — Advanced

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

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

Изучение редактора WordPress по умолчанию — Gutenberg

WordPress создал новый редактор, который был интегрирован во все установки WordPress.Вот несколько основных статей об использовании и знакомстве с Гутенбергом.

Плагины WordPress

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

Рекомендуемые плагины

Здесь, в InMotion, мы создаем учебные пособия по WordPress, обучаем и запускаем WordPress, а также разработали множество способов научиться использовать WordPress.У нас есть почти 1300 учебных пособий по различным темам.

Почему WordPress

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

Пресс-релизы

Будьте в курсе последних выпусков и новостей WordPress. Мы поможем вам от обновлений больших версий до уведомлений безопасности.Прочтите последние выпуски WordPress и уведомления.

---

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

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

Обратите внимание, что мы добавляем новые категории сейчас, потому что мы понимаем, что наши более 1300 текущих руководств по WordPress и более 4000 сообщений на форуме стали одним из крупнейших хранилищ информации о WordPress — и их немного сложно не перегружать.При этом вы можете посетить весь наш репозиторий статей здесь, но мы предупреждали, что они большие. У нас даже есть более 400 статей с инструкциями!

A — G — Просто H — I — Q — R — V — W — Z — 0–9

WordPress Учебник для начинающих 2021 [с видео]

Если вы приземлились здесь, я предполагаю, что вы хотите построить ваш первый сайт. И все ваши друзья говорили вам использовать WordPress. Но вы не знаете, с чего начать. Я прав?

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

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

Примечание. В этой серии руководств по WordPress демонстрируется, как использовать встроенный конструктор и темы WordPress. Для этого урока вам не нужен конструктор страниц, такой как Divi или Elementor. Фактически, Джош показывает вам, как создать свой WordPress БЕЗ использования Divi или Elementor!

Вот что вы узнаете:

• Видео 1: Как выбрать и установить тему WordPress
• Видео 2: Как настроить тему WordPress
• Видео 3: Как создать и отредактировать страницу в WordPress
• Видео 4: меню навигации и виджеты WordPress
• Видео 5: Создание домашней страницы с помощью редактора блоков WordPress
• Видео 6: Как установить и активировать плагины WordPress
• Видео 7: Как создать сообщение в блоге WordPress

Как выбрать и установить тему WordPress — Ep 1 Работа с WordPress

Как настроить тему WordPress — Ep 2 Работа с WordPress

Как создать и редактировать страницу в WordPress — Ep 3 Работа с WordPress

Меню навигации и виджеты WordPress — Ep 4 Работа с WordPress

Создание домашней страницы с помощью редактора блоков WordPress — Ep 5 Работа с WordPress

Как установить и активировать WordPress Плагины — Ep 6 Работа с WordPress

Как создать сообщение в блоге WordPress — Ep 7 Работа с WordPress

Практическое руководство: обновите свой веб-сайт WordPress, тему и плагины

Как создать интернет-магазин с WooCommerce — Ep 8 Работа с WordPress

Видео 1: Как выбрать и установить тему WordPress

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

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

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

Видео 2: Как настроить тему WordPress

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

Видео 3: Как создать и отредактировать страницу в WordPress

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

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

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

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

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

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

Видео 5: Создание домашней страницы с помощью редактора блоков WordPress

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

Видео 6: Как установить и активировать плагины WordPress

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

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

Видео 7: Как создать сообщение в блоге WordPress

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

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

Связанные

Как создавать и использовать WordPress

В 2003 году Интернет был изменен, поскольку был выпущен WordPress. Она начиналась как простая платформа для ведения блогов, но превратилась в CMS, которая доминирует в индустрии создания веб-сайтов с долей рынка, превышающей 40%.

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

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

Но сначала давайте обсудим несколько моментов.

Что такое CMS и как она работает?

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

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

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

В то время как CDA — это то, что на самом деле доставляет контент, который вы создаете в CMA.CMS может иметь множество различных форм, но сегодня мы рассматриваем только WordPress.

WordPress.org против WordPress.com: в чем разница?

Когда большинство людей обращаются к WordPress, они имеют в виду автономный WordPress или WordPress.org. Его не следует путать с WordPress.com.

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

Все еще не уверены? Позволь мне объяснить.

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

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

Как создать веб-сайт на WordPress

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

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

Установка WordPress

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

Минимальные требования:

• PHP версии 5.2.4 или выше.
• MySQL версии 5.0.15 или выше

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

В этом руководстве мы сосредоточимся на Softaculous, который доступен всем клиентам GreenGeeks.

Шаг 1. Найдите Softaculous

Войдите в свою учетную запись GreenGeeks на странице https://my.greengeeks.com/login.

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

Теперь, когда вы находитесь на cPanel, прокрутите вниз до раздела «Программное обеспечение» и нажмите на установщик Softaculous Apps.

Шаг 2. Установка WordPress с помощью Softaculous

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

Вы должны увидеть самые популярные варианты Softaculous с WordPress вверху. Щелкните по кнопке «Установить».

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

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

Шаг 3. Настройки сайта

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

Вы также увидите два флажка: «Включить мультисайт (WPMU)» и «Отключить WordPress Cron». По умолчанию они не отмечены, и я рекомендую оставить их такими.

Шаг 4: Учетная запись администратора

Существует раздел учетной записи администратора, который позволит вам настроить учетную запись администратора, которая очень важна . Здесь вы можете создать имя пользователя и пароль администратора, а также ввести адрес электронной почты.

По умолчанию имя пользователя admin — admin, пароль — pass.«Это верно для каждой установки WordPress, что является серьезным недостатком безопасности. Я настоятельно рекомендую изменить имя пользователя и пароль администратора.

Запишите эту информацию, она понадобится вам для входа в систему.

Вы также увидите электронное письмо администратора. По умолчанию хостинговые компании будут использовать [email protected]. Вы обязательно захотите изменить это на адрес электронной почты, который вы связываетесь с вашей компанией, или найдите время и создайте его для этой учетной записи.

Шаг 5: Завершение установки

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

На самом деле, все, что вам нужно сделать, это нажать кнопку «Установить» внизу.

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

Изучение панели управления WordPress

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

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

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

Шаг 1: Войдите на свой веб-сайт

Теперь вам может быть интересно, как мне на самом деле войти на свой веб-сайт после установки WordPress. Просто посетите https://www.YourDomainName.com/wp-login.php . Не забудьте заменить «YourDomainName» на свое фактическое доменное имя.

ПРИМЕЧАНИЕ. Может пройти некоторое время, прежде чем ваш домен и веб-сайт будут циклически проходить через серверы доменных имен. Другими словами, все интернет-провайдеры должны знать, что ваш веб-сайт существует, и это может занять до нескольких часов.Хотя я не думаю, что видел, чтобы это заняло больше десяти минут.

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

Шаг 2. Панель мониторинга

Первое, что вы увидите при входе в систему, — это панель мониторинга. Этот раздел полностью настраиваемый, но по умолчанию он содержит следующие модули:

• Краткий обзор
• Активность
• Быстрый черновик
• Состояние работоспособности сайта
• События и новости WordPress

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

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

Шаг 3. Панель администратора

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

В некоторых случаях вы можете заметить красный кружок с числом внутри.

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

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

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

Выбор темы WordPress

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

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

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

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

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

Шаг 1. Добавление новой темы

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

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

Щелкните «Внешний вид» и выберите «Темы».

По умолчанию единственная тема, которая у вас должна быть — это Twenty Twenty-One, или текущий год, когда вы читаете этот пост.WordPress выпускается с новой темой каждый год с пометкой для этого конкретного года.

Нажмите кнопку «Добавить», чтобы перейти в библиотеку тем.

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

Например, если вы создаете интернет-магазин, поиск электронной коммерции приведет к появлению тем, созданных для него.

Когда вы увидите тему, которая может вам понравиться, наведите на нее курсор и нажмите кнопку «Предварительный просмотр».

Это должно показать вам предварительный просмотр темы, но иногда вы можете ничего не видеть, и на самом деле это известная ошибка в WordPress, которая не была исправлена ​​на момент написания этой статьи.

Если вам нравится тема, нажмите кнопку «Установить», а если нет, поищите другую.

Теперь просто нажмите кнопку «Активировать», и тема станет вашим текущим внешним видом.

Шаг 2. Настройка вашей темы

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

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

Во-первых, давайте отметим, какие параметры предоставляет ваша тема. Вы можете найти их в разделе «Внешний вид». Ниже я показываю различные варианты, предлагаемые темами Hello Elementor и ColorMag.

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

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

С левой стороны вы увидите параметры, предоставляемые вашей темой. Опять же, каждая тема уникальна.

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

Если вы выберете опцию «Дополнительный CSS» слева, вы сможете ввести собственный код CSS. Для новичка это может показаться сложным, но на самом деле в Интернете доступно множество примеров, которые вы можете скопировать и вставить.

Самое приятное то, что вы можете видеть, что делает код в реальном времени, поэтому он очень полезен.

Просто помните, что весь собственный код CSS в настройщике зависит от темы. Если вы смените тему, вам придется повторно вводить код.

Добавление плагинов в WordPress

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

Плагины делают то же самое, но для WordPress, и они бывают любой формы и размера.

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

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

Все, что вам нужно сделать, это найти плагин с нужной функцией, установить и настроить.

Давайте рассмотрим процесс.

Шаг 1. Установка подключаемого модуля

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

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

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

Приступим.

Щелкните Plugins и выберите опцию Add New.

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

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

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

Ищите плагины, пока не найдете тот, который вам нравится. Нажмите на опцию «Подробнее», чтобы увидеть полный список функций.

Если вам нравится то, что вы видите, нажмите кнопку «Установить сейчас» и активируйте плагин для использования. Если нет, поищите другой плагин.

Шаг 2. Настройка подключаемого модуля

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

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

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

У меня есть одна критика в адрес WordPress: настройки плагинов не находятся в разделе «Плагины». Иногда они могут быть перечислены в разделах «Настройки», а иногда — в разделе «Инструменты».В некоторых случаях у них будет специальный раздел в панели администратора.

Это, мягко говоря, сбивает с толку, потому что это зависит от разработчиков плагинов.

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

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

Создание контента WordPress в Gutenberg

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

Просто нужно знать, где все находится.

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

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

Шаг 1: Войдите в редактор

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

Давайте создадим новую запись WordPress. Для этого нажмите «Записи» и выберите «Добавить новую опцию».

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

Шаг 2. Блок абзаца и основы

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

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

Это наиболее распространенный блок, который вы будете использовать.

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

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

А теперь добавим изображение.

Шаг 3: Добавление дополнительных блоков (блок изображения)

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

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

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

Теперь блок изображения должен быть в редакторе Гутенберга. Это довольно просто и состоит из трех кнопок:

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

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

Если вы нажмете на блок и проверьте дополнительные настройки на вкладке блока, как мы это делали для блока Paragraph, вы найдете параметры, эксклюзивные для блока Image.Опять же, так для каждого блока.

Шаг 4. Публикация контента

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

Это можно сделать с помощью кнопки «Предварительный просмотр». Это позволит вам увидеть, как будет выглядеть страница, когда она будет запущена.

Я всегда рекомендую просмотреть предварительный просмотр перед публикацией контента.Это просто хорошая политика. Если все в порядке, нажмите кнопку «Опубликовать».

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

Этот процесс идентичен при создании или редактировании записи или страницы WordPress.

Оптимизация WordPress

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

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

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

Давайте начнем с самого важного, что нужно делать каждому веб-сайту: оставаться в курсе событий

Тема 1: Обновления

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

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

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

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

Кроме того, это легко сделать.

Щелкните «Панель управления» и выберите «Обновления».

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

Если есть новая версия WordPress, нажмите «Обновить до версии X.X.X ”.

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

Тема 2: Резервные копии

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

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

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

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

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

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

Тема 3: Оптимизация изображений

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

WordPress, естественно, возьмет любое изображение, которое вы добавите, и изменит его размер. Звучит здорово, но данных много. Представьте, что вы загружаете изображение размером 600 x 600, но вам нужно всего лишь 200 x 200.

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

У вас есть несколько вариантов. Во-первых, вы можете редактировать изображения, прежде чем загружать их в WordPress, в программном обеспечении для редактирования фотографий, таком как PhotoShop. Это наиболее распространенная тактика и популярное программное обеспечение.

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

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

Тема 4: Безопасность

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

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

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

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

Тема 5: Веб-хостинг

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

Однако не все веб-хосты предоставляют одинаковые возможности.

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

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

У нас есть гораздо больше, чтобы научить вас

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

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

14 руководств по WordPress для всех уровней квалификации

С момента своего выпуска в 2003 году WordPress сыграл важную роль в создании и поддержке более 75 миллионов веб-сайтов. WordPress — самая популярная система управления контентом, на которой работает около 40% существующих веб-сайтов. С WordPress можно делать что угодно. Вот почему существуют сотни и сотни руководств по WordPress.

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

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

Иллюстрация OrangeCrush

Почему WordPress?

–

Когда мы говорим «WordPress», мы имеем в виду wordpress.org, бесплатную систему управления контентом, которую вы можете загрузить или получить к ней через выбранного вами хостинг-провайдера. Если вы еще не выбрали хостинг-провайдера или не уверены на 100%, что влечет за собой веб-хостинг, ознакомьтесь с нашим кратким руководством по веб-хостингу.

WordPress.com — это конструктор веб-сайтов, который также позволяет создавать веб-сайты бесплатно, но чтобы использовать собственное доменное имя или получить доступ к другим функциям, вы должны заплатить. Его гораздо меньше настраивать, чем при использовании wordpress.org, но он предлагает аналогичную поддержку для других платных разработчиков веб-сайтов, таких как Squarespace и Wix.

Вот краткое руководство по WordPress:

Так почему же WordPress? Это самая популярная в мире система управления контентом по многим причинам.

Некоторые из его самых больших преимуществ:

• Это бесплатно. WordPress известен тем, что он полностью бесплатный и имеет открытый исходный код. Тем не менее, многие надстройки, такие как темы и плагины для WordPress, стоят денег. Но это совершенно необязательно; Сам WordPress никогда не будет вам ничего стоить.
• Существует ошеломляющее количество плагинов на выбор для настройки вашего веб-сайта — по состоянию на 2018 год их было более 50 000, и сейчас оно, безусловно, больше.
• Тонны интеграции с другими программами и сервисами, такими как Salesforce, Google Drive, Shopify, Mailchimp и многими другими.
• Легко использовать. Хотя вы, безусловно, можете заняться кодированием и создавать интересные вещи с помощью WordPress, вам не нужны какие-либо знания в области программирования, чтобы создать красивый, полностью функциональный веб-сайт.
• В Интернете доступно множество учебных пособий, многие из которых бесплатны.

Лучшие учебники по WordPress

—

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

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

Учебники WordPress для начинающих

—

Как создать сайт в 2021 году (шаг за шагом)

По : WPBeginner
Стоимость : бесплатно
Продолжительность : 28 минут
Что охватывает : полное руководство по настройке хостинга, получению доменного имени, установке WordPress, выбору темы и добавлению страниц и плагины.
Посмотреть руководство можно здесь

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

Как добавить форму запроса на обратный звонок в WordPress

Через WPBeginner

От : WPBeginner
Стоимость : бесплатно
Длина : 1546 слов — около 7 минут
Что это касается : процесс добавления кнопки на ваш веб-сайт, которая позволяет клиентам запрашивать обратный звонок от вас при первой же возможности
Прочтите руководство здесь

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

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

Как использовать FTP для загрузки файлов в WordPress для начинающих

По : WPBeginner
Стоимость : бесплатно
Продолжительность : 6 минут
Что это касается : загрузка файлов через FTP, средство доступа к файлам веб-сайта через хостинг-провайдера, а не через панель управления WordPress
Смотреть учебник здесь

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

Электронная торговля WordPress: WooCommerce

Via Lynda.com

Автор : Патрик Рауланд через Lynda.com
Стоимость : 25 долларов в месяц для членства на Lynda.com, что дает вам доступ ко всем курсам бесплатно
Продолжительность : 2 часа 39 минут
О чем идет речь : все, что нужно знать новичку в WooCommerce, от установки WooCommerce и настройки магазина до подключения Mailchimp и Google Analytics
Смотрите руководство здесь

Если вы планируете создать сайт электронной торговли, это руководство для вас.WordPress + WooCommerce — одна из самых популярных настроек для электронной коммерции, потому что, как и WordPress в целом, она чрезвычайно настраиваема и позволяет создавать именно то, что вы хотите. Если вы все еще ищете подходящую платформу электронной коммерции для своего магазина, ознакомьтесь с нашим руководством по 10 лучшим платформам электронной коммерции для онлайн-продаж.

В этом руководстве вы познакомитесь с новичком, как начать работу с WooCommerce. Он начинает вас с самого первого шага: выбора WooCommerce по сравнению с другими платформами электронной коммерции.Затем Патрик Рауланд проведет вас через каждый этап создания вашего первого магазина, включая работу с мобильным приложением WooCommerce.

Как правильно добавить Google AdSense на свой сайт WordPress

По : WPBeginner
Стоимость : бесплатно
Продолжительность : 5 минут
Что это покрывает : Добавление Google AdSense на ваш веб-сайт
Смотрите руководство здесь

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

Учебники WordPress для промежуточных пользователей

—

Шпаргалка по WordPress

Через Начать ведение блога в Интернете

К : Начать блог в Интернете
Стоимость : бесплатно
Длина : примерно 650 слов — около 3 минут
О чем идет речь: Разработчику нужно много фрагментов кода для создания страниц и шаблонов work
Читайте инструкцию здесь

Это не учебник в традиционном понимании, но мы подумали, что было слишком полезно включать , а не в этот обзор.Это быстрый и простой чит-лист со всеми основными файлами шаблонов, фрагментами php для шаблонов и заголовков, фрагментами кода навигации и несколькими более сложными разделами, такими как цикл, запросы сообщений и стили различных категорий. Здесь не так много объяснений, просто набор фрагментов кода, готовых для копирования и вставки в тему.

Узнайте, как правильно добавить пользовательский JavaScript в WordPress

Через wpmudev

Автор : Бренда Бэррон через wpmudev
Стоимость : бесплатно
Длина : примерно 1500 слов — примерно 6 минут
Что это касается : почему вы хотите использовать Javascript на своем сайте и правила как (и как не добавлять) добавлять Javascript на ваш сайт
Прочтите руководство здесь

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

Бренда Баррон объясняет, как добавить собственный Javascript в файлы WordPress, чтобы безопасно и правильно изменить поведение вашего сайта (другими словами, таким образом, чтобы ваш сайт не вылетел) в четырех сжатых заголовках. Эти заголовки отражают несколько важных вредных привычек, которые, возможно, вы заметили у других, и почему вам не следует их делать.В конце она познакомит вас с несколькими полезными плагинами, которые упрощают работу с пользовательским Javascript.

Начало работы с разработкой плагинов WordPress

Через Wpmudev

Автор : Даниэль Патаки через Wpmudev
Стоимость : бесплатно
Длина : примерно 3800 слов — примерно 17 минут
Что он охватывает : Создание плагинов для изменения функциональности вашего сайта без изменения его основного кода
Прочтите руководство здесь

Плагины

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

В этом руководстве Дэниел Патаки покажет вам, как пройти через процесс создания плагина, который интегрирует Facebook Open Graph с WordPress. Facebook Open Graph — это API, который позволяет интегрировать Facebook с вашим сайтом такими способами, как добавление кнопки «Нравится» на ваши страницы, встраивание потоков Facebook Live и предоставление пользователям возможности входить на ваш сайт с помощью Facebook.В этом учебном пособии описывается все, что вам нужно знать для создания собственного плагина, от использования хуков и фильтров до добавления скриптов и стилей.

WordPress: разработка безопасных сайтов

Через Lynda.com

Автор : Джефф Старр через Lynda.com
Стоимость : 25 долларов в месяц для членства на Lynda.com, что дает вам доступ ко всем курсам бесплатно
Продолжительность : 2 часа 34 минуты
Что он охватывает : основы веб-безопасности, а также более продвинутые меры безопасности, такие как мониторинг активности пользователей, сканирование эксплойтов, создание брандмауэров и остановка хотлинкинга
См. Руководство здесь

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

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

Разработка тем WordPress с помощью Bootstrap в 2021 году

Via Udemy

По : Брэд Хасси и Code College через Udemy
Стоимость : 94 доллара.99
Длина : 12 часов
Что он охватывает : Создание собственного веб-сайта с нуля с помощью Bootstrap
Смотрите руководство здесь

Когда бесплатные и платные темы WordPress, которые вы найдете, просто не подходят, что вы можете сделать? Разумеется, создайте свою собственную тему! В этом руководстве вы точно узнаете, как создать свою собственную тему WordPress с помощью Bootstrap, CSS-фреймворка с открытым исходным кодом для интерфейсной веб-разработки. Вы узнаете, как сделать статические веб-сайты динамическими, как создать уникальный веб-сайт с помощью Bootstrap, как использовать настраиваемые типы сообщений и расширенные настраиваемые поля и многое другое, все навыки, которые вы можете использовать, чтобы начать свою карьеру в качестве разработчик тем WordPress.

Учебники WordPress для продвинутых пользователей

—

Рабочие процессы WordPress

Via Lynda.com

По : Джо Касабона через Lynda.com
Стоимость : 25 долларов в месяц для членства на Lynda.com, что дает вам доступ ко всем курсам бесплатно
Продолжительность : 1 час, 22 минуты
Что он охватывает : Рабочий процесс создания настраиваемого веб-сайта WordPress для клиента
Смотрите руководство здесь

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

Создайте клиентский портал с помощью WordPress

Через Creative Bloq

Автор : Джозеф Форд через Creative Bloq
Стоимость : бесплатно
Длина : примерно 1380 слов — около 6 минут
Что это касается : создание портала, на котором клиенты могут делиться документами и загружать их
Прочтите руководство здесь

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

Блоки Гутенберга для разработчиков WordPress и React

Через Udemy

По : Али Алаа через Udemy
Стоимость : 109 долларов.99
Длина : 11 часов, 15 минут
Что он охватывает : Как создавать блоки и плагины Гутенберга с нуля
Смотрите руководство здесь

В этом руководстве вы узнаете все тонкости работы с блоками Гутенберга в WordPress и React. В рамках курса Али Алаа знакомит вас с редактором Гутенберга в WordPress, который изначально был отдельным плагином, но с 2018 года является основным редактором WordPress. Блоки Гутенберга — это отдельные блоки контента, которые позволяют пользователям создавать собственные макеты веб-сайтов.Базовые блоки предназначены для таких частей контента, как абзацы и изображения.

За 11 часов вы узнаете, как создавать сложные блоки с помощью ReactJS и Redux и как добавлять новые функции в пользовательский интерфейс Gutenberg. Вы также узнаете, как работают блоки Гутенберга, узнаете, как сохранять их в базе данных, создать динамический блок, получить советы по дизайну, чтобы блоки выглядели великолепно, и создали плагин Гутенберга.

Как легко скрыть страницу входа в WordPress от хакеров

Via Wpmudev

Автор : Мартин Аранович
Стоимость : Бесплатно
Длина : Приблизительно 2800 слов — около 12 минут
Что это касается : Скрытие страницы входа в WordPress для предотвращения атак методом грубой силы
Прочтите руководство здесь

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

No related posts.