If you would like to have your blog title and description in the center, this how to do it. First I will start by showing you how to center the title or heading of your blog. Login in to Blogger - Dashboard - Design - EDIT HTML. By use of Ctrl + F, find out the following codes
}
.Header h1 {
font: $(header.font);
color: $(header.text.color);
text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top)
$(header.shadow.spread) rgba(0, 0, 0, .2);
}
In the above code, insert the following code immediately below the color code line.
text-align:center;
You new code will look like this:
}
.Header h1 {
font: $(header.font);
color: $(header.text.color);
text-align:center;
text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top)
$(header.shadow.spread) rgba(0, 0, 0, .2);
}
To center the description, look out for the following codes by use of Ctrl+F;
}
.Header .description {
font-size: $(description.text.size);
color: $(description.text.color);
}
In the above code, insert the following code immediately below the font-size code line;
.Header h1 {
font: $(header.font);
color: $(header.text.color);
text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top)
$(header.shadow.spread) rgba(0, 0, 0, .2);
}
In the above code, insert the following code immediately below the color code line.
text-align:center;
You new code will look like this:
}
.Header h1 {
font: $(header.font);
color: $(header.text.color);
text-align:center;
text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top)
$(header.shadow.spread) rgba(0, 0, 0, .2);
}
To center the description, look out for the following codes by use of Ctrl+F;
}
.Header .description {
font-size: $(description.text.size);
color: $(description.text.color);
}
In the above code, insert the following code immediately below the font-size code line;
text-align:center;
Your new code will look like this;
}
.Header .description {
font-size: $(description.text.size);
text-align:center;
color: $(description.text.color);
}
Save your template and check your blog. You title and description are now centered in the blog. If you want to change the alignment, you can just replace text-align:center; with text-align:left or right, depending on what you want.
Your new code will look like this;
}
.Header .description {
font-size: $(description.text.size);
text-align:center;
color: $(description.text.color);
}
Save your template and check your blog. You title and description are now centered in the blog. If you want to change the alignment, you can just replace text-align:center; with text-align:left or right, depending on what you want.
Related Posts
Duplicate Title or Meta Tag Problems
Thank you for this tip. I used it and it worked out well :)
ReplyDeleteWelcome. I am glad that it worked out as you expected.
ReplyDeleteOh My Gosh. Thank You So Much. This Was The Only Place Where It Worked out.
ReplyDeleteThank you and welcome back.
DeleteThank you thank you.... I used 20 different tips from people and none of them worked... yours was the easiest and worked fine! Again, thank you!!!
ReplyDeleteWelcome. I am always very happy when I see that, my readers are getting information that they want.
DeleteTHANK YOU!
ReplyDeleteWelcome.
DeleteI can't find that code in my blog. I searched the Edit HTML and it saw the color code but nothing around it looked the same. So then I tried the code anyways and previewed it but it was still the same....??
ReplyDeleteTry locating the code using .Header h1 { and .Header .description {. You should be able to find it.
DeleteHallelujah, this is the first code that worked!
ReplyDeleteThank you so much! This is the first website whose instructions worked, really appreciate it
ReplyDelete