Как подчеркнуть текст в wordpress

Форматирование текстов WordPress в статьях, страницах, виджетах

От автора

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

Форматирование текстов

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

На WordPress оформить текст можно обоими способами. Работают, как теги HTML разметки, так и кнопки редактора.

Кнопки визуального редактора

По умолчанию, в визуальный редактор WordPress добавлено 9 кнопок форматирования текстов. Кнопки расположены в два ряда. Нижний (второй) ряд кнопок по-умолчанию скрыт.

Как подчеркнуть текст в wordpress

Форматирование текстов WordPress в статьях

Чтобы начать форматирование статьи (поста) WordPress, зайди на вкладку Записи >>Добавить новую или Записи>>Опубликованные >>Все сообщения и выбери пост, который ты хочешь отредактировать.

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

Как подчеркнуть текст в wordpress

Все кнопки подписаны.

Как подчеркнуть текст в wordpress

Первый ряд кнопок

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

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

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

Значок кавычки является блоком цитаты. По умолчанию это добавит отступы, и текст будет выделен курсивом.

Примечание: твоя тема WordPress может менять внешний вид цитаты.

Далее кнопки параметров выравнивания текста. Ты можешь выбрать выравнивание влево, по центру или выровнять по правому краю.

Кнопка ссылка, позволяет быстро создать ссылку.

Как подчеркнуть текст в wordpress

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

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

Второй ряд кнопок редактора

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

Добавить в текст, стили заголовка H1–H6: Просто выделить заголовок и нажать стиль заголовка h1-h6.

Как подчеркнуть текст в wordpress

Подчеркнуть текст: выделить текст и подчеркнуть его.

Изменить цвет выбранного текста: Выделяете текст и меняете его цвет.

Как подчеркнуть текст в wordpress

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

Далее значок в виде ластика. Называется «Очистить форматирование». Этой кнопкой ты можешь очистить формат Word выделенного фрагмента текста.

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

Как подчеркнуть текст в wordpress

Как подчеркнуть текст в wordpress

Уменьшить отступ: Двигает выделенный текст влево.

Увеличить отступ: Двигает выделенный текст вправо.

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

Отменить команду вперед: То же, только вперёд.

Горячие клавиши (знак вопроса): Здесь справочная таблица горячих клавиш визуального редактора. На рисунке полная шпаргалка по горячим клавишам WordPress редактора.

Как подчеркнуть текст в wordpress

Оформление текстов WordPress на страницах

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

Редактор страниц не отличается от редактора записей.

Форматирование виджетов

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

Как подчеркнуть текст в wordpress форматирование текстов WordPress в виджетах

Очистить форматирование текстов WordPress

Я никогда не использую редактор сайта для создания текстов. Это создаёт много мусора (резервные копии сохраняются каждые 5 минут) и лишний раз нагружается сервер. Для подготовки текстов разумно использовать программы для работы с документами типа «Microsoft Office». Они удобны, но добавляют в код текста свои элементы форматирования, а некоторые редакторы свои классы.

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

Как подчеркнуть текст в wordpress

Левая с «портфелем» называется «вставить, как текст», вторая с «ластиком» называется «Очистить форматирование».

Работают они очень просто, но по разному:

Вывод

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

Источник

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

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

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

За форматирование текста отвечают стандартные теги HTML:

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

Шаг 1. Прописываем параметры CSS

Откройте свой файл стилей (style.css, css.css, screen.css и прочее) и добавьте в самый конец такое:

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

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

Шаг 2. Добавляем свои кнопки в панель форматирования текста

Теперь мы добавим новые кнопки в панель форматирования текста в админке вашего сайта на WordPress. Выглядеть это будет вот так:

Как подчеркнуть текст в wordpress

Как видно с картинки, у меня в режиме HTML добавилось 3 новых кнопки. Именно на них я «подвесил» созданные span с нужными классами (strong, italic и underline).

Если ранее ни разу не делали для этого файла UTF-8 без BOM (чтобы русский был буквами, а не иероглифами), то при помощи бесплатной программы Notepad++ сделайте это:

Как подчеркнуть текст в wordpress

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

Послесловие

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

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

Все. Креативим и делимся результатом.

Как подчеркнуть текст в wordpress

Как подчеркнуть текст в wordpress

Привет. Я автор этого блога и ридера вебмастеров/SEO-специалистов WMSN.ru

Можешь оставить свой вопрос в комментариях к статье или предложить идею для новой статьи. Не стесняйся.

Источник

Как добавить кнопки подчеркивания и выравнивания текста в WordPress

Главное меню » Блог-платформа wordpress » Плагины для WordPress » Как добавить кнопки подчеркивания и выравнивания текста в WordPress

Как подчеркнуть текст в wordpress

Метод 1: Использование плагина Re-add Text Underline and Justify

Первое, что вам нужно сделать, это установить и активировать плагин Re-add Text Underline and Justify. Для получения более подробной информации см наш шаг за шагом руководство о том, как установить плагин в WordPress.

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

Как подчеркнуть текст в wordpress

Плагин поставляется с двумя вариантами на выбор.

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

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

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

Теперь вы можете посетить страницу Записи » Добавить новую, и вы увидите, кнопки подчеркивания и выравнивания текста, добавленные обратно в редактор.

Как подчеркнуть текст в wordpress

Способ 2: Плагин TinyMCE Advanced

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

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

После активации, вам необходимо посетить страницу Настройки »TinyMCE Advanced для настройки параметров плагина.

Как подчеркнуть текст в wordpress

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

Теперь вам нужно перетащить кнопки подчеркивание и выравнивание текста из коробки “неиспользуемыми кнопки” в редактор.

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

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

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Источник

Как добавить кнопки подчеркивания и выравнивания текста по центру в WordPress

Опубликовано: ADv Дата 14.06.2017 в рубрике Плагины WP Комментировать

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

Как подчеркнуть текст в wordpress

Способ 1: Используем плагин Re-add Text Underline and Justify

Первым делом вам потребуется установить и активировать плагин Re-add Text Underline and Justify.

После активации переходим на страницу Настройки » Написание для конфигурации настроек плагина.

Как подчеркнуть текст в wordpress

У плагина есть две опции на выбор.

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

Или же, вы можете выбрать передобавление кнопок. Эта опция вернет пропавшие элементы в то же место, в каком они находились до WordPress 4.7.

Не забудьте нажать на кнопку сохранения изменений.

Теперь переходим на страницу Записи » Добавить новую и вы вновь обнаружите исчезнувшие кнопки в редакторе записей.

Как подчеркнуть текст в wordpress

Current Version: 0.3

Last Updated: 14.11.2019

Способ 2: Плагин TinyMCE Advanced

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

Дня начала вам потребуется установить и активировать плагин TinyMCE Advanced.

После активации переходим на страницу Настройки » TinyMCE Advanced для настройки плагина.

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

Теперь вам нужно перетянуть кнопки подчеркивания и выравнивания текста по центру из блока ‘Unused Buttons’ в редактор записей.

Не забудьте нажать на кнопку сохранения изменений.

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

Мы надеемся, что эта статья помогла вам научиться добавлять кнопки подчеркивания и выравнивания текста по центру в WordPress.

Источник

Перечёркнутый подчёркнутый текст CSS изменить сайт WordPress

Установить плагин SiteOrigin CSS вы сможете прямо из админ-панели WordPress. Перейдите на страницу: Плагины — Добавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

Как подчеркнуть текст в wordpress

После установки и активации плагина, перейдите на страницу: Внешний вид — Custom CSS. На странице плагина, вверху справа нажмите на кнопку в виде одного глазика.

Как подчеркнуть текст в wordpress

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

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

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

Как подчеркнуть текст в wordpress

Как подчеркнуть текст в wordpress

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *