Gutenberg: Блоки перекрывают мета-боксы в сообщениях

Я могу подтвердить эту проблему. Вставьте длинный контент в классический блок, и мета-блоки будут перекрывать этот блок.

Кто-нибудь из вас может протестировать с мастером, я не могу воспроизвести эту проблему, возможно, она была исправлена.

Это сохраняется.
Протестировано с чистой установкой WordPress 4.9.8 и Gutenberg 4.2.0
Для тестирования я установил плагин, как описано в # 11482

Результат:

Это может быть проблема с Windows? Можете ли вы протестировать с помощью этого zip https://builds.danielbachhuber.com/gutenberg-nightly.zip

С ночной сборкой работает 👍

Спасибо за тест, это отличная новость. Я собираюсь закрыть это, это будет выпущено в версии 4.3.

Я установил Gutenberg 4.3.0-alpha-1ac70e1 на свой сайт 4.9.8, и проблема не устранена.

https://youtu.be/cSdo1cUIb1E

@DeveloperWil Интересно, я снова открываюсь, чтобы мы могли исследовать больше, но это не будет легким решением, если мы не сможем надежно воспроизвести.

@Developer Не могли бы вы отключить Advanced Custom Fields PRO и
Yoast SEO Premium? Затем установите плагин, как описано в # 11482, в тестовых целях?

Я также тестировал (как и вы) с Windows 10 64bit и Chrome, WP 4.9.8 и т.д. и Gutenberg 4.3.0-alpha-1ac70e1 (но больше ничего не установлено), и ошибка была исправлена.

Fire Fox
Ubuntu 14.04
WP 5.0-beta3-43878
Ночная сборка Гутенберга https://builds.danielbachhuber.com/gutenberg-nightly.zip

прописано много метабоксов.

Моя проблема с № 11482 на самом деле не сохраняется.

@gziolo изменил вехи: 4.3, WordPress 5.0 5 дней назад

Это не исправлено в Gutenberg 4.3.0 и не исправлено в WP 5.0-beta3-43891.

Я не уверен, связано ли это, но если это так, вы можете воспроизвести это, включив кнопки общего доступа в плагине Jetpack. Как вы можете видеть на скриншоте, мета-поле кнопок совместного доступа перекрывает блоки Гутенберга. Однако это может быть ошибкой в ​​Jetpack (и плагине All in One SEO, который имеет ту же проблему, как вы можете видеть на изображении).

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

Я перекрестно ссылаюсь на эту проблему из TwentyNineteen https://github.com/WordPress/twentynineteen/issues/599, поскольку эта проблема, похоже, также касается метабоксов и поля редактора (хотя под немного другим углом)

Такая же ошибка существует в Genesis Framework 2.7.1 (готов для Gutenberg) и Gutenberg 4.4.0.

Я нашел способ воспроизвести, но только на 4.4, а не в мастере. Так что стоит попытаться выяснить, когда и как это было исправлено.

• Шаг 1. Включите Yoast или другой плагин с метабоксом. Разверните его для максимального эффекта.
• Шаг 2: Наберите кучу элементов, посмотрите, как они перекрываются. Другой симптом - ТОННА пробелов, прежде чем вы сможете увидеть метабоксы.

Результат вышеуказанных шагов в 4.4:

Результат вышеуказанных шагов в мастере:

☝️ Обратите внимание, что коралловый цвет - это цвет, который я добавил в отладчике к элементу editor-writing-flow__click-redirect , который изначально выглядел неправильно.

Я тестировал это в Chrome и Firefox на Windows и Mac.

Когда я первоначально исследовал, это выглядело так, как будто это был плохой изгиб editor-writing-flow и .editor-writing-flow__click-redirect . Однако, как уже отмечалось, я не могу воспроизвести эту проблему в мастере, несмотря на то, что код не изменился. Попробуем разобраться, что здесь изменилось за последнее время.

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

Я не уверен, связано ли это, но если это так, вы можете воспроизвести это, включив кнопки общего доступа в плагине Jetpack. Как вы можете видеть на скриншоте, мета-поле кнопок совместного доступа перекрывает блоки Гутенберга. Однако это может быть ошибкой в ​​Jetpack (и плагине All in One SEO, который имеет ту же проблему, как вы можете видеть на изображении).

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

Как оказалось, моя «ошибка» была связана с темой Divi, а не с плагинами Jetpack или All in One SEO.

Активировав Twenty Seventeen и запустив основную ветку плагина, все работает нормально.

Спасибо за продолжение и тестирование.

Хотя я вижу, что эта ошибка закрыта, у меня тоже есть проблема с мета-блоками, плавающими над блоками редактора WP. Я попытался отключить свою текущую тему (Theme.co Pro), а также Yoast. Это было на сайте разработчиков с минимальным количеством плагинов. Я попробую отключить все плагины, чтобы увидеть, смогу ли я определить конфликт. Я использую 5.0-RC1.

Обновлено : обнаружен конфликтующий плагин - Shortcake (пользовательский интерфейс Shortcake) - https://wordpress.org/plugins/shortcode-ui/
После отключения все выглядит хорошо.

У меня все еще возникает эта проблема с 4.9.8 и Gutenberg 4.5.1

Я также получаю 3 партии следующих ошибок в консоли в Chrome:
wp-seo-premium-metabox-830.min.js? ver = 8.3: 109 Uncaught TypeError: (0, i.getI18n) не является функцией
в t (wp-seo-premium-metabox-830.min.js? ver = 8.3: 109)
на объекте.(wp-seo-premium-metabox-830.min.js? ver = 8.3: 56)
в e (commons-premium-830.min.js? ver = 8,3: 1)
в window.yoastPremiumWebpackJsonp (commons-premium-830.min.js? ver = 8.3: 1)
в wp-seo-premium-metabox-830.min.js? ver = 8.3: 1

Я воспроизвел это на небольшом тестовом примере.

Шаг 1: Создайте метабокс на странице. Могут быть настраиваемые поля («Еще меню»> «Параметры»> «Настраиваемые поля»)

Шаг 2: Поместите в functions.php следующее:

add_action('init', iAmError);

Шаг 3: перезагрузите и обратите внимание на ошибку.

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

Кроме того, это усугубляется тем, что редактор _ вроде бы работает нормально_, хотя на самом деле он частично находится в состоянии ошибки.

Чтобы уточнить, эта ошибка, вероятно, все еще присутствует на странице редактора без включенных метабоксов. Но ошибка просто не очевидна, потому что нет метабоксов, показывающих состояние ошибки.

Можем ли мы лучше справиться с этими ошибками?

Это проблема и для нас. Мы нашли результаты ниже, когда активированы наша настраиваемая тема и множество плагинов (включая YoastSEO):

Работает правильно с мета-блоками, появляющимися внизу блоков страницы при использовании:

• FireFox 63.0.3 (64-разрядная версия) в Windows 10
• Internet Explorer 11.285.17134.0 в Windows 10 с использованием опции эмулятора инструментов разработчика для принудительного режима документа 10

Мета-блоки перекрывают блоки страницы при использовании:

• Internet Explorer 11.285.17134.0 в Windows 10 с использованием инструментов разработчика для принудительного режима документа 11
• Edge 42.17134.1.0 в Windows 10
• Chrome 70.0.3538.110 в Windows 10

@SJNBham Пока что единственный способ воспроизвести это - использовать плагин, который выдает ошибку в WordPress 5.0.

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

Другой способ воспроизвести это без появления ошибки в WP 5.0-RC1-43945:

add_action( 'enqueue_block_editor_assets', function() { echo '<style></style>'; } );

Это не вызывает ошибок консоли или PHP, но содержимое накладывается на мета-поля.

@jasmussen Если я отключил все плагины, кроме Gutenberg, активировал тему Twenty8teen, использовал шаблон страницы по умолчанию и выбрал отображение настраиваемых полей, возникает проблема перекрытия.

Я переключился на один из наших самых простых сайтов, на котором было активировано только два плагина (панель инструментов Google Analytics для WP и Gutenberg). Он использует тему Dynamic Seventeen, и мета-блоки правильно выравниваются по нижней части блоков содержимого. Я переключился на тему Twenty8teen, чтобы убедиться, что я сравниваю яблоки с яблоками, и мета-боксы продолжают работать правильно.

Мы используем WordPress 4.9.8 и Gutenberg 4.5.1.

Обновление: сайт, на котором мы наблюдали эту проблему, был промежуточным сайтом нашего производственного сайта. Мы обнаружили, что на нашем промежуточном сайте есть ошибки (мы размещаем на WPEngine и тестируем обновление PHP 7.2). Я считаю, что WPEngine знает об ошибке и работает над ней.

"Параметр 1 для wp_default_scripts () должен быть ссылкой ...."

Когда я активировал Gutenberg на нашем производственном сайте, мета-поля, кажется, выровнялись внизу по желанию.

Может быть, это связано с тем, как обрабатываются ошибки, как было сказано ранее?

Те из вас, у кого возникла эта проблема, не могли бы вы попробовать следующие шаги отладки и вернуться ко мне?

1. Откройте консоль JavaScript.
   В Chrome это View> Developer> JavaScript Console . В Firefox это Инструменты> Веб-разработчик> Веб-консоль .
2. Вставьте в консоль следующее и нажмите Enter: javascript:window.alert('You are in ' + (document.compatMode==='CSS1Compat'?'Standards':'Quirks') + ' mode.')

Пожалуйста, сообщите, какое сообщение вы получаете.

• Когда я вижу сообщение «Вы в стандартном режиме», значит, все работает так, как было задумано.
• Когда я вижу сообщение «Вы находитесь в режиме Quirks», я вижу проблему с перекрытием.

@jasmussen Я вижу «Вы находитесь в режиме Quirks» при использовании фрагмента add_action( 'enqueue_block_editor_assets', function() { echo '<style></style>'; } ); в файле functions.php темы сверху.

(Это потому, что <style></style> испускается перед <!DOCTYPE html> , заставляя режим причуд.)

Так что обычный недопустимый HTML может вызвать это, а также ошибки, выдаваемые PHP.

Спасибо за проверку, @nickcernis , да, конечно. Кажется, что правила гибкости, определяющие размер основного холста редактирования, в режиме причуд ведут себя иначе, чем в стандартном режиме. Рассматриваю несколько вариантов.

@jasmussen - я активировал упомянутый выше плагин (который вызывал проблему) и поместил предложенный вами код в консоль. Я вижу сообщение «Вы находитесь в режиме Quirks» на этом экземпляре с активным плагином.
Когда я деактивирую этот плагин и перезагружаю страницу сообщения, я получаю сообщение «Вы в стандартном режиме». Надеюсь, это поможет.

@HighTechDad Да, это очень помогает. У меня есть несколько идей, как это смягчить, но я взвешиваю варианты. Если я прав, то это означает, что есть небольшая проблема с плагином Shortcake UI, которая вызывает проблему, и в идеале она там исправлена. Но я вернусь, когда мне будет чем поделиться.

@jasmussen - Я действительно не использую этот плагин Shortcake UI. Я просто случайно нашел его на моем сайте разработчиков, где я тестирую WP 5.0. Я уверен, что будет / будет много плагинов, которые не обновлялись какое-то время, что может вызвать проявление проблемы. Я просто знаю, что с этим конкретным плагином его легко тестировать и воспроизводить. (Просто волнуюсь, когда выйдет 5.0, будет много других плагинов, которые будут иметь «небольшие проблемы» и вызывать разочарование.)

Благодарим за сохранение этой темы, даже если эта конкретная проблема отмечена как «Закрытая». Возможно, пора открывать заново ...

Я обратился в службу поддержки Yoast SEO, и они увидели, что этот билет был закрыт, поэтому сказали, что это проблема WordPress, которая в конечном итоге будет решена с помощью более новой версии WordPress. Я упоминаю об этом, потому что другие поставщики могут дать такой же ответ, если увидят, что этот билет закрыт. Также тот факт, что очень вероятно, что другие плагины будут иметь ошибку в них, которая запустит режим совместимости. Так что было бы здорово найти решение для постепенного отката при активном режиме совместимости. Спасибо за вашу работу!

Да обсуждение никогда не закрывается. Я все еще пытаюсь выяснить, где и как возникает проблема, и, в зависимости от деталей, проблема будет либо повторно открыта, либо создана новая на основе полученных здесь уроков. Спасибо за терпеливость.

Для меня ты тоже в режиме причуд

Я только что наткнулся на это в 5.0 RC1. Стандартный режим, без ошибок PHP, без ошибок JS.
Оказывается, моя проблема заключалась в том, что моя тема имела это в файле editor-styles.css :

body {
    height: 100%;
}

который был отображен как встроенный CSS на экран редактора как:

.editor-styles-wrapper {
    height: 100%;
}

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

Хороший улов, @earnjam. Я бы сказал, что это отдельная проблема (и не стесняйтесь открывать ее с шагами для воспроизведения). Это связано с тем, что холст редактирования не находится в iframe, и, если вы не внимательны, вы можете написать стили редактора, которые влияют на окружающий пользовательский интерфейс, например:

* {
    border: 13px solid mediumaquamarine;
}

В стилях редактора определенно можно внести некоторые улучшения в том, что касается области видимости, и было бы неплохо начать собирать проблемы, которые мы собираемся решить, я думаю, некоторые были отмечены здесь и там. Но в этом случае темы WordPress должны явно разрешить использование стилей редактора, так что, надеюсь, это то, что будет уловлено при разработке указанного стиля. Возможно, решение этой конкретной проблемы состоит в том, чтобы отметить ее в разделе «Лучшие практики» в документации по поддержке темы?

Хорошо, я создал запрос на перенос в качестве доказательства концепции, которая смягчает это, но, учитывая, что это ошибка не Гутенберга, я не думаю, что ее следует объединять. Но, надеюсь, это может вдохновить на некоторые лучшие идеи о том, как помочь пользователю или разработчику плагина, который переводит Гутенберг в режим причуд, исправить проблему. Поделитесь своими мыслями и наблюдениями по поводу PR: https://github.com/WordPress/gutenberg/pull/12455

@jasmussen Да, я просто хотел отметить еще одну причину проблемы, описанную в исходном сообщении.

Единственное, что меня беспокоит, это то, что эта конкретная тема выбрала стили редактора в старом редакторе. Он давно не обновлялся и, следовательно, не обновлялся для поддержки нового редактора блоков.

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

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

Nevermind обновили 20 ноября. Может просто ошиблись при тестировании. Я буду исследовать дальше.

Я считаю, что это одна из причин, по которой Гутенберг требует от разработчиков тем явного согласия на поддержку новых стилей редактора: https://wordpress.org/gutenberg/handbook/designers-developers/developers/themes/theme-support/#editor -styles - насколько мне известно, старые стили редактора не должны загружаться, если автор темы не говорит, что они подходят для загрузки. И если они это сделают, во многих случаях стили должны переводиться 1: 1, но выбор должен предлагать этап тестирования.

Вот моя последняя попытка смягчить и вызвать осведомленность разработчиков о конфликтах плагинов, которые могут вызвать это: https://github.com/WordPress/gutenberg/pull/12575 - поделитесь своими мыслями.

У меня была эта проблема, и она была вызвана плагином Form Maker, спасибо за информацию о "Quirks Mode", мне потребовалась бы целая вечность, чтобы понять это! Я написал сообщение по этой проблеме на своем сайте WordPress. В настоящее время я использую WP версии 5.0.2 на Debian 9 с php 7.2.13

У меня была эта проблема с Yoast SEO и Postmattic. Мой браузер был в режиме Quirks из-за плагина WP Rainbow Hilite. На данный момент отключен, и проблема исчезла.

Я могу сказать вам, что проблема перекрытия блоков (фактически исчезновения под) мета-блоков на страницах, использующих Gutenberg, все еще существует, и не позволяет нам вносить изменения или дополнения на страницу.
Некоторые люди думают, что это исправлено, но это не так.

Я использую:
Браузер Google Chrome.
WordPress 5.1
Тема: Nirvana Версия: 1.5.1.1
Метабокс Yoast SEO - первый, который показывает проблему; есть и другие.
И нет, это не Windows; Я испытываю это на iMac.

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

Если вам нужно что-то еще, чтобы отследить это, дайте мне знать ...

Спасибо за отчет.

Если вам нужно что-то еще, чтобы отследить это, дайте мне знать ...

Можете ли вы открыть консоль JavaScript и посмотреть, есть ли там сообщения? В Chrome, mac это ⌘⌥J, в Firefox - ⌘⌥K, в Safari сначала нужно включить его, инструкции здесь: https://support.airtable.com/hc/en-us/articles/232313848-How- открыть консоль разработчика

В зависимости от того, есть ли сообщение в консоли, от этого зависят следующие шаги. Благодарю.

Вот снимок экрана, когда я сказал "Изменить страницу" на выбранном мной
страница (прилагается).
Обратите внимание, что я очистил консоль перед тем, как перейти на страницу редактирования.

https://user-images.githubusercontent.com/1204802/54151216-a0ea1c80-443a-11e9-8ea7-9f34965840c7.png

Я надеюсь, что это помогает!

Брайан

Надеюсь, у вас есть снимок экрана!

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

И действительно, это было полезно. На скриншоте есть предупреждение о том, что браузер находится в «Режиме причуд». Этот режим является причиной перекрытия метабоксов, и это почти наверняка вызвано плагином, который нестандартным образом добавляет контент на страницу и нуждается в обновлении. Это _может_ быть темой WordPress, но это менее вероятно.

Если у вас есть такая возможность, можете ли вы попробовать деактивировать плагины по одному, а затем перезагрузить редактор, чтобы посмотреть, начинает ли он работать должным образом? Необязательно деактивировать все сразу, только по одному и каждый раз перезагружать редактор. Когда вы найдете один плагин, который при деактивации заставляет редактор работать, дайте мне знать здесь. Затем я могу обратиться к разработчику и предложить совет и помощь о том, как обновить этот плагин для работы с редактором. Благодаря!

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

FWIW, я сделал тот же захват консоли Javascript в Firefox, который не
похоже, испытывают такое поведение, используя страницу редактирования на той же странице, что и раньше.
Вот результат (прилагается). Возможно, сравнивая это с захватом Chrome
может пролить свет?

Я попытался воспроизвести это на нескольких других сайтах, даже установил Yoast SEO, если он еще не был установлен. К сожалению, мне не удалось воспроизвести поведение на этих сайтах, а это значит, что деактивация плагинов не принесет особой пользы.

Второй захват консоли прошел?

Вложения не видел. Если вы отвечаете на эти сообщения по электронной почте, я не думаю, что вложения засоряются. Я думаю, вам нужно перейти сюда в Github через браузер, чтобы добавить изображения.

Я подозреваю, что Firefox покажет то же сообщение об ошибке, но, возможно, движок рендеринга браузера имеет лучший способ обработки так называемого «режима причуд». Лучшее решение по-прежнему - найти проблемный плагин и попросить разработчика отправить исправление для этого. Но я полагаю, что если Firefox в данный момент у вас работает хорошо, то это может служить обходным решением. Я полностью понимаю, почему вы не можете протестировать это на производстве.

Альтернативный способ отладки: можете ли вы прислать мне полный список плагинов, которые вы используете на своем веб-сайте? Затем я могу протестировать их один за другим, посмотреть, смогу ли я воспроизвести его.

У меня тоже была такая же проблема. Установка плагина Disable Gutenberg устраняет проблему, и сообщение «Quirks Mode» исчезает, но это не очень хорошее долгосрочное решение.

Я пробовал отключить плагины в своей локальной версии Wordpress. Я проверил, что 26 из моих плагинов не вызывают проблемы, но включение любого из этих 5 приводит к тому, что проблема возвращается:

Социальная война - Pro
Оглавление Плюс
Расширение TablePress: адаптивные таблицы
WP Скрыть сообщение
Виджет вкладки WP Pro

Спасибо за отчет, Джо! Я попробую эти плагины и посмотрю, смогу ли я сузить проблему и вернуться с дополнительной информацией здесь.

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

Я внес несколько изменений в свой сайт с помощью Elementor pro, что, как я сначала подумал, может вызвать проблему, но отключение этого ничего не меняет.

Объяснение того, почему возникает проблема, носит немного технический характер, но суть заключается в следующем:

• Если веб-страница (в данном случае редактор) является допустимым HTML , она отображается правильно.
• Если веб-страница является недействительным HTML , браузер должен _гадать_, как отображать вещи, и неправильно догадывается, что метабоксы должны перекрываться

Что приводит к тому, что веб-страница становится недействительной? В этом случае вполне вероятно, что плагин выводит некоторые расширения в разметку редактора, что приводит к его поломке. Если в классическом редакторе он работает так, как задумано, это, вероятно, связано с тем, что браузеры правильно _угадываются_ относительно визуализации из-за любого количества различий в разметке. Поскольку оказалось, что он работает правильно, ошибка в этих плагинах, вероятно, до сих пор осталась незамеченной.

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

Если Firefox угадает правильно, то это будет предлагаемый обходной путь, пока плагины не смогут обновиться. Спасибо за терпеливость.

Джоэн -

Я только что добавил снимок экрана к своему сообщению на Github. Я надеюсь, что это помогает.

Брайан

FWIW, я взглянул на список плагинов, перечисленных Joe-Clements126:

Социальная война - Pro
Оглавление Плюс
Расширение TablePress: адаптивные таблицы
WP Скрыть сообщение
Виджет вкладки WP Pro

Я не использую ни один из этих плагинов на своем сайте.

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

Смотри приложение...

== Активные плагины ==
Добавить с сервера
Версия: 3.3.3
Автор: Дион Халс

Akismet Anti-Spam
    Version: 4.1.1
    Author: Automattic

Antispam Bee
    Version: 2.9.1
    Author: pluginkollektiv

Auto Update Plugins
    Version: 0.1.4
    Author: Geenyous Limited

Better Font Awesome
    Version: 1.7.1
    Author: Mickey Kay

Black Studio TinyMCE Widget
    Version: 2.6.8
    Author: Black Studio

Broken Link Checker
    Version: 1.11.5
    Author: Janis Elsts, Vladimir Prelovac

Classic Editor
    Version: 1.4
    Author: WordPress Contributors

Contact Form 7
    Version: 5.1.1
    Author: Takayuki Miyoshi

Contact Form 7 Style
    Version: 3.1.8
    Author: Johnny, dorumarginean, mlehelsz, MirceaR

Cryout Serious Theme Settings
    Version: 0.5.9
    Author: Cryout Creations

Custom Menu Wizard
    Version: 3.3.1
    Author: Roger Barrett

Easy Google Fonts
    Version: 1.4.4
    Author: Titanium Themes

Elementor
    Version: 2.5.5
    Author: Elementor.com

Google Analytics Dashboard for WP (GADWP)
    Version: 5.3.7
    Author: ExactMetrics

Howdy Tweaks
    Version: 2.3
    Author: Kailey Lampert

Jetpack by WordPress.com
    Version: 7.1.1
    Author: Automattic

Members
    Version: 2.1.0
    Author: Justin Tadlock

My Custom Functions
    Version: 4.35
    Author: Space X-Chimp

myStickymenu
    Version: 2.0.6
    Author: m.r.d.a

Nav Menu Roles
    Version: 1.9.3
    Author: Kathy Darling

Page Links To
    Version: 3.0.1
    Author: Mark Jaquith

Popup Builder
    Version: 3.1.7.1
    Author: Sygnoos

Profile Builder - Email Confirmation Field
    Version: 1.0.4
    Author: Cozmoslabs, Adrian Spiac

Profile Builder - Numbers and Phone Validation
    Version: 1.0.1
    Author: Cozmoslabs, Cristian Antohe

Profile Builder Pro
    Version: 2.9.7
    Author: Cozmoslabs

Search Exclude
    Version: 1.2.2
    Author: Roman Pronskiy

ShareThis Share Buttons
    Version: 1.1.8
    Author: ShareThis

Simple History
    Version: 2.29.2
    Author: Pär Thernström

SSL Insecure Content Fixer
    Version: 2.7.2
    Author: WebAware

Tela Albums: Google Photo Albums for Wordpress
    Version: 1.5.2.8
    Author: Isaac Brown

Timeline Express
    Version: 1.8.0
    Author: Code Parrots

TinyMCE Advanced
    Version: 5.1.0
    Author: Andrew Ozz

Title Remover
    Version: 1.2
    Author: WPGurus

Visual Form Builder
    Version: 2.9.9
    Author: Matthew Muro

WP-VR-view - Photo Sphere and 360 video
    Version: 1.6
    Author: Tumanov Alexander

WP Mail SMTP
    Version: 1.4.1
    Author: WPForms

WP Media Category Management
    Version: 1.9.3
    Author: DeBAAT <[email protected]>

WP UI - Tabs, accordions and more.
    Version: 0.8.8
    Author: Kavin

Yoast SEO
    Version: 10.0
    Author: Team Yoast

У меня тоже была такая же проблема, поэтому я сравнил наш список плагинов и отключил Popup Builder. Это устранило проблему для меня.

Итак, я попытался деактивировать Popup Builder на своем сайте, и плохое поведение
ушел, по крайней мере, на той странице, где он был раньше.

Думаю, мы нашли виновного (возможно, одного из многих ...)

Спасибо, Элизабет!

Спасибо всем за отзывы! Это обязательно будет полезно для других поисковиков. А сейчас я дважды протестирую конструктор всплывающих окон и обращусь к разработчику Popup Builder с советами и предложениями по исправлению. Надеюсь, мы скоро это исправим! Я очень ценю все отзывы.

FWIW, я заменил Popup Builder на Popup Maker (что, в конце концов, я собирался сделать).
Похоже, что он не имеет таких же отрицательных эффектов, как Popup Builder.

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

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

Спасибо, что изучили это. Сегодня над моим сайтом работал разработчик, и он был уверен, что проблема возникла из-за Elementor.

Это то, с чем он вернулся, и я передал им это.

"Внутри elementor / includes / utils.php в плагине Elementor есть функция, которая вставляет теги скрипта в обычные ответы JSON.

Следующая функция вызывает проблемы, поскольку вы не можете просто случайным образом отправить '. PHP_EOL;}

Было бы здорово, если бы вы могли обновить свой плагин, чтобы определить, является ли запрос / ответ JSON, прежде чем возиться с этим выводом "

Я только что получил отзыв от разработчика Popup Builder, что они ожидают исправления в следующей версии. Мне не удалось это проверить, но приятно видеть такой быстрый ответ 👏

Привет, ребята, спасибо за то, что поделились. Что касается проблем с Popup Builder, проблема, которая ломает визуальный редактор, заключается в том, что они добавили новую кнопку в редактор. Это исправление (удалите эту кнопку) ...

Перейдите в следующий файл на своем сайте: your_wordpress_folder / wp-content / plugins / popup-builder / com / classes / Actions.php
Удалите строку 26: add_action ('mce_external_plugins', array ($ this, 'editorButton')); ....
Это должно решить проблему.

Я использую WP 5.1.1, и он решил проблему на всех моих сайтах.

Просто хотел сообщить, что проблема перекрытия также вызвана Ninja Forms 3.4.4., Beta4 и WP 5.1.1.

@ alkah3st Я не могу воспроизвести эти проблемы только с плагином Ninja Forms версии 3.4.4 и темой WordPress 2019, активированной в WP 5.1.1 Похоже, что проблема, которую вы видите, вызвана плагином ACF 5.8.0 Beta4 .

Хм, когда я оставляю все отключенным, кроме ACF Beta 4 и Yoast, я не получаю перекрытия. В тот момент, когда я включаю Ninja Forms, начинается перекрытие. Если хотите, я могу создать промежуточный экземпляр, чтобы продемонстрировать это.

Обновление: похоже, Ninja Forms выводит эту ошибку:

Ошибка базы данных WordPress: [Неизвестный столбец 'form_title' в 'списке полей']

| ВЫБЕРИТЕ title , created_at , form_title , default_label_pos , show_title , clear_complete , hide_complete , logged_in , seq_num
| ОТ wp_k5n_nf3_forms
| ГДЕ id = 2

Когда форме не присвоено название (что допускается в Ninja Forms). Таким образом, эта ошибка сбрасывается в верхней части документа, перед объявлением HTML, в результате чего редактор переходит в режим Quirks.

Не уверен, что это поможет ... но когда у меня появляется предупреждение PHP, когда WP_DEBUG активен, возникает проблема перекрытия. Когда я разрешаю предупреждение PHP, перекрытие исчезает.

@ alkah3st Я не могу воспроизвести эти проблемы только с плагином Ninja Forms версии 3.4.4 и темой WordPress 2019, активированной в WP 5.1.1 Похоже, что проблема, которую вы видите, вызвана плагином ACF 5.8.0 Beta4 .

У меня есть ACF Beta4 на всех сайтах, которые я сейчас разрабатываю, и у меня нет проблем с дублированием на этих сайтах.

Чтобы быть ясным, это просто предупреждение для всех, кто использует Ninja Forms, поскольку проблема возникает из-за того, что Ninja Forms вводит свою ошибку перед объявлением HTML, что приводит к тому, что документ переходит в режим Quirks (как и для других людей с аналогичными проблемами с разные плагины в этой ветке).

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

@ellatrix Я вижу несколько сообщений о том, что функция внешних плагинов TinyMCE может вызывать некоторые ошибки PHP - это также может вызвать перекрытие, поскольку оно переводит браузер в режим причуд. Вы знаете, можем ли мы что-нибудь сделать, чтобы этого не произошло? Что-нибудь от того, чтобы не загружать внешние плагины в Gutenberg, до вывода ошибки PHP в другом месте? Спасибо, Элла.

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

В классическом редакторе таблица стилей редактора загружается непосредственно в iframe редактора WYSIWYG без изменений. Однако Гутенберг не использует фреймы. Чтобы ваши стили применялись только к содержимому редактора, мы автоматически преобразуем стили вашего редактора, выборочно переписывая или настраивая определенные селекторы CSS. Это также позволяет Гутенбергу использовать ваш стиль редактора при предварительном просмотре вариантов блока.

В моем случае body { height: 100% } становится .editor-styles-wrapper { height: 100% } . Это правило css, из-за которого метабоксы плагина перекрывают редактор. Удаление height: 100% из элемента body решило проблему для меня.

В моем случае body {height: 100%} становится .editor-styles-wrapper {height: 100%}. Это правило css, из-за которого метабоксы плагина перекрывают редактор. Удаление высоты: 100% из элемента body решило проблему для меня.

Спасибо, что поделились этим, @bitwitch! @youknowriad, это похоже на то, что мы должны смягчить. Как вы думаете, следует ли нам удалить эту высоту при переписывании или создать отдельное правило в новой таблице стилей «нормализации», которое переопределяет высоту, чтобы она всегда была автоматической, возможно, с! Important и встроенным комментарием?

Могу я спросить, почему в стилях редактора есть body { height: 100% } ?

Основная причина того, что стили редактора включены в Gutenberg, заключается в том, что старые стили редактора не могут использоваться напрямую. Авторы тем должны проверить, совместимы ли их стили, а затем включить их.

Я не уверен, что нам стоит внедрять подобные хаки.

Могу я спросить, почему в стилях редактора есть body {height: 100%}?

Основной причиной для этого обычно является создание веб-сайтов, которые используют для элементов всю высоту окна браузера. Например, если у вас есть всплывающий элемент «в верхней части страницы», он всегда имеет высоту 100%. Или если вам нужно выровнять по нижнему краю что-то на странице, которая не прокручивается.

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

Могу я спросить, почему в стилях редактора есть body {height: 100%}?

Причина такого правила в моем случае заключается в том, что мы не используем отдельную таблицу стилей для редактора. Мы минимизируем CSS всего сайта в один файл, включая все CSS для пользовательских блоков. Правило «Рост: 100» действует на всем сайте. Мое намерение в публикации состояло в том, чтобы помочь другим, у кого может быть тот же источник проблемы, что и я, а не обязательно рекомендовать введение обходного пути со стороны Гутенберга.

Мне нечего добавить, кроме как сказать, что у меня была такая же проблема (Yoast SEO блокирует текст в редакторе страницы) до такой степени, что ее едва можно было использовать.

@PhotoCoog обычно возникает из-за плагина.

Можете ли вы открыть консоль JavaScript и посмотреть, есть ли там сообщения? В Chrome, mac это ⌘⌥J, в Firefox - ⌘⌥K, в Safari сначала нужно включить его, инструкции здесь: https://support.airtable.com/hc/en-us/articles/232313848-How- открыть консоль разработчика

В зависимости от того, есть ли сообщение в консоли, от этого зависят следующие шаги. Благодарю.

В нем есть следующее, в котором действительно упоминается проблема! Есть способ исправить это?

JQMIGRATE: Migrate установлен, версия 1.4.1
edit-post.min.js? ver = 3.1.11: 12 В вашем браузере используется режим совместимости.

Это может вызвать проблемы с рендерингом, такие как наложение блоков на мета-поля в редакторе. Quirks Mode может быть вызван ошибками PHP или HTML-кодом, появляющимся перед открытием. Попробуйте проверить исходный код страницы или журнал ошибок PHP вашего сайта и исправить там ошибки, удалив любой HTML перед типом документа или отключив плагины.

@PhotoCoog Спасибо, что посмотрели!

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

Исправьте эту проблему в стиле панели инструментов.

Добавьте этот хук в свою тему, functions.php

// Добавить стиль для панели управления, перекрывать мета-поля на сообщениях (редактор)
add_action ('admin_head', 'custom_metabox_style');

функция custom_metabox_style ()
{
эхо ' ';
}

@rendergraf Можете ли вы открыть консоль JavaScript и сообщить мне, если увидите там предупреждение? В Chrome, mac это ⌘⌥J, в Firefox - ⌘⌥K, в Safari сначала нужно включить его, инструкции здесь: https://support.airtable.com/hc/en-us/articles/232313848-How- открыть консоль разработчика

Я пробовал этот трюк с переполнением в прошлом, и у него есть неприятные побочные эффекты. Вдобавок, если вы _до_ видите предупреждение в консоли JS, это означает, что _ есть_ конфликт с подключаемым модулем, и реальное исправление состоит в исправлении этого подключаемого модуля.

@jasmussen в консоли не показывает ошибок, связанных с admin_head.

все работает правильно

Интересно! Спасибо, что ответили мне.

Если вы откроете веб-инспектор, будет ли первым в документе тип документа? Т.е.? Или есть что-нибудь до этого?

Нет, в моем случае это:

Пожалуйста, если вам нужна дополнительная информация о хуке admin_head, можете ли вы увидеть официальную документацию:
https://developer.wordpress.org/reference/hooks/admin_head/

Я надеюсь это поможет тебе

В моем случае проблема заключалась в коде CSS, отраженном на хуке admin_menu, я изменил ловушку на admin_bar_menu, и все вроде бы в порядке

Исправьте эту проблему в стиле панели инструментов.

Добавьте этот хук в свою тему, functions.php

// Добавить стиль для панели управления, перекрывать мета-поля на сообщениях (редактор)
add_action ('admin_head', 'custom_metabox_style');

функция custom_metabox_style ()
{
эхо ' ';
}

это работает

но почему это до сих пор не исправлено в самом WP.

Я столкнулся с этой проблемой вчера, после того, как обновился до Google Chrome версии 77.0.3865.75 на моем Mac. Я отключил все плагины браузера, проблема все еще существует.

Редактирование выполняется нормально в Google Chrome 76. Я обновил Chrome до версии 77 на этом компьютере, и проблема также появляется.

Я также без проблем тестировал Chrome Canary Version 79.0.3912.0 (Offizieller Build) canary (64-Bit).

И я тестировал с помощью firefox. Тоже никаких проблем.

Я столкнулся с этой проблемой вчера, после того, как обновился до Google Chrome версии 77.0.3865.75 на моем Mac. Я отключил все плагины браузера, проблема все еще существует.

Редактирование выполняется нормально в Google Chrome 76. Я обновил Chrome до версии 77 на этом компьютере, и проблема также появляется.

Я также без проблем тестировал Chrome Canary Version 79.0.3912.0 (Offizieller Build) canary (64-Bit).

И я тестировал с помощью firefox. Тоже никаких проблем.

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

// Добавить стиль для панели управления, перекрывать мета-поля на сообщениях (редактор)
add_action ('admin_head', 'custom_metabox_style');

функция custom_metabox_style ()
{
эхо ' ';
}

Я наблюдаю ту же проблему на нескольких сайтах, обновленных до 5.2.3. Настройки ACF, Yoast и RevSlider охватывают содержимое публикации, и если они свернуты, они останутся посередине содержимого при прокрутке. Пытался изолировать, отключая плагины и используя по одному, и поведение такое же.

Я подтверждаю.

Плагины: Yoast, ACF

Firefox 69.0

Хром 77.0.3865.75

Этот фрагмент кода немного исправляет поведение Chrome.

add_action('admin_head', 'custom_metabox_style');

function custom_metabox_style()
{
echo '<style>
.block-editor-writing-flow {
height: auto;}
</style>';
}

метабоксы сейчас внизу, но некоторые лаги сохраняются

add_action('admin_head', 'custom_metabox_style');
function custom_metabox_style() {
    echo '<style>.block-editor-writing-flow { height: auto; }</style>';
}

Работает на меня.
Win10, Google Chrome

Можно подтвердить, что эта проблема существует в Chrome 77.0.3865.75 на MacOS.

Вышеупомянутые решения относительно добавления height: auto; к .block-editor-writing-flow или overflow: auto; к .editor-writing-flow у меня не работали. Решение для меня добавляло:

add_action( 'admin_head', 'fix_overlapping_blocks' );
function fix_overlapping_blocks() {
    ?>
    <style>
        .edit-post-layout__content .edit-post-visual-editor {
            flex-basis: auto; // override the default flex-basis: 100%;
        }
    </style>
    <?php
}

@ TylerB24890
Я могу подтвердить ваше решение css.
То же решение сработало для меня.

Лучший
Патрик

Это происходит на 4 сайтах в 5.2.3 для нас. Исправление TylerB сработало для меня, хотя вам следует удалить комментарий //, поскольку это недопустимый комментарий CSS.
Вы также можете запустить это в консоли как временное исправление:
document.querySelector('.edit-post-layout__content .edit-post-visual-editor').style.flexBasis = 'auto'

.block-editor-writing-flow {
height: auto;}

Сработало у меня!

document.querySelector('.edit-post-layout__content .edit-post-visual-editor').style.flexBasis = 'auto'
это работает как временное решение, но почему по умолчанию оно не добавляется в ядро?

Вы также можете использовать:

#editor .edit-post-layout__content {
  display:block;
}

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

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

add_action( 'admin_head', 'fix_overlapping_blocks' );
function fix_overlapping_blocks() {  // fix the admin edit post with metabox
    ?>
    <style>
    #editor .edit-post-layout__content {
        display: block;
    }
    #editor .edit-post-layout__content .edit-post-visual-editor {
        flex-basis: auto;  /* override the default flex-basis: 100%;*/
        clear: both;
    }
    </style>
    <?php
}

Исправить с этим:
/* sort out floating metaboxes issue */ in file 'post_edit_styles.css' .block-editor-page .edit-post-visual-editor.editor-styles-wrapper { min-height: unset; }

Поставить в очередь только у администратора:
function function_name( $hook){ $screen = get_current_screen(); if ( ! is_admin() && $screen->id !== 'edit-post' ) { return; } $datetimeversion = date('YmdHis'); wp_enqueue_style( 'post_edit_styles', plugin_dir_url( __FILE__ ) . 'css/post-edit-page.css', array(), $datetimeversion, 'all' ); }