Wordpress

Текстовый редактор для wordpress: Продвинутый текстовый редактор wordpress — плагин TinyMCE Advanced

24.02.2021

Содержание

Продвинутый текстовый редактор wordpress — плагин TinyMCE Advanced

Есть у меня небольшой набор плагинов wordpress, которые смело можно называть «must have» для каждого блоггера, то есть обязательными к использованию. Устанавливаю по возможности практически одну и ту же сборку на все свои блоги, что позволяет сделать работу с системой более продуктивной, функциональной и удобной для посетителей. Думаю, в дальнейшем обзоры их всех вы найдете на страницах этого блога, про кое-какие модули уже успел рассказать, но большинство из них еще впереди. Сегодня речь пойдет о продвинутом текстовом редакторе TinyMCE Advanced – штука очень классная и практичная.

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

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

  • форматирование wordpress  шрифта (жирным, курсивом, с подчеркиванием и т.п.)
  • создание обычных и нумерованных списков, а также отступов для текста
  • выравнивание текста по краям, центру и всей ширине колонки
  • создание и удаление ссылок
  • вставка изображения
  • редактирования css
  • создание цитат
  • вставка разделителей в wordpress читать далее и следующей страницы
  • включение проверки орфографии, нахождения строки в тексте
  • включение полноэкранного режима, а также отображение дополнительной строки функциональных клавиш для текстового редактора TinyMCE Advanced
  • последняя кнопка – вставка голосования плагина wp-polls.

Вторая строка не менее важная и также содержит ряд интересных функций:

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

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

Установка и настройка TinyMCE Advanced

Скачать текстовый редактор TinyMCE Advanced можно с официального сайта вордпресс здесь. Следует заметить, что для разных версий wordpress (2.6, 2.7, 2.8+) нужно использовать свой дистрибутив.  На момент написания статьи последняя версия плагина есть 3.2.7.

Установка стандартная – после скачивания разархивируем и загружаем на фтп блога в папку wp-content/plugins. Далее активируем TinyMCE Advanced из админки, после чего заходим в меню «Параметры» — «TinyMCE Advanced», где нужно произвести его настройку. Финальным аккордом есть очистка кэша браузера.

Перед тем как рассказать о настройке еще пару слов про функциональность модуля. По описанию на официальном сайте в него входит аж 15 других плагинов: Advanced HR, Advanced Image, Advanced Link, Context Menu, Emotions (Smilies), Date and Time, IESpell, Layer, Nonbreaking, Print, Search and Replace, Style, Table, Visual Characters и XHTML Extras. Все это возможно получить, установив лишь один TinyMCE Advanced! Кроме английского языка плагин поддерживает и некоторые другие локализации (немецкую, французскую, итальянскую, испанскую, русскую и т.д.). В общем, сомневаться в широких возможностях модуля не приходится.

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

Видите сколько там еще все припасено? Вникать в детали вам уже придется самостоятельно, благо все элементы подписаны и достаточно наглядные. Выделил бы отдельно, пожалуй, блок с функциями для работы с таблицами – позволит быстро и легко создавать, изменять их в тексте. Еще в TinyMCE Advanced можно импортировать в редактор пользовательский css файл стилей – тоже может пригодиться. В целом, как я и сказал с самого начала поста, модуль must have!

Дополнения для TinyMCE Advanced

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

  • Изменяем цвет текста в WordPress с помощью модуля TinyMCE Color Grid и не только. Данное решение создает здоровенную палитрую цветов в редакторе + добавляет еще одну полезную функцию. Также в статье найдете хак для functions.php, позволяющий заменять базовые цвета в TinyMCE Advanced на свои.
  • Как подключить шрифт в WordPress редакторе — рассматриваю задачу установки новых пользовательских шрифтов в TinyMCE Advanced, а также добавление Google Fonts через обычные CSS стили.

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

Понравился пост? Подпишись на обновления блога по RSS, Email или twitter!

Редактор CKEditor для WordPress | www.wordpress-abc.ru

Вступление

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

Особенности редактора WordPress с CKEditor

  • Заменить по умолчанию редактор WordPress с CKEditor
  • Оставить комментарий с CKEditor обеспечить стиле и красочным Комментарии (по желанию).
  • Встроенный файловый менеджер и менеджер загрузки.
  • Строить-в WordPress «читать далее» Button.
  • Управление выходной формат.
  • Настраиваемые кнопки на панели инструментов
  • Интеграция с WordPress кнопки средствах массовой информации:
  • Управление и вставить смайлики в сообщении.
  • Настроить кожи редактора.
  • … И многое другое.

Этот плагин требует WordPress версии wp 3.2 или более поздних версий. Последнее тестирование плагина на версии wp 4.3.16.

Два варианта установки плагина CKEditor

Вариант 1.

Скачать на  Wordpress.org (https://wordpress.org/plugins/ckeditor-for-wordpress/).

Далее стандартная установка:

  1. Распаковать и загрузить файлы в wp-content/plugins корневого каталога;
  2. Активировать плагин;
  3. Готово, наслаждайтесь этим.

Вариант 2.

  1. Зайти в свою админ. панель сайта WordPress;
  2. Открыть в меню: Плагин→Добавить новый;
  3. В окне [Поиск плагина] нужно набрать название нужного плагина, в этом случае: CKEditor;
  4. В открывшейся таблице с вариантами найти нужный плагин. Он будет на первых местах;
  5. Под названием плагина Установить/Детали, выбираем Установить.
  6. Установка автоматическая. На открывшейся странице нужно активировать плагин, нажав [Активировать].

Редактор CKEditor для WordPress — Настройка плагина

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

Вывод

Плагин Редактор CKEditor значительно расширяет возможности визуального редактирования и оформления статей и страниц сайта. Напомню, по умолчанию система использует визуальный редактор TinyMCE и если хотите расширить функционал редактора, лучше установить плагин TinyMCE Advanced. Он тестируется под все новые версии.

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

таблицы и т. д.

©www.wordpress-abc.ru

Другие статьи раздела: Плагины

Похожие посты:

Похожее

Gutenberg – новый блочный редактор WordPress. За и Против

WordPress

access_time

29 декабря, 2017

hourglass_empty

12мин. чтения

Вступление

Редактор WordPress, предназначенный для создания и редактирования записей и страниц, поставляемый вместе с ним  уже давно существует, возможно пришло время для обновлений?

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

Что такое Gutenberg?

Вкратце, Gutenberg – это новый редактор WordPress для записей и страниц. Проект назван именем Иогана Гутерберга, презентовавшего Европе печатный станок и начавшего печатную революцию. Его работа сделала знание и информацию доступной для масс и запустила социальную революцию. Аналогично этому, разработчики хотят сделать доступным создание продвинутый макетов страниц для всех пользователей WordPress.

Основная особенность редактора Gutenberg – это преставление всего контента в виде блоков и определение макета записи прямо в редакторе. Текущий редактор WordPress free-flow как любая другая программа для обработки текста, а макет страницы и стили определяются в файлах HTML и CSS.

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

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

Разработчики также хотят заменить использование шорткодов, когда добавляешь много контента в запись или на страницу. Это означает, что встраивание внешнего содержимого проще, со специальными настройками для видео с YouTube, публикаций Reddit, Tweets, ссылки Spotify и многое другое. Это упрощает процесс, который обычно требует плагина или генерирования специального встроенного кода на сайте, откуда вы хотите взять контент. На данный момент поддерживается  34 ресурса.

Они также хотят раскрыть некоторые скрытые от пользователей WordPress моменты. Ссылаясь на то, что WordPress фактически поддерживает встраивание с более 30 ресурсов и, если вы посмотрите на редактор WordPress по умолчанию, вы заметите, что нет кнопок для их удобного включения в контент. Единственный путь добавить их — это метод экспериментирования. Но редактор Gutenberg уже поддерживает 34 встраиваемых ресурса. И все из них легко доступны. Всё, что вам нужно это ввести URL, который вы хотите добавить и редактор Gutenberg сделает всё остальное.

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

Установка редактора Gutenberg

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

Текущая версия 1.6.1 и требует версию WordPress 4.8+. Мы проверяли на версии 4.8.2.

Тестирование редактора Gutenberg

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

Разработчики Gutenberg недавно пересмотрели сроки перехода от плагина к редактору по умолчанию. Следующий важный выпуск плагина запланирован на ноябрь, чтобы совпасть с выпуском обновления WordPress до 4.9. Прежде чем встроить его в ядро WordPress, разработчики выпустят предложение о слиянии в декабре 2017 года, где редактор будет тщательно изучен. Предполагается, что окончательный переход на новый редактор будет частью обновления WordPress 5.0, возможно, в 2018 году.

Внизу админ меню в консоли расположен пункт Gutenberg с тремя выпадающими подпунктами-ссылками внутри. Одна из ссылок называется Demo, по нажатию открывается страница с примером записи в новом редакторе со всеми доступными вам функциями – текст, картинки, таблицы, различные примеры выравнивания блоков, а также некоторый встраиваемый контент.

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

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

Создавая новую страницу вы заметите, что она также открывается в новом блочном редакторе. Ранее созданные страницы тоже можно редактировать пользуясь ссылкой Классический редактор под названием страницы в меню Страницы -> Все страницы, если нажать ссылку Изменить, то страница для редактирования откроется в блочном редакторе Gutenberg. Изучая страницу проекта на Github можно увидеть какие изменения автора собираются внести в плагин в ближайшее время.

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

Новый редактор

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

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

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

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

Добавление новых блоков

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

Новое меню имеет навигацию по вкладкам: Recent (недавно использованные)Blocks (блоки) и Embeds (встраиваемый контент). В этом меню также всегда доступна строка поиска. Усилия разработчиков по улучшению рабочего процесса хорошо видны на примере контекстно-зависимых меню.

  • Recent – когда вы нажимаете на символ + или кнопку вставки, появляется список из 8 наиболее часто используемых блоков и встраиваемых ресурсов.
  • Blocks – список блоков, сгруппированных в четыре категории:
    • Common Blocks – заголовки, параграфы, изображения и так далее
    • Formatting – таблицы, предформатируемый текст, код и т.д.
    • Layout – разделители, кнопки и др.
    • Widgets – последние записи, категории, шорткоды.
  • Embeds – вы можете встраивать содержимое из длинного списка популярных сайтов таких как Reddit, YouTube, Instagram и есть кнопка для генерации встраиваемого контента, куда вы можете просто вставить верный URL и редактор WordPress сделает всё остальное. Работает как функция автоматического определения.

Передвигание и выравнивание блоков

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

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

Визуальный редактор против Текстового редактора

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

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

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

Оглавление

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

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

Якоря

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

Когда выбран блок заголовка, на странице параметров блока Block можно увидеть раздел HTML Anchor с текстовым полем под ним. При вводе имени для ссылки в текстовом поле, появляется кнопка Copy link для копирования ссылки, которую вы потом можете вставить в любое нужное место.

Это эквивалентно предоставлению любому элементу HTML идентификатора ID и привязке к нему, добавив #name-of-id к URL-адресу.

Дополнительные CSS стили

В большинстве блоков есть возможность добавить к нему дополнительные стили CSS.

Это позволяет вам назначать классы, определенные в файле stylesheet.css вашей темы.

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

Галерея

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

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

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

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

 

Изображение записи (Cover Image / Hero Image)

Изображение записи — это большой заголовок, часто с текстом поверх него.

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

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

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

Цитаты и Блок цитат (Pull Quotes & Block Quotes)

Цитата — это отрывок текста статьи. Она применяется для выделения важного фрагмента текста или как чьё-то изречение и располагается обычно перед текстом статьи.

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

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

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

Пользовательский HTML (Custom HTML)

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

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

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

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

Традиционный текст (Classic text)

Блок Classic text имитирует редактор WordPress по умолчанию и показывает полную панель инструментов TinyMCE вместо каких-либо кнопок Gutenberg. Единственным отличием от TinyMCE является опция ‘Additional CSS Class’ (дополнительный класс CSS) в меню настроек блока.

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

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

Строфа (Verse)

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

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

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

В выбранной строке текст в блоке Verse отображается с серым фоном и отличный от блоков параграфа (Paragraph) шрифтом. Надеемся, что это будет усовершенствованно в будущих обновлениях редактора.

Текстовые колонки

Текстовые колонки позволяют добавлять любое количество встроенных текстовых блоков в ряд. Иным способом реализации могло бы было быть написание HTML и CSS с помощью текстового редактора или блока HTML.

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

Параметры форматирования текста ограничены жирным шрифтом, курсивом, зачеркиванием и ссылкой.

Кнопки

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

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

В настоящее время вы не можете изменить цвет текста с белого, однако в блочных вариантах есть текстовое поле ‘Additional CSS Class’ (дополнительный CSS-класс), поэтому вы можете создать простой стиль CSS, который определяет цвет.

Виджеты

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

Недавние записи

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

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

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

 

Категории

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

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

Этот блок поддерживает выравнивание, поэтому вы можете перемещать их левее, правее или по центру.

Шорткоды

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

Тестирование производительности Gutenberg

Настольный компьютер

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

Хотя новый редактор WordPress не имеет потоковой обработки текста, вы всё так же можете копировать и вставлять текст из документа Word и Gutenberg сделает необходимую работу по определению, где контент должен быть разделён. Протестировав редактор по умолчанию и Gutenberg путём вставки текста из документа Microsoft Word 2016 было выявлено, что оба редактора определили фрагмент одинаково и применили одно и то же форматирование. Было два различия в том, как вставленный текст обрабатывался:

  • В обоих редакторах текст, помеченный ‘Heading 1’ в Word, был определён, вместо этого, как отдельный параграф, ‘Heading 2’ был верно размещён как блок heading 2.
  • В Gutenberg цвет шрифта был правильно применён в заголовке и в параграфах, в то время как редактор WordPress по умолчанию не определил их вообще.
  • Один фрагмент в Word был выделен как ‘Intense Quote’ и он был преобразован в параграф в обоих редакторах. Изменение его на ‘Quote’ не дало эффекта определния как цитату.
  • Редактор по умолчанию определил разрыв строки, в то время как Gutenberg этого не сделал.

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

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

Мобильное устройство

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

Прежде всего, производительность отличная и каждая кнопка откликается сразу же. Была выбрана демонстрационная запись, создаваемая Gutenberg так как она достаточно длинная (881 слов), к тому же несколько изображений, встроенный контент и блоки. Контент загрузился моментально, в то время как редактор WordPress по умолчанию заметно зависал, когда первый раз загружал первую страницу для редактирования. Можно было спокойно прокручивать вверх и вниз, спокойно проходя встроенный контент из YouTube и Tweets на странице.

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

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

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

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

Удаление блока мгновенное, так же как и перемещение их вверх/вниз и не вызывает никаких проблем с общим внешним видом.

Отзывы

Пока что у Gutenberg различные отзывы и он получил скромные 2.4/5 звезды на WordPress.org. На момент написания было 74 отзыва с одной звёздочкой, и многие из них выражают одинаковые проблемы. Главная проблема заключается не в том, что далеко не каждому нужны блоки. Текущий редактор WordPress чрезвычайно гибкий и позволяет создавать сайты различных стилей, которые прекрасно соответствуют идее WordPress.

 

Заключение, За и Против

ЗаПротив
Упрощение процесса написанияBeta версия / не подходит для реальных сайтов
Помогает представить контент в виде блоковПлохие отзывы
Позволяет создавать сложные макеты без опыта и знанийПостоянные ошибки
Отображает актуальные инструменты, которыми можно воспользоваться
Позволяет быстрое встраивание контента с разных ресурсов

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

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

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

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

Работа с текстовым редактором WordPress

1563 Посещений

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

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

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

Для установки плагина, входите в админ панель и в разделе Плагины/Добавить новый вводите CKEditor. Далее, выбираете кнопку Установить и Активировать, чтобы запустить плагин в работу.

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

 

Даже визуально видно отличие в наличии разных инструментов.

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

А также присутствуют все те опции, что были в наличии во встроенном редакторе:

  • Формирование нумерованного или маркированного списков 
  • Работа со ссылками
  • Добавление тега more
  • Выравнивание текста по краям и центру, прочее.

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

Текстовой редактор WordPress | WordPress для всех

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

От автора

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

Текстовой редактор WordPress

Любой текстовой редактор отличается от редактора WiSiWyg (What You See Is What You Get) или редакторы типа Microsoft Word отсутствием визуального форматирования.

Например, если составить и оформить текст в Word, а потом перенести его в текстовой редактор «Блокнот Windows», то всё форматирование текста, будет отменено.

Такой же эффект будет, будет если ты вставишь отформатированный текст в визуальный редактор WordPress, через кнопку «Вставить как текст». Или выделишь оформленный текст и используешь кнопку «Очистить форматирование».

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

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

Обратите внимание, текстовой редактор показывает все теги HTML разметки, за исключением тегов «чистого» абзаца <p></p>. Их текстовой редактор WordPress поддерживает, но не показывает.

Кнопки текстового редактора

Текстовой редактор WP имеет свои быстрые кнопки. Расскажу для чего каждая из них.

-b (bold) выделение текста или букв;

-i (incline) наклон;

-link – добавление ссылки;

-b-quate – цитата;

-del – зачеркивает текст с проставлением даты зачеркивания;

-ins – подчеркивает текст с проставлением даты подчёркивания;

-img – откроет окно вставки картинки по URL;

-ul – оформление списка;

-ol – оформление списка;

-li – оформление списка;

-code – отличный тег, для окружения любого программного кода;

-more – тег для создания анонса статьи;

-закрыть теги. Должна закрывать все открытые теги.

Также, в текстовом редакторе работает кнопка добавления медиафайлов.

Вывод

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

©WPkupi.ru

Еще статьи

Похожие посты:

Текстовый редактор для WordPress

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

Самая главная особенность в том, что владея основами HTML, визуальный редактор вам может вообще не понадобиться. Любое оформление можно сделать в текстовом режиме и сделать горааааздо лучше! 🙂

Но! В визуальном режиме текст набирать в разы приятнее и быстрее. В текстовом же приходится постоянно вводить теги HTML для вёрстки текста, а в визуальном за вас это делает WordPress.

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

Например:

  • Изменить стиль конкретной ссылки, абзаца, слова.
  • Вставить скрипт со стороннего сайта.
  • Сделать форму подписки (при отсутствии плагина, например).
  • Добавить атрибут «nofollow» для ссылок.

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

Переключение в текстовый режим

Осуществляется очень просто — переключением в режим «Текст»:

Переключение редактора в текстовый режим

И всё, что выглядело красиво в визуальном режиме будет выглядеть вот так:

Внешний вид редактора в режиме Текст

Неподготовленный читатель может (и скорее всего) испугаться, но тут не так всё страшно, как кажется на первый взгляд. Выучив основы HTML вы без труда поймёте, что в приведённом скриншоте присутствует тег <ul>, который создаёт маркированный список. 🙂

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

Пример изменения тега в режиме Текст

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

Пример изменённого оформления

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

Панель инструментов

Так же не лишним будет обратить ваше внимание на то, что количество кнопок в панели инструментов заметно уменьшится:

Панель инструментов в текстовом режиме

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

Основная идея такова (лично моё мнение): если вы владеете HTML, то кнопки визуального редактора вам не пригодятся, т.к. вы всё то же можете сделать самостоятельно и гораздо быстрее и лучше.

На этом обзор текстового редактора считаю завершённым! 😉

Плагин для редактирования текста WordPress. Как редактировать текст на WordPress

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

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

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

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

Бесплатный курс «Основы создания тем WordPress»

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

Скачать курс

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

Как обычно, начинаем с поиска плагина.

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

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

Давайте взглянем на настройки плагина, они находятся в меню Настройки — TinyMCE Advanced.

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

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

Бесплатный курс «Основы создания тем WordPress»

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

Скачать курс

Хотите узнать, что необходимо для создания сайта?

Посмотрите видео и узнайте пошаговый план по созданию сайта с нуля!

Смотреть

6 лучших текстовых редакторов для разработчиков WordPress в 2020 году

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

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

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

Важность использования правильного текстового редактора для разработки WordPress

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

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

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

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

6 лучших текстовых редакторов для разработчиков WordPress в 2020 году

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

1. Атом

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

Atom — это редактор с открытым исходным кодом, которым вы можете пользоваться как новичку, так и опытному программисту. Он доступен для Windows, Mac и Linux.

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

  • «Пакеты» для расширения базовых функций редактора
  • Push- и pull-запросы через GitHub
  • Интеллектуальное автозаполнение
  • Браузер файловой системы
  • Функция поиска и замены
  • Редактирование и совместное использование в реальном времени
  • Несколько панелей для боковых панелей параллельное кодирование
  • Темы для улучшения внешнего вида редактора

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

2. Coda

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

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

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

  • Встроенный терминал и инспектор
  • Сенсорная панель
  • Вертикальные отступы и настраиваемые направляющие столбцов
  • Традиционные или визуальные вкладки с цветовой кодировкой
  • Локальная индексация для автозаполнения
  • Переопределение CSS для редактирования на рабочем сайте
  • ‘Паническая синхронизация ‘для сайтов, паролей и закрытых ключей
  • Сохранение, публикация и отслеживание удаленных файлов
  • Поддержка различных языков программирования

Вы можете купить копию последней версии Coda за 99 долларов или загрузить приложение iOS для четверть этой цены в Apple Store.С помощью редактора вы также получите доступ к основной поддержке клиентов и ресурсным материалам, таким как электронные книги.

3. Превосходный текст

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

Из текстовых редакторов в этом списке Sublime Text наиболее сопоставим с Atom. У них много общего как по внешнему виду, так и по характеристикам.

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

  • Редактирование с несколькими картами для одновременной вставки повторяющегося текста
  • Интерфейс API Python
  • Плагины и менеджер пакетов для дополнительной расширяемости
  • Разнообразные инструменты поиска и ярлыки, включая «GoTo Anything»

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

Если вы большой программист, стоит подумать о Sublime Text.Ярлыки могут ускорить ваш рабочий процесс, равно как и кроссплатформенные возможности.

Хотя вы можете скачать Sublime Text бесплатно, вы также можете приобрести его премиум-версию. Лицензия на одну копию — 80 долларов.

4. Кронштейны

Brackets — это бесплатный текстовый редактор от Adobe, который может быть особенно полезен, если вы разработчик WordPress начального уровня. Одна из вещей, которыми это решение с открытым исходным кодом наиболее известно, — это его функция «Live Preview».

Он имеет современный и простой интерфейс и обладает широким набором функций.К ним относятся:

  • Частичная интеграция с Photoshop и файлами PSD
  • Встроенные редакторы и упорядоченные файлы
  • Автоматические обновления
  • Подключение к GitHub через расширения
  • Инструменты визуального предварительного просмотра

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

5. Кодшеринг

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

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

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

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

6. Блокнот ++

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

Этот мощный текстовый редактор полностью бесплатен и поставляется с впечатляющим набором компонентов. Некоторые из функций включают:

  • Подсветка и сворачивание синтаксиса
  • Инструмент поиска и замены
  • Плагины для расширения и улучшения функциональных возможностей редактора
  • Настраиваемый пользовательский интерфейс
  • Multiview Editor
  • Автозаполнение и переключение нескольких документов

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

Заключение

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

В этом посте мы обсудили шесть лучших текстовых редакторов для разработчиков WordPress, в том числе:

  1. Atom: идеально подходит для совместной работы и простой интеграции с GitHub.
  2. Coda: текстовый редактор только для Mac с уникальными расширенными функциями.
  3. Sublime Text: популярный редактор, поддерживающий широкий спектр языков программирования и разметки.
  4. Скобки: для дизайнеров, которые хотят интегрировать свой текстовый редактор с продуктами Adobe Creative Cloud.
  5. Codeshare: лучше всего подходит для совместных разработчиков, которым требуется относительно простой опыт редактирования.
  6. Notepad ++: текстовый редактор только для Windows, удобный для начинающих.

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

Топ-5 плагинов для текстового редактора WordPress 2021

Каждый технический специалист знает о визуальном текстовом редакторе WordPress по умолчанию.

В WordPress есть два раздела «Визуальный» и «Текстовый».

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

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

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

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

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

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


Плагин

WP Quick Front-end Editor для WordPress — это самый быстрый и мощный онлайн-редактор WYSIWYG (то, что вы видите, то и интерфейс). Этот плагин предоставляет вам простой в использовании интерфейс текстового редактора.

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



Стоимость

Этот плагин текстового редактора обойдется вам в 26 долларов.

Дополнительные функции

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

Нажмите здесь, чтобы узнать подробнее


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

Кроме того, плагин добавляет некоторые другие функции, такие как сохранение тегов para

в текстовом редакторе и импорт классов CSS из стиля темы.css файл.



Без сборов

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

Дополнительные функции

  • Плагин позволяет добавлять меню TinyMCE на панель инструментов, что делает редактор еще более мощным.
  • Обеспечивает 100% безопасность. Поскольку этот плагин не хранит и не собирает какие-либо пользовательские данные.
  • Вы можете перетащить неиспользуемые кнопки с панели инструментов.Кроме того, вы также можете вернуть его, когда вам понадобится кнопка, просто перетащив ее.
  • Он имеет встроенную программу проверки доступности, которая гарантирует, что ваш контент будет доступен для чтения тысячам читателей.
  • Плагин никоим образом не влияет на соблюдение вашим сайтом закона о конфиденциальности.

Нажмите здесь, чтобы узнать подробнее


Ultimate Blocks — это плагин Gutenberg, который помогает вам добавлять больше блоков в недавний редактор Gutenberg.

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

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



Бесплатно

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

Дополнительные функции

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

Нажмите здесь, чтобы узнать подробнее


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

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



Нет затрат

Загрузите этот плагин бесплатно с официального сайта WordPress.

Дополнительные функции

  • Вы можете выбрать нужные кнопки на странице настроек, и они будут доступны в редакторе TinyMCE.
  • Позволяет добавлять кнопки верхнего и нижнего индекса.
  • Этот плагин хорошо работает со всеми темами WordPress.
  • Он также позволяет добавить кнопку пустого документа.

Нажмите здесь, чтобы узнать подробнее


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

Кроме того, этот плагин поставляется с инструментами для экономии времени, такими как диспетчер таблиц, диспетчер файлов, диспетчер столбцов и так далее.

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



Бесплатно

Этот плагин доступен бесплатно.

Дополнительные функции

  • Он поставляется со встроенным менеджером маркеров, поэтому создайте свой список маркеров с помощью значков.
  • Этот плагин имеет расширенную версию codemirror (окрашивание кода).
  • Обладает потрясающей функциональностью поиска и замены кода.
  • Вы также можете создавать кнопки с помощью встроенного диспетчера кнопок.
  • Создавайте и настраивайте макеты столбцов с помощью диспетчера столбцов без кода HTML.

Нажмите здесь, чтобы узнать подробнее


Последние мысли

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

Уже пробовали эти плагины текстового редактора WordPress?

Тогда не стесняйтесь поделиться своим опытом использования этих плагинов.

Вам также может понравиться —

Как использовать текстовый редактор WordPress

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

Источник изображения: EgoAltere — Pixabay.com / Лицензия: CC0 Public Domain

Как использовать текстовый редактор WordPress для написания сообщений и статей

Начало работы — Структура текстового редактора WP

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

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

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

Используя визуальный режим, вы можете очень легко форматировать текст, используя значки панели инструментов, не требуя знания HTML.Кроме того, вы можете изменить панель инструментов в визуальном режиме, щелкнув квадратную кнопку Toggle Toolbar справа, чтобы увидеть больше или меньше значков параметров форматирования. Вы также можете использовать Режим письма без отвлечения внимания , щелкнув значок под вкладками Визуальный / Текст.

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

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

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

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

Плагины для улучшения текстового редактора WordPress

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

* Краткие сведения о написании и публикации сообщений *

Как писать сообщения в WordPress? Чтобы начать писать новый пост в WordPress, перейдите к Сообщений на панели инструментов WordPress и нажмите Добавить новый . Теперь появится текстовый редактор WordPress, и вы сможете сразу же начать писать. Как сохранить мои сочинения? Пока вы пишете статью, WordPress регулярно автоматически сохраняет ваш контент.Мы по-прежнему рекомендуем вам регулярно нажимать кнопку Save Draft , чтобы действительно убедиться, что все сохранено.

Источник изображения: kaboompics — Pixabay.com / Лицензия: CC0 Public Domain

А как насчет категорий, тегов или изображений? Вы должны выбрать категорию для каждого сообщения, которое вы пишете. Вставка изображений в WordPress может быть сделана довольно интуитивно понятным и не требующим пояснений способом. Добавление тегов может помочь сгруппировать ваш контент. Как публиковать статьи / посты? Чтобы опубликовать статью, просто нажмите кнопку Опубликовать .Чтобы внести изменения впоследствии, вы все равно можете изменить свое сообщение в любое время и нажать кнопку Обновить , чтобы обновить свои сообщения.

9 плагинов редактора WordPress — для простого редактирования данных WordPress

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

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

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

Черный Studio TinyMCE

Это один из лучших плагинов для редактора wysiwyg WordPress, которые в настоящее время доступны в репозитории WordPress.Вы сможете без проблем вставлять форматированный текст и медиа-объекты на свою боковую панель. Black studio TineMCE позволяет редактировать виджеты в режиме WYSIWYG без использования встроенного редактора TinyMCE WordPress.

Black Studio TinyMCE позволяет полностью переключаться между режимом HTML и визуальным режимом. Вам не требуются какие-либо знания HTML, чтобы добавлять в текст форматирование и мультимедиа / изображения. Вы можете двигаться дальше и использовать медиафайлы из медиабиблиотеки WordPress.

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

Плюсы

  • Полнофункциональный визуальный редактор TinyMCE.
  • Поддерживает полноэкранное редактирование.
  • Перевод доступен на 20+ языков.
  • Он может редактировать виджеты с форматированным текстом через визуальный редактор.

Минусы

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

Классический редактор

Classic editor — официальный плагин команды WordPress, восстанавливающий классический редактор WordPress. В новом WordPress 5 редактором по умолчанию является Gutenburg. Гутенберг может быть не тем редактором, которого вы ищете. Этот плагин скроет всю функциональность редактора блоков Gutenberg , и вы сможете создать свой пост старым классическим способом.

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

Этот официальный плагин WordPress будет полностью поддерживаться и поддерживаться до 2022 года или столько, сколько потребуется.

Плюсы

  • Восстанавливает старый классический редактор.
  • Никакой сложности.

Минусы

  • Поставляется со всеми ограничениями, которые есть в классическом редакторе WordPress.

WP Smart Editor

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

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

Плюсов:

  • Несколько инструментов для экономии времени.
  • Создание неограниченного профиля пользователя.
  • Совместимость со сторонней интеграцией.

Минусы:

  • Pro версия не предоставляет много возможностей.

TinyMCE Advanced

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

С TinyMCE Advanced вы сможете выполнять расширенное форматирование с панели инструментов. Это позволяет:

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

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

Плюсов:

  • Расширенные параметры форматирования.

Минусы:

  • Иногда выдает ошибки типа 403 и 500.
  • Не поддерживает встроенный CSS.

Подсветка синтаксиса для HTML-редактора сообщений / страниц

Если вам скучно или у вас проблемы с редактором, попробуйте переключиться на подсветку синтаксиса. Это простой в использовании плагин WordPress, который заменит ваш стандартный редактор сообщений и текста страницы / HTML расширенным редактором.Стандартный текстовый / HTML-редактор WordPress для записей и страниц — отличный, но ограниченный.

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

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

Плюсов:

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

Минусы:

  • Не обеспечивает подсветку синтаксиса для редактора тем / плагинов.

WP Githuber MD — редактор разметки WordPress

Wp Githuber MD — это универсальный плагин для разметки WordPress, который предоставляет множество функций, таких как редактор разметки, вставка изображений, помощник по разметке HTML, предварительный просмотр в реальном времени и многое другое.Он позволяет конвертировать HTML в уценку, просто используя инструмент HTML в Markdown.

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

Плюсов:

  • HTML to Markdown helper
  • Поддержка Gutenberg
  • Копирование и вставка изображений
  • Подсветка синтаксиса

Минусы:

  • Для этого плагина нет премиум-версии.

Редактор Htaccess

Легко редактируйте файл .htaccess вашего сайта из администратора WP с помощью редактора WP Htaccess. Он предоставляет вам безопасный, простой и быстрый способ редактирования файла .htaccess с автоматическим резервным копированием. Вы можете восстановить эту резервную копию через FTP или непосредственно из плагина в случае возникновения какой-либо аварии.

Вы можете найти резервные копии в папке ‘/ wp-content / htaccess-editor backups /’. Этот редактор полностью совместим и протестирован с сетью WP (WPMU). Он отображается в меню настроек администратора сети.

Плюсов:

  • Автоматическое резервное копирование файлов.
  • Простое и безопасное редактирование файла .htaccess.
  • Сеть WP (WPMU) Поддержка

Минусы:

Редактор тем

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

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

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

Плюсов:

  • Зеркальное отображение кода
  • Редактировать файлы тем и плагинов
  • Fancy box

Минусы:

  • Без автозавершения
  • Без выделения синтаксиса

Ultimate Blocks

Редактор

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

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

Плагин Ultimate Blocks содержит 17 потрясающих блоков, которые помогут вам расширить функциональность редактора Гутенберга и получить от него максимальную отдачу.

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

Плюсов:

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

Минусы:

  • Этот плагин предназначен только для редактора Gutenberg. Вы не можете использовать его в классическом редакторе.

Выбор плагина редактора WordPress

Если вам не нравится встроенный редактор tinyMCE для WordPress — выбирайте Black studio TinyMCE.

Если вы хотите расширить визуальный редактор WordPress — используйте TinyMCE Advanced.

Если вы ищете хороший редактор файлов темы — Используйте редактор тем.

Если вы ищете лучший редактор уценки — воспользуйтесь редактором уценки WP Githuber MD.

Заключение

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

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

17 лучших текстовых редакторов для разработки WordPress в 2017 году

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

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

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

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

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

Лучшие текстовые редакторы для разработчиков WordPress

Когда вы просматриваете варианты ниже, вы должны обратить внимание на некоторые ключевые особенности:

  • Простой в использовании пользовательский интерфейс — Убедитесь, что вы выбрали эффективный редактор.
  • Контроль версий — Возможность просматривать или откатывать историю документа.
  • Поддержка необходимых языков программирования — Выбранный вами текстовый редактор должен поддерживать HTML, CSS, JavaScript и PHP, чтобы использовать его для разработки WordPress.
  • Подсветка синтаксиса — Структура и синтаксис автоматически отображаются разными цветами для более эффективного понимания, чтения и редактирования кода.
  • Автозаполнение — Многие текстовые редакторы могут распознавать синтаксис, который вы собираетесь или начали вводить, и могут включать их автоматически, чтобы сэкономить время.
  • Загрузка по FTP — Возможность напрямую загружать файлы вашего сайта WordPress через FTP может сэкономить ваше время, вместо того, чтобы загружать их по отдельности в редактор после загрузки с вашего сайта.
  • Найдите и замените — Вместо того, чтобы тратить время на сканирование кода вручную, вы можете найти что-либо в коде и заменить его в несколько щелчков мышью.
  • Ваш бюджет — Некоторые из текстовых редакторов, представленных ниже, имеют открытый исходный код и бесплатны, в то время как другие представляют собой дополнительные опции по разной цене.При сравнении этих текстовых редакторов и функций учитывайте свой бюджет.

Имея все это в виду, вот лучшие текстовые редакторы для редактирования кода и для WordPress в алфавитном порядке.

Обратите внимание: цены и другие аналогичные данные для текстовых редакторов ниже верны на момент их написания.

  • Aptana Studio 3 — это инструмент для разработки и текстовый редактор, с помощью которого вы можете разрабатывать и тестировать свои веб-проекты.

    Он поддерживает HTML5, CSS3, JavaScript, Ruby, PHP и Python.Он имеет встроенный инструмент отладки, встроенный терминал, а также интеграцию с Git.

    Aptana Studio 3 также:

    • Бесплатно с открытым исходным кодом
    • Доступно для Mac OS X (или новее), Windows и Linux
    • Не установлен сертификат SSL
  • Atom — это чрезвычайно настраиваемый текстовый редактор, но он отлично работает прямо из коробки.

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

    Атом — это также:

    • Бесплатно с открытым исходным кодом
    • Доступно для Mac OS X (или новее), Windows и Linux
  • BBEdit — это самопровозглашенный текстовый редактор, который «не отстой». Он создан для обеспечения высокой производительности и эффективности.

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

    BB Редактировать также:

    • Имеет бесплатную пробную версию
    • Его цена 49,99 доллара США
    • Доступно для Mac OS X (версия 10.9.5 или новее)
  • Brackets был разработан для веб-дизайнеров и разработчиков интерфейса. Он имеет визуальные инструменты, включенные в редактор, чтобы помочь творческим аспектам кодирования для дизайна.

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

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

    Кронштейнов также является:

    • Бесплатно с открытым исходным кодом
    • Доступно для Mac, Windows и Linux (Debian / Ubuntu)
    • Имеет сертификат SSL с истекшим сроком действия на момент написания этой статьи.
  • Coda 2 — это надежный текстовый редактор, который включает в себя гигантский набор функций, включая выделение синтаксиса, автозаполнение, поиск и замену, навигатор кода, руководства по отступам, валидатор HTML, автоматическое закрытие тегов, быстрое комментирование и даже возможность открывать файлы локально или удаленно через FTP, SFTP, WebDAV или Amazon S3.

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

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

    Coda 2 — это также:

    • По цене 99 долларов
    • Доступно для Mac OS X 10.9.5 (или новее) и iOS
  • Codeanywhere — это облачный текстовый редактор, доступ к которому осуществляется из браузера. Вы также можете поделиться своим кодом со ссылкой и сотрудничать в режиме реального времени.

    Он имеет встроенный терминал, поэтому вы можете подключиться к удаленному серверу и MySQL. Вы также можете получить доступ к своим файлам и редактировать их удаленно через FTP, SFTP, Dropbox и Google Drive.

    Он также поддерживает множество функций, таких как выделение синтаксиса, автозаполнение, линтинг для JavaScript и CSS, а также несколько макетов, курсоров и цветовых схем.Он также совместим с HTML, CSS, JavaScript, PHP и 71 другим языком программирования.

    Код

    , где также есть:

    • Бесплатно для базового аккаунта
    • Возможность обновления с премиальной ежемесячной или годовой подпиской по цене от 2 долларов в месяц (оплата ежегодно), или 3 долларов в месяц, и 40 долларов в месяц (оплата ежегодно) или 50 долларов в месяц.
    • Совместим со всеми основными браузерами, а также с iOS и Android.
  • CodeRunner 2 имеет простой и понятный интерфейс и множество замечательных функций, включая автозаполнение на уровне IDE, нечеткий поиск, заполнители с возможностью выбора табуляции, вы также можете устанавливать точки останова и отлаживать код с помощью команд.

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

    CodeRunner 2 — это также:

    • Бесплатно с пробной версией
    • Возможность обновления до премиум-версии за 14,99 долл. США
    • Доступно для Mac
  • ICEcoder — это текстовый редактор на основе браузера, который работает как онлайн, так и офлайн, и вы также можете использовать его локально.

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

    ICEcoder также:

    • Имеет бесплатную пробную версию
    • Премиум-версия за 10 долларов
    • Mac, Windows, Linux и все основные браузеры
  • Komodo Edit имеет множество расширенных функций, но это не значит, что его пользовательский интерфейс сложен. На самом деле это довольно просто с множеством удобных функций, включая автозаполнение, менеджер проектов, подсветку синтаксиса и средство просмотра уценки.

    Вы также можете настроить редактор с различными скинами и значками.

    Komodo Edit также:

    • Бесплатно
    • Доступно для Mac, Windows и Linux
  • Light Table имеет минималистичный подход к редактору, но у него есть множество функций, таких как встроенная проверка кода, подсветка синтаксиса, нечеткий поиск, часы, а также вы можете встроить все, что захотите, включая графики и игры.

    Он также легко настраивается с огромным списком расширений.

    Световой стол — это еще:

    • Бесплатно с открытым исходным кодом
    • Доступно в Mac OS X, Windows и Linux
    • Не установлен активный сертификат SSL
  • NetBeans — это специальная среда программирования PHP, которая также поддерживает HTML5, CSS3 и JavaScript.

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

    NetBeans — это также:

    • Бесплатно с открытым исходным кодом
    • Доступно для Mac OS X, Windows и Linux
  • Notepad ++ был разработан, чтобы быть сверхлегким, оптимизированным по производительности и потребляющим меньше ресурсов процессора, чем у большинства других редакторов, чтобы уменьшить ваш углеродный след.

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

    Notepad ++ — это также:

    • Бесплатно с открытым исходным кодом
    • Доступно для Windows
  • PhpStorm был разработан, чтобы действительно хорошо работать с WordPress. Это текстовый редактор, созданный с учетом последних достижений интерфейсной разработки. Он поддерживает HTML5, CSS, Sass, Less, Stylus, CoffeeScript, TypeScript, Emmet и JavaScript.

    Он также включает такие функции, как рефакторинг, отладка, модульное тестирование, предварительный просмотр в реальном времени, контроль версий и инструменты командной строки.Он также поддерживает MySQL, Vagrant, Composer, REST Client и аналогичные инструменты.

    PhpStorm также:

    • Имеет бесплатную 30-дневную пробную версию
    • Может быть обновлен после пробной версии до премиум-версии за 199 долларов в первый год, затем за 159 долларов за второй и 119 долларов за третий год и каждый год после этого
  • Sublime Text имеет множество довольно уникальных функций, которые выделяют его среди многих других текстовых редакторов в этом списке. У него есть опция «Goto Anything», которая позволяет вам перейти к любой строке, слову или символу в вашем файле с помощью одной команды.

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

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

    Sublime Text также имеет:

    • Бесплатная пробная версия
    • Премиум-версия за 70 долларов и
    • Доступен для Mac OS X, Windows и Linux.
    • Кроме того, одна лицензия распространяется на все ваши устройства в разных операционных системах
  • UltraEdit фокусируется на максимальной эффективности редактирования списков и столбцов с помощью редактирования с несколькими картами, редактирования блоков и множественного выбора.

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

    UltraEdit также имеет:

    • Бесплатная пробная версия
    • Премиум-версия за 99,95 долларов США или годовая подписка за 79,95 долларов США в год с доступом к дополнительному сопутствующему программному обеспечению и
    • Доступен для Mac, Windows и Linux.
    • Лицензия также распространяется на три машины
  • Visual Studio Code имеет простой в использовании интерфейс.Его функции включают подсветку синтаксиса и автозаполнение, которые выходят за рамки большинства других текстовых редакторов, поскольку эти функции работают на основе типов переменных, определений функций и импортированных модулей.

    Он также имеет возможность отладки и встроенные команды Git. Он легко настраивается с множеством доступных расширений. Он также поддерживает множество языков, включая HTML, CSS, Sass, Less, JavaScript, JSON, PHP, XML, CoffeeScript, TypeScript, Perl, Ruby, SQL и многие другие.

    Код Visual Studio также:

    • Бесплатно с открытым исходным кодом
    • Доступно для Mac 10.9 (или новее), Windows 7, 8 и 10 и Linux (Debian, Ubuntu, Red Hat, Fedora и CentOS)
  • WeBuilder имеет огромное количество встроенных функций, а также отличается гибкостью. Этот текстовый редактор поддерживает HTML, CSS, Sass, Less, JavaScript, PHP, Ruby, Python, ASP, Perl и многие другие языки.

    Его множество функций включает подсветку синтаксиса, менеджер проектов, отладку PHP, проверку HTML, линтинг, автозаполнение, предварительный просмотр одним щелчком мыши, интеграцию SVN и Git, а также поддержку FTP и SFTP.Это даже не полный список доступных встроенных функций.

    WeBuilder также имеет:

    • Бесплатная пробная версия
    • Премиум-версия за 49,95 долларов и
    • Доступен для Windows XP, Vista, 7, 8 и 10.

Завершение

Вот и все: лучшие и самые популярные текстовые редакторы для разработки WordPress.

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

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