Вы забрели на блог Вебмастерицы


Я не "рублю бабло" - я просто зарабатываю в интернете.

Впервые на блоге и не знаете SEO-терминов? Тогда проходите в мой SEO-словарь!

14 Сен 2012

Автоформатирование WordPress, или как решить проблему с удалением пустых тэгов <p> и <br> при переходе из визуального редактора в html

автоформатирование WordPress - решение проблемыНа своих сайтах мне нередко нужно красиво разместить несколько картинок с подписями рядом — 2 или 3. Для этого я обычно использую выравнивание слева, а чтобы текст не наползал на оставшееся пространство справа, нужно «обнулить» стиль. Для этого после картинок я прописываю пустой абзац <p style=»clear:both;»></p>.

Совсем правильно — добавить в файл style.css строку .clear {clear:both;}, а потом добавлять после картинок <p class=»clear»></p>

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

В конце концов, это меня выбесило настолько, что я начала искать решение и потратила на это несколько часов.

История моих поисков решения проблемы

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

1. TinyMCE Advanced.

Итак, первое решение проблемы, которое я нагуглила — это плагин TinyMCE Advanced. У него в настройках есть галочка «Stop removing the <p> and <br /> tags when saving and show them in the HTML editor» («Остановить удаление <p> и <br /> тэгов при сохранении и отображении их в HTML-редакторе»).

Это решает проблему с удалением абзацев и… порождает новую: теперь при переходе из визуального редактора в HTML добавляются новые абзацы и переносы. Не передать, как меня это выбесило. Ведь вместо нескольких картинок в ряд у меня появлялась «лесенка» из картинок, т.к. каждую из фото этот плагин обрамлял в собственный абзац.

2. Dean’s FCKEditor For WordPress.

Второе нагугленное решение проблемы — замена встроенного визуального редактора TinyMCE на Dean’s FCKEditor For WordPress.

Кстати, вы знали, что визуальный редактор TinyMCE, который вы используете в ВП — это отдельный opensource-проект, который просто включили в WordPress? Можете прочитать про него в Википедии.

Этот редактор тоже не подошел, к сожалению. Он не только добавлял абзацы и переносы, как TinyMCE Advanced, но и убирал [ caption][/caption] — тэги, которые ставит вордпресс при добавлении подписей к картинкам.

Я отчаялась найти решение в рунете и обратила свой взор на англонет.

3. RAW HTML

В поисках решения проблемы я набрела на забавный и полезный пост «Why You Hate The WordPress Text Editor and What To Do About It» («Почему Вы Ненавидите Текстовый Редактор WordPress и Что С Этим Делать»), где упоминался RAW HTML. Поставив его, я поняла, что бесплатная версия правит код только уже непосредственно на сайте, а для того, чтобы визуальный редактор не дурил, нужно ставить платную версию, которая стоит 15$. Так что и тут меня встречал товарищ Облом.

Но меня уже взял злой азарт. Ё-моё, половина рунета стонет, половина англонета стонет, ну, неужели эту проблему решить никак нельзя?! Ведь понятно же, что где-то в недрах TinyMCE, живущего в файлах WP, есть коварные строки, которые таки заставляют визуальный редактор творить эти гадости!

И вот, наконец-то я нашла ЕГО. РАБОЧИЙ способ. Простите за капс, но я просто не знаю, как передать всю глубину снизошедшего откровения. :D

4. Код для functions.php, решающий проблему.

Найден на официальном английском форуме WordPress по какому-то запросу из внутренностей tinymce, когда я пыталась разобраться, что он там умеет и как это поправить.

Нервы были на пределе, к тому же, я порядком устала, так что код запулила в файл, не пытаясь разобраться, что он там делает. Главное, что я поняла — он отключает ряд функций редактора, на что недвусмысленно указывает неоднократное «false» в коде:

function change_mce_options($initArray) {

        $initArray['verify_html'] = false;
        $initArray['cleanup_on_startup'] = false;
        $initArray['cleanup'] = false;
        $initArray['forced_root_block'] = false;
        $initArray['validate_children'] = false;
        $initArray['remove_redundant_brs'] = false;
        $initArray['remove_linebreaks'] = false;
        $initArray['force_p_newlines'] = false;
        $initArray['force_br_newlines'] = false;
        $initArray['fix_table_elements'] = false;

        $initArray['entities'] = '160,nbsp,38,amp,60,lt,62,gt'; 

        return $initArray;
}

add_filter('tiny_mce_before_init', 'change_mce_options');

В принципе, по названиями отключаемых функций можно примерно догадаться:
verify_html — это проверка на валидность кода,
cleanup_on_startup и cleanup — очистка чего-то (может, кстати, оно и есть?),
fix_table_elements — это правка кода таблицы при переходе в визуальный редактор: помню, он там вставлял <tbody>, вроде, и еще какие-то изменения вносил.

В общем, после добавления этого кода в functions.php жизнь у меня наладилась. :) Теперь можно не бояться переходить в визуальный редактор — ничего не слетит.


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

P.S. Не забудьте, что код в functions.php обязательно должен быть между <?php и ?>, иначе WP будет ругаться на ошибку.

Понравился пост? Так поделитесь же! :)

Твитнуть
Нравится

Отзывы:

(57) на Автоформатирование WordPress, или как решить проблему с удалением пустых тэгов <p> и <br> при переходе из визуального редактора в html

Поболтаем о сайтиках?

Вы также можете зарегистрироваться и загрузить свою аватарку. :)


Или залогиниться, если вы уже зарегистрированы.

Полезное вебмастеру:

  • Точные апдейты Яндекса
  • Список всех аддурилок
  • Проверить домен:
    регистрация доменов
    домен RU - 99 руб
    домен РФ - 99 руб
    Зарегистрируй себе домен!
    имя: 

    2domains.ru