#javascript #php #jquery #css #wordpress
#javascript #php #jquery #css #wordpress
Вопрос:
У меня происходит конфликт CSS с основным плагином на моем сайте WordPress. Создатель плагина счел удобным добавить объявления !important во все свои таблицы стилей. С точки зрения разработчика; это катастрофа. В свою защиту они хотят охватить все темы, в которых используются объявления !important, чтобы это выглядело согласованно. Я не согласен, поэтому мне нужно решение.
Что происходит, так это то, что моя премиум тема, которая не использует эти объявления, не может переопределить стиль. У меня есть несколько решений для удаления определенных классов с помощью jQuery.
Но есть проблема, которая не может быть решена путем удаления классов. Например, привязка :hover
по умолчанию, как border: none !important
в плагине. Но я хотел бы видеть, что опция привязки: наведение границы фактически применяется через настройки темы. Применяемый CSS таков (имейте в виду, что .plugin
класс не применяется в привязке, только из файла CSS):
.plugin a { border: none !important; }
Есть ли какой-либо способ отключить определенные комбинации классов из DOM? Я рад, что это сделано с помощью php
or jQuery
. Что-то вроде: .plugin is not applied to anchor
Я понятия не имею, как это решить.
Комментарии:
1. Я пытался удалить файл CSS с помощью jQuery, но это устраняет также некоторые необходимые стили.
Ответ №1:
Конечно, это всего лишь случай перезаписи css с помощью более точно указанной строки css.
Например, если код является:
.plugin a::hover { border: none !important; }
Вы можете перезаписать это, выполнив:
body .plugin a::hover { border: 1px solid grey !important; }
Поскольку вы добавили элемент body в свою строку css, это добавляет дополнительную специфичность, то есть перезаписывает css плагинов. К сожалению, вам придется использовать !important , поскольку !important выбрасывает обычную спецификацию, исключающую окно (плохой создатель плагина).
Комментарии:
1. Спасибо за ваш ответ, это альтернативное решение, но я бы хотел, чтобы настройки темы использовали стиль привязки. Потому что я стремлюсь к последовательному способу оформления.
2. Извините, мой ответ был предоставлен на основе обновления вашей темы, так что ваша тема перезаписывается, если это невозможно, то простого способа сделать это нет.
Ответ №2:
Вам нужен какой-либо из стилей, предоставляемых плагином? Если нет, то, возможно, стоит подумать о полном удалении стилей плагина из очереди и просто добавить свои собственные стили, где тема этого не касается.
Если вы узнаете зарегистрированное имя таблицы стилей (должно быть в теге style), вы можете удалить его из очереди с помощью чего-то вроде:
function remove_push_plugin_styles() {
wp_dequeue_style( 'plugin-stylesheet' );
}
add_action( 'wp_print_styles', 'remove_pushy_plugin_styles', 1000 );
Ответ №3:
Вы не можете редактировать содержимое iframe, верно. Но сам iframe по-прежнему принадлежит вашей странице, и вы можете редактировать атрибуты. Я только что протестировал и смог сделать что-то похожее на:
var i = $('div.item iframe');
// Did the selector work?
console.log(i.length);
i.removeAttr('width');
i.removeAttr('height');
Как говорится, использование !important в этой ситуации неплохо. Если вы беспокоитесь об обслуживании CSS, оставьте комментарий, что !important переопределяет атрибуты элемента. !important часто демонизируется, но в данном случае это допустимое использование для повышения специфичности вашего CSS.
Преимущество выполнения этого в CSS заключается в том, что это будет применяться до загрузки вашего JavaScript, поэтому вы не получите доли секунды применения этих атрибутов и стилей до того, как JavaScript удалит стили.
Комментарии:
1. iframe? Где вы видите это в моем вопросе?