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

Мне хотелось автоматизировать этот процесс, чтобы не добавлять постоянно дополнительный код во время написания статьи. И я обратил внимание на то, что тег <!—more—> всегда добавляет в статью свой код (некий блок с идентификатором ID, к которому мы переходим после нажатия на ссылку «Читать далее»). Именно над этим кодом нам и придется поработать, не пугайтесь это не труднее чем прокладка оптоволокна который вам закладывают в квартиру при подключении Интернета, я все объясню Вам быстро и подробно.

Для начала более подробно опишу проблему:
В начале каждой статьи я добавляю рисунок с выравниванием float:left. Поэтому весь последующий текст обтекает рисунок с правой стороны, но, если анонс статьи небольшой (а у меня на блоге раньше было всегда так), то при выводе всей статьи целиком основной текст следует сразу после анонса и продолжает заполнять пространство справа от рисунка, что выглядит не совсем красиво.
Чтобы расположить текст под рисунком, независимо от размера анонса, необходимо убрать влияние стиля float:left на этот текст. Для этого добавим дополнительный блок со стилем clear:both. Напомню тем, кто забыл:

Блок со стилем clear:both располагает следующие за ним объекты ниже всех плавающих блоков.

Сначала я пытался добавить новый код в шаблон темы, но так и не нашел подходящего места. Пришлось смотреть файл wp-includes\post-template.php, где и нашел код:

<span id=»more-’ . $id . ‘»></span>

Сразу же после него дописываем следующее:

<p style=»clear:both;»></p>

Вот и всё, теперь основной текст статьи будет всегда находиться под картинкой! Единственный минус всей этой операции — после каждого обновления WordPress код придется прописывать заново.