How to Insert Backgrounds on Blogspot

by Alexander Poirier, Demand Media

Blogspot, which is another name for Google's Blogger blogging service, lets you customize the look of your blog by editing the layout of the page. Advanced users can also change every aspect of their profile by editing the page's HTML. While there is no default option to add a background image to your Blogspot profile you can do so by inserting a special line of HTML code that includes the image's URL into the template code.

Step 1

Open a Web browser and navigate to Blogspot.com. Type your Blogspot login credentials in the spaces provided and click the "Sign In" button to sign into your account.

Step 2

Click the arrow to the right of the "Post List" icon and select the "Template" option from the drop-down menu. The Post List icon resembles a sheet of paper. Click the "Proceed" button to continue.

Related Reading: How to Change Backgrounds to Simple Templates on Blogspot

Step 3

Click the "Edit HTML" button and locate following section of HTML code: "body { background: #ffffff; margin: 0;"

Step 4

Replace this section of HTML code with the following code: "body { background:#fff url("image URL"); background-position: down-left; background-attachment: fixed; background-repeat: no-repeat; margin: 0;"

Step 5

Replace the "image URL" text with the URL of the image that you want to use as your Blogspot background.

Step 6

Click the "Save Template" button to save the template and apply the changes.

Tip

• If your image does not already have a URL you can upload it to a free image hosting site like Image Shack, Photo Bucket or Tiny Pic.

How to Auto Post to Blogspot

Blogger, also called Blogspot, is a free blog-hosting service provided by Google. A blog has the potential to become an excellent publicity tool for any business; for example, you can use a blog to promote new products and give customers an in-depth look into your business. To create a successful blog, you must post new content to it regularly. If you are leaving on a business trip or other extended leave from your workplace, you do not want to leave your blog with no posts for the duration of your trip. Set your Blogger posts to automatically post at set dates and times.

Step 1

Click the orange "New Post" button located on the left side of the Blogger screen.

Step 2

Click "Schedule" on the right side of the screen.

Related Reading: Sharing a Blog Post From Blogspot on Facebook

Step 3

Click "Set Date and Time."

Step 4

Select the date and the time you want the blog post to automatically post to Blogger. Click "Done" when finished.

Step 5

Compose the rest of your blog post as normal. Click "Publish" at the top of the screen. When you return back to the "Posts" page, any posts that are scheduled to automatically post will say "Schedule" next to them.

Step 6

Repeat these steps for additional blog posts you want to automatically post to your blog.

Tip

• To change the time of a schedule post, click "Edit" underneath the post on the "Posts" page and repeat Steps 1 through 5

How to Add Post Separators in Blogspot

If your Blogspot blog design does not come with a post separator to delimit your blog entries, you can add your own by editing the template. You need to change a small part of the blog post's CSS to add a post separator. The separator can be any type of image and may require some adjustment before it displays in a proper location at the end of the post.

Step 1

Log into your Blogspot account and click the specific blog that you want to edit, if you have multiple blogs associated with your email login.

Step 2

Click the drop-down menu and select Layout. Click "Edit HTML." You may wish to save a copy of the original HTML code your Blogspot layout is currently using before you make any changes to the template. You can copy and paste the code into a text or HTML editor.

Related Reading: How to Add a Password to Blogspot

Step 3

Search through the Blogspot template until you see the CSS class definition labeled ".post." This div class controls the styling of your posts. Type "background: url(picturelink);" (without quotes) after the beginning bracket that follows .post. Replace "picturelink" with the direct URL of the picture you're using to separate your posts. Press "Enter."

Step 4

Type "background-repeat: no-repeat;" to prevent the separator image from repeating in the background of the .post DIV class. Press "Enter." Type "background-position: bottom center;" to set the post separator so it appears at the bottom of your posts. Press "Enter."

Step 5

Type "margin:.5em 0 1.5em;" and press "Enter" to set the separator margins. (You may need to adjust these numbers to match your specific spacing requirements on your blog template.) Press "Enter." Type "padding-bottom:2.5em;" and press "Enter." (You may also need to adjust these numbers.) Save the template changes to make your post separator live on the Blogspot blog.

Tips on Blogspot Design

by Jason Artman, Demand Media

Blogspot provides many tools that members can use to customize the appearance of their blogs by changing aspects such as element colors, sidebar gadgets and navigational structure. People who visit Blogspot blogs frequently quickly grow to recognize the default blue and white design given to new blogs. Set your blog apart from the rest by taking the time to give it a design that looks like none other.

Gadgets

Blogspot has several gadgets that you can install to add new functionality to your blog. Gadgets are available to offer subscriptions to your blog, display statistics, connect your blog to social networking accounts, list your blog's followers and display advertisements. Open the "Layout" screen on your blog's dashboard and click the "Add a Gadget" link at the location where you want the gadget to appear to view the list of gadgets and select one to install.

Custom Header

Design a custom image to display at the top of your blog and replace the default plain text title. From the "Layout" screen, click the "Edit" link in the lower-right corner of the "Header" area. Click "Choose File" and double-click an image on your computer to upload it to Blogspot.

Related Reading: Easy Instructions for Creating Posts in Blogspot

Navigation Menu

Blogger gives you the ability to add keyword-based labels to your posts for faster searching, and you can use this feature to create a simple navigation menu and allow readers to browse your blog's content. Install the "Labels" gadget at a position near the top of your blog's layout to create a navigation menu. A reader can then click one of the labels to view all posts containing that label.

Color Scheme

Customize your blog's color scheme to give it an appearance that differs from Blogspot's default blue style. Click the "Template Designer" link at the top of the "Layout" screen. Click "Templates" to view a selection of pre-configured color schemes available for your blog's template, or click "Advanced" to customize the color of all blog elements including titles, body text and links.

Post Layout

Break long posts up using sub-headings with larger bold fonts. Sub-headings make posts more readable and give them a more professional appearance. In addition, add an image to the top of each post whenever possible. Images engage readers and make them want to read further.

How to Add a Playlist to Blogspot

Change Views

As of 2011, every blog hosted on Blogger displays in one of seven ways, known as Dynamic Views -- Classic, Flipcard, Magazine, Mosaic, Sidebar, Snapshot and Timeslide. These views don't change the content of a blog but display text and images in a different way. You set the Dynamic View and any tweaks you wish to apply to the blog via the "Template" link in the Blogger control panel.

Add Widgets

Sidebar widgets add interest to a blog and provide extra information beyond the basic posts. Widgets -- referred to as "gadgets" within the Blogger interface -- can include short lists of links, RSS feeds, a Twitter stream or a rotating picture gallery. Accessed from the "Layout" link within the control panel, gadgets go in various positions on the blog and you can customize their color, style and content.

Related Reading: How to Add a Password to Blogspot

Template Modification

Blogger provides plenty of tools for tweaking your selected blog template -- it's possible to change text fonts and colors, change the widths of columns and even add your own HTML and CSS code. The "Template" link on the left of the main Blogger control panel provides access to all available options. The "Preview" button gives you a chance to see the modifications before publication, and you can easily undo the fixes if you change your mind.

Schedule Posts

If you don't want to immediately publish a post to your blog, the "Schedule" tab on the right side of the New Post page enables you to set a specific time and date for publishing a post. This feature allows you to spread your future posts out evenly if you go on vacation, for example, or time a post to coincide with a specific date. You can view and edit scheduled posts at any time from the "Posts" section of the control panel.

Enable Comments

Allowing visitors to leave comments improves the community feel of a blog and provides an easier way for others to share their thoughts and opinions on your posts. Blogger lets you choose who can comment on posts and gives you a chance to moderate comments before publication. Comment features are accessed through the "Settings" link from the left side of the control panel.

how to Get Blogger Without Blogspot in the Name

by Adrian Grahams, Demand Media 

Move your Blogger blog to a new domain to remove the blogspot domain name.

The “blogspot” name in your blog’s address is the Internet domain that the Google Blogger service uses to host all Blogger blogs. When you create a new blog through Blogger, the service automatically assigns a “blogspot.com” Web domain address. To remove the “blogspot.com” address from your blog, you can switch to a new custom domain name through the Blogger service. Once set up, Blogger automatically forwards your blogspot blog to the new domain.

Step 1

Sign in to your Blogger account. Click the “Settings” link in the submenu under the title of the blog that you want to move to a custom domain.

Step 2

Click “Publishing” in the Settings navigation menu at the top of the page.

Related Reading: How to Set Up PayPal on Blogspot

Step 3

Scroll to the “Buy a Domain for Your Blog” section. Type your preferred domain name into the input box beside “What address would you like your blog to have?” This is the part of the address that follows the “http://www." prefix.

Step 4

Select your preferred top-level domain from the drop-down list. Options include “.com”, “.net”, “.org”, “.info” or “.biz.”

Step 5

Click the blue “Check Availability” button. If the address is already taken, amend or replace your preferred address name, and then click “Check Availability” again. Repeat this step until Blogger displays a success message stating that the domain is available. Click the “Continue to Registration” button.

Step 6

Type your name and contact details into the input fields. Blogger automatically populates the fields with the information you entered when you set up the Blogger account, so you’ll usually need to just complete any gaps or correct mistakes.

Step 7

Click and select the check boxes to confirm that you have read and agreed to the terms and conditions for Blogger and GoDaddy, the Web hosting firm that Blogger uses for custom domains. Click the blue links above the check boxes to read the terms and conditions in full.

Step 8

Click the “I Accept. Proceed to Google Checkout” button. If you have a credit card, debit card or electronic payment method registered on your Google Account, sign in with your account user name and password to pay with this method. Otherwise, enter the payment method information -- account name, number and expiration date -- into the applicable input fields. Once you’ve confirmed the purchase, Blogger will transfer your blog to the new domain and replace the “blogspot.com” address with the new domain name.

Things Needed

• Credit card, debit card or valid payment method

Tip

• The redirection of your blog from the Blogger address to your new domain can take up to an hour after buying the new domain.

How to Insert Likes in Blogspot

Facebook makes its "Like" button available to any website or blog owner free of charge. If you have an account with Blogspot, another free service, you can insert the Facebook Like button into any of the blogs you administer. Your blog visitors will then be able to click the button to quickly share the site with their friends. Additionally, if a visitor clicks the Like button while viewing an individual post, that particular post will be shared. The Facebook Like button is a simple way to spread the word about your Blogspot blog.

Step 1

Open a browser and navigate to the Facebook Developers website at developers.facebook.com, then click the "Build for Websites" button in the middle of the screen. You do not need to sign in to a Facebook account.

Step 2

Click the "Core Concepts" link in the navigation menu on the left side of the screen, click the "Social Plugins" link when it appears in the same menu, then click "Like Button" at the top of the list that appears.

Related Reading: How to Center a Header in Blogspot

Step 3

Scroll down the screen until the blue box below the heading "Step 1 - Get Like Button Code" appears in it entirety. This blue box contains all of the available options for customizing the Like button.

Step 4

Click to adjust any of the other options displayed in the blue box. You can opt to include a "Send" button, select a layout and width, show or hide faces, change the button label from "Like" to "Recommend," and select the color scheme and font. A preview of your Like button appears to the right as you make changes. You can leave these options unchanged if desired.

Step 5

Click the "Get Code" button at the bottom of the blue box. A new window appears displaying the Like button code. Copy and paste the code to your computer's clipboard.

Step 6

Sign in to your Blogspot account and click the "Design" link next to the blog title for which you want to insert Facebook likes. This opens the layout editing page for the selected blog.

Step 7

Click "Add a Gadget" anywhere in the layout editing page. The Facebook Like button will appear where you clicked. A new window opens, displaying a list of available Blogspot gadgets.

Step 8

Scroll down the gadget list until you see the "HTML/JavaScript" gadget and click the "+" button to the right. A "Configure HTML/JavaScript" window appears.

Step 9

Click inside the "Content" field in the new window and paste the copied code. Click the "Save" button to lock in the changes and return to the layout editing page.

Step 10

Click the "View Blog" link in the layout editing page to view your Blogspot blog with the new Facebook Like button.

References (1) 

Resources (1) 

About the Author

Will Conley's writing has appeared in print and online since 1999. Publication venues include Salon.com, SlashGear.com, National Journal, Art New England, Pulse of the Twin Cities, Minnesota Daily and ThisBlogRules.com. Will studied journalism at the University of Minnesota. He is working on four fiction and nonf