Приветствую! В этом уроке рассмотрим, как ускорить wordpress путем правки кода. Многие коды в шаблоне блога дают запросы к базе данных, которые вовсе не обязательны. Подкорректировав некоторые файлы шаблона, можно добиться лучшей скорости загрузки.
Как я писал в прошлом уроке, загрузка страницвлияет на выдачу в поисковых системах. Блог, который загружается медленно, имеет меньше посещаемость и большее количество отказов.
Веб-мастера большее внимание уделяют скорости загрузки страниц, потому что это не только удобство работать с сайтом или блогом, но и один из самых важных показателей.
Как ускорить WordPress? Оптимизация шаблона
Теперь перейдем к правке кода. В файле шаблона header.php надо подправить коды, которые создают дополнительные запросы к базе.
Сделайте резервную копию всего шаблона. Если где-то допустите ошибку, то всегда сможете восстановить поврежденные файлы. Лучше, если Вы сделаете резервную копию всего блога. После каждого изменения в файлах, проверяйте блог, как он работает. Если все нормально, можно переходить к следующему шагу.
Перед тем, как править коды в шаблоне, установите следующей код в footer.php:
<?php echo get_num_queries(); ?> Запросов <?php timer_stop(1); ?> Секунд
Этот код в подвале Вашего блога будет отображать количество запросов к базе данных и скорость загрузки страниц. Так Вы сможете отслеживать все изменения в блоге.
Правка кода header.php
Подключитесь к серверу, где находится Ваш блог, найдите файл header.php в теме Вашего блога и скопируйте его на компьютер. Откройте этот файл в редакторе Notepad++ и найдите строку:
<html <?php language_attributes(); ?>>
замените ее на код
|
1 |
<html dir="ltr" lang="ru-RU"> |
Эта функция возвращает атрибут для тега HTML
Следующий код сообщает браузеру, какую кодировку нужно использовать.
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
Замените эту строку на
|
1 |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
Теперь найдите в этом же файле header.php строку:
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
Этот код может выглядеть немного иначе. Если такой код присутствует в Вашем файле — удалите его. Он выводит версию WordPress, что не совсем безопасно для Вашего блога. С помощью этого кода взламывают некоторые версии WordPress.
Если в Вашем файле header.php присутствуют похожие коды:
<link rel=»stylesheet» href=»<?php echo THEMATER_URL; ?>/css/reset.css» type=»text/css» media=»screen, projection» />
и
<link rel=»stylesheet» href=»<?php echo THEMATER_URL; ?>/css/defaults.css» type=»text/css» media=»screen, projection» />
Замените их на статические. Статические коды Вы можете найти с помощью открытого кода. Найдите в файле header.php код, который выводит фавикон, и замените его.
<link rel="shortcut icon" type="image/ico" href="<?php bloginfo('template_directory'); ?>/favicon.ico" />
Что такое фавикон, Вы можете почитать в этой статье.
Замените следующий код на статический:
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed"href="<?php bloginfo('rss2_url'); ?>" />
Этот код указывает путь к RSS ленте.
Найдите в файле следующие два кода, которые отвечают за вывод заголовка и описания Вашего блога:
<?php bloginfo('name'); ?>
и следующий код:
<?php bloginfo('description'); ?>
Замените эти два кода статическими.
Возможно у Вас в файле header.php имеется описание для верхнего меню. Можно самому прописать описание через URL на главную страницу. Код может выглядеть так:
<a href="<?php echo get_option('home'); ?>/">Главная</a>
Можно его заменить на следующий код:
<a href="https://dvpress.ru/" title="Уроки WordPress для начинающих | Настройка и раскрутка блога. Книги по заработку в Интернете, бесплатные видео-курсы">Главная</a>
Перенос Java Scripts в Footer.php
При загрузке блога, первым делом загружается файл header.php а потом все остальное. Наша задача, сделать так, чтобы этот файл загружался как можно быстрее. Header.php содержит в себе скрипты, которые можно перенести в footer.php. Footer.php — это низ (подвал) Вашего блога, и загружается в последнюю очередь. Если перенести скрипты в подвал, то страницы блога будут загружаться быстрее.
Откройте файл header.php Вашей темы и найдите там скрипты. Скрипты имеют теги <script></script>. Скрипт может выглядеть так:
<script src=»<?php bloginfo(‘template_directory'); ?>/jdgallery/mootools-1.2-more.js» type=»text/javascript»></script>
Возможно, при переносе скриптов блог перестанет правильно работать, тогда восстановите все файлы обратно.
Теперь мы установим кэш в браузере посетителей нашего блога.
Установка кэша в браузере посетителей
Не буду в этом уроке вдаваться в подробности кэша, потому что об этом я более подробно расскажу в следующем уроке. В следующем уроке я буду описывать плагин WP-Super Cache, который кэширует страницы, за счет чего Ваш блог будет загружаться еще быстрее.
Установите в файле .htaccess следующий код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
# кеширование в браузере на стороне пользователя <IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access 7 days" ExpiresByType application/javascript "access plus 1 year" ExpiresByType text/javascript "access plus 1 year" ExpiresByType text/css "access plus 1 year" ExpiresByType text/html "access plus 7 day" ExpiresByType text/x-javascript "access 1 year" ExpiresByType image/gif "access plus 1 year" ExpiresByType image/jpeg "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType image/jpg "access plus 1 year" ExpiresByType image/x-icon "access 1 year" ExpiresByType application/x-shockwave-flash "access 1 year" </IfModule> # Cache-Control <ifModule mod_headers.c> # 30 дней <filesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$"> Header set Cache-Control "max-age=2592000, public" </filesMatch> # 30 дней <filesMatch "\.(css|js)$"> Header set Cache-Control "max-age=2592000, public" </filesMatch> # 2 дня <filesMatch "\.(xml|txt)$"> Header set Cache-Control "max-age=172800, public, must-revalidate" </filesMatch> # 1 день <filesMatch "\.(html|htm|php)$"> Header set Cache-Control "max-age=172800, private, must-revalidate" </filesMatch> </ifModule> # использование кеша браузеров FileETag MTime SIZE <ifmodule mod_expires.c> <filesmatch ".(jpg|jpeg|gif|png|ico|css|js)$"> ExpiresActive on ExpiresDefault "access plus 1 year" </filesmatch> </ifmodule> #Запрет отдачи HTTP-заголовков VARY браузерам семейства MSIE <IfModule mod_setenvif.c> BrowserMatch "MSIE" force-no-vary BrowserMatch "Mozilla/4.[0-9]{2}" force-no-vary </IfModule> |
Когда установите данный код, блог будет загружаться быстрее. Как это происходит? При первом посещении Вашего блога, страница будет загружаться как обычно. Но при переходе на другие страницы, они станут загружаться значительно быстрее. Это происходит за счет того, что сформированная страница Вашего блога сохраняется в кэше браузера посетителя.
Каждая страница блога содержит заголовок (header.php), сайдбар (sidebar.php) и подвал (footer.php). Все эти файлы будут загружаться уже не с сервера, где установлен Ваш блог, а с браузера посетителя, т. е. с кэша браузера. Более подробно я опишу процесс кэширования в следующем уроке.
Оптимизируем таблицы стилей CSS
Таблицы стилей находятся у нас в шаблоне блога, а если точнее, то в файле style.css и других файлах. Подключитесь к серверу через FTP и найдите в шаблоне Вашего блога файл style.css. Сделайте резервную копию этого файла в виде архива zip или rar.
В будущем, если Вы захотите отредактировать файл стилей, то Вам понадобиться оригинал этого файла. После сжатия, этот файл потеряет нормальный вид, поэтому в кодах CSS разобрать что-либо будет невозможным. Перейдем теперь к самому процессу сжатия CSS. Откройте файл style.css редактором Notepad++ и скопируйте все содержимое этого файла.
Перейдите по этой ссылке http://www.cssdrive.com/index.php/main/csscompressor/ и вставьте скопированный код файла стилей style.css в окно, как показано на скриншоте:
После того, как Вы нажмете кнопку «Compress-it» (сжать), в окне код уже будет выглядеть в сжатом виде. Скопируйте его и вставьте в файл style.css. Теперь файл stylee.css и style.zip скопируйте на сервер в тему Вашего блога.
Для изменений кода в запросе к базе данных, достаточно просмотреть код страницы из браузера, зайти в редактор темы да поменять большинство запросов к базе. По крайней мере я так и делал.
Полностью согласен!
Лучше открутите плюшки и плагины типа падающего снега, бегающего кота за указателем мыши и крутящихся меток — толку будет больше. 90% плагинов кроме тормозов и сомнительных красивостей ничего не несут.
Все эти припарки дают выигрыш сотые секунд при нормальной скорости Интернета и сервера. И то и другое сегодня на высоте, по гнилому телефонному кабелю никто не сидит. Подобные эксперименты — только для общего развития, да новичкам нервы пощекотать. И не парьтесь.
все сделал, ничего не сломалось, но и никаких результатов, к сожалению, не принесло: количество обращений к базе и время загрузки не сократилось…а щастье было так близко и так возможно)) 😐
Не раскрыта тема удаления или объединения screen.css print.css . Куда их девать?
А, понял, это сохраненный оригинал файла. Вопрос снят!
Кстати, style.zip — каким образом получается? Откуда он вообще берется? Спасибо заранее!
Спасибо! А-то я уже голову сломал :), теперь все понятно!
Рустам, приветствую!
Конечно же это ошибка. Нет в теме wordpress такого файла style.php, но только style.css! Странно, тысячи людей прочитало статью, и никто не заметил этой ошибки. Спасибо, Рустам! Я уже исправил.
Здравствуйте! «Скопируйте его и вставьте в файл style.php. Теперь файл stylee.php и style.zip скопируйте на сервер в тему Вашего блога.» вы не ошиблись? Может stylee.CSS? У меня php файла нет. Я новичок в этом деле, но точно говорю — style.php у меня нет. Спасибо за статью, но последнее не понял.
Верно, Алексей, в коды все равно придется лезть. Не обязательно быть программистом, чтобы подправить некоторые моменты в шаблоне.
Я хотел обратится к тем, кто боится лезть в коды. Если туда не лезть, то рано или поздно проблемы возникнут. Ведь никто темы не делает бесплатные просто так. А убирать ссылки на сторонние ресурсы придется. Конечно, с дорогим тарифом не чувствуешь нагрузки на сайт, особенно если посетителей немного.
Но все равно придется знакомиться с HTML,CSS, PHP, если хочешь заниматься сайтом или блогом. Или прослушать нужные курсы. А уж как Юрий хорошо объясняет, так это вдвойне легче делать становиться. Только не забывать копии сохранять файлов, чтобы в случае неприятности быстро восстановить. Если не получиться сделать, можно у хостеров попросить, и они всегда откатят Вам версию назад на нужное вам время.
Главное, не паниковать. Сам через это проходил не раз.
Спасибо за полезную информацию,я вот почему то любопытная и мне хочется самой полазить в кодах. Но на это нужно время и чтобы ни кто тебе не мешал. Но я попробую. Хотелось бы освоить программу Notepad++
Да, мне тоже что то страшновато всё это делать.
Людмила, поэтому и надо всегда делать резервную копию того, что редактируете
Юрий, а когда в этом толком не понимаешь, наверное, не стоит в коды и лезть? Мне, например, страшновато. Пускай будет как есть. Здесь уже нужны знания программиста