Blogs on Mobile Devices

Have you ever looked at your blog or other Blogger blogs from a mobile device like a phone or a tablet? You may be surprised to see that the background doesn't always look right. Let me first tell you what is wrong and then show you what you can do about it.

If you use any of my free backgrounds or other similar backgrounds from other sites you will notice a problem with the size and position of that background. Below is a rough sketch of what you might see when you view a blog on a phone:

On a mobile device, the background image is shrunk down to fit the size of the screen. But because a phone is much longer than it is wide, the image does not fill the screen. You could turn your phone on its side but it still does not fit the screen right. Also, the background image stays fixed at one position on the screen. It may be at the top or centered in the middle as you see above. Either way, this means that as you scroll, the background image will not move with your blog.

So how can you work around this problem and still have a great design on your blog? Let me tell you...


If you don't mind losing the background as well as other designs (header, sidebars, etc.) on your blog just on mobile devices, then you can easily change the settings through Blogger. Here's how:

1. From your Blogger Dashboard, click "Template" from the drop-down menu.
2. You should see the following:

 There is an image below the word "Mobile" that shows you a preview of your blog as seen on a mobile device. (If you see the word "Disabled", then your blog will show the same design template on your mobile device as it shows on a regular computer. In other words, you may have the problem I described above.)

Click on the button below the "Mobile" image. (The button has a circle with spokes.)

3. You should see the following screen pop-up:

If you want to have a basic template that is easier to use on mobile devices, then click "Yes. Show mobile template on mobile devices." (Click this if you have the problem I discussed at the top of this post.)

4. Click "Preview" to see what your blog will look like on a mobile device. You can change the template by clicking the arrow next to "Default". If you are happy with what you see, click "Save".


If you do not want a mobile template and want the same template that you would see on a computer to show up on your mobile device, then click "No. Show desktop template on mobile devices." 

If you choose to keep the same template as on a computer, I highly recommend that you do not use free backgrounds as described above. 

Instead, follow one of the tutorials below to create your own background: 

How to Make Your Own Background (using the Blogger Mimima template)

How to Make Your Own Background (using the blogger Simple template)

These tutorials create background images that are repeated all over the background of your blog, thus allowing your design to fill the whole screen regardless of the size.