0
78
2019-01-05

Autoptimize - Перемещаем блок вывода стилей Autoptimize ниже блока вывода метаданных Yoast

В данном уроке рассмотрим решение которое позволит перенести блок вывода метаданных Yoast выше вставки CSS кода, генерированного плагином Autoptimize
Понравилась страница? Поставь свою оценку!
PLUGIN_STAR_RATINGS.SCORE_TEXTPLUGIN_STAR_RATINGS.VOTES_TEXT

Здравствуйте друзья, совсем недавно у меня возникла серьезная задача. Данная задача заключается в том что в теле html страницы, код блока со стилями (.css) Autoptimize выводился раньше чем блок с метаданными которые выводились при помощи плагина Yoast. На сайте клиента нужно было все стили вывести не в отдельном css файле, а внедрить стили в тело страницы (вся штука в том что на сайте клиента было такое огромное количество контента и его составляющих, что вывод всех стилей элементов в отдельном файле существенно замедлял прогрузку контента страницы). Но в начале после того как стили (выводимые Autoptimize плагином) были вставлены в тело страницы, полностью (а где-то частично) "слетал" вывод метаданных. То есть мне нужно было переместить вывод стилей Autoptimize ниже блока с выводом метаданных Yoast. Более детально отобразил на скриншоте ниже (на скриншоте я вывел стили в css файле, чтобы было более наглядно).

Вывод кода плагинов Yoast и Autoptimize

В итоге решить данную задачу мне помогли ребята из поддержки плагина Autoptimize, При помощи кода ниже вывод стилей выводимых при помощи плагина Autoptimize происходит прямо перед закрытием тега </head>.

add_filter('autoptimize_filter_css_replacetag','SDStudio_css_replacetag',10,1);
function SDStudio_css_replacetag($replacetag) {
    return array("</head>","before");
    }

При разгоне сайтов считаю данный сниппет крайне полезным в случае если нет другого варианта кроме как вставить стили сайта в тело страницы. Хотя от себя добавлю что в идеале правильно стили подключать в отдельном файле. Прибегать к вставке стилей в HTML код страницы, нужно только в крайних случаях, когда скорость уже начинает зависеть от объёма файла со стилями CSS.