Долго я мучался с проблемой обтекания текстом картинок в WordPress. Точнее сказать, не обтеканием. Никак руки не доходили поискать информацию о том, как же решить эту проблему. Поэтому при вставке изображений, я тупо указывал «Не выравнивать» в настройках изображения.
Но теперь, когда я разобрался с более насущными для блога вопросами, такими как настройка 404 страницы, добавление в блог пользовательского поиска Google, WordPress SEO и др. Настало время решить проблему не обтекания текстом картинок.
Оказалось всё гораздо проще, чем я предполагал. Я думал, что это глюк WordPress, а на самом деле, это глюк старых шаблонов. Потому что начиная с версии WordPress 2.5, требуется наличие следующего кода в таблицах стилей любого шаблона:
img.centered { display: block; margin-left: auto; margin-right: auto; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } .alignright { float: right; } .alignleft { float: left; }
Вот и всё! Достаточно просто скопировать этот код в файл style.css твоего шаблона WordPress и текст начнёт исправно обтекать изображения. Как вода, заполнит всё свободное пространство. Обожаю смотреть, как это работает. 
не автоматом. только если картинки вставлять через родной загрузчик wordpress, если же воспользоваться ручной вставкой или клиентом ничего не получится – alignleft и тд автоматом не проставляются.
Вот спасибо, тоже в некоторых темах сталкивался с этой бедой. А в 2.6 кажется еще появилась рамочка вокруг фотографий и тест из поля Alt автоматом выводится… Не знаете как эту рамку в старые темы включить или вообще отключить нафиг?
Я решил это проще.
Когда добавляете изображение, припишите к нему align=»left», например:
[img src='...' align='left']
И текст будет обтекать изображение.
DimoninG, это каждый раз надо приписывать. А здесь один раз подправил стили и всё само собой обтекается. Я раньше так и делал, как ты предлагаешь, но меня это запарило.
Не знаю какая у вас версия WP, но на 2.3.3. все само по себе нормально обтекает.
Несомненно WordPress лучший движок для блога, потому что он содержит кучу полезных функций для меня, вот и ещё одну функцию открыл для себя, спасибо автора!
Большой Благодарисимус!
А у меня такая проблема: Если картинку выравнить по левому или по праваму краю текст обтекает картинку, но меняется размер картинки. Картинка становится намного шире чем надо. Как решить проблему. В качестве темы использую Adformat, WordPress версии 2.6.3.
Заранее спасибо!!!
СПАСИБО ТЕБЕ ОГРОМНОЕ, ДРУГ!!!!!!!!!!!!!!!!!!!!!!
Чтоб не подумал что я робот – не написал адрес своего сайта.
Но за этот пост – ОГРОМНОЕ СПАСИБО!!!!!!!!!!!!!!!!!!!!!!!!!
Он про нас забыл
Э-э, ребята, а переключится на HTML и сделать там всё ручками (выравнивание, обтекание, отступы) это типа не модно нынче? Или просто слишком сложно?
Я думаю все дело в display: inline. А все остальное так, мишура.
Не понял почему данное действо не срабатывает в WordPress 2.7 RC2. Глюк релиза, или криво установился?
Мои благодарности! Давно были проблемы с картинками, теперь массово вставил этот код во все сайты.
Ура!!! Заработало!!! Потекла водичка по картинкам!
Давно хотел разобраться, как это делается, нашел. Продолжаю поиск полезностей…
Благодарю.
Дай тебе бог здоровья, добрый человек))))))))
В некоторых бесплатных шаблонах для WordPress действительно встречается такая проблема и приходится лезть в стили шаблона, для обычных юзверей это не самая лёгкая процедура и в большинстве случаев от таких шаблонов отказываются.
Куда именно там в этот файл добавлять? После каких строк?
Спасибо, работает отлично!!!
Огромное спасибо.Решила проблему за полминуты!
Спасибо. Очень актуальная информация для меня сегодня
очень помогли. Спасибо большое. теперь вид совсем другой
Ага, промучился блин пол дня, уже согласился эти алигны руками вставлять.
И тут нашел – круто.
Спасибо.
Знать бы еще после чего вставлять…
Черт, не получилось блин.
не знаю, у меня все вышло, теперь только классами и id делаю!
Спасибо большое за дельную статью! Благодаря ей я быстро справился с проблемой не обтекания текстом картинок!!!