Tehnografi.com - Технологические новости, обзоры и советы

Советы по редактированию WordPress! Часть I

Следующая статья поможет вам: Советы по редактированию WordPress! Часть I

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

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

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

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

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

Вход в систему

Если вы абсолютный новичок, вы, вероятно, не знаете, как войти в систему администратора WP. В большинстве случаев экран входа в систему находится по адресу www.yourwebsite.com/wp-admin/. Если вы не можете найти свои данные для входа, воспользуйтесь ссылкой «Забыли пароль», чтобы получить электронное письмо для сброса пароля. Если ваш адрес электронной почты не связан с логином, вам может потребоваться обратиться к своему разработчику или хостинговой компании, чтобы помочь вам получить доступ. Эти ресурсы могут предоставить новый логин, добавив новую учетную запись администратора или редактора непосредственно в базу данных, а также есть другие методы, к которым вы, как владелец сайта и хостинг-аккаунта, имеете доступ.

Устали искать этот пароль? Мы рекомендуем использовать менеджер паролей, например Dashlane или LastPass, который запомнит его и позволит вам сразу войти в систему.

Сообщения против страниц

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

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

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

Основы визуального редактора WordPress

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

В крайнем левом углу, рядом со строкой значков, находится чрезвычайно важный раскрывающийся список выбора формата, который назначает выбранный текст абзацам или уровням заголовков. Использование раскрывающегося списка форматирования приведет к добавлению соответствующих тегов HTML к выделенному тексту, хотя вы не увидите теги в визуальном редакторе. Правильное форматирование текста HTML важно для поисковых систем при сканировании и оценке вашего контента в рамках расчета рейтинга страницы в результатах поиска. Короче говоря, раскрывающийся список форматирования облегчит поиск вашего контента в Интернете. Например, очень важно, чтобы основная тема вашей статьи была заключена в тег заголовка «H1», а подзаголовки также были назначены в правильной иерархии важности с использованием H2, H3, H4 и т. д.

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

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

Кухонная раковина”

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

Абзацы и разрывы строк: как это делает WordPress.

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

Иногда вам нужно принудительно перенести строку, например, при составлении адреса. Для этого вы используете Shift + Enter так же, как вы привыкли делать это в текстовом редакторе.

Маркированные и нумерованные списки

Чтобы создать маркированный список в визуальном редакторе, просто нажмите Enter, затем введите элементы списка, нажимая клавишу Enter в конце каждого. Затем, заполнив список, с помощью мыши выберите весь список и нажмите значок «Маркированный» или «Нумерованный» из набора инструментов. WordPress обернет все элементы правильными тегами. Использование Shift + Enter обеспечит разрыв строки внутри одного элемента списка, но не поможет вам создавать списки.

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

Колонны!

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

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

  1. Перейдите в меню «Панель управления» и выберите «Плагины», затем «Добавить новый».
  2. Найдите «Короткие коды столбцов» в строке поиска на экране «Добавить плагины».
  3. Используйте кнопку «Установить», чтобы установить плагин, затем нажмите «Активировать» после его установки.
  4. Затем вернитесь на экран редактирования сообщения.

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

  1. Поместите курсор туда, где вы хотите, чтобы появился первый столбец.
  2. Затем щелкните значок столбца, и появится окно столбцов.
  3. Поскольку нам нужно создать три столбца, сначала мы введем отступы, чтобы создать поля между столбцами. Для простоты мы установим все столбцы с одинаковым отступом справа и слева от 15 пикселей. При этом между столбцами будут созданы промежутки, ширина которых в два раза (30 пикселей) превышает значение, введенное в виджете заполнения столбца, поскольку пространство будет включать в себя заполнение правой стороны левого столбца, добавленное к левой стороне соседнего столбца.

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

[one_third padding=”0 15px 0 15px”][/one_third]

  1. Здесь нужно быть немного осторожным. Выделите весь текст, который вы хотите разместить в первом столбце, затем нажмите Ctrl-X (CMD-X на Mac), чтобы вырезать его, затем Ctrl-V или CMD-V, чтобы вставить его между двумя частями пары короткого кода, вот так :
  2. Повторите процедуру для второго столбца.
  3. Для третьего (последнего) столбца вам нужно поместить курсор в то место, где начинается последний столбец, и еще раз щелкнуть значок столбца, чтобы повторно отобразить меню столбцов. Заполните отступы (если это еще не сделано), а затем на этот раз выберите «одна треть (последняя)». Последняя пара коротких кодов столбца выглядит следующим образом:

    [one_third_last padding=”0 15px 0 15px”]

  4. В правом верхнем углу экрана редактора имеется кнопка «Предварительный просмотр». Часто полезно предварительно просмотреть изменения, особенно если вы используете только что установленный плагин. Нажмите кнопку «Предварительный просмотр», чтобы увидеть, как будет выглядеть контент:

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

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

А пока узнайте, как маркетинговая фирма WIX в Хьюстоне может создать дизайн веб-сайта в Хьюстоне, который превратит посетителей в клиентов. Свяжитесь с нами сегодня Узнать больше!