Skip to main content

How to Add a Subtitle to Blogger Posts

This Blogger tutorial shows you how to easily and quickly add a subtitle to your Blogger posts (Blogspot posts) so that both search engines and readers will have more information about your post. I also discuss the benefits of adding subtitles to Blogger articles. This is an easy tweak to your Blogger blog that anyone can carry out in a couple of minutes.

blogger Blog with Subtitle Under Post for Emphasis and Search Engine Friendliness

Benefits of Using Subtitles in Posts
Adding a subtitle which appears below the title of your post can be both eye catching and informative. For instance a titling schema for this post could be:

Title: Add a Subtitle to a Blogger Blog

Subtitle: Make Your Posts More Search Engine Friendly and User Friendly

If you craft your titles and subtitles carefully you will encourage more targeted readers of your blog as they will be able to see at a glance what your post is about rather than reading the whole article. Your traffic therefore might be slightly less but they will be far more targeted to the content of your site resulting in a lower bounce rate.

If the subtitle you choose for your Blogger post is keyword rich then you are also improving your chances of gaining a higher position in search engine result pages because search engines give added weight to headings and to text early on in an article. By adding a subtitle to a Blogger post you have a SEO tool which if used effectively could result in more visitors finding your site because of higher keyword density.

You can of course add a subtitle manually to each post and format it everytime. The advantage of this method over doing it manually though is that all the formatting is in the stylesheet section of your template so you only have to change the colour scheme and font variables in one location and Blogger will look after the rest. Any change will be reflected in each and every post that has the subtitle <div> tags.


How to Add a Subtitle to Blogger Posts
This tutorial guides you through the steps to take to add a subtitle to your Blogger blog. The trick requires only takes a few short minutes and requires only a small snippet of code to be added to your template. Provided the instructions are followed anyone can do this including beginners and new bloggers. Interestingly it is not widely known or written about in technical blogs that a subtitle can be added to your Blogger Blogspot blog posts yet the advantages are considerable.

1. Log in to Blogger and navigate to Design > Edit HTML

2. Find the </b:skin> tag in your template. If you are have difficulty finding it use CTRL + F to bring up the Blogger toolbar at the bottom of your blog and enter the tag </b:skin> into the search box on the toolbar

3. Copy and paste the code below into your template making sure that it appears before the </b:skin> closing tag.

.subtitle{
font-family:Trebuchet MS',Verdana,Arial,Sans-serif;
font-size:15px;
color: #ca1717;
line-height:20px;
}

Add a Subtitle to a Blogger post - edit template and customise if desired

Update November 14, 2010. This code inserts a subtitle in red. You will need to change this color to match your template. See later in this post for information on how to add styling or change the color of the subtitle. If you wish to use a known variable as shown in the above image you can. color: $dateheadercolor; could be used for example provided this variable had already been declared in the variables section of the template.

4. Save Template

5. Go to the post you wish to add a subtitle to by clicking on the Posting tab and then the Edit Posts link.

6. Copy and paste the following code into your post ahead of any other text.

<div class="subtitle">Subtitle Text. Please Substitute for your own text</div>

Add a Subtitle to a Blogger Post

7. Substitute your own text between the <div> tags

8. Navigate to Settings > Formatting and under the last option Post Template enter the following into the box:

<div class="subtitle"></div>

This will mean that every time you create a post you will have the tags appear automatically. All you need do is place the text of your subtitle between the tags. If you don't want to use a subtitle for a particular post just delete the tags.

9. Save Changes to Post and click on View Blog to admire your new subtitle.

blogger Blog with Subtitle Under Post for Emphasis and Search Engine Friendliness

Customizing the CSS Styling of a Blogger Subtitle
It is easy to customize your subtitle for a different font type, color and size. Just change the code you added before the </b:skin> tag. If you want a specific color for instance you could change the color I have chosen for another color, increase the font size, and change the font face to Times Roman for instance. Thus your code would become something like this:


.subtitle{

font-family:Georgia, "Times New Roman", Times, serif;
font-size:16px;
color:#ff6600;
line-height:20px;


This Blogger tutorial has shown you how to add a subtitle to your Blogger posts (Blogspot posts) quickly and easily. I have discussed the benefits of inserting a subtitle feature on a Blogger blog including how this might assist search engines to correctly index your blog articles. I have also shown you how to customize your subtitle to your own individual requirements using CSS styling


Related Posts
List of Blog Know How Tutorials for Blogger Blogs

Comments

Popular posts from this blog

Free Social Bookmark Buttons for Blogger

One way to get your blog to grow is add social bookmarking buttons to your Blogger Blogspot blog . In an earlier article I wrote about the simplest way to place social media on a Blogger blog - that is to add an all-in-one Add This social bookmarking button . However, as one size doesn't fit all situations there may be lots of times when you would prefer to add individual social bookmark buttons to your Blogger blog . That's why I have put together this list of useful free social bookmarking button sets. All are free to use on a personal blog and most have no restrictions for commercial use either but please do double check the license when you download them if you want to use the buttons commercially. Best Sources of Social Bookmarking Buttons for Blogger Blogspot 128 Completely Free Icons Set 128 Icons available in 48×48px. Includes Social Media Icons such as: Design Float, Digg, Delicious, Furl, Technorati, Flickr, Stumble Upon, Twitter & more… Web 2.0 Icons (23 icons...

Cara Membuat Blog dan Website dengan Blogger Blogspot

Cara Membuat Blog dan Website dengan Blogger Blogspot Tentukan Niche/Topik Utama Website Tentukan nama domain Buat Daftar Menu Navigasi/Daftar Isi Buat Daftar keyword penting/niche turunan Mulai buat artikel dengan cara pakai 1, 2 atau 3 keyword gabungan Susun Point-point utama keyword yang kita pilih Uraikan dan kembangkan point-point keyword tersebut menjadi sebuah paragraf Jadilah Artikel, Masukkan 2-3 keyword gabungan

Cara Mengetahui Kekuatan Sinyal Tower dekat Lokasi Kota Daerah Anda

Cara mengetahui tower sinyal di daerah Beberapa dari kita asal memilih operator karena harga paketnya dikatakan tergolong murah. Ingat "Ada Harga, Ada Kualitas". Mungkin anda pernah membeli paket internet yang murah tapi sinyalnya kurang memadai dan kecepatanya kurang. itu dikarenakan tepat anda jauh dari Tower BTS (Tower Sinyal). Untuk dari itu Glory akan mengshare cara mengetahui tower sinyal di daerah anda. 1. Buka Search Engine anda, Lalu ketik " Open Signal " 2. Jika sudah maka klik website yang paling atas 3. Pada menu kotak di kanan bawah pilih " Towers " 4. Lalu geser peta ke daerah tempat anda tinggal, lalu lihat operator yang paling banyak towernya Saya di lampung menggunakan operator telkomsel, di lampung sinyal operator telkomsel sangat baik sekali. Walau Saya menggunakan sinyal 3G Tapi upload dan download lumayan cepat.   Pililah opertator yang anda sukai dan stabil, saya tidak bermaksud me...