Как удалить из верхней части страницы код Javascript

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

Для того, чтобы улучшить время загрузки вашего блога WordPress, Google рекомендует переместить код Javacsript и CSS из верхней части страницы HTML вниз.

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

Я напишу вам сейчас простое решение.

Желательно, мой пример, который я опишу, применить не на «живом» сайте. И еще желательно, понимать немного о каких функциях в примере идет речь и где они расположены.

Первый шаг.

Добавляем следующий код в файл functions.php вашей активной темы:

/**
* Filter HTML code and leave allowed/disallowed tags only
*
* @param string $text Input HTML code.
* @param string $tags Filtered tags.
* @param bool $invert Define whether should leave or remove tags.
* @return string Filtered tags
*/
function theme_strip_tags_content($text, $tags = », $invert = false) {

preg_match_all( ‘/<(.+?)[\s]*\/?[\s]*>/si’, trim( $tags ), $tags );
$tags = array_unique( $tags[1] );

if ( is_array( $tags ) AND count( $tags ) > 0 ) {
if ( false == $invert ) {
return preg_replace( ‘@<(?!(?:’. implode( ‘|’, $tags ) .’)\b)(\w+)\b.*?>.*?@si’, », $text );
}
else {
return preg_replace( ‘@<(‘. implode( ‘|’, $tags ) .’)\b.*?>.*?@si’, », $text );
}
}
elseif ( false == $invert ) {
return preg_replace( ‘@<(\w+)\b.*?>.*?@si’, », $text );
}

return $text;
}

/**
* Generate script tags from given source code
*
* @param string $source HTML code.
* @return string Filtered HTML code with script tags only
*/
function theme_insert_js($source) {

$out = »;

$fragment = new DOMDocument();
$fragment->loadHTML( $source );

$xp = new DOMXPath( $fragment );
$result = $xp->query( ‘//script’ );

$scripts = array();
$scripts_src = array();
foreach ( $result as $key => $el ) {
$src = $result->item( $key )->attributes->getNamedItem( ‘src’ )->value;
if ( ! empty( $src ) ) {
$scripts_src[] = $src;
} else {
$type = $result->item( $key )->attributes->getNamedItem( ‘type’ )->value;
if ( empty( $type ) ) {
$type = ‘text/javascript’;
}

$scripts[$type][] = $el->nodeValue;
}
}

//used by inline code and rich snippets type like application/ld+json
foreach ( $scripts as $key => $value ) {
$out .= ‘<script type="'.$key.'">';

        foreach ( $value as $keyC => $valueC ) {
            $out .= "\n".$valueC;
        }

        $out .= '</script>‘;
}

//external script
foreach ( $scripts_src as $value ) {
$out .= ‘<script src="'.$value.'"></script>‘;
}

return $out;
}

Второй шаг

Редактируем файл header.php. Найдем функцию wp_head() и заменим ее кодом:

<?php
ob_start();
wp_head();
$themeHead = ob_get_contents();
ob_end_clean();
define( 'HEAD_CONTENT', $themeHead );

$allowedTags = '<style><link><meta><title>‘;
print theme_strip_tags_content( HEAD_CONTENT, $allowedTags );
?>

И в завершении, в файле footer.php перед закрывающимся тегом BODY добавьте

<?php theme_insert_js( HEAD_CONTENT ); ?>
Важно! Эта запись может содержать ссылки на плагины, которые к моменту вашего чтения и скачивания могут работать не корректно. Будьте внимательны.

2 Comments

  • · Edit

    Попытался реализовать на сайте,установленном на денвере.После того как вставил код в файле functions сайт перестал отображаться, появилось сообщение об ошибке Parse error: syntax error, unexpected T_STRING in Z:\home\localhost\www\myblog\wp-content\themes\twenty-plus-lite\functions.php on line 194 Вот эта строчка 194 $src = $result->item ( $key ) ->attributes->getNamedItem ( ‘src’ ) ->value;
    код вставлял в конце файле functions, вроде бы ничего не пропустил, если можно, то посоветуйте в чем причина, установлена дочерняя тема twentytwelve
    Спасибо

    Ответить
    • Автор · Edit

      Функция, которую я вставил в статье, «обрезалась» и опубликована не корректно.Перейдите сюда.
      На этой странице в пункте #3 вы найдете пример, который я пытался опубликовать.

      Ответить

Добавить комментарий

Ваш email нигде не будет показан. Обязательные поля помечены *