Если проверять скорость загрузки вашего блога Blogger с помощью гугловского сервиса PageSpeed Insights, то в графе “Оптимизация” обнаруживаются стандартные файлы Blogger, которые блокируют отображение, а именно файлы Bundle:
- для мобильной версии они имеют вид:
widgets/117…-widget_css_mobile_2_bundle.css - для ПК -
widgets/272…-css_bundle_v2.css
Сегодня мы будем удалять данные файлы. К сожалению, стандартного решения нет, но существуют определенные шаги, которые помогут избавится вам от файлов Bundle v2 и mobile Bundle.
В некоторых блогах Blogger встречаются также файлы dyn-css/authorization.css, блокирующие загрузку. Удаляя файлы bundle_v2.css, вы одновременно удалите и dyn-css/authorization.css.Удалив ненужные файлы, вы можете значительно увеличить скорость загрузки вашего блога.
Итак, приступим к удалению файлов Bundle:
Сначала вам нужно найти файлы Bundle в шаблоне вашего блога. При просмотре страницы вашего сайта в браузере, нажмите на CTRL + U и найдите ссылку, похожую на эту:https://www.blogger.com/static/v1/widgets/2727757643-css_bundle_v2.cssУ вас будет своя ссылка, поэтому не нужно копировать мой вариант. Перейдите по найденной ссылке, и вы увидите css код. Скопируйте его в блокнот и сохраните. В дальнейшем этот код нам понадобится. Это Bundle_v2 для десктопной версии вашего блога.
Теперь просмотрите в браузете мобильную версию вашего блога. Для этого допишите к вашему адресу окончание ?m=1 , т.е. перейдите по ссылке https://вашблог/?m=1 Снова просмотрите код html страницы при помощи горячих клавиш CTRL + U, найдите css файл Bundle для мобильной версии (mobile_2_bundle.css). У меня это ссылка:
https://www.blogger.com/static/v1/widgets/1171200566-widget_css_mobile_2_bundle.cssУ вас будет своя ссылка. Перейдите по ссылке и скопируйте весь код в пустой блокнот. Сохраните под именем mobile_2_bundle.
Теперь переходим к редактированию шаблона блога.
- Перед внесением изменений обязательно сделайте резервную копию шаблона блога!
- Найдите тег </head> и вставьте над ним следующий код:
<b:if cond='data:blog.isMobile'>
<style type='text/css'>
Код Bundle_v2
</style>
<b:else/>
<style type='text/css'>
Код mobile_2_bundle
</style>
</b:if>
>> Вы можете подключить css файлы через <link href='ссылка, куда залит css файл' rel='stylesheet' type='text/css' /> - Найдите в шаблоне вашего блога тег <head> и замените его на <head>
- Найдите в шаблоне тег </head>, замените его на </head><!--<head/>—>
- Сохраните изменения. Проверьте блог на наличите файлов Bundle. Если это не помогло, то продолжайте изменения шаблона.
- Найдите тег <b:skin><![CDATA[ и замените его на
<style type="text/css">
<!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>
Найдите тег ]]></b:skin> и замените его на </style> - Сохраните изменения. Проверьте ваш шаблон на наличие файлов Bundle. Если они еще присутствуют, то найдите тег </body> и замените его на <!--</body>--></body>
- Снова проверьте шаблон. Измените <html на <HTML и </html> на </HTML>
- Если в ходе преобразований шаблон “поплыл” (проверяйте и мобильную версию тоже!), то внесите поправки в файлы css.
1 комментарий :
Спасибо
Подписаться на комментарии блога: RSS
Отправить комментарий
Комментарии, содержащие ненормативную лексику, спам, оскорбления, публиковаться не будут. Ели вы хотите опубликовать код в комментарии, то воспользуйтесь encoder HTML
Публикуя комментарии, вы соглашаетесь с политикой конфиденциальности