Обтекание изображений текстом в WordPress

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

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

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

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

.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}

Для того, чтобы вставить код переходим во вкладку "Внешний вид", далее жмем кнопку "Редактор", находим справа файл style.css (как правило, редактор по умолчанию открывает данный файл, поэтому ничего искать не нужно) и в самый конец файла вставляем вышеобозначенный код.

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

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

Вы можете оставить комментарий, или ссылку на Ваш сайт.

11 комментариев к записи “Обтекание изображений текстом в WordPress”

  1. Анто:

    Здорово! очень полезная статья — мне как раз нужно для норм отображения= )
    спасибо: )

  2. Тамара:

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

  3. Делал все как показано, но ничего не изменилось.

  4. Делал все как показано, но ничего не изменилось. http://stepan-chernysh.ru/?p=356 Вот высылаю ссылку. Что-то здесь не работает.

  5. sind:

    Специально для тех кто на бронепоезде: вам же ясно Ержан написал! Уточняю подробнее:
    1. В панели редакции страницы, в вашем тексте, курсором отмечаете место где должна быть картинка.
    2. Через «добавить медиафайл» устанавливаете картинку (она к вас встанет без обтекания).
    3. (и самое главное) Клацните по картинке, над ней появится панелька и на ней нажмите на выравнивание «слева» или «справа», ну где вы хотите установить картинку. И можете попрыгать от радости — у вас все получилось!!! А автору респект за пост!

  6. Сделал, как Вы сказали. Ничего не изменилось. Cделал, как подсказал в комментарии sind и всё получилось. Только в пункте 3 нужно нажимать не на картинку, а на «справа», «слева», «по центру» в строке над картинкой. Так что не только автору решпект, но и sind-у.

  7. Атлант:

    Все получилось! Благодарствую!

  8. Алексей:

    Не работает.

  9. Я:

    Спасибо! Всё получилось)

  10. Alex:

    Если делать через «вкладку «Внешний вид», далее жмем кнопку «Редактор» — не работает.
    Помогло, если делать «Настройки —> Additional CSS»

    Автору спасибо

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

Яндекс.Метрика