All template customizations are done in the Template Designer (aka Customizer).
Access the Template Designer (Customizer)
- On your Blogger Dashboard, go to the Template page.
- Click the orange Customize button.
- The Customizer/Template Designer window will open.
If you are using the Boxed or Framed theme layout, you can add a custom background.
- Click on the Background option tab.
- Click on the Background image box to open the Select background image box.
- You can select one of the default background images or upload a custom background by clicking on the Upload image link.
- Click the orange Apply to blog button to save settings to your live blog.
This template does not allow the option of Adjustable widths.
Colors & Fonts
You can adjust your template colors, fonts and some padding using the Template Designer > Advanced options.
This tutorial will walk through the basic setting options. We will not cover all the settings. Once you get the hang of how to use the basic settings you will be able to customize your entire template easily.
- Click on the Advanced tab in the Customizer.
- The first section will be the Body section. Here you can set the body background color.
- The body background color setting is for use with the Boxed or Framed layouts. To change the body background color, in the text field, enter a 6-digit hex color code, choose a color using the color palette or select a suggested color from below.
- You can also edit the Body Text color in this section.
- The next section is Wrapper section. In this section you can edit the Content background color for the Boxed and Framed layout or the background for the Fulll width layout.
- Under the Headings section, you can edit the Headings font family and color.
- To edit the font family, choose a font family from the list.
- You can also choose to edit the weight of the font by clicking the bold B icon.
- Edit the font style (italics) by clicking the I icon.
- To change the size of the font, enter a font size (in px) in the font-size field or click on the arrow to select from pre-assigned values.
- Once done editing your settings, click the Apply to blog button to save settings.
These are the basic Customizer settings. Explore the various panels to discover all the options to customize.
You can easily add custom CSS to your site.
- In the Customizer, go to Advanced.
- Scroll down until you find the Add CSS option and click on it.
- A code window will appear.
- Copy and paste or type any custom CSS code into this box.
- Click the Apply to blog button to save changes.