Вы также можете заказать:
Верстку
Шаблон
Плагин

Оптимизируем сайт на WordPress без плагина

Оптимизация сайта является одним из важных моментов при создании сайта, и не имеет значения на wordpress он или еще на какой либо CMS. И конечно нужна всем без исключения.

А так как мы говорим о WordPress то попробуем оптимизировать его в своей теме, итак приступим.

Открываем файл functions.php который находится в папке вашей темы и проверьте что скрипты у вас подключены через функцию wp_enqueue_script, так как при работе на некоторых сайтах я видел упрощенное подключение в html коде, когда в head просто вставляют такую конструкцию – <script src=”<?= bloginfo(‘template_directory’); ?>/js/script.js”></script> и если у вас такое подключение стилей и скриптов то рекомендую перенести их в файл functions.php что будет более правильно.

И переносим все скрипты в подвал вот таким образом:


function footer_all_scripts() {

// Сначала удаляем из wp_head
remove_action('wp_head', 'wp_print_scripts');
remove_action('wp_head', 'wp_print_head_scripts', 9);
remove_action('wp_head', 'wp_enqueue_scripts', 1);

// и добавляем в wp_footer
add_action('wp_footer', 'wp_print_scripts', 5);
add_action('wp_footer', 'wp_enqueue_scripts', 5);
add_action('wp_footer', 'wp_print_head_scripts', 5);
}
add_action('after_setup_theme', 'footer_all_scripts');

Теперь нужным нам скриптам добавим атрибут defer (отложенная загрузка) или async (асинхронная загрузка)
Делаем по аналогии

&lt;/pre&gt;
function theme_add_defer_attribute( $tag, $handle ) {
$handles = array(
'form-js', // идентификатор обработчика, можно увидеть в&nbsp;&nbsp;wp_enqueue_script первый параметр
'mainscript-js',
'slick-js',
);

foreach( $handles as $defer_script) {
if ( $defer_script === $handle ) {
return str_replace( ' src', ' defer="defer" src', $tag );
}
}

return $tag;
}
add_filter( 'script_loader_tag', 'theme_add_defer_attribute', 10, 2 );
&lt;pre&gt;

Выполнив эти действия вы уже поднимите результаты скорости своего сайта по Google PageSpeed Insights

Используем кэш, убираем лишнее

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

Если вы не разработчик и мало смыслите в коде то можно использовать готовое решение, все их я называть не буду а приложу ссылку на один из популярных плагинов  WP Super Cache которым пользуются многие владельцы сайтов на WordPress, но я не любитель этого плагина (не знаю правда может в последних версиях разработчики поправили свой код) из-за того что при его деактивации и удалении он не подчищает за собой мусор, поэтому я прописываю в файле .htaccess

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

  1. <IfModule mod_expires.c>
  2. ExpiresActive On
  3. ExpiresByType application/javascript ‘access plus 1 year’
  4. ExpiresByType text/javascript ‘access plus 1 year’
  5. ExpiresByType text/css ‘access plus 1 year’
  6. ExpiresByType image/gif ‘access plus 1 year’
  7. ExpiresByType image/jpeg ‘access plus 1 year’
  8. ExpiresByType image/png ‘access plus 1 year’
  9. </IfModule>
  10. <IfModule mod_headers.c>
  11. <FilesMatch .*\.(js|css)$>
  12. Header set Cache-control: private
  13. </FilesMatch>
  14. <FilesMatch .*\.(gif|jpg|png)$>
  15. Header set Cache-control: public
  16. </FilesMatch>
  17. </IfModule>
  18. <IfModule mod_setenvif.c>
  19. BrowserMatch ‘MSIE’ force-no-vary
  20. BrowserMatch ‘Mozilla/4.[0-9]{2}’ force-no-vary
  21. </IfModule>
  22. FileETag MTime Size
  23. <ifmodule mod_expires.c>
  24. <filesmatch ‘.(jpg|jpeg|gif|png|ico|css|js)$’>
  25. ExpiresActive on
  26. ExpiresDefault ‘access plus 1 month’
  27. </filesmatch>
  28. </ifmodule>

Способ 2 (на многих серверах работает этот код)

  1. ## EXPIRES CACHING ##
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access 1 year"
    ExpiresByType image/jpeg "access 1 year"
    ExpiresByType image/gif "access 1 year"
    ExpiresByType image/png "access 1 year"
    ExpiresByType text/css "access 1 month"
    ExpiresByType text/html "access 1 month"
    ExpiresByType application/pdf "access 1 month"
    ExpiresByType text/x-javascript "access 1 month"
    ExpiresByType application/x-shockwave-flash "access 1 month"
    ExpiresByType image/x-icon "access 1 year"
    ExpiresDefault "access 1 month"
    </IfModule>
    ## EXPIRES CACHING ##

И туда же вставляю gzip сжатие


  1. # compress text, html, javascript, css, xml:
  2. AddOutputFilterByType DEFLATE text/plain
  3. AddOutputFilterByType DEFLATE text/html
  4. AddOutputFilterByType DEFLATE text/xml
  5. AddOutputFilterByType DEFLATE text/css
  6. AddOutputFilterByType DEFLATE application/xml
  7. AddOutputFilterByType DEFLATE application/xhtml+xml
  8. AddOutputFilterByType DEFLATE application/rss+xml
  9. AddOutputFilterByType DEFLATE application/javascript
  10. AddOutputFilterByType DEFLATE application/x-javascript
  11. # Or, compress certain file types by extension:
  12. SetOutputFilter DEFLATE

 

 

Оставить отзыв

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*