Пропустить

Как отступы абзацев на WordPress

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 901.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

Вы хотите добавить пробелы или подразделы с отступом на WordPress? Хотели бы вы делать абзацы в WordPress с отступом?

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

В этом уроке мы покажем вам, как сделать отступ легко параграфы на WordPress.

отступ абзаца на WordPress

Метод 1. Использование кнопок отступа текста в визуальном редакторе 

По умолчанию большинство Темы WordPress Отобразите выровненные абзацы слева или справа для языков справа налево.

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

Отступ абзацев в wordpress

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

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

Вы также можете уменьшить вывод, нажав на кнопку Уменьшить отступ

Мы также приглашаем вас, прежде чем продолжать открывать Как использовать редактор Гутенберга для WordPress 5.0: Часть XNUMX

Метод 2: отступ вручную абзац с помощью текстового редактора

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

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

Текст вашего абзаца идет сюда ...

Сделать отступ абзаца вручную в wordpress

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

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

Так что, если вы достаточно часто делаете отступы, это не идеальное решение.

Откройте для себя наш гид по Как написать (запись) хороший пункт на своем блоге 

Метод 3: отступ только в первой строке абзаца

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

Даже в WordPress, когда вы делаете отступ для абзаца, ко всему абзацу добавляется пробел.

Пример отступа абзаца

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

Перейти к Внешний вид> Настроить Для запуска Настройщик Темы WordPress. Нажми на " Дополнительные CSS .

Дополнительный настройщик css wordpress

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

p.custom отступ {текст-отступов: 60px; }

Откройте для себя также наш Учебник: как освоить визуальный редактор WordPress

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress на Envato и легко создайте свой сайт. Уже больше, чем 49.720.000. [ЭКСКЛЮЗИВ]

Этот код CSS просто сообщает браузерам, что если абзац имеет класс «.custom-indent», то он добавляет отступ 60 пикселей.

Затем вы можете редактировать свою статью в текстовом редакторе. Затем окружите свой текст тегами а также следующим образом:

Текст вашего абзаца идет сюда ...

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

Интервал перед абзацем

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

Статья р {текст-отступов: 60px; }

Этот код CSS автоматически добавит отступ в первой строке всех абзацев внутри записи или страницы WordPress.

Узнайте также перед отъездом Как добавить визуальный стиль редактора WordPress

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

1. Желтый карандаш: редактор CSS в стиле Visual

Yellow Pencil - это редактор визуальных стилей, который можно использовать с любой темой, чтобы персонализировать свой веб-сайт за считанные минуты (шрифты, цвета, анимация и многое другое…).Yellowpencil плагин визуального редактора стилей css wordpress

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

скачать | Демонстрация | веб-хостинг

2. Easy Custom JS и CSS 

Этот премиум-плагин WordPress представляет собой мощный редактор кода CSS и Javascript, который позволяет вам добавлять их в любой раздел вашего сайта. Это позволяет вам сохранить ваши настройки даже после серьезного обновления вашей темы WordPress. Простой настраиваемый плагин для дополнительной настройки js и css для wordpress

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

скачать | Демонстрация | веб-хостинг

3. Кастомные JS и CSS для Гутенберга

Плагин WordPress Custom JS и CSS для Gutenberg позволит вам добавлять неограниченное количество пользовательских стилей в редактор WYSIWYG для ваших записей и страниц WordPress. Он полностью совместим с версией WordPress для Гутенберга.Пользовательские js и css для плагина gutenberg wordpress

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

Легко создайте свой интернет-магазин

Загрузите бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать свои физические и цифровые продукты в WordPress. [Рекомендуется]

скачать | Демонстрация | веб-хостинг

Рекомендуемые ресурсы

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

Заключение

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

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

... 

Эта статья содержит 1 комментарий

  1. Статья p {dash-text: 60 px; }
    Строка, которая дает мне ошибку.
    Служба проверки также выдает ошибку «60px; } "
    Как мы должны исправить?
    хорошая работа

Оставить комментарий

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

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

Вверх
17 акции
доля14
чирикать1
Регистрация2