Getting Started : Change the design of your blog

To change the design of your blog, you can use the template designer or CSS.

Blogger Tutorial - change design of your blog

Change the design with the template designer

  1. Sign in to Blogger.
  2. Select the blog to update.
  3. In the left menu, click Template.
  4. Under “Live on blog," click Customize.
  5. At the top, use the carousel to choose a template. Below the carousel, use the preview to see how your blog will appear.
  6. Use the left menu to customize your background, adjust widths, layout, and other settings.
  7. On the top right, click Apply to Blog to make your changes live.

To clear your changes, click Live on Blog.

Change the design with CSS

You can also personalize your blog's appearance by using cascading style sheets (CSS).

To add custom CSS snippets to your template:

  1. Sign in to Blogger.
  2. Select the blog to update.
  3. In the left menu, click Template.
  4. Under Live on blog, click Customize.
  5. In the left menu, select Advanced > Add CSS.
  6. Add your code.
  7. On the top right, click Apply to blog.

Navigation bar for custom templates

If your custom template designs cause problems with the navigation bar, try:

  • At the topmost element of your template, add style="margin-top:40px;"
  • Check if the closing </head> tag is present. It should go before the <body> tag.

Mobile templates for your blog

To change how your blog appears on smartphones:

  1. Sign in to Blogger.
  2. Select the blog to update.
  3. In the left menu, click Template.
  4. Under “Mobile,” click Customize mobile template .
  5. Select the mobile template for your blog. You can also click Preview to see the template live on your blog.
  6. Click Save.

To see your blog on your mobile device, scan the QR code on the left of the pop-up window.

Comments