The following tips are requests from bloggers via the contact form asking how to delete CSS, Javascript, and Blogger Bundle Widgets on the template? Actually this method has a lot of sharing, but there is nothing wrong if this time Arlina Design shares these tips.
Removing CSS, Javascript, and Blogger Bundle Widgets is one of the optimizations to speed up blog loading by hiding CSS, Javascript, and blogger default Bundle Widgets that will automatically load when the blog is opened. For example if we check the blog on Google PageSpeed Insight , a warning will appear.
Of course, having a blog with fast loading will make visitors more comfortable and even easier for search engines to crawl your blog. Well, to overcome this problem we have to edit some HTML tags in the blog template so that the default CSS, Javascript, and Bundle Widget code is no longer automatically loaded on the blog.
If it's ready, please follow the steps below.
Open Blogger > Click the Theme menu > Click the Edit HTML button then find the opening code for the head below
Change with the code below
Next look for this code to hide CSS Reset
Change with the code below
Search for this code
Change with the code below
Next to the head cover code, look for this code
Change with the code below
The next step is to cover the body code, find this code
Change with the code below
Is it still advanced? Okay, there are still two more. Now in the HTML opening and closing code, look for this
code HTML opening code
Change with the code below
HTML closing code
Change with the code below
Well, it's done! Then click the Save theme button (click refresh if a warning popup appears from the Blogger page). How, easy enough isn't it? Please check your blog on Google PageSpeed Insight . If it has increased then the steps above are successfully applied to your blog.
I myself have done the optimization above on this blog, for the results you can check this link
We can know that the blog speed data will be updated every week, so wait at least one week then check the blog address again to find out the changes in the Speed PageSpeed Insight column.
As for the effects given after doing the optimization above, here are some improvements that I made on this blog
Blog pager
Please add or edit the CSS blog pager on the template
Contact form
The send button from the contact form widget will usually not work as before, please add this code after the HTML form of the contact code (Special contact form widget added on the static page)
Replace all codes marked with your URL and blog ID . Read more here: The Latest Ways to Add Contact Forms on the Blog
That's the answer to the bloggers' questions about How to Delete CSS, Javascript, and Blogger Bundle Widgets . Hopefully useful and cautious.
Why do you have to delete CSS, Javascript, and Blogger Bundle Widgets?
Removing CSS, Javascript, and Blogger Bundle Widgets is one of the optimizations to speed up blog loading by hiding CSS, Javascript, and blogger default Bundle Widgets that will automatically load when the blog is opened. For example if we check the blog on Google PageSpeed Insight , a warning will appear.
Of course, having a blog with fast loading will make visitors more comfortable and even easier for search engines to crawl your blog. Well, to overcome this problem we have to edit some HTML tags in the blog template so that the default CSS, Javascript, and Bundle Widget code is no longer automatically loaded on the blog.
If it's ready, please follow the steps below.
How to delete CSS, Javascript, and Blogger Bundle Widgets
Open Blogger > Click the Theme menu > Click the Edit HTML button then find the opening code for the head below
<head>
Change with the code below
<head>
Next look for this code to hide CSS Reset
<b:skin><![CDATA[
Change with the code below
<style type="text/css">
<!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>
Search for this code
]]></b:skin>
Change with the code below
</style>
Next to the head cover code, look for this code
</head>
Change with the code below
</head><!--<head/>-->
The next step is to cover the body code, find this code
</body>
Change with the code below
<!--</body>--></body>
Is it still advanced? Okay, there are still two more. Now in the HTML opening and closing code, look for this
code HTML opening code
<html>
Change with the code below
<HTML expr:dir='data:blog.languageDirection'>
HTML closing code
</html>
Change with the code below
</HTML>
Well, it's done! Then click the Save theme button (click refresh if a warning popup appears from the Blogger page). How, easy enough isn't it? Please check your blog on Google PageSpeed Insight . If it has increased then the steps above are successfully applied to your blog.
I myself have done the optimization above on this blog, for the results you can check this link
We can know that the blog speed data will be updated every week, so wait at least one week then check the blog address again to find out the changes in the Speed PageSpeed Insight column.
Some improvements After Removing CSS, Javascript, and Blogger Bundle Widgets
As for the effects given after doing the optimization above, here are some improvements that I made on this blog
Blog pager
Please add or edit the CSS blog pager on the template
#blog-pager-newer-link{float:left}
#blog-pager-older-link{float:right}
#blog-pager{text-align:center}
Contact form
The send button from the contact form widget will usually not work as before, please add this code after the HTML form of the contact code (Special contact form widget added on the static page)
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '7342017194742683056';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d7342017194742683056','//www.arlinadzgn.com/','7342017194742683056');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Sending...', 'contactFormMessageSentMsg': 'Your message has been sent.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'A valid email address is required.', 'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title': 'Contact Form', 'blogId': '7342017194742683056', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]>
</script>
Replace all codes marked with your URL and blog ID . Read more here: The Latest Ways to Add Contact Forms on the Blog
That's the answer to the bloggers' questions about How to Delete CSS, Javascript, and Blogger Bundle Widgets . Hopefully useful and cautious.
image quote pre code