WordPress выравнивание текста по ширине: Выравнивание текста по ширине WordPress – Как выровнять текст по ширине

Содержание

Почему убрали выравнивание текста по ширине?

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

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

PS все эти кнопки легко возвращаются кодом или плагинами.

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

Нужно же какой-то компромисс иметь…

Модератор SeVlad

(@sevlad)

wp.me/3YHjQ

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

Это стилями делается.
Как раз поэтому и НЕ нужно производить форматирование в контенте.

ЗЫ. Я считаю, что по ширине правильно, что нет (ещё бы от другого форматирования текста отучили юзеров). А вот удаление подчёркивания — реально бред.

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

не ошиблись? может все-таки по левому краю то?

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

ЗЫ. Я считаю, что по ширине правильно, что нет (ещё бы от другого форматирования текста отучили юзеров). А вот удаление подчёркивания — реально бред.

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

Модератор SeVlad

(@sevlad)

wp.me/3YHjQ

разное выравнивание в разных абзацах.

Вот чего не хватает (и я это добавляю когда нужно), так это div/span-ов с назначаемыми стилями.

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

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

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

АПД. Да, есть же разные плагины, которые стилевое оформление делают с пом шорткодов. Я небольшой сторонник таких методов (лучше html, как я вначале написал), но это хотя бы позволяет быстро и просто изменить/удалить это дело.

  • Ответ изменён 2 года, 8 месяцев назад пользователем SeVlad. Причина: Добавка

не ошиблись? может все-таки по левому краю то?

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

Да-да, по левому. Не подскажите, как это делать в стилях? Буду признателен.

Модератор SeVlad

(@sevlad)

wp.me/3YHjQ

Не подскажите, как это делать в стилях?

Как-то так:
.content { text-align: left; }

Как-то так:
.content { text-align: left; }

Нет-нет. Это я знаю. Речь шла о том, как с помощью стилей для мобильной версии сайта сделать выравнивание по левому краю , а для обычной версии по ширине?

как-то так

@media (max-width: 640px) {
.content { text-align: left; }
}

@media (max-width: 640px) {
.content { text-align: left; }
}

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

Модератор Denis Yanchevskiy

(@denisco)

WordPress-разработчик, wpcute.ru

Это получается современные стили стали практически как джава скрипты, коли умеют подобное!

Они и в переменные умеют, ежели захочется.

Модератор SeVlad

(@sevlad)

wp.me/3YHjQ

Они и в переменные умеют, ежели захочется.

И даже считать местами 🙂

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

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

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

Не так давно, перед блогерами возник вопрос, как сделать выравнивание текста по ширине в WordPress.После обновления до версии 4,7 — эта функция исчезла из панели визуального редактора.

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


Способы выравнивания текста


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

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

Выравнивание текста в html-коде

Вариант для тех, кто никуда не спешит и знаком с понятием html. Делаем выравнивание с помощью параметра align. В визуальном редакторе переходим на вкладку «Текст», где представлен html-код статьи. Помещаем абзац или весь текст в тег <p>или<div>. Выглядит это так:

<p style=»text-align: justify;»>текст</p>

Обязательно нажмите «Обновить».

При использовании тега <p> в начале и в конце абзаца появляется вертикальный отступ, его нет при применении тега <div>.

Автоматическое выравнивание

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

В панели управления WordPress находим «Внешний вид»⇒ «Редактор»⇒ «Таблица стилей» (style.css).В этом файле необходимо вставить правило: p {text-align:justify;}, для того, чтобы наш текст выравнивался по ширине. Сначала надо найти место, куда именно поместить данный код. Ищем букву р и вставляем в фигурные скобки text-align: justify;

Vyravnivanie-po-shirine

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

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

Самый простой способ выравнивания текста

Здесь вам ненужно особых знаний и навыков. Делается, до безобразия, просто. Идёте в визуальный редактор, выделяете написанный текст и нажимаете три клавиши «Alt + Shift + J». Всё, ваш текст выровнен.

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

Благодарю вас за то, что поделились статьей в социальных сетях!

Похожие статьи

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

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

Стандартный визуальный редактор WordPress

Добавляем подчеркивание и выравнивание по ширине

Способ 1. Плагин Re-Add Text Underline And Justify

С этой задачей хорошо справляется бесплатный плагин Re-add text underline and justify. Для начала его нужно установить и активировать, после чего в админ-панели перейти Настройки -> Написание для конфигурирования настроек плагина.

Страница настроек чтения

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

Визуальный редактор WordPress

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

Визуальный редактор WordPress

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

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

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

Страница настроек плагина TinyMCE Advanced

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

Страница настроек плагина TinyMCE Advanced

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

Визуальный редактор WordPress

Курс WordPress-разработчик

Если Вам понравилась статья — поделитесь с друзьями

Курс WordPress-разработчик

Михаил Петров

Привет! Меня зовут Михаил Петров. Я копирайтер и занимаюсь этим с 2013 года. Скрупулезность и ответственность — моя фишка! Не могу делать как попало и добиваюсь, чтоб заказчик сказал минимум “неплохо”. За все время своей работы пришлось написать и отредактировать немало разной “текстовухи”, включая SEO-тексты, отзывы и прочую чушь. На сегодняшний день специализируюсь на написании информационных статей и руководств технического направления. Вижу смысл и светлое будущее в текстах для людей, а не для машин.

WordPress выравнивание текста по ширине. Как выровнять текст? • Блог вебмастера

google reviewsgoogle reviews

Реклама, маркетинг 139

Ранее был озабочен сам лично данной проблемой. Дело в том, что годами отзывы google

Обновление CMS сайта: зачем это нужноОбновление CMS сайта: зачем это нужно

Создание сайтов 126

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

Бесплатные шаблоны WordPressБесплатные шаблоны WordPress

CMS wordpress 85

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

Галерея для wordpressГалерея для wordpress

CMS wordpress 98

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

Добавляет «подчёркивание» и «выравнивание по ширине» — Плагин для WordPress

This tiny plugin re-adds the Editor text underline & text justify buttons in the WYSIWYG removed in WordPress 4.7. It works well with the Classic Editor plugin, Advanced Custom Fields (Free & Pro) and is also compatible with the Gutenberg’s «Classic» bloc.

В WordPress 4.7, группа разработчиков ядра решила внести различные изменения в редакторе (TinyMCE WYSIWYG), включая удаление кнопок «подчеркивание» и «выравниваение по ширине» и перегруппировки некоторых кнопок панели инструментов.
Если вы не хотите менять способ редактирования своего контента, и / или не хотите запутать своих клиентов с новым интерфейсом, это очень легкий плагин установит стиль редактирования назад к своему предыдущему состоянию (как и в WordPress 4.6 и выше версии).

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

3 options are available for the Editor style:

  • Without underline & justify buttons
  • Default — Re-add underline & justify buttons
  • Re-add justify only

Please note, the previous option «Re-add underline & justify + rearrange» has been deprecated in 0.2 (sept. 2018) as it causes conflicts with the new Gutenberg editor. This option automatically switches to «Re-add underline & justify buttons» from now on.

DOCUMENTATION

CHECK OUT MY OTHER PLUGINS

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

  1. Загрузите и активируйте плагин (или установите его с помощью консоли администратора WP)
  2. Это всё, готово к использованию!
  3. If you wan’t to change the default parameter, go to Settings -> Writing and select the option you want under «Editor style».
Где я могу изменить стиль редактора?

Просто зайдите в Настройки -> Написание и выберите нужный вариант в разделе «Стиль редактора».

«Добавляет «подчёркивание» и «выравнивание по ширине»» — проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:

Участники
0.3 — 14/11/2019
  • Tested on WP 5.3 with success!
  • Change default option to «Re-add underline & justify buttons» on plugin activation
0.2 — 09/04/2018
  • Tested on WP 4.9.8 with success!
  • Added support for Gutenberg for its «Classic» bloc only.
  • Remove option 3 «Re-add underline & justify + rearrange» (depracated)
0.1.4 — 03/31/2017
  • Tested on WP 4.7.3 with success!
  • Fix broken links in plugins meta
0.1.3 — 01/14/2016
  • Added the fourth option to only re-add justify button (push methode)
  • Push non standard button to the end of the buttons lines for the third option. This prevents from removing extra buttons added by other plugins.
  • Fix for ACF (free) on the second option
0.1.2 — 11/14/2016
  • Changes MCE button hook priority to prevent errors with other plugins adding extra buttons.
0.1.1 — 11/10/2016
  • Fixes an issue hidding Editor content.
0.1 — 11/06/2016
  • Первый выпуск.

Подчёркивание и выравнивание по ширине плагин WordPress – INFO-EFFECT

На чтение 2 мин. Опубликовано

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

“Подчёркивание” и “Выравнивание по ширине”. Вы наверняка знаете, что после недавнего обновления (Wordpess 4.7), в меню визуального редактора исчезли кнопки “Подчёркивание” и “Выравнивание по ширине”. Те кто не пользовался данными кнопками, наверно и не заметили потери, а вот я заметил, потому что пользовался.

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

Установить плагин Добавляет “подчёркивание” и “выравнивание по ширине” (искать по запросу underline) вы сможете прямо из админ-панели WordPress. Перейдите на страницу: Плагины – Добавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

 

underline WordPress

 

Далее, после установки и активации плагина, перейдите на страницу: Настройки – Написание. Здесь у вас появится новый параметр “Стиль редактора”. У вас будет 4 варианта на выбор:

 

– По умолчанию – без кнопок “Подчёркивание” и “Выравнивание по ширине”.

– Добавляет кнопки “Подчёркивание” и “Выравнивание по ширине”.

– Добавляет кнопки “Подчёркивание” и “Выравнивание по ширине” и меняет порядок отображения кнопок.

– Re add justify only, повторно добавить кнопки.

– Выберите один из вариантов и сохраните изменения.

 

Настройки публикации написание WordPress

 

Всё готово! После сохранения настроек, на странице редактирования записи или страницы, в меню визуального редактора, снова появятся кнопки 

“Подчёркивание” и “Выравнивание по ширине”!

 

Остались вопросы? Напиши комментарий! Удачи!

 

 

Форматирование текста. Как выровнять текст по ширине? — PetrAlex.NET

Форматирование текста в WordPress.
Как выровнять текст по ширине?

Согласитесь, что отредактированный и отформатированный текст более приятен для чтения, а как следствие и восприятия. У военных есть такое понятие как штабная культура оформления документов — своего рода совокупность требований предъявляемых к оформлению того или иного штабного документа. Так и блогеры при написании постов (документов) стараются придерживаться определенных правил (штабной культуры) в оформлении текса, чтобы как можно четко и ясно передать содержимое и тем самым повысить конверсию статьи. При форматировании своих постов с помощью визуального редактора, я столкнулся с проблемой выравнивания текста по ширине. Если Вы используете стандартный визуальный редактор Вордпресс, то должно быть заметили, что в панели инструментов редактора записей отсутствует соответствующая функция. На приведённом ниже изображении ясно видно, что в нашем распоряжении только три варианта выравнивания текста: по левому краю, по центру, по правому краю. Как же выровнять текст по ширине?

 

  

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

Данные плагины значительно расширяют стандартный набор функций предустановленного визуального (WYSIWYG) редактора вордпресс в т.ч. и позволяют форматировать текст по ширине. Ну, а если Вы все таки всерьез задумались покорить Вордпресс, так сказать «вывернуть на изнанку» то как раз не будет лишним заглянуть под эту самую «изнанку» (HTML код) при помощи HTML редактора. HTML код — это основа любой интернет странички, своего рода набор тегов и символов, который говорит вашему браузеру, что и как выводить на странице. Взгляните на картинку со стандартным редактором Вордпресс снова и в крайнем правом углу вы увидите надпись HTML. Это и есть переключатель в потусторонний мир вашего поста. На первый взгляд ничего не понятно! Но не спешите сдаваться, ведь как говорится в старой поговорке: Не так страшен черт, как его малюют. Дабы особо не углубляться в HTML предлагаю скачать бесплатные видеоуроки по HTML. Для отображения ссылок для скачивания видеоуроков укажите Ваше имя и имейл в приведенной ниже форме.

Вернемся к нашему вопросу. Как же выровнять текст по ширине. Так вот, если вы наберете какой-нибуть текст в визуальном редакторе и нажмете в панели иконку “выровнять по правому краю”, то переключившись в HTML редактор Вы увидите следующий код:

 <p style=”text-align: right;”>ваш текст.</p>

Соответственно для выравнивания текста по левому краю, Вам необходимо заменить значение « right » на « left » , а для выравнивания текста по ширене — на « justify » . Таким образом, HTML код будет выглядеть так:

 <p style=”text-align: justify;”>ваш текст</p>

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

Также текст по ширине можно выровнять применив к тексту так называемые каскадные таблицы стилей (CSS). Этот способ может показаться более сложным, если у Вас пробел в области технологии CSS, но это всего лишь от незнания. Для убеждения приведу такой пример: Представте что у Вас есть блог со 100 постами (страницами) и Вам необходимо выровнять текс по ширине, а то смотри возможно со временем станет вопрос об изменении некоторых свойст текста (шрифта, размера, цвета и т.д.) преставляте сколько Вы убьете времени на редактирование каждого поста (страницы). И чтобы окончательно Вас убедить, что за CSS будущее веб технологий следует принять во внимание, что использование CSS значительно облегчает вес каждой странички (по-просту избавляет от лишнего кода), что в свою очередь весьна положительно сказывается на скорости загрузки Вашего блога.

Что бы разобраться как придавать посту (страничке) Вашего блога определенный стиль т.е. менять шрифт, цвет, размер текста, а также задавать фон, настоятельно рекомендую скачать бесплатно промо-курс по CSS и тчательно изучить и по возможности практически закрепить полученные навыки. Обладая минимальными знаниями в области CSS, Вы сможете творить чудеса не хуже любого веб дизайнера и Ваш блог будет оригинальным и привлекательным. Ответ на вопрос: Как форматировать текст по ширине при помощи CSS? Вы найдете в рубрике Уроки CSS.

Создание и раскрутка сайта от А до Я!

«HTML, CSS, JavaScript, PHP, MySQL, XML, Joomla, Регистрация сайта в Интернете, Раскрутка сайта»

Узнай обо всё этом здесь!

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

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