I want to change my Pregnancy Stories blog to three columns - Blogger Hack: Three Columns, Any Browser, but before I do, I need to retrace my steps and find the previous blog hacks I used, which will be deleted when I change the template to Minima to begin. So...
♦ First, the meta tags hack:
Blogger Title & Meta Tag Keyword ,Description hack - Blog SEO Tip
Some easy mods to optimize the Meta tags for Keywords, Description, Title and even customize for the Index page, post page and archive !
♦ Next, I added a picture to the header, and then moved over the words to the right so they were clear of the picture, by changing the header description margin - I added 300px at the end:
#header .description {
margin: 10px 5px 5px 300px;
♦ To create more white space between the main posts and the sidebars, I went to Add or Remove Borders in CSS Templates:
Scroll to where you see this and change or insert the code (shown in red):-
.post {
border:1px dotted #ff00ff;
padding:1.5em;
}
We have included a padding to give some space between the contents and the border. Without this padding, the text will be too close to the border.
♦ Had an idea, I wanted the background of the posts to be different than the rest of the page, so I went back to this and added:
.post {
background:#ffFFff;
padding:1.5em; }
♦ Then I added the label tabs - Tabs are in place!:
changing the background colour to match the page:
#tabsB {
float:left;
width:100%;
background:#FFFFe6;
♦ To place the label tabs below the Header, I changed this showaddelement to "yes", and dragged the new label Page Element there:
div id='crosscol-wrapper'
b:section class='crosscol' id='crosscol' showaddelement='yes'
♦ To move around all the Page Elements, the "maxwidgets" & "show elements" must be set to "2" & "yes".
There is one in the header:
b:section class='header' id='header'
maxwidgets='2' showaddelement='yes'
And the main wrapper:
div id='main-wrapper'
b:section class='main' id='main' showaddelement='yes'
/b:section
♦ Next adding FeedFlare to the footer - Paste the code just below
div class='post-footer'
or just above:
p class='post-footer-line
♦ To place the tiny pic next to the title of each post, I added the following between a expr:href='data:post.url' and data:post.title/:
img src='http://www.borntolove.com/tn_golden_egg2.jpg' style='border-width:0px'/
Hopefully that's all the changes I made, and I won't lose anything important as I begin the transformation!
Friday, January 11, 2008
Blogger Hack: Before I begin...
Posted by Catherine McDiarmid-Watt at 12:18 PM
Labels: Blogger hacks
Subscribe to:
Post Comments (Atom)
2 comments:
I wrote a book, Shoestring Marketing Guide, in the 1970s. Was just wondering if this is one of the books you read.
Yes, I am pretty sure I read that one. I got all my books from the library, so didn't make you a sale, sorry, but yours was definitely the type of book I was reading back then.
It's great to "meet" the author, who helped me make my BTL business a success, after all these years!
Post a Comment