Memaparkan catatan dengan label optimization. Papar semua catatan
Memaparkan catatan dengan label optimization. Papar semua catatan

Khamis, 1 November 2012

Blogspot image host secret

Blogspot image secret is only a URL secret not the image. And actually the image is not secret but the Image url. The secret is only the resolution of image, we can change it like we want. This secret maybe you already know, but i share just for people who don't know.

How to change blogspot image resolution

So it's very easy, look at this image below:
The URL of that image is https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGZXeKn20q1BaJWZ09C5jelpgGWPJVa3nazBF3kmwDGXnDfWNwnXv9SUOJLqWWjZqNgJwdubw8rkzhopeDl3QXh7cEfoappMJ18SwoDRH18d7CCCKLmoZDNwygBd4Q-EDik7MHzZjWRHe9/s320/400955_2375618285276_2146237091_n.jpg, then just change the s320 red code, with another resolution, but maximal resolution is s1600.

Sabtu, 20 Oktober 2012

How to remove blogger CSS reset stylesheet (widget bundle)

I will share now, share what?, the trick for remove the CSS reset stylesheet in blogger. Maybe if you don't know about this code, you may not so like this article, but if you're understand many blogger code, you may think this article is very-very helpful. But why many peoples want to remove this code from HTML?, because, this is a CSS reset code of blogger, and if you're template designer, you may hate this code, because it's make multiple CSS and crashing CSS code. If you're not understand about blogger code, don't follow this tutorial!.


How to remove <link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' /> in blogger?

How to remove <link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/4219271310-widget_css_2_bundle.css' /> in blogger?


WARNING!
Removing this code maybe can make your template destroyed, if you use official widget from blogger, the style can be totally changed. If you're don't understand about this code, don't do this. This tutorial is ADVANCED tutorial, not recommended for newbie or intermediate coder.


Explanation

This tutorial is not real removing the code, but this tutorial is make that code is ignored by browser and not make blog CSS code replaced. It's simply this tutorial is just converting that code to HTML comments, why HTML comments?, HTML comments is ignored by browser, because that i just converting but not removing, and this tutorial can effecting page speed score in Gtmetrix.....

Ok now for tutorial.

Tutorial

  1. Open blogger, edit HTML, and backup your template for safety.
  2. Edit HTML, proceed, then CTRL+F this code: <b:skin><![CDATA[
  3. If you have found that code, in below that code you may found your CSS (of course XD), now block from below that code to before ]]></b:skin>, or block all your CSS and CTRL+X, paste in notepad.
  4. Then the remaining code is <b:skin><![CDATA[    ]]></b:skin>
  5. Block that code and replace it with this code:
    &lt;style type=&quot;text/css&quot;&gt;
    &lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>
  6. Then below the replaced code, place this code:
    <style type='text/css'>

    YOUR CSS FROM NOTEPAD

    </style>
  7. Then below the <style type='text/css'> that you placed below the ]]></b:skin>, paste your all CSS from notepad.
  8. Then save template.
  9. You're finish!

Checking

Open your blog, then CTRL+U,  if you found code like this:
<style type="text/css">
<!-- /*<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' />
<style id='page-skin-1' type='text/css'><!--
*/
--></style>
If you found that code in page source and all the color of that is black, it means the stylesheet link is ignored by browser and you're succes.

Or you can open http://www.gtmetrix.com then type your blog in the form, if the site finish checking, you may found the tab 'remove unused CSS', if you click, and you not found this code <link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' /> , it means you're succes.....

That's all, special thanks to google group. I'll update later, if you have any question, send it with comments below....

Rabu, 29 Ogos 2012

How to check blog/site page speed

Hmm.... Sometimes blog pagespeed is super fast, and sometimes is super boooooooored or super slow for loading page. This time i will share "How to check blog/site page speed" for you all. What do you think about this blog loading?, for me, i think my blog is fast on loading. OK now to the point.

Method 1


  1. Open this link: http://www.gtmetrix.com
  2. Then type or copy/paste your blog/site url in the form of 

    Analyze Performance of:

  3. Then just click GO button
  4. Then wait for a momment
  5. Then you should get th performance/page speed score and optimization of that url!

Method 2

  1. Open this link:  https://developers.google.com/speed/pagespeed/insights
  2. Then type or copy/paste your blog/site url in the form with grayed text "Enter a web page URL"
  3. Then click the "Analyze" button
  4. Then you should get the performance of the URL that you input!


I hope this trick is usefully!