tag:blogger.com,1999:blog-3079320836878379462024-03-08T14:00:21.546-05:00Plumrose Lane TutorialsA plethora of whimsical treasures and phantasmagorical design, with an assortment of helpful step-by-step tutorials for beginning bloggers and beyond.Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comBlogger40125tag:blogger.com,1999:blog-307932083687837946.post-26706032020906867112015-11-02T17:59:00.000-05:002015-11-02T18:00:37.195-05:00How to: Delete a Blog<span style="font-family: "georgia" , "times new roman" , serif;">Here are the steps to delete a blog as provided by Google...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCKiXJ43lPgXtwv2Ub2hxLNl3NGUo3Dh87swtfQZmK41KkvWoezcVi-_0qIP8T0505m12XaoVDlF_comHHc55XSDHjBCakfIc23pu9EtWTCAVAxEp1Q1K9s6YMKHalFa8xW3LTN1fbjSh8/s1600/delete_blog.PNG" /></div>
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0tag:blogger.com,1999:blog-307932083687837946.post-78771750384296637942014-07-01T12:28:00.004-04:002014-07-01T14:01:37.134-04:00How to: Create a BlogThis tutorial will walk you through the steps of starting your own blog. Blogging is a fantastic outlet for people of all interests ~ from politics to crafting, there are massive genres existing in the world of blogging. There are also several popular platforms and the most common are Blogger, Wordpress, Tumbler, and Typepad. I began like most on Blogger because it was a free and easy to use interface. While times have changed a bit since those early days, Blogger still stands as an excellent platform for bloggers. <br />
<br />
To begin blogging you'll first need to select a title and link for you blog. While bloggers do try to keep the title and link of their blogs the same, it isn't entirely necessary, so if you find that the name you want to use is taken then consider using your own name or a modification of that for your link, such as www.sharonwrites.blogspot.com. Now that you've given the title some thought, let's begin.<br />
<br />
The tutorial below is a combination of my own tutorial and one published on wikiHow. I'd like to thank the contributors for their additional images and content. source link: <a href="http://www.wikihow.com/Start-a-Blog-on-Blogger">http://www.wikihow.com/Start-a-Blog-on-Blogger</a><br />
<br />
1. Begin by visiting <a href="http://www.blogger.com/home" target="_blank">www.blogger.com/home</a>, where you will be prompted to log-in to your Google account. All Blogger blogs are associated with a Google account. If you don't have one then you will need to create a new account...<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEUscgJjcUKxXQCLLFNrUTFQp37vc1dBvu_b9iHRQdWO2WK2U7ScckYSJnSnXczQ58IGUl2n-LiuinpAZgZprLZq_hQ8yJ4cCdU9mRI6PghETWTt63DxYZVMGC_sGYX3-r4tcz433BZoiX/s1600/image1-a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEUscgJjcUKxXQCLLFNrUTFQp37vc1dBvu_b9iHRQdWO2WK2U7ScckYSJnSnXczQ58IGUl2n-LiuinpAZgZprLZq_hQ8yJ4cCdU9mRI6PghETWTt63DxYZVMGC_sGYX3-r4tcz433BZoiX/s1600/image1-a.JPG" height="400" width="343" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
2. On the next page you will need to confirm your profile information and click "Continue to Blogger"... </div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4NQ4IdRl8Ewr4bpIN-LknR7IMpElEKj0LYhGRKjHKJ0Pc8A8jffC1ag_Fhtv4wKZyubuk32DVMxhDf0XRwAVFBpjZvHurLwWjz-bX1Xj-o4jt6mc7dw6ezlk05UHKB53D1Yqex81xNnp5/s1600/image2-a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4NQ4IdRl8Ewr4bpIN-LknR7IMpElEKj0LYhGRKjHKJ0Pc8A8jffC1ag_Fhtv4wKZyubuk32DVMxhDf0XRwAVFBpjZvHurLwWjz-bX1Xj-o4jt6mc7dw6ezlk05UHKB53D1Yqex81xNnp5/s1600/image2-a.JPG" height="318" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
3. On the next page you will fill in your Blogger display name and click "Continue to Blogger"...</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM2PVpgCo7mI3u4ZUnlUqdadhLlbX8jACerSubX_hT_JmDtckjv4YJYLVHVcYzK_qU24TigjsscO7-elaMjwFGn8usQDLMeBm6txi9mvbZLQ0CyRe5tUBk7MByyj_r748MmlqW6o6A7gJM/s1600/image3-1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM2PVpgCo7mI3u4ZUnlUqdadhLlbX8jACerSubX_hT_JmDtckjv4YJYLVHVcYzK_qU24TigjsscO7-elaMjwFGn8usQDLMeBm6txi9mvbZLQ0CyRe5tUBk7MByyj_r748MmlqW6o6A7gJM/s1600/image3-1.JPG" height="272" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
4. Once logged in you will be redirected to the Blogger home page...</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwwO9qHvVXwTsehKr74BMNfqCN-yGX5yTx8Vwc7wIpD52euB0TcssEHiB5mFG73G8MWkPbRb2CIqH6PvgVGPhfRF_6HsNXMfvj36TOBGXMUdK_YSs9OrphCtGapmyCdpATLM80yN3kC5DF/s1600/image5-a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwwO9qHvVXwTsehKr74BMNfqCN-yGX5yTx8Vwc7wIpD52euB0TcssEHiB5mFG73G8MWkPbRb2CIqH6PvgVGPhfRF_6HsNXMfvj36TOBGXMUdK_YSs9OrphCtGapmyCdpATLM80yN3kC5DF/s1600/image5-a.JPG" height="277" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
This page will show a list of your blogs and a list of the blogs you follow, if any.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
5. To create your first blog click the gray "New Blog" button...</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOJVsN-jZa059622oXPgN5nqNQ33bZax4CGG05l-LFvDBZFGUBDgIiyEMqHsE8BhIL7bbmTmSjr7-MOvrOLx13whxWta036BnDpIGjcw0Ss0si6DwYllJgd484n62Kq_9S0CwEALNrmp6-/s1600/image5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOJVsN-jZa059622oXPgN5nqNQ33bZax4CGG05l-LFvDBZFGUBDgIiyEMqHsE8BhIL7bbmTmSjr7-MOvrOLx13whxWta036BnDpIGjcw0Ss0si6DwYllJgd484n62Kq_9S0CwEALNrmp6-/s1600/image5.jpg" height="163" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
6. On this page you'll select a blog "Title", "Address", and a template. </div>
<br />
You can use anything you like for the title, since this can be changed at any time.<br />
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
For the address you'll need to play around, since Blogger has been around for a long time you may find the title you want is not available. You can use a combination of your actual name and what you do ~ I used sharons-artblog.blogspot.com, and it doesn't have to match your blog title. Try some different combinations until you find one that works. You'll see a blue check when you've found an address that's available...</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1FSYllp2299GxZJenFI5MTpWH2LxWkR4Yr2-Ana8kMOb1m_Szx-S15Qk51IgH0rIrKPEJmb1uvzZ2g89RIoJJiyjYAPHZ1x7x9E1wLECSfFhVwwMs7sR6v28IpoBJsZx2Sm-LLY9eAXqx/s1600/image7-a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1FSYllp2299GxZJenFI5MTpWH2LxWkR4Yr2-Ana8kMOb1m_Szx-S15Qk51IgH0rIrKPEJmb1uvzZ2g89RIoJJiyjYAPHZ1x7x9E1wLECSfFhVwwMs7sR6v28IpoBJsZx2Sm-LLY9eAXqx/s1600/image7-a.JPG" height="336" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
7. Next you'll choose a starter template, which will act as the basic design/layout of your blog. I recommend using the "Picture Window" because it's easily modified for my free blog elements and designer blog themes...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz8G2nav5OdaX7MaCx3rJGmRkgNKXbap0r0lVC9MGIfAQRuqADhVSd7ttG79yuhWa1tdf4c75pTnzOeOv2eNsU3k9vqbfM7-EWYn-Iknn5N57hMDwLNHRegyHYzk_Pf8N7fFKD3678NiDw/s1600/image7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz8G2nav5OdaX7MaCx3rJGmRkgNKXbap0r0lVC9MGIfAQRuqADhVSd7ttG79yuhWa1tdf4c75pTnzOeOv2eNsU3k9vqbfM7-EWYn-Iknn5N57hMDwLNHRegyHYzk_Pf8N7fFKD3678NiDw/s1600/image7.jpg" height="246" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
8. Click "Create blog"...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiphwiFIj58IZ01eUFDKqww3FYa_WEeEOl9SaFcxzxZimc0DN2Dg5OSzWQpE9OtWTnvGclPIRzu4B7v5hzZbQxUZQmgZpQooDnr8yiZUL9tcEd08_MgI_UoSxu49AJrweMKCOhARhDhIQNZ/s1600/image8.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiphwiFIj58IZ01eUFDKqww3FYa_WEeEOl9SaFcxzxZimc0DN2Dg5OSzWQpE9OtWTnvGclPIRzu4B7v5hzZbQxUZQmgZpQooDnr8yiZUL9tcEd08_MgI_UoSxu49AJrweMKCOhARhDhIQNZ/s1600/image8.jpg" height="246" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
9. <span style="font-family: Georgia, serif; font-size: 11pt; line-height: 115%;">Now
you’ll be taken back to the Blogger home page where you’ll see your new blog
appear at the top of the page.</span><span style="font-family: Georgia, serif; font-size: 11pt; line-height: 115%;"> </span><span style="font-family: Georgia, serif; font-size: 11pt; line-height: 115%;">Click on
the title of your new blog to access the back end…</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="font-family: Georgia, serif; font-size: 11pt; line-height: 115%;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbXrsU-f1Znd3LdMAw2RBByTf1EJZzZPl05t24z5T5NmjOw8pTAjfs1fgW-aIFHryMePty5YZgrXg0GgDnUSbLIsMasb0r_NiCIRJf8AJwGqHekoA-6Rp1Ae8RTCk8WmlUAwV8tOckEUPC/s1600/image8-a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbXrsU-f1Znd3LdMAw2RBByTf1EJZzZPl05t24z5T5NmjOw8pTAjfs1fgW-aIFHryMePty5YZgrXg0GgDnUSbLIsMasb0r_NiCIRJf8AJwGqHekoA-6Rp1Ae8RTCk8WmlUAwV8tOckEUPC/s1600/image8-a.JPG" height="311" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<span style="font-family: Georgia, serif; font-size: 11pt; line-height: 115%;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
10. On the next screen you'll see an overview of the control area where you can personalize your blog and set up basic options...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsDJi1nD_6lGWTW2BWwpZ72TcxL4mEESo02EjkNcrMK4zTs7oMDkt0B92WGayMbyeVAuGIU2TlK7LMutzAF4zeZj_yrfJ-iIZeZ8qTgO92sj9gFvxvhyphenhyphennGVImkcShwhCMKsbmlsUd0eCJe/s1600/image9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsDJi1nD_6lGWTW2BWwpZ72TcxL4mEESo02EjkNcrMK4zTs7oMDkt0B92WGayMbyeVAuGIU2TlK7LMutzAF4zeZj_yrfJ-iIZeZ8qTgO92sj9gFvxvhyphenhyphennGVImkcShwhCMKsbmlsUd0eCJe/s1600/image9.jpg" height="213" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
11. Using the "Template" link, gives you access to change the template and other visible features of your blog. You can control the layout, width, text, colors, and so much more...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf2VILa0NDufrgg2tAP8c3-17yTRSJaXOdkccLW7T5x2D6nllD1zG1h64Pn7F3zJ1efPQPRVSKeLq2-pCobsE94O1yUm6MQYGdTK4Yzu8xyKCIdog7_ouAw-QOrYyYjKSos52PK37bVolO/s1600/image15.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf2VILa0NDufrgg2tAP8c3-17yTRSJaXOdkccLW7T5x2D6nllD1zG1h64Pn7F3zJ1efPQPRVSKeLq2-pCobsE94O1yUm6MQYGdTK4Yzu8xyKCIdog7_ouAw-QOrYyYjKSos52PK37bVolO/s1600/image15.jpg" height="238" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
12. Click on the "Customize" button to enter the "Template Designer" area and play with these settings...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4Pc5N0ByfUIvLGB_O5DRah3CMz7xPE1N4OUFry8dtAGzAGciAFutWWD-MQNqVT6RieimiR3hLf98exjPR8uS5N7Tsz7diQnHBXltOQpZDzZU3l2Ci4-ZBQZk_PB72MBMvaKdX2OL4gDDH/s1600/image16.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4Pc5N0ByfUIvLGB_O5DRah3CMz7xPE1N4OUFry8dtAGzAGciAFutWWD-MQNqVT6RieimiR3hLf98exjPR8uS5N7Tsz7diQnHBXltOQpZDzZU3l2Ci4-ZBQZk_PB72MBMvaKdX2OL4gDDH/s1600/image16.jpg" height="160" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
13. The "Settings" area allows you to control the functionality of your blog such as who is able to view your blog, contribute to it, and comment on your blog. Click this link to explore this area further...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZQmRQYVOzlsSc0c-YTmmGdzirBZuvLICfeG_zkE8EofGRMqHdIOFF03HiVGrimxOPTj-PT38NSuekR-3p41WXArQdMPYQt5PklIeJxYft9X_-GEcYn2bFFWqE0S6ztXmN-ZDwav4EYoX3/s1600/image17.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZQmRQYVOzlsSc0c-YTmmGdzirBZuvLICfeG_zkE8EofGRMqHdIOFF03HiVGrimxOPTj-PT38NSuekR-3p41WXArQdMPYQt5PklIeJxYft9X_-GEcYn2bFFWqE0S6ztXmN-ZDwav4EYoX3/s1600/image17.jpg" height="236" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
14. You can adjust publishing, comments, archiving, permissions, and all the other settings for your blog within the sub areas of the "Settings" tab.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
15. To write your first blog post click the orange "New post" button found on at the top of the sidebar area...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsDJi1nD_6lGWTW2BWwpZ72TcxL4mEESo02EjkNcrMK4zTs7oMDkt0B92WGayMbyeVAuGIU2TlK7LMutzAF4zeZj_yrfJ-iIZeZ8qTgO92sj9gFvxvhyphenhyphennGVImkcShwhCMKsbmlsUd0eCJe/s1600/image9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsDJi1nD_6lGWTW2BWwpZ72TcxL4mEESo02EjkNcrMK4zTs7oMDkt0B92WGayMbyeVAuGIU2TlK7LMutzAF4zeZj_yrfJ-iIZeZ8qTgO92sj9gFvxvhyphenhyphennGVImkcShwhCMKsbmlsUd0eCJe/s1600/image9.jpg" height="213" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
16. Always begin by titling your blog posts ~ this is a key feature to enabling search features, archiving, and visitors to easy find and sort your blog posts... </div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie3uYSP8RPDO19gjVBxPk7FFCKYFHQ3GjiEskPqxKb-c1RkGDcsqWMwqJPErNC23DV9-eA0gm9p1Qzj7Zth8GcFOIQ7WhYliftW-5Hu3ddAIW7mFbtM1uOWDCu_qizQJCQ_7xkXrdd1vDC/s1600/image10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie3uYSP8RPDO19gjVBxPk7FFCKYFHQ3GjiEskPqxKb-c1RkGDcsqWMwqJPErNC23DV9-eA0gm9p1Qzj7Zth8GcFOIQ7WhYliftW-5Hu3ddAIW7mFbtM1uOWDCu_qizQJCQ_7xkXrdd1vDC/s1600/image10.jpg" height="85" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
17. Next click in the large box space, this is where you will write your blog posts content. You can add text, pictures, videos, etc. Hover over each icon to view a pop-up key word of what each function is...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkFC8l5DAw8AS7LLAQDxWi4pjWfxVwx7e-Aeq1PXC_j_OjzDGRUN-VbrU4Id_w1c7W7tU4xSj9SpNpWCmxb-GYlD1IWW0yo95vWmaSQskFX85tkt03Z3JQFRa81zIR91yCc37SFiO9r2Lm/s1600/image11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkFC8l5DAw8AS7LLAQDxWi4pjWfxVwx7e-Aeq1PXC_j_OjzDGRUN-VbrU4Id_w1c7W7tU4xSj9SpNpWCmxb-GYlD1IWW0yo95vWmaSQskFX85tkt03Z3JQFRa81zIR91yCc37SFiO9r2Lm/s1600/image11.jpg" height="136" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
18. You can even use Html to write your blog posts if you know this web developing language...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMKINEkuLeKV7s7WR5YYES_36IVqnut9pNddKATqMF9ZN4LD50QoLcZe_djipZOisRsWrw56T3xrq_VzEN584KoNgDZot6Hb-cJS5Wck4zi_Oe0gNIfy5upqB_DUhI-Sri0kx4dULuJBgU/s1600/image12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMKINEkuLeKV7s7WR5YYES_36IVqnut9pNddKATqMF9ZN4LD50QoLcZe_djipZOisRsWrw56T3xrq_VzEN584KoNgDZot6Hb-cJS5Wck4zi_Oe0gNIfy5upqB_DUhI-Sri0kx4dULuJBgU/s1600/image12.jpg" height="120" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
19. On the right sidebar are more key features, such at "Labels"; single words that describe your posts and "Options" which allow comments and other interactivity for your individual posts...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIh59zgeJgZfEnRlAkYGOJktzsxD1OCEGzljYqp6xGIxA3tdmy4NC8FLqsK9sWUnA_Qm4XCWNO4eJzpjIeYY8OJitDZ_OHhaXWdxqDj3A8kJX750OXS6LamY5yWR4rVW7avY5QSxyvhZX9/s1600/image13.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIh59zgeJgZfEnRlAkYGOJktzsxD1OCEGzljYqp6xGIxA3tdmy4NC8FLqsK9sWUnA_Qm4XCWNO4eJzpjIeYY8OJitDZ_OHhaXWdxqDj3A8kJX750OXS6LamY5yWR4rVW7avY5QSxyvhZX9/s1600/image13.jpg" height="400" width="275" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
20. Once you've finished writing your blog post, click the "Publish" button and your blog post will be <i><b>live </b></i>on your blog...</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj34pvF1qCbMn3P_M-DLijq0zlk-FAoZXvaFzqsJ5vfL_MCIpcn4Jw-dfRNiySmwOdzNPg2qzbw40R4EuoGmfmp5bl3NT0wjqgJq88wh7suqb0AqE_dp2KW-dd8Yu-jEm8wcLbzD1xFP1Sw/s1600/image14.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj34pvF1qCbMn3P_M-DLijq0zlk-FAoZXvaFzqsJ5vfL_MCIpcn4Jw-dfRNiySmwOdzNPg2qzbw40R4EuoGmfmp5bl3NT0wjqgJq88wh7suqb0AqE_dp2KW-dd8Yu-jEm8wcLbzD1xFP1Sw/s1600/image14.jpg" height="83" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: left;">
That's it! Congratulations on setting up your new blog! You can find more helpful tutorials on customizing your blog by visiting the <b><a href="http://plumroselane-tutorials.blogspot.com/p/new-blogging-tutorials.html" target="_blank">Tutorials</a> </b>section of my blog. I also offer a more in-depth video tutorial on writing a blog post at this link: <b><a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-write-blogger-blog-post-video.html" target="_blank">How to: Write Your First Blog Post</a></b></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
Enjoy~</div>
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com1tag:blogger.com,1999:blog-307932083687837946.post-2365764742603043142013-06-29T11:45:00.000-04:002013-07-03T15:46:47.984-04:00How To: Add a Guest Author to Your BlogThis tutorial covers the steps to add a guest author to your blog. This option comes in handy if you need help with your blog or if you would like to host a guest writer.<br />
<br />
1. To begin, log into your blog and navigate to the "Settings" page as show below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFO2H9rvBABCt56zShk1P1nDBrcRZmghGcrLBN6Wbnjt6xwqT6tdVZr7sBppw1YTKFgGjlcSOfk9LusaNZKO810y4qq2e556W_dfTUgq2Bcx4QS3_knHKzt_23U82x6OX87Kw7BUYSB4hP/s850/image+1a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFO2H9rvBABCt56zShk1P1nDBrcRZmghGcrLBN6Wbnjt6xwqT6tdVZr7sBppw1YTKFgGjlcSOfk9LusaNZKO810y4qq2e556W_dfTUgq2Bcx4QS3_knHKzt_23U82x6OX87Kw7BUYSB4hP/s400/image+1a.jpg" width="400" /></a></div>
<br />
2. In the Permissions area, find the "Add authors" link and click that...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVm1YRHJw38tEea0rDNEwmyPV5j4gBvtBYIgz-9peeEWbJwetOctedCyq91MPvfiH3MkCZFd-ANTd7CNR90nL8gCry1So0fFOlqdjBFeu56HBWOyOZuIleDSu3zua9rhOgnwV7yL73oPTp/s850/image+1b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVm1YRHJw38tEea0rDNEwmyPV5j4gBvtBYIgz-9peeEWbJwetOctedCyq91MPvfiH3MkCZFd-ANTd7CNR90nL8gCry1So0fFOlqdjBFeu56HBWOyOZuIleDSu3zua9rhOgnwV7yL73oPTp/s400/image+1b.jpg" width="400" /></a></div>
<br />
3. A white text area will appear below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYeRlByVat-ctUZl35R5rlQMU-a-UIY05p9XNlAW5CRB_hz-0vAS33dugOlTN9npJH_1j-_jV3D1dyv31q1HtSwH5C_73POhDVQlYntahx2awqG3wBc_myZQpyAJNcbMlFluZdMETb3d0R/s850/image+2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="280" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYeRlByVat-ctUZl35R5rlQMU-a-UIY05p9XNlAW5CRB_hz-0vAS33dugOlTN9npJH_1j-_jV3D1dyv31q1HtSwH5C_73POhDVQlYntahx2awqG3wBc_myZQpyAJNcbMlFluZdMETb3d0R/s400/image+2a.jpg" width="400" /></a></div>
<br />
<br />
4. In the text field, type in the email address of your guest, being sure to type their address accurately...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiigxAkP6s5xhsetc0x3l1ycJj2JEgZ1mkqjUy_6cw5uLOISR0aAvLK6GJ_wKjL_MTtJDFubYBhR4OyJ9d5P6i73raDqtxKzbrka5Qj97S1YJrZtxHk9-EmztTr-Vd7XWLk1jw8X5IwvOe9/s849/image+3a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiigxAkP6s5xhsetc0x3l1ycJj2JEgZ1mkqjUy_6cw5uLOISR0aAvLK6GJ_wKjL_MTtJDFubYBhR4OyJ9d5P6i73raDqtxKzbrka5Qj97S1YJrZtxHk9-EmztTr-Vd7XWLk1jw8X5IwvOe9/s400/image+3a.jpg" width="400" /></a></div>
<br />
<br />
5. Once you begin typing an orange button will appear below the text field, click the button to send the invitation to your guest...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw06DU42gGksLVvRwhKb38xauzbOko8i4R7yPp_fcojEtyikokmSJEmcZSKUNAbeRWhe0M4TCOt09aMJPVMwxX9DuhIz2bK2DSANRCfzcLlKZCOQjBrH2zm0ok1xwX9tBoAbV1FtYUDnge/s850/image+3b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="271" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw06DU42gGksLVvRwhKb38xauzbOko8i4R7yPp_fcojEtyikokmSJEmcZSKUNAbeRWhe0M4TCOt09aMJPVMwxX9DuhIz2bK2DSANRCfzcLlKZCOQjBrH2zm0ok1xwX9tBoAbV1FtYUDnge/s400/image+3b.jpg" width="400" /></a></div>
<br />
6. Your guest will receive an email from Blogger inviting them to join your blog. The email will include a link they will need to click to accept and join. Once they have accepted you will see their information show up next to yours in the Permissions area....<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzz3QQBG5OxIv8LewXARPuTkzaNiGSNKZLrP2PANAL3RL9tDM1WDDfI41p3OYkWv_OuMHqc6Y2eMaC6gCPa-o3BTQwI3M21GOd31JyhhjCEd5QqzQoyuDi-EGwQpgB6LzopvErZCmVF9if/s850/image+4c.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="271" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzz3QQBG5OxIv8LewXARPuTkzaNiGSNKZLrP2PANAL3RL9tDM1WDDfI41p3OYkWv_OuMHqc6Y2eMaC6gCPa-o3BTQwI3M21GOd31JyhhjCEd5QqzQoyuDi-EGwQpgB6LzopvErZCmVF9if/s400/image+4c.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s183/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s183/PrL-section_break.png" /></a></div>
<div style="text-align: center;">
<br /></div>
7. At this stage, they are only an Author... this means they have the ability to write a blog post, and is denoted by the title next to their info...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9z1JG_ZWjktV_jLRATkIqQ8VONjC-XZqyBcPHw6KEsTe-qpGKJZwuF12YTIb3TOQ7dZObhdCSKJEAd_0vbfmu0P5h05KeZnRD3Wg8akMLkLQYAalz1rdzaeI_-PnUjDB-dXPa_C31ndi7/s850/image+6a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="271" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9z1JG_ZWjktV_jLRATkIqQ8VONjC-XZqyBcPHw6KEsTe-qpGKJZwuF12YTIb3TOQ7dZObhdCSKJEAd_0vbfmu0P5h05KeZnRD3Wg8akMLkLQYAalz1rdzaeI_-PnUjDB-dXPa_C31ndi7/s400/image+6a.jpg" width="400" /></a></div>
<br />
<br />
8. To change their status to Admin and give them access to your entire blog, then click on the button with "Author" and change it to "Admin"...<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjijB51SIQjwKrOyUKImjoqtRD8ha9tM8vsP6odjAaNV__TktO6W8Nc34GUxSpj-oAMlfftiBnWjIXfbdCtNReGC8EBleFLXz_Q3lY8eUCyitoQ7KClZpgydhBPfvC9CqRVxJOojvhKzqgI/s850/image+5a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="290" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjijB51SIQjwKrOyUKImjoqtRD8ha9tM8vsP6odjAaNV__TktO6W8Nc34GUxSpj-oAMlfftiBnWjIXfbdCtNReGC8EBleFLXz_Q3lY8eUCyitoQ7KClZpgydhBPfvC9CqRVxJOojvhKzqgI/s400/image+5a.jpg" width="400" /></a></div>
<br />
9. Once you've changed their status from Author to Admin you will need to notify them since Blogger does not send out an email notification for this step.<br />
<br />
That's it!<br />
<br />
Enjoy~<br />
<br />
<br />
<br />
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com3tag:blogger.com,1999:blog-307932083687837946.post-35189400960514727512013-03-26T10:17:00.003-04:002013-03-26T10:17:49.027-04:00How to: Install a Blog Badge (or add an Html Sidebar Gadget)This tutorial will cover the steps for installing a sidebar gadget that using html or java script code. It's a simple but important process as it allows you to easily install badges, buttons and widgets from all of the internet. Whether it's my own blog badge, a fellow blogger's button, or one of those nifty gadgets, the few steps involved are quite useful in helping us create our own blog space.<br />
<br />
To use this tutorial you'll need to have a sidebar item selected that uses Html code. For example purposes we'll use my own blog badge seen below but you can also find a wide range of free inspirational sidebar buttons from this page:<a href="http://www.blogger.com/%C2%A0http://www.prl-images.com/blog_buttons.html" target="_blank"> http://www.prl-images.com/blog_buttons.html</a> <br />
<br />
<center>
<img alt="Plumrose Lane" src="http://www.prl-images.com/images/my_images/badges/PrL_badge.png" style="border: 0px none;" /></center>
<center>
<textarea cols="20" id="code-source" name="code-source" rows="5"><center>
<a href="http://www.plumroselane.com/" target="_blank"><img border="0" src="http://www.prl-images.com/images/my_images/badges/PrL_badge.png" alt="Plumrose Lane" /></a></center>
</textarea></center>
<br />
To install this badge on your own blog you'll need "grab" the code or "copy" it and "paste" it into an Html/Java Script gadget. If you need help understanding or practicing how to copy and paste with your mouse I recommend following along with this easy video tutorial: <a href="http://www.youtube.com/watch?v=mXRT2YH8EDM">http://www.youtube.com/watch?v=mXRT2YH8EDM</a> The most important thing to remember when copying and pasting html code is that if you loose a snippet of code it may affect how the button appears so be sure to "grab" <b><i>all </i></b>of the code.<br />
<br />
So let's begin...<br />
<br />
1. Begin by logging into your blog, and click "Design"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_To2RdCSWz89-rVPGPZwOjw7iGXHpb-hoWZbYokiBIjivRjF-IFjb-sj-8mnQb3WEc3HUTHMX8IX4ZGOolAvO8ieOPaH_LCICSw8c7ovuQqq7LrujxU3o-XqweZc9YIy3OS8dcSPk1o6m/s1600/image-1a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_To2RdCSWz89-rVPGPZwOjw7iGXHpb-hoWZbYokiBIjivRjF-IFjb-sj-8mnQb3WEc3HUTHMX8IX4ZGOolAvO8ieOPaH_LCICSw8c7ovuQqq7LrujxU3o-XqweZc9YIy3OS8dcSPk1o6m/s400/image-1a.jpg" width="400" /></a></div>
<br />
2. Now navigate to the "Layout" section of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhep9qfprk0inA7cJqkIuJAJZUFaAllR6UvD9arWq-be9x3S60b1HoyE-6nxRwWUdoBfj56gUnxa7xv4bpilEQWUNAJy8hbkT_mCLTu2bg9LiHlCDnNFReMKyJKMLm1BmY0wpHJaPn4vpQJ/s1600/image-2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhep9qfprk0inA7cJqkIuJAJZUFaAllR6UvD9arWq-be9x3S60b1HoyE-6nxRwWUdoBfj56gUnxa7xv4bpilEQWUNAJy8hbkT_mCLTu2bg9LiHlCDnNFReMKyJKMLm1BmY0wpHJaPn4vpQJ/s400/image-2a.jpg" width="400" /></a></div>
<br />
<i>In this area you can see a skeletal view of your blog. Looking over the various sections you'll see the navigation bar, "Header" area, "Blog Posts" area, and any sidebars you have setup on your blog. This is where you can easily install, move around, and remove various gadgets for your blog. Clicking on "Add a Gadget" enables you to access a wide range of built-in gadgets that Blogger offers it's user. </i><br />
<i><br /></i>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEgDNjzOaP1H1P_KcBFH4eKnem0MhEAyVe29KLZJ6pSCLjN3aUELDQ1DVcH7EfRdqJYS7FeiR-bKZAodhjRh2H1dnHbz3ofW_MOGMnZqZw7D9I1r-TS_xvt4ZFUC-llW4Rykj1aufhCP_P/s1600/image-3a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEgDNjzOaP1H1P_KcBFH4eKnem0MhEAyVe29KLZJ6pSCLjN3aUELDQ1DVcH7EfRdqJYS7FeiR-bKZAodhjRh2H1dnHbz3ofW_MOGMnZqZw7D9I1r-TS_xvt4ZFUC-llW4Rykj1aufhCP_P/s400/image-3a.jpg" width="400" /></a></div>
<br />
<br />
So let's go on and access this area...<br />
<br />
3. Click on the "Add a Gadget" link in the sidebar area of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhMls56jpsROKYaXls2jMCct_4kr0Z9aa8Fdp9Aspuy15-sgmBO61M3lH-89CNn8Rd2lJ_YbXhbJwgpwFPCKtlvzpdlziiNcXXjGvIeHL5-oTmy8JeKuT5Hx6ZMvXQbgG_3t3Y8eg7x0Y-/s1600/image-3b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhMls56jpsROKYaXls2jMCct_4kr0Z9aa8Fdp9Aspuy15-sgmBO61M3lH-89CNn8Rd2lJ_YbXhbJwgpwFPCKtlvzpdlziiNcXXjGvIeHL5-oTmy8JeKuT5Hx6ZMvXQbgG_3t3Y8eg7x0Y-/s400/image-3b.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
4. You'll see a small window up...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju_JQPEreTyCV5pYSRwOfpE_C31961_iWUnAhHHvgDUm6b-RDFNjTW3gnVl3NZcgFoiQ24jk2pHt2uKzYZpS4DL3sfr1G0NfFO0TV3TqOpB17Kts3t13gDO_yNL0Izo5zkO3q3gsaGP7A2/s1600/image-4a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju_JQPEreTyCV5pYSRwOfpE_C31961_iWUnAhHHvgDUm6b-RDFNjTW3gnVl3NZcgFoiQ24jk2pHt2uKzYZpS4DL3sfr1G0NfFO0TV3TqOpB17Kts3t13gDO_yNL0Izo5zkO3q3gsaGP7A2/s400/image-4a.jpg" width="400" /></a></div>
<br />
<br />
<i>This is where you can access all of the built-in add-ons that Blogger offers. </i><br />
<br />
5. We're going to be using "HTML/Java Script" gadget so using the scroll bar, scroll down until you see that option...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTu2PTOYTefUveDHxeWPerRQDHfmJxAWBoKHL77aaVHZDbp6p4O7FwidZua0Pe46cSf7TeXe9r-i2UFeBvTmkqHteuSSYxaFXMQ6HT-lGjUs83PkPMF9hXfbd5U7jIwDQUuhA6xirxXtXK/s1600/image-4b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTu2PTOYTefUveDHxeWPerRQDHfmJxAWBoKHL77aaVHZDbp6p4O7FwidZua0Pe46cSf7TeXe9r-i2UFeBvTmkqHteuSSYxaFXMQ6HT-lGjUs83PkPMF9hXfbd5U7jIwDQUuhA6xirxXtXK/s400/image-4b.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT54S17F9wu9o_fvHR2fj34KWfPOJhSHWWtkLGQFqZOz_N4R9guCdbJRL_A1kaTE0W-ohKBGJH2JVwCdh2N4ztSorSMvZ8yRP6Z4if-pFdxdyTKOv_RQYjc0vtyHlBc7KZAAh6vOO5HH50/s1600/image-5a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT54S17F9wu9o_fvHR2fj34KWfPOJhSHWWtkLGQFqZOz_N4R9guCdbJRL_A1kaTE0W-ohKBGJH2JVwCdh2N4ztSorSMvZ8yRP6Z4if-pFdxdyTKOv_RQYjc0vtyHlBc7KZAAh6vOO5HH50/s400/image-5a.jpg" width="400" /></a></div>
<br />
6. Now click on either the title or the blue + button...<br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaoitT7VwC1FHVsv6NKn0rDYLYKUkcgBsb9cw5v84gNa0BEwVgbb97zIiyPR9AmnSr-FBNw6swNSJDGmFZ6iVgW23fjegerr0Yf7fDr5bwMEVU2vBOy40f0M2DueYo0AI7mO3Lmvj5D2GL/s1600/image-6a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaoitT7VwC1FHVsv6NKn0rDYLYKUkcgBsb9cw5v84gNa0BEwVgbb97zIiyPR9AmnSr-FBNw6swNSJDGmFZ6iVgW23fjegerr0Yf7fDr5bwMEVU2vBOy40f0M2DueYo0AI7mO3Lmvj5D2GL/s400/image-6a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
In this area you'll now see where we can title your gadget and paste in any Html or Java Script code.<br />
<br />
7. Going back to the code from my own blog badge at the beginning of this tutorial, copy the Html code and paste it into the large rectangle as shown below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLbcyK7PK3yKjP9KYOyxEMkP8ZkSHTs-1un16ZO-zj6v-fjolMSVdMdcppKzs7ZTG_zwlu92JhobdCpHHUAPACSNmxmWav-CLUm0sqhyphenhyphend7OCDBf8MrWNlHq1Qar0shQv8Q7fv4RMK9eXdd/s1600/image-7a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLbcyK7PK3yKjP9KYOyxEMkP8ZkSHTs-1un16ZO-zj6v-fjolMSVdMdcppKzs7ZTG_zwlu92JhobdCpHHUAPACSNmxmWav-CLUm0sqhyphenhyphend7OCDBf8MrWNlHq1Qar0shQv8Q7fv4RMK9eXdd/s400/image-7a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
When I'm working with a lot of sidebar gadgets, I find it easier to temporarily title new ones so I can easily move them to their final location so let's do that too while we're here...<br />
<br />
8. Type a simple title in, something easy like "new button" works and you can always change this or delete it later...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivvBSfBfs3JEcTarsj9hldN580edWS5WT-Hxo7JRTC1711H71UaK-c47wx3m9Dp_V0Wltgap_IlGw386niTUxv42EWebO0OlpduD7qTiaizDQwYUnNKZs1JUWZ_j8TUS5dbzJV5GZwj7Gi/s1600/image-8a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivvBSfBfs3JEcTarsj9hldN580edWS5WT-Hxo7JRTC1711H71UaK-c47wx3m9Dp_V0Wltgap_IlGw386niTUxv42EWebO0OlpduD7qTiaizDQwYUnNKZs1JUWZ_j8TUS5dbzJV5GZwj7Gi/s400/image-8a.jpg" width="400" /></a></div>
<br />
9. With that completed we can now click "Save"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhffhkuJY1Zorn6DUA97JRyNmbczVgc4h0jB2_D4cVGMD26Q4a2JuavOOrWTv2WCq7iv7dkwsfdRLNrU7kBuoGCcu74lnWYU39E8J0m0ma_EnGpE3vjdbDkBvcPaYA8HeUwtKyhzrxwN0j_/s1600/image-9a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhffhkuJY1Zorn6DUA97JRyNmbczVgc4h0jB2_D4cVGMD26Q4a2JuavOOrWTv2WCq7iv7dkwsfdRLNrU7kBuoGCcu74lnWYU39E8J0m0ma_EnGpE3vjdbDkBvcPaYA8HeUwtKyhzrxwN0j_/s400/image-9a.jpg" width="400" /></a></div>
<br />
10. You will now see your new gadget present on your blog's Layout...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGRPMITDLMB_1yKe_IAgkoeFQUPkF7L1uiHhqPYCcfkTnbboUDxILmOV-Zr3i1kPyrLcYVgvWln2XEryy8vrKvfXz_tlcUh16Qgth5vXbh5AvtPpHXu0mKG52atXNVadixvU_3TXq7drb0/s1600/image-10a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGRPMITDLMB_1yKe_IAgkoeFQUPkF7L1uiHhqPYCcfkTnbboUDxILmOV-Zr3i1kPyrLcYVgvWln2XEryy8vrKvfXz_tlcUh16Qgth5vXbh5AvtPpHXu0mKG52atXNVadixvU_3TXq7drb0/s400/image-10a.jpg" width="400" /></a></div>
<br />
Now let's reposition this new gadget so we can remove that temporary title...<br />
<br />
11. By clicking on the gadget with your mouse, you can easily drag the object to a new location within your layout...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN7bGQZr1A6QmFRIvX-2lUiBcIp70BXv2gT7qGgslbIuk4zqswIJ444wUQuDfnjtSKGmz39LyztgtO3J0MDm1pq-QT2LuJMvGTtdvaveSQrKJIWZxcGVIyMmScesRA8EEChLRablWYqcs2/s1600/image-11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN7bGQZr1A6QmFRIvX-2lUiBcIp70BXv2gT7qGgslbIuk4zqswIJ444wUQuDfnjtSKGmz39LyztgtO3J0MDm1pq-QT2LuJMvGTtdvaveSQrKJIWZxcGVIyMmScesRA8EEChLRablWYqcs2/s400/image-11.jpg" width="400" /></a></div>
<br />
12. Choose where you would like to place your new button and then click the "Save arrangement" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv_jNFiGX8ExvOfGhGNDiG90QW4jVpVjtsv9JSUNkbKs9UkBZl6Bu9cxsXfbhC67qb0o6_FYteQpQ6MfAJh7d7aYtMHw-nbwRBHsTCi7xe-fEhr8GFuGvzYcyQme9ZczALQR_V911a5eXR/s1600/image-12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv_jNFiGX8ExvOfGhGNDiG90QW4jVpVjtsv9JSUNkbKs9UkBZl6Bu9cxsXfbhC67qb0o6_FYteQpQ6MfAJh7d7aYtMHw-nbwRBHsTCi7xe-fEhr8GFuGvzYcyQme9ZczALQR_V911a5eXR/s400/image-12.jpg" width="400" /></a></div>
<br />
13. With that done, you can click on the "Edit" link within your new gadget to remove the temporary title...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTP_AqfY8kb8Y2MPANYoecaeBGTRzGxyx8iQiroenT2fNRSufrmSP1Z9Y_C3wUOmjteGosoK9IRv69gLc_1RhkbhTHcNCa1CP40iaeS0T_7kfVH6gzV80r9ZRHSEFKA82HfrKKFxXChQap/s1600/image-13.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTP_AqfY8kb8Y2MPANYoecaeBGTRzGxyx8iQiroenT2fNRSufrmSP1Z9Y_C3wUOmjteGosoK9IRv69gLc_1RhkbhTHcNCa1CP40iaeS0T_7kfVH6gzV80r9ZRHSEFKA82HfrKKFxXChQap/s400/image-13.jpg" width="400" /></a></div>
<br />
14. Just be sure to click "Save" to keep your change...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz6TTB5KLuBo6cQ2c6WL3i14tPrWzWMllasY0AvrSP0cS5IhUdCA4hWLElEmuNs_mgkkMT0sGFnJyNB6t6CtQVZWc8Gic2KZrpGE_xfg-jpJmfgKBN_HOdeM5G43-iKyxiLPsl_q3xqvWA/s1600/image-14.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz6TTB5KLuBo6cQ2c6WL3i14tPrWzWMllasY0AvrSP0cS5IhUdCA4hWLElEmuNs_mgkkMT0sGFnJyNB6t6CtQVZWc8Gic2KZrpGE_xfg-jpJmfgKBN_HOdeM5G43-iKyxiLPsl_q3xqvWA/s400/image-14.jpg" width="400" /></a></div>
<br />
15. Your new gadget will now be titled by it's default gadget title...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnbNy3YY3dUZWlkrYiZ_N2BluCCuPeD-9qmevSGuEcR_wRnqOhSaKzEzdqKgXpvezM1SDQ4DgyFcbZGB9o87FN6MRU96fShDEDSBgf5mAMAbRGr6kJvEnOpCQogao6faNUJRpl3dQj7Fkb/s1600/image-15.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnbNy3YY3dUZWlkrYiZ_N2BluCCuPeD-9qmevSGuEcR_wRnqOhSaKzEzdqKgXpvezM1SDQ4DgyFcbZGB9o87FN6MRU96fShDEDSBgf5mAMAbRGr6kJvEnOpCQogao6faNUJRpl3dQj7Fkb/s400/image-15.jpg" width="400" /></a></div>
<br />
16. That's it! Congratulations ~ you've now added an Html/Java Script gadget! You can click the "View blog" button to view your new item...<br />
<br />
Enjoy~<br />
<br />
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com23tag:blogger.com,1999:blog-307932083687837946.post-28165501866601585592013-02-05T01:25:00.003-05:002013-02-05T01:25:41.158-05:00How to: Push (or Center) a Blog HeaderThis tutorial is to serve as an alternative to my other tutorial titled <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-center-blog-header.html" target="_blank">How to: Center a Blog Header</a>. Although that method works well in most cases, it can fail to center if used with other enhanced template features so if you find your banner image is not centering properly then go ahead and give this simple method a try. The code below is not meant to be used in combination with any other code for centering a header so be sure to remove any prior "banner centering code" before moving forward. <br />
<br />
To use this tutorial you will need to have a banner already loaded onto your blog. If you need help installing a blog banner then follow this tutorial: How to: Install a Blog Header.<br />
With a banner in place you are ready to move forward with "pushing" your blog header, so let's begin...<br />
<br />
1. Log-in to your blog click on the "Design" link in the top right corner link list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl_MPSLR77jt8RrVH5qSNR92gcwJbNReH0yjqRGbCw0BNi78elzTbU9zJDjodxhad6Lc4f3A1n66n-M5hEREhCkzM7fet7N6Od5YRL2WNbBDC9DzsZLwH6njOdAd-SwahVepq8sVe_4oRn/s1600/image+1a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl_MPSLR77jt8RrVH5qSNR92gcwJbNReH0yjqRGbCw0BNi78elzTbU9zJDjodxhad6Lc4f3A1n66n-M5hEREhCkzM7fet7N6Od5YRL2WNbBDC9DzsZLwH6njOdAd-SwahVepq8sVe_4oRn/s400/image+1a.jpg" width="400" /></a></div>
<br />
2. This should bring you directly to the "Template" page, in the left links list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf4epmCfd1Pb1e-9Ios-m8DrfBThtIvNpmntqFyr637Xa0_woSblT3CfZd28m3hn01ulb5_7xVPhuVUo-_aOp0N1ZXtAT0fK6ubgX3WXozVRLBfVJCxA99cndAgzYMJ51aCKigxZS0oC00/s1600/image+2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf4epmCfd1Pb1e-9Ios-m8DrfBThtIvNpmntqFyr637Xa0_woSblT3CfZd28m3hn01ulb5_7xVPhuVUo-_aOp0N1ZXtAT0fK6ubgX3WXozVRLBfVJCxA99cndAgzYMJ51aCKigxZS0oC00/s400/image+2a.jpg" width="400" /></a></div>
<br />
3. Click on the "Customize" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU_6h8vVosuniptILoCKr8a96h-_kR-XMHhUHNBWSz-jKfmh0sucULsOvPYED6IaGGpWd-EFX9pGts6v2UFhtqHdRMrxconTzQAbRzD2ZqUzibDAsKTht1FPMQ-5S8H0-eW9OgQ53fQKbD/s1600/image+2b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU_6h8vVosuniptILoCKr8a96h-_kR-XMHhUHNBWSz-jKfmh0sucULsOvPYED6IaGGpWd-EFX9pGts6v2UFhtqHdRMrxconTzQAbRzD2ZqUzibDAsKTht1FPMQ-5S8H0-eW9OgQ53fQKbD/s400/image+2b.jpg" width="400" /></a></div>
<br />
4. We are now in the "Template Designer" area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhknPiSdatWViO6Jar2Ogk1wKAtFw9ujKjaISxc33BNYin7hTWbswAh6iTXvmm_ySO456fndeCnq9d8vr-eZrBh-asHXPmCugEgx-YbPU_pCp4UtPHE0cE_RNmt2zekXirZDe-VzlKLCSbH/s1600/image+3.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhknPiSdatWViO6Jar2Ogk1wKAtFw9ujKjaISxc33BNYin7hTWbswAh6iTXvmm_ySO456fndeCnq9d8vr-eZrBh-asHXPmCugEgx-YbPU_pCp4UtPHE0cE_RNmt2zekXirZDe-VzlKLCSbH/s400/image+3.JPG" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
This interface offers you the ability to easily change aspects of your blog. We will be adding some code to the "Advanced CSS" area so let's navigate to that area...<br />
<br />
5. Click on "Advanced" at the bottom of the left link list...<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFlgOoxJ8vsAQyq-yZDkDBfXFLCIjY_uItNVVEghzMcXGARyf_LTUsxah7uWaztQLDzBgThDNk8P3zHL1SDZYpA3Mk-FppHISFIpRvgs6E0eu1xNQiKxn7izBQ_lGnVWNv-WFwkJpoOIaO/s1600/image+3a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFlgOoxJ8vsAQyq-yZDkDBfXFLCIjY_uItNVVEghzMcXGARyf_LTUsxah7uWaztQLDzBgThDNk8P3zHL1SDZYpA3Mk-FppHISFIpRvgs6E0eu1xNQiKxn7izBQ_lGnVWNv-WFwkJpoOIaO/s400/image+3a.jpg" width="400" /></a></div>
<br />
6. Now using the scroll bar...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdx98JVmz6cISTqXwccJpvNTIIGKTu8spkUFwEz0JR1FU7G9NLxFi8jfrMlx-RXm2Gk95H7LY6qXRMiwoAkCoAGG3lUnHoAvbs5is9zWBV__hTrqyZV7PDDVykRMR3Qi6ieenWGj8puz_p/s1600/image+4a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="207" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdx98JVmz6cISTqXwccJpvNTIIGKTu8spkUFwEz0JR1FU7G9NLxFi8jfrMlx-RXm2Gk95H7LY6qXRMiwoAkCoAGG3lUnHoAvbs5is9zWBV__hTrqyZV7PDDVykRMR3Qi6ieenWGj8puz_p/s400/image+4a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
7. Scroll down the inner link list until you see "Add CSS"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLZhyphenhyphen6XxxmnwUhr0ir8nMqXTIqOWPFIkKg2MXo5xJbD6TeGLy_ZyI2nteWQtrK7thzCiDpTTUxW_pGkdIpW1yJGcK-oZdD9aqXxhrbhTM4GQfDk_YIZENrQA5J-0yUVtaY3diZTdUMhxlE/s1600/image+5a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLZhyphenhyphen6XxxmnwUhr0ir8nMqXTIqOWPFIkKg2MXo5xJbD6TeGLy_ZyI2nteWQtrK7thzCiDpTTUxW_pGkdIpW1yJGcK-oZdD9aqXxhrbhTM4GQfDk_YIZENrQA5J-0yUVtaY3diZTdUMhxlE/s400/image+5a.jpg" width="400" /></a></div>
<br />
8. Click on that link to be taken to the CSS area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZfwm0nDss7gWUD_sQ8UDNRm43zZ3TTSWdiDD6Lv8Bs1_tnOAEdr1aEQguTYrisjlB0O1xF7ZpeTh4_O8DxUIB8hxB2IDnsVT-wurCKBs2H0fDCYUx-jvZgIXfAKVgVEar8mjAPj662SWe/s1600/image+6a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZfwm0nDss7gWUD_sQ8UDNRm43zZ3TTSWdiDD6Lv8Bs1_tnOAEdr1aEQguTYrisjlB0O1xF7ZpeTh4_O8DxUIB8hxB2IDnsVT-wurCKBs2H0fDCYUx-jvZgIXfAKVgVEar8mjAPj662SWe/s400/image+6a.jpg" width="400" /></a></div>
<br />
If you've previously inserted any CSS code then you will see it present in this area. If you have not then this area will be empty on your blog.<br />
<br />
9. Now copy the code from the scrolling box below...<br />
<br />
<center>
<textarea cols="20" id="code-source" name="code-source" rows="3">#header-inner img {margin: 0 auto 0 30px;}
</textarea></center>
<br />
10. And paste it into the CSS area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYAotnSJncBWboyjjBXYER6CVeKjrXdSiJW61iRHJEP6v9uIdbgGoFDC8tNA46c5j5PWJhSL1u5txupd3x4ic9szJ6Ew5WPhspenFSV1HGU9Xg1FnYcTmXVnCYXjXfta-oL-M9WRz-BtjV/s1600/image+7a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYAotnSJncBWboyjjBXYER6CVeKjrXdSiJW61iRHJEP6v9uIdbgGoFDC8tNA46c5j5PWJhSL1u5txupd3x4ic9szJ6Ew5WPhspenFSV1HGU9Xg1FnYcTmXVnCYXjXfta-oL-M9WRz-BtjV/s400/image+7a.jpg" width="400" /></a></div>
<br />
and you should see your banner image immediately shift to the right.<br />
<br />
11. If you wish to move it over further to the right or left you can easily do this by either increasing or decreasing the last number in the code. So, if the setting is at "0", then your banner will be all the way to the farthest left position it can go...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS6EK6j_CKHTuj8xqGItlUTgxFzCXH-O35ztj55VxabUCiCiPNc-PksQ5fsfNsq5NjmrXMIHsD8WzW1fkr3UaoYpiSU8eQY7eoK573XEtdmC0BHpAbVPVDM5QQbE8JonB0YF1k0q4STDk6/s1600/image+8a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS6EK6j_CKHTuj8xqGItlUTgxFzCXH-O35ztj55VxabUCiCiPNc-PksQ5fsfNsq5NjmrXMIHsD8WzW1fkr3UaoYpiSU8eQY7eoK573XEtdmC0BHpAbVPVDM5QQbE8JonB0YF1k0q4STDk6/s400/image+8a.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
12. And if you increase the number to say "100", then you will see your banner image move way over to the right side...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWDwfiRUqhqClQt0CiOvSRoD6dCRo4Bgv9fI3iRYRfPf5yU03CtqObOUOKEwmQeWXaKOeNAPZEClmGUarm5-BAplMAJDWKQ88qQGGeyzbgcOVaMYQDl9iV8i0gMkpxQU15DfvyPAQcLAu6/s1600/image+9a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="206" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWDwfiRUqhqClQt0CiOvSRoD6dCRo4Bgv9fI3iRYRfPf5yU03CtqObOUOKEwmQeWXaKOeNAPZEClmGUarm5-BAplMAJDWKQ88qQGGeyzbgcOVaMYQDl9iV8i0gMkpxQU15DfvyPAQcLAu6/s400/image+9a.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
13. Personally, I think somewhere between 30 - 50 works best but test it out and see what looks best on your own blog....<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge3MFSVz8p5q2s_TOhDDjjVAAoHZG2JfGR6O3VzfdAsdFRaKSXQUXf_JZbTQnXhBlSbwmHa6s2CQN3cOAKR74Q4dr-S2jwhguFmw6GGPg7CKcEH8Cq1t_dnwkJQJ5NoWF-dwpG6gPgAKwa/s1600/image+10a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="207" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge3MFSVz8p5q2s_TOhDDjjVAAoHZG2JfGR6O3VzfdAsdFRaKSXQUXf_JZbTQnXhBlSbwmHa6s2CQN3cOAKR74Q4dr-S2jwhguFmw6GGPg7CKcEH8Cq1t_dnwkJQJ5NoWF-dwpG6gPgAKwa/s400/image+10a.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
14. Once you have your banner image set where you want it, then save your changes by clicking the "Apply to Blog" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfx-qF3Vgtwr000lAOAsjXvUfRkYwmf9UtHas9CVqPqXkAwa2Qrr5Epc8q82DwNLSI6ciqnGOOL-yDMYchjhV0cLwtiEibxjIHsc-D9YxaDrRjZhI9mPo5be_ofYEwG6-PS7-aogWseluP/s1600/image+11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="207" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfx-qF3Vgtwr000lAOAsjXvUfRkYwmf9UtHas9CVqPqXkAwa2Qrr5Epc8q82DwNLSI6ciqnGOOL-yDMYchjhV0cLwtiEibxjIHsc-D9YxaDrRjZhI9mPo5be_ofYEwG6-PS7-aogWseluP/s400/image+11.jpg" width="400" /></a></div>
<br />
That's it! You've now successfully centered your blog banner. If you decide to change the dimensions of your blog layout in the future, you can simply return to this area and increase or decease that last number to recenter you banner image.<br />
<br />
Enjoy~Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com9tag:blogger.com,1999:blog-307932083687837946.post-80248022400278235712013-01-31T22:27:00.002-05:002013-04-11T22:31:45.766-04:00How to Add a Title to a Blog HeaderThis tutorial will cover how to add your blog title to one of my free blog banners. This tutorial is designed to be used only with a <i><b>free </b></i>designer blog header and never meant to be used with any copyright protected images. I offer a selection of free banners located through out my prefab blog themes and they are easily recognizable with the word "<i><span style="color: #cc0000;"><b>free</b></span></i>" above them. To find one of my free blog banners you can peruse the <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/themes.html" target="_blank">A-Z List of Blog Themes</a> or select from one of the titles below, which are just a sampling of the free banners I offer...<br />
<br />
<b>Some of my Free Headers</b><br />
<a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/heart-for-you-blog-theme.html" target="_blank">A Heart for You</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/binding-journey-blog-theme.html" target="_blank">Binding Journey</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2011/05/birthday-bash-blog-theme.html" target="_blank">Birthday Bash</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/12/blueberry-plumcicle-blog-theme.html" target="_blank">Blueberry Plumcicle</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2011/02/bundle-of-joy-blog-theme.html" target="_blank">Bundle of Joy</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/cherish-blog-theme.html" target="_blank">Cherish</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2011/07/daydream-believer-blog-theme.html" target="_blank">Day Dream Believer</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/fanciful-love-blog-theme.html" target="_blank">Fanciful Love</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/flight-of-fancy-blog-theme.html" target="_blank">Flight of Fancy</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2011/06/fore-father-blog-theme.html" target="_blank">Fore-Father</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2011/06/freedom-blog-theme.html" target="_blank">Freedom</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/gilded-love-blog-theme.html" target="_blank">Gilded Love</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/je-taime-blog-theme.html" target="_blank">Je T'aime</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/marleque-embellished-blog-theme.html" target="_blank">Marleque</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/once-upon-pink-october.html" target="_blank">Once Upon a Pink October</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/practical-magic-blog-theme.html" target="_blank">Practical Magic</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2012/12/providence-blog-theme.html" target="_blank">Providence</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/spring-medley-blog-theme.html" target="_blank">Spring Medley</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/st-pattys-day-blog-theme.html" target="_blank">St. Patty's Day</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/stardust-blog-theme.html" target="_blank">Stardust</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/sunshine-garden-blog-theme.html" target="_blank">Sunshine Garden</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/tattered-garden-blog-theme.html" target="_blank">Tattered Garden</a>, <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/tea-for-two-blog-theme.html" target="_blank">Tea for Two</a>, and <a href="http://plumroselane-bckgrnds.blogspot.com/2010/01/vintage-easter.html" target="_blank">Vintage Easter</a><br />
<br />
While I'm sure there are many free online options for successfully modifying images, for this tutorial we will be using PicMonkey. I like this site because it has a reputable <a href="http://www.mywot.com/" target="_blank">WOT</a> rating and offers a nice simple to use interface.<br />
<br />
Once you've selected a banner and saved it to your computer, you're ready to begin this tutorial. Be sure the banner is saved in an easy to find location ~ <i>for this exercise I recommend placing the image on your desktop so it's super simple to find.</i> Now let's begin...<br />
<br />
1. Open your browser and go to <a href="http://www.picmonkey.com/">http://www.picmonkey.com</a>...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibiakRHM2wX5KkYYSehDKHbJA1Aa4LZH9tEbDBYCShOAIVHayhZGfxwt346A4q_pNpnxk2LAiqpfOFbRQMnjfvMTpaJbmbJf7YPxd2jo_ID4I5pUgZpuX3DhegRilLXhZccKQ1cLwQfYvt/s1600/image+1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibiakRHM2wX5KkYYSehDKHbJA1Aa4LZH9tEbDBYCShOAIVHayhZGfxwt346A4q_pNpnxk2LAiqpfOFbRQMnjfvMTpaJbmbJf7YPxd2jo_ID4I5pUgZpuX3DhegRilLXhZccKQ1cLwQfYvt/s400/image+1.JPG" width="400" /></a></div>
<br />
2. Once there, hover your mouse over the "Edit Picture" area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimNEXWCCUekC4wb3Z4eOtTfSlCab7EP2PuRbAh6UXGktTkSnWKgH1dAd4JBg2iY_JvEWTcmvhTMyHqyIzmEWCx-ZNsi4ZQUKmADRq8Tgd0-3rrxoSO7IScbV1pF4i1Ke4xYmzjwFiG6SYa/s1600/image+1a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimNEXWCCUekC4wb3Z4eOtTfSlCab7EP2PuRbAh6UXGktTkSnWKgH1dAd4JBg2iY_JvEWTcmvhTMyHqyIzmEWCx-ZNsi4ZQUKmADRq8Tgd0-3rrxoSO7IScbV1pF4i1Ke4xYmzjwFiG6SYa/s400/image+1a.jpg" width="400" /></a></div>
<br />
3. And you'll see the words change to "Click to open or drag a photo here"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ToVJF_ZE8YBSBSxVcl_k2rA_Qy3xEFesxBqxuaPaQ7Z0rLVXokczxK9kSc2wKResYCzzRMuKxR-wZzQRKUU5c-RMByGgnNkDEhMKLHNeE1-Bgcs-g6iW5xsTRmbV8G2SJn92Iemrah9O/s1600/image+2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ToVJF_ZE8YBSBSxVcl_k2rA_Qy3xEFesxBqxuaPaQ7Z0rLVXokczxK9kSc2wKResYCzzRMuKxR-wZzQRKUU5c-RMByGgnNkDEhMKLHNeE1-Bgcs-g6iW5xsTRmbV8G2SJn92Iemrah9O/s400/image+2a.jpg" width="400" /></a></div>
<br />
<i>Since you have your banner located on your desktop you can easily drag and drop the image into the small rectangle area.</i><br />
<br />
5. In one easy step this opens up the banner image in the PicMonkey photo editing area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWMibUgoh8sq0Q_-DOEZDRB-_jRY-rcUoSJGvsYQTx28zk4C6Du71OszTDBpYfSp-fb6aIlosmvqe55B9gbGkdlfIRr8vsFZnS7XcwOlsfYvTnCWe2Bals3S7P5OpIBx9G9d4kddD1Gbx7/s1600/image+3.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWMibUgoh8sq0Q_-DOEZDRB-_jRY-rcUoSJGvsYQTx28zk4C6Du71OszTDBpYfSp-fb6aIlosmvqe55B9gbGkdlfIRr8vsFZnS7XcwOlsfYvTnCWe2Bals3S7P5OpIBx9G9d4kddD1Gbx7/s400/image+3.JPG" width="400" /></a></div>
<br />
6. Now since my copyright only allows for adding text to banner images we're going to go right down to the text area and click on that...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRPYH1e2qn2Oe7HAC2UqNLa4YEbxY5HRChRAsYKhmcklOS-DTP-D3mCJr8xwL-nVlj8W-JsT_yAhaKS1qeRSRmF6X75x51LbnqP246E4SJoXrDx2tMBuEnfmTmBR93GMygRJsKxfFP2QC1/s1600/image+3a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRPYH1e2qn2Oe7HAC2UqNLa4YEbxY5HRChRAsYKhmcklOS-DTP-D3mCJr8xwL-nVlj8W-JsT_yAhaKS1qeRSRmF6X75x51LbnqP246E4SJoXrDx2tMBuEnfmTmBR93GMygRJsKxfFP2QC1/s400/image+3a.jpg" width="400" /></a></div>
<br />
7. Using the scroll bar, scroll through the selection of text choices to find one you like...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6f7Wn15sDM7xkD91WTCSYw8HTcHUKLLHIwB93jWC1K2_huCv4oNzMjeFfSBtt_LPb6zZIigVi_f1tjjkbWHTwaCXC6-XI575ZLR0AOV4r-pQFWyhbWfo4IP55wr7zp8g4q5onSrs1xAgJ/s1600/image+4a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6f7Wn15sDM7xkD91WTCSYw8HTcHUKLLHIwB93jWC1K2_huCv4oNzMjeFfSBtt_LPb6zZIigVi_f1tjjkbWHTwaCXC6-XI575ZLR0AOV4r-pQFWyhbWfo4IP55wr7zp8g4q5onSrs1xAgJ/s400/image+4a.jpg" width="400" /></a></div>
<br />
8. Once you've made your selection, click on that title, then click on the "Add Text" box at the top of the list...<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1WZ2u3iMzOW2Zck6UBXWDub1Imx855FDDeWiKcRR1ACwRGO3PXW6jpJcE5SzMIeDESlZb0mB1mIkhiLYrMTzAM6tn1E9C8EZhkadEyETgdRufV4Hi9tuCvDQl-TNX09rWfzcikRwpLQyK/s1600/image+6a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1WZ2u3iMzOW2Zck6UBXWDub1Imx855FDDeWiKcRR1ACwRGO3PXW6jpJcE5SzMIeDESlZb0mB1mIkhiLYrMTzAM6tn1E9C8EZhkadEyETgdRufV4Hi9tuCvDQl-TNX09rWfzcikRwpLQyK/s400/image+6a.jpg" width="400" /></a></div>
<br />
9. With this, you'll see the Text box window open up, which includes a color chart and other selections, as well as a small box show up in the center of the banner image...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjZsHGMKRof6U30p7OmlEuwiIv8t6goVd3PgXO61fBSf2nh6DfXomjmPvBcVjt6gReck-iZFW_nCcKbn8neIhMVMHvS9hwiMovW2r4SbNs__HcV1FXnQnEarBIygBDRlcANep-xtPKuyvN/s1600/image+7a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjZsHGMKRof6U30p7OmlEuwiIv8t6goVd3PgXO61fBSf2nh6DfXomjmPvBcVjt6gReck-iZFW_nCcKbn8neIhMVMHvS9hwiMovW2r4SbNs__HcV1FXnQnEarBIygBDRlcANep-xtPKuyvN/s320/image+7a.jpg" width="320" /></a></div>
<br />
10. We'll begin by adding our text, then move on to modifying it's appearance, so let's begin by clicking inside that small text area in the center of the banner...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB6I7Rdq1vn3JN89mxo0ChSBSRPF8Gv4bHX4QB8UCMGf5e12Z7J3eCDAqKCSMH_SWPOwIFX3SniacqoK8dhwDPBMOqcVoKNsYp0ga3zmLq9xEuuPLOkiAp3aKdT8TEgln8CweclfSebJt0/s1600/image+8-2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="182" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB6I7Rdq1vn3JN89mxo0ChSBSRPF8Gv4bHX4QB8UCMGf5e12Z7J3eCDAqKCSMH_SWPOwIFX3SniacqoK8dhwDPBMOqcVoKNsYp0ga3zmLq9xEuuPLOkiAp3aKdT8TEgln8CweclfSebJt0/s400/image+8-2a.jpg" width="400" /></a></div>
<br />
11. Click and type your entire blog title in that space...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiP9e2z7-p7fnQlaSfM9uBx_unk_GJELXBE5cKSkaNtBX6bVj1MSO1DDgq4Pg7-NpDw4UVR7xNxvummbwH41JqEWiOi2xxxU0LcmDn6kiufxPdMjMyzo-fIY-_NcKXt8ZBldj2MZbcPBTbx/s1600/image+8a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="148" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiP9e2z7-p7fnQlaSfM9uBx_unk_GJELXBE5cKSkaNtBX6bVj1MSO1DDgq4Pg7-NpDw4UVR7xNxvummbwH41JqEWiOi2xxxU0LcmDn6kiufxPdMjMyzo-fIY-_NcKXt8ZBldj2MZbcPBTbx/s320/image+8a.jpg" width="320" /></a></div>
<br />
12.Now before moving on, I recommend increasing the size of the text box close to how large you want your final text to appear. To do this, hover your mouse over a corner of the white outline and grab one of the corner circles, then drag the corner out as far as you would like your title to go...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbzWOrnYdfiNntIuUV8lAS0yU4g0dlWiBSRy51hj67tGKSEWbqrH1ZRWsvIDUBEW6u2bWv8kdhED9NcJJkt3Q2S6RsT3y6RFsCxBjkDjbfIcKzg2p68BJ-88z27osR-_uxFxLEWWXeJlTX/s1600/image+9.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbzWOrnYdfiNntIuUV8lAS0yU4g0dlWiBSRy51hj67tGKSEWbqrH1ZRWsvIDUBEW6u2bWv8kdhED9NcJJkt3Q2S6RsT3y6RFsCxBjkDjbfIcKzg2p68BJ-88z27osR-_uxFxLEWWXeJlTX/s400/image+9.JPG" width="400" /></a></div>
<br />
<br />
13. As you do this you'll notice your text increasing in size, so continue on until you have the size you want...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgedjHahROaEqExvBewzpgachM-xPxog1k9W6n1uzQWIO1Vh1Q63lFxdpKR9-wy3RAj4QQfPoCxWP3uUp0Xlkod7MaKiZ9m5Z1RID5xG6E-bJ6mXMEBCB2updXPjByNPxuD-Xe9MBuMJUXn/s1600/image+9.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgedjHahROaEqExvBewzpgachM-xPxog1k9W6n1uzQWIO1Vh1Q63lFxdpKR9-wy3RAj4QQfPoCxWP3uUp0Xlkod7MaKiZ9m5Z1RID5xG6E-bJ6mXMEBCB2updXPjByNPxuD-Xe9MBuMJUXn/s400/image+9.JPG" width="400" /></a></div>
<br />
<i>With that done you can now use the Text box menu to modify other options for your title.</i><br />
<br />
14. To begin using the Text box options, highlight your blog title by scrolling over it with your mouse or click inside the white box where your title appears...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC8QwOQggsxhUyBYzFHwku1Hql4f_iff1ESsutmmc-X2Gow9Sj1szinMgjMLgrSHUpVJEGeO6PFUrk01xoJg3HOPecXvJGy8II20A4lJY_Qm7x4cEin3QoreLe-CUWZyuYlokQcHhyphenhyphenHIZv/s1600/image+10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="182" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC8QwOQggsxhUyBYzFHwku1Hql4f_iff1ESsutmmc-X2Gow9Sj1szinMgjMLgrSHUpVJEGeO6PFUrk01xoJg3HOPecXvJGy8II20A4lJY_Qm7x4cEin3QoreLe-CUWZyuYlokQcHhyphenhyphenHIZv/s400/image+10.jpg" width="400" /></a></div>
<br />
15. Go ahead and play around with these different buttons and settings to get the right affect you want for your blog title...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzovfipAEc65ix-QWkjivqSiafzqxWcI93vCwGaZ8_3c7DcG4EK6AizVGw2DYRNjbQOlSsf5Gj3ycAoIUsbPThNTp6pp44uLaIWFCxbG2Ncg3_gEPjKYGZ6gH7z2fAH_csnyO7ziRK6A-l/s1600/image+11a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="183" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzovfipAEc65ix-QWkjivqSiafzqxWcI93vCwGaZ8_3c7DcG4EK6AizVGw2DYRNjbQOlSsf5Gj3ycAoIUsbPThNTp6pp44uLaIWFCxbG2Ncg3_gEPjKYGZ6gH7z2fAH_csnyO7ziRK6A-l/s400/image+11a.jpg" width="400" /></a></div>
<br />
<i>Here are a few tips...</i><br />
✻<i> If you click within the color lines you can change the color of your font.</i><br />
✻ <i>"B" and "I" stand for Bold and Italic.</i><br />
✻ <i>Under the "Size", drag the small circle across the bar to easily increase the size of your text.</i><br />
✻ <i>Clicking on the arrow next to "Normal" shows a selection of other affects.</i><br />
<i>It's fun to experiment so don't be shy.</i><br />
<br />
16. When you're finished and your title is just as you would like it, go ahead and click the "Save" link at the top...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKTNvRqLWdCnx958yQpuBz4GiQ5tFZTVmFvHDjIDmYcV81o42-zd8i5Hd1DQytcahYSUMu7EjuPjhoLWuALzK03hUm_MBsn8zdokP0gN5TrZvRTp518-5iQZIZYT1dPqUdnkthggVLlwuP/s1600/image+12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="181" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKTNvRqLWdCnx958yQpuBz4GiQ5tFZTVmFvHDjIDmYcV81o42-zd8i5Hd1DQytcahYSUMu7EjuPjhoLWuALzK03hUm_MBsn8zdokP0gN5TrZvRTp518-5iQZIZYT1dPqUdnkthggVLlwuP/s400/image+12.jpg" width="400" /></a></div>
<br />
17. This opens the "Save" area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNDi2lNbHRR5Lbz4yRd2QmzTiA7PdhDJlpLhr7Xn54-ZUbWDevCuGIb3ZNwYdIMp2XPPOv4O0HKOBD8D9kVze4BuE-TfXCkIQTchNwd-1HPJ8YBiyXLbZJN2xF5gSU8QBcaOddSkpRXPKh/s1600/image+13.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNDi2lNbHRR5Lbz4yRd2QmzTiA7PdhDJlpLhr7Xn54-ZUbWDevCuGIb3ZNwYdIMp2XPPOv4O0HKOBD8D9kVze4BuE-TfXCkIQTchNwd-1HPJ8YBiyXLbZJN2xF5gSU8QBcaOddSkpRXPKh/s400/image+13.JPG" width="400" /></a></div>
<br />
18. In this area; you'll want to leave all of the presets as they are, including the artist's original title* and the image type**...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2JKPUfZF9oBUpjaHT0akwnseQp-jWPyKkmSKv_dllZnZ6sIVchqBzeabNuYRXDvr6pQhvR2QDcXvEDu3ca3V35bSFe8QD8Lf0gpGhON8WEGCBDPQLc0EI2XVhR94XP9-y45_iB7TmvKzI/s1600/image+13a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2JKPUfZF9oBUpjaHT0akwnseQp-jWPyKkmSKv_dllZnZ6sIVchqBzeabNuYRXDvr6pQhvR2QDcXvEDu3ca3V35bSFe8QD8Lf0gpGhON8WEGCBDPQLc0EI2XVhR94XP9-y45_iB7TmvKzI/s400/image+13a.jpg" width="400" /></a></div>
<br />
*Since you're using a <i>free </i>image you'll want to leave the title as is out of respect for the originating artist.<br />
<br />
**This is especially important when using one of my blog banners as I only use PNG images for my blog banners which ensure a clear background which helps add dimension to my designs and blog themes.<br />
<br />
19. Now click the "Save photo" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjghFngF5txs7yBF0cscZCEWRMjYH_ypf1E2Cb43Ira9L5ldvJ0wRlHpXi7vVSnfCWob5t4ermCyoUhNleQ9Kri6pXARHE0Z11zFpPo6QWFWcfRg37xYUbp7DDCkmuqMSYCXsL2Q3yHZzf4/s1600/image+13b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjghFngF5txs7yBF0cscZCEWRMjYH_ypf1E2Cb43Ira9L5ldvJ0wRlHpXi7vVSnfCWob5t4ermCyoUhNleQ9Kri6pXARHE0Z11zFpPo6QWFWcfRg37xYUbp7DDCkmuqMSYCXsL2Q3yHZzf4/s400/image+13b.jpg" width="400" /></a></div>
<br />
20. And in the pop-up window click the "Save" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3sQ2A0NEM1h05c0zFSEp99UVqKaicZMa0a-6_NKdOLKTtknqGLmaYNgGnQC0q0a_X5R_vnSdx_N10_GWDvcKpuVyTKyeRgMQzxh87vtRwza69StqVbMkl3A_8HTQyZSt8_UkgWIbzY_f1/s1600/image+13c.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3sQ2A0NEM1h05c0zFSEp99UVqKaicZMa0a-6_NKdOLKTtknqGLmaYNgGnQC0q0a_X5R_vnSdx_N10_GWDvcKpuVyTKyeRgMQzxh87vtRwza69StqVbMkl3A_8HTQyZSt8_UkgWIbzY_f1/s400/image+13c.jpg" width="400" /></a></div>
<br />
That's it! You have successfully added text to a free blog banner, congratulations! Now you can follow this tutorial ~ <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-install-blog-header-banner-image.html" target="_blank"><b>How to Install a Blog Header</b></a> to add your new banner to your blog.<br />
<br />
Enjoy~Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com1tag:blogger.com,1999:blog-307932083687837946.post-26780383883857966052013-01-18T16:31:00.000-05:002013-01-18T18:32:25.198-05:00Working With Google Chrome<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWssHb2WlnE8W0r18xViF6oY3ztq1YfPFO253NrrFmlNHaQL8UaYvazTaV2bca6GJo0SGbsYNvIwCrf3Oi7_fIJT1EKT5VtTrhhYY7arm6SU8y7oImg9AqPlnfJm5ioa33tN5BE3DrXHa/s1600/chrome.JPG" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWssHb2WlnE8W0r18xViF6oY3ztq1YfPFO253NrrFmlNHaQL8UaYvazTaV2bca6GJo0SGbsYNvIwCrf3Oi7_fIJT1EKT5VtTrhhYY7arm6SU8y7oImg9AqPlnfJm5ioa33tN5BE3DrXHa/s1600/chrome.JPG" /></a></div>
<span style="font-family: Georgia, Times New Roman, serif;">This posting will cover some important information and add-ons for using Google Chrome. Chrome is a recent addition to the selection of online browsers which has quickly gained momentum among it's competition; Internet Explorer and Mozilla Firefox. While Chrome boast noticeable faster web browsing and page loading it should be noted that there are some important add-ons to install before using Chrome on a regular basis. I discuss these additional add-ons and extensions below...</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">To install Chrome on your home PC visit this link: <a href="https://www.google.com/intl/en/chrome/browser/">https://www.google.com/intl/en/chrome/browser/</a></span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">Installation is simple, just follow the screen prompts to go through the process. You can even import your bookmarks from other web browsers and I recommend doing this so you don't have to start over again. Once installed, you can visit the same link above to find more information and tips on how to use your new browser...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDAuFpzRDITxxq110QHyCMTmHKNydrq1IWUVpfRZgHvP2RMBZegIAlW7Dt0QHvxU3IhEwVbACuar6grD1YvoblPdPQYC1i_mfDG4qPk_3ha8G_NbnX2ib8tGMmYrGq4krJZXiVycLAWL9m/s1600/image+1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDAuFpzRDITxxq110QHyCMTmHKNydrq1IWUVpfRZgHvP2RMBZegIAlW7Dt0QHvxU3IhEwVbACuar6grD1YvoblPdPQYC1i_mfDG4qPk_3ha8G_NbnX2ib8tGMmYrGq4krJZXiVycLAWL9m/s400/image+1.JPG" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">With Chrome installed on your computer we'll move on to discussing how to install add-ons and extensions, necessary for safe web browsing. So let's begin...</span><br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<br />
<b><span style="font-family: Georgia, Times New Roman, serif;">Finding Add-ons</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;">To find add-ons for Chrome you'll need to access the "Chrome Webstore". You can do this in one of two ways, either by opening a new tab and clicking on the "Webstore" icon...</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">Or by clicking on the "Customize and control" icon...</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg69Uu4UTSCwOUVvgF6C6h_oIVDMcUJKSOrHOnUhFHSvMgqnKupDFoJhnvFqvvySr8CVT9NROJ_beSEFRfvpQxbHwxusuT9MV-EdYnZi0vfCSBLtdaHoWq3SedBTZ4VP3rsyAdTM-v_HgyR/s1600/image-4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="311" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg69Uu4UTSCwOUVvgF6C6h_oIVDMcUJKSOrHOnUhFHSvMgqnKupDFoJhnvFqvvySr8CVT9NROJ_beSEFRfvpQxbHwxusuT9MV-EdYnZi0vfCSBLtdaHoWq3SedBTZ4VP3rsyAdTM-v_HgyR/s400/image-4.jpg" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">and in the drop-down menu, clicking on "Settings" ...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSqiIH5FmJ-XkDJxTJKyBq8mfGxAgDudREHETxe3OqmHPK3hI6XEUPPv5Wkcv-uLalsqSTgxYVZ5wiqkWhfTrBjDljvibX-l7Otgi4gaz5JHYJh7B-H4VWb5xTABzYchrn11bYnkElyc5y/s1600/image-5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="291" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSqiIH5FmJ-XkDJxTJKyBq8mfGxAgDudREHETxe3OqmHPK3hI6XEUPPv5Wkcv-uLalsqSTgxYVZ5wiqkWhfTrBjDljvibX-l7Otgi4gaz5JHYJh7B-H4VWb5xTABzYchrn11bYnkElyc5y/s400/image-5.jpg" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">Then clicking on "Extensions" in the left side list...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFwioEcKdhZxHW5Ki4m_pcjnhMGcqwq1XzAJ6TCcD30wzB0L4PvYtv9393FzQ5A3TpnZf7thr30NlhKgjpa0vO0yE14pyMA_YotlQvQm2Cbx-syV2reYMNdAa4DWmzWZu8oBFK4dknFEKp/s1600/image-6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="219" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFwioEcKdhZxHW5Ki4m_pcjnhMGcqwq1XzAJ6TCcD30wzB0L4PvYtv9393FzQ5A3TpnZf7thr30NlhKgjpa0vO0yE14pyMA_YotlQvQm2Cbx-syV2reYMNdAa4DWmzWZu8oBFK4dknFEKp/s320/image-6.jpg" width="320" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">In this area you can see all of the extensions, currently installed on the browser, and find new extensions by clicking on the "Get more extensions" link at the bottom of the page... </span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl9O-ruyeYvirRnDDm2ZohVe7EDHFBJN0Mgx_Potc64wvQ9JX1gVwzpa0NZPhfjILzwFQebxhLMBKhbKgjUHc_Fji2yWYGnVprflYjVrK5ExTLoq_YyKHx9VLnuy1LbNuSYnWvDWS1M-zJ/s1600/image-7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="303" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl9O-ruyeYvirRnDDm2ZohVe7EDHFBJN0Mgx_Potc64wvQ9JX1gVwzpa0NZPhfjILzwFQebxhLMBKhbKgjUHc_Fji2yWYGnVprflYjVrK5ExTLoq_YyKHx9VLnuy1LbNuSYnWvDWS1M-zJ/s400/image-7.jpg" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">Once in the Extensions area of the Webstore, you can easily use the Search feature to find the extensions you're looking for by title or browse their extensive library of add-ons...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqU5QHkwh8U-HNjOvmeJCUzh_knqSC1l1T8E_QSvTLPVGtbBUlPVHT39mu4wE_c0QfC6ZE1IJbiTaZ2fcUIIdxIcJlx7SHLuQIhkN0wXcxhyphenhyphengz9WPbQmiMgSbE4wxmDDBwv3TIdMVrBz9X/s1600/image-8.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="253" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqU5QHkwh8U-HNjOvmeJCUzh_knqSC1l1T8E_QSvTLPVGtbBUlPVHT39mu4wE_c0QfC6ZE1IJbiTaZ2fcUIIdxIcJlx7SHLuQIhkN0wXcxhyphenhyphengz9WPbQmiMgSbE4wxmDDBwv3TIdMVrBz9X/s400/image-8.jpg" width="400" /></a></div>
<br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<b><br /></b>
<b><span style="font-family: Georgia, Times New Roman, serif;">Installing Extensions</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;">To install an extension on Chrome, begin by searching for the item you want by typing the title in the search box...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirwS5rngSXPk8j_tf60UHKMteuwOcznxhu3ck__8kavkLjJoEyZFGPf01DAquj2RPKZXGO3dN2eHGtipci8N_fqSP0_HtPqMNc6wavjZPup0WLfY4C2O0YOH8VBFZoweLGj70_K9fkwqk1/s1600/Untitled-11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="176" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirwS5rngSXPk8j_tf60UHKMteuwOcznxhu3ck__8kavkLjJoEyZFGPf01DAquj2RPKZXGO3dN2eHGtipci8N_fqSP0_HtPqMNc6wavjZPup0WLfY4C2O0YOH8VBFZoweLGj70_K9fkwqk1/s400/Untitled-11.jpg" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">A list of results will show up from your search...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmrBf5XteIhmIymfWaJftqBp-jXVEgxE5ekd_EsV48Vncj8WVC6UkMsiq8Z-nZqqRCh-SPv6Ng5daW57muGnQas3nHv5UJtqIcS2EXBlulgdiz7dKzaSFSte8fXOxAsMHyprgUe2jaxANa/s1600/Untitled-12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="176" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmrBf5XteIhmIymfWaJftqBp-jXVEgxE5ekd_EsV48Vncj8WVC6UkMsiq8Z-nZqqRCh-SPv6Ng5daW57muGnQas3nHv5UJtqIcS2EXBlulgdiz7dKzaSFSte8fXOxAsMHyprgUe2jaxANa/s400/Untitled-12.jpg" width="400" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">To choose and install the extension click on the "Add to Chrome" button next to the extension you want to install...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLPakr4ZlBRuy8IvbGbAge2vDcj1D9sFA2KaDPv8GwJHV3leBmJa6OVRW4o3S75IZtQ-nPUmlgkR49GAQ7887VOskl96j_1MMqgYdb-c6shomiBQ2AM3ViY-tDn0EEnC0dZh1GSo5_u1x1/s1600/Untitled-13.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="176" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLPakr4ZlBRuy8IvbGbAge2vDcj1D9sFA2KaDPv8GwJHV3leBmJa6OVRW4o3S75IZtQ-nPUmlgkR49GAQ7887VOskl96j_1MMqgYdb-c6shomiBQ2AM3ViY-tDn0EEnC0dZh1GSo5_u1x1/s400/Untitled-13.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<b><i><span style="font-family: Georgia, Times New Roman, serif;">Recommended Extensions</span></i></b><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<b><span style="font-family: Georgia, Times New Roman, serif;">WOT</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;">WOT stands for Web of Trust and is a tool I've used for year now. Using small color coded donut shaped icons, WOT easily shows you which sites are safe and which ones you want to avoid...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWQQaMa-O-sfQjZsLLPPBfu3TgdmJZBrrsk52s2OpDhhKretdqhuVPgq79rppl0Qx336BDEyXbiOOxgkWl60zxdQxn1VjmtYq-knMrkkEwWDQNItGQ53cJZKVFMoT0RSSIKLwAkVmuL-sk/s1600/WOT-symbols.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWQQaMa-O-sfQjZsLLPPBfu3TgdmJZBrrsk52s2OpDhhKretdqhuVPgq79rppl0Qx336BDEyXbiOOxgkWl60zxdQxn1VjmtYq-knMrkkEwWDQNItGQ53cJZKVFMoT0RSSIKLwAkVmuL-sk/s1600/WOT-symbols.jpg" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">You can even participate in WOT by grading websites yourself. They base their ratings on 4 categories including...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2tJNNw-G_b2-Z_6FBhSwg8yrxDP64iinoPqmD9MayfjSKPLoMU5UN4VSZSPFddEvgZ6njT98-bht9fYi6U8ZDm_bMh5JLRS03037XwX1nvhzNq-NGYJFE8OFWZbP-ob-eE57Ng7dgC9L0/s1600/image-10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2tJNNw-G_b2-Z_6FBhSwg8yrxDP64iinoPqmD9MayfjSKPLoMU5UN4VSZSPFddEvgZ6njT98-bht9fYi6U8ZDm_bMh5JLRS03037XwX1nvhzNq-NGYJFE8OFWZbP-ob-eE57Ng7dgC9L0/s1600/image-10.jpg" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">Once installed, WOT is integrated into most commonly used platforms like Facebook and Twitter so that even bad links posted by innocent users can be easily avoided.</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">To install WOT, simply visit the "Extensions" section of the "Webstore" as described in previous steps and search for the title in the "Search" bar. A listing of options will appear... </span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLBZWnm0z_0OzZ_1onDAzZp7VbME8nWIvTK12axaRDk7_6dr4x0erAc0wE0l5vBpllawMXu94mgFVX8WscghrXZAn6bZ65-hPfeYHiD4w2E4fsWRgELUPol5nTV7Oyr1CiB69Mzo2temca/s1600/image-17.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="198" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLBZWnm0z_0OzZ_1onDAzZp7VbME8nWIvTK12axaRDk7_6dr4x0erAc0wE0l5vBpllawMXu94mgFVX8WscghrXZAn6bZ65-hPfeYHiD4w2E4fsWRgELUPol5nTV7Oyr1CiB69Mzo2temca/s400/image-17.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<span style="font-family: Georgia, Times New Roman, serif;">To find out more about WOT and to participate in their ratings program visit: <a href="http://www.mywot.com/">www.mywot.com</a></span><br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<br />
<b><span style="font-family: Georgia, Times New Roman, serif;">Adblock Plus</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;">Adblock Plus is another invaluable tool I've used for years. While most visitors to commonly used website like Facebook are greeted by a barrage of online advertising, my sidebar areas areaclear as a noon sky and yours can be too...</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhREkmay4dWUdhV9ISt6UjwGTjMOZ31W0p-sBCireE-ROo2MoJfeCDasijE8bJvTd3Z1V8dExPP8Z1gxPYbIVC3ViWYFcgF4hmPf2ZltZx6dWy4nSxdTu88Zc6yXWwf6fIzsfjDEV9EzQlz/s1600/image-15.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="238" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhREkmay4dWUdhV9ISt6UjwGTjMOZ31W0p-sBCireE-ROo2MoJfeCDasijE8bJvTd3Z1V8dExPP8Z1gxPYbIVC3ViWYFcgF4hmPf2ZltZx6dWy4nSxdTu88Zc6yXWwf6fIzsfjDEV9EzQlz/s400/image-15.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<span style="font-family: Georgia, Times New Roman, serif;">To install Ad Blocker, simply visit the "Extensions" section of the "Webstore" as described in previous steps and search for the title in the "Search" bar. A listing of options will appear... </span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinaURC3ZoKZVMUBWpkaAhhyUES1UEGA7X4FrBvO8_GDCWe0b0lnIzZK7lp8cI_wvIxgY_wMs0eSLMLx-roYimIKVW_gr8SP4dGMj5OZWftK46h0uiGopln5oqrAKwZn11IBT9bJdbeSi9z/s1600/image-14.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="198" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinaURC3ZoKZVMUBWpkaAhhyUES1UEGA7X4FrBvO8_GDCWe0b0lnIzZK7lp8cI_wvIxgY_wMs0eSLMLx-roYimIKVW_gr8SP4dGMj5OZWftK46h0uiGopln5oqrAKwZn11IBT9bJdbeSi9z/s400/image-14.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<span style="font-family: Georgia, Times New Roman, serif;">While there are many ad blocking programs available, I recommend "Adblocker Plus" ~ I've used it for years and have found it to be a reliable and stable add-on.</span><br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<br />
<b><span style="font-family: Georgia, Times New Roman, serif;">DoNotTrackMe</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;">One final tool I recommend is the DoNotTrackMe. Tracking was one of my greatest concerns in switching over to Google Chrome. It's commonly known that everything we do these days is tracked by many corporations but rogue sites can use this tool to gain personal information about you such as log-in and financial information. For this reason I use DoNotTrackMe. </span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">To install this add-on simply type the title exactly as it appears above, into the search bar on the Extensions page, then click on the "Add to Chrome" button....</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0YBrZewJtKjDiKp8ihfWyv4jk3bsqCjxL_R-txO1B6jATNzZf9sBHdnNsDaOceAM_OKj9yPBKTlVIfF5wHM6zKjb0WqTnEy5doNqmTRS4Ck4xFxELZc1N5bD53EPViFHToVUZ4mGvxL_l/s1600/image-16.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="198" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0YBrZewJtKjDiKp8ihfWyv4jk3bsqCjxL_R-txO1B6jATNzZf9sBHdnNsDaOceAM_OKj9yPBKTlVIfF5wHM6zKjb0WqTnEy5doNqmTRS4Ck4xFxELZc1N5bD53EPViFHToVUZ4mGvxL_l/s400/image-16.jpg" width="400" /></a></div>
<br />
After installing this program you may want to make some tweaks to ensure you're able to view the websites you visit and use most often. Case in point ~ I noticed the top navigation bar went missing on Blogger after installing the DoNotTrackMe add-on. Through researching the issue I found it was necessary to change the settings for some Google sites so that they were not being blocked.<br />
To access the settings for individual websites just click on the small icon for this program, highlighted in the screen shot below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKWuhDqgdjM3ICtWSdrEO-GjM8AyPddUuG5RiKQd6t2mnSp7UsORZ2Dvw3H-kGpJkpWIJyFg4-ncKnyCCaEhVrO5fltEWdzTx50f_faqCx9RClIQvV77VV5A7lIY1h43OIaOoIfou1XVtk/s1600/image-18.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKWuhDqgdjM3ICtWSdrEO-GjM8AyPddUuG5RiKQd6t2mnSp7UsORZ2Dvw3H-kGpJkpWIJyFg4-ncKnyCCaEhVrO5fltEWdzTx50f_faqCx9RClIQvV77VV5A7lIY1h43OIaOoIfou1XVtk/s400/image-18.jpg" width="400" /></a></div>
<br />
This opens a window where you can adjust the settings per site and even access an all inclusive list, by clicking on gear icon in the top right side, to turn the feature on and off for individual sites...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWFSrjinUalQuZ_FEqQoBAmdN0UI4lXTuWoxfv29G4hhE1jrRJ5pbCyX1rOfd95FUeMKZKOPvZAFgE3wiyABPGSE7CEVGcy9e0c4OnDAy0CADD8u8tTZyMslF9AsFuGhyphenhyphenqOStwcl4Se163/s1600/image-19.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWFSrjinUalQuZ_FEqQoBAmdN0UI4lXTuWoxfv29G4hhE1jrRJ5pbCyX1rOfd95FUeMKZKOPvZAFgE3wiyABPGSE7CEVGcy9e0c4OnDAy0CADD8u8tTZyMslF9AsFuGhyphenhyphenqOStwcl4Se163/s400/image-19.jpg" width="348" /></a></div>
<br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<br />
<span style="font-family: Georgia, Times New Roman, serif;">That's it! I hope you've found this information helpful. It's always important to get to know our browsers to help keep our information and our computers safe. Beyond the important stuff there's a whole world of goodies to search through and explore including beautiful themes, helpful tools, and games. So have fun!</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><br /></span>
<span style="font-family: Georgia, Times New Roman, serif;">Enjoy~</span><br />
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com4tag:blogger.com,1999:blog-307932083687837946.post-44663912383528257962013-01-02T20:19:00.001-05:002013-01-02T20:28:38.103-05:00How to: Set up Your Blogger ProfileThis tutorial will cover how to set up your Blogger Profile. This is an important step in ensuring that other bloggers can find you. Case in point ~ if you were to leave a comment on someone's blog but your profile was not properly set up then the blogger would have no way of finding you. Setting up your Blogger Profile with your blog address and other contact info will help you gain added exposure for you blog and it's content. <br />
<br />
Here are the basic steps to access your Blogger Profile...<br />
<br />
1. Begin by navigating to the backend of your blog ~ you can do this by clicking on the "Design" link on the main page of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgag8lIQvkB9ljFtzHKqNjlTre_hRMghyzT4xR4VQ0-bRdnBV0Ekd4O27xHQaMSMd2S9YoNh6034qRdonemPesqD_tj6LMGAApoGQ8ip2bisnHBh0KNy6TEPwAHj2ruo80Cz2WW1F1Ck7d4/s1600/iamge0.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="231" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgag8lIQvkB9ljFtzHKqNjlTre_hRMghyzT4xR4VQ0-bRdnBV0Ekd4O27xHQaMSMd2S9YoNh6034qRdonemPesqD_tj6LMGAApoGQ8ip2bisnHBh0KNy6TEPwAHj2ruo80Cz2WW1F1Ck7d4/s400/iamge0.jpg" width="400" /></a></div>
<br />
<br />
2. In this area you will see a small arrow next to your name or blog title in the top right hand side...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqAtPopl0f6pau_bIjUwqtc0pUAfguDz3L-xR4Pv5CTGF6J858HcNTFnEEXjm5CpemeK-NywT3RQhlhcst1jn7nbefhrtuWxML7PS3LYFa-NYnf0rdWYODlZI6kTZMM01BcR98oW1fuzOr/s1600/image2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqAtPopl0f6pau_bIjUwqtc0pUAfguDz3L-xR4Pv5CTGF6J858HcNTFnEEXjm5CpemeK-NywT3RQhlhcst1jn7nbefhrtuWxML7PS3LYFa-NYnf0rdWYODlZI6kTZMM01BcR98oW1fuzOr/s400/image2.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNvKvBlHDc6XW2QBmFNp_u0-OY6qznc_Dnu8n7AlHkpsicVLVdKem4cqO-s9Jj4yINDWYFMIlkhv68Rk4unorg_vYrbwQGWwHiC8SI_XrYfPauc-j6-PIgUkvkFBIK4GyI4gFl0wJ-X90E/s1600/image3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<br />
3. Click on the arrow to bring up a small menu...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNvKvBlHDc6XW2QBmFNp_u0-OY6qznc_Dnu8n7AlHkpsicVLVdKem4cqO-s9Jj4yINDWYFMIlkhv68Rk4unorg_vYrbwQGWwHiC8SI_XrYfPauc-j6-PIgUkvkFBIK4GyI4gFl0wJ-X90E/s1600/image3.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNvKvBlHDc6XW2QBmFNp_u0-OY6qznc_Dnu8n7AlHkpsicVLVdKem4cqO-s9Jj4yINDWYFMIlkhv68Rk4unorg_vYrbwQGWwHiC8SI_XrYfPauc-j6-PIgUkvkFBIK4GyI4gFl0wJ-X90E/s400/image3.jpg" width="400" /></a></div>
<br />
<br />
4. Now click on the "Blogger profile" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhijlgzReWLU5LTmiJILbXbNuclN_d8btOL5Rv3jFyycAk0kxLb_mMZHmWnhtcxIAX86vbwdmVVQgQdW32Hg5MtZOrGCKamHDzLqLgpnI5mUJilyI18ZovHv1e1IBu4h40WgEO7uTjCfZ-1/s1600/image4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhijlgzReWLU5LTmiJILbXbNuclN_d8btOL5Rv3jFyycAk0kxLb_mMZHmWnhtcxIAX86vbwdmVVQgQdW32Hg5MtZOrGCKamHDzLqLgpnI5mUJilyI18ZovHv1e1IBu4h40WgEO7uTjCfZ-1/s400/image4.jpg" width="400" /></a></div>
<br />
5. Your profile will show up in a new window. To edit your profile click on the "Edit Profile" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrkffNeznFLSoVDUD1hs7ppNlHADhHbwTk1-b0zKX5zmwNb4x0olKlpdG5f3-NHbGswg3b7-XRA8Mnh4bkANN66dPOYhxr44Pkj2b5Z3bh_3npV722DI09MB6FikLoU411ugNqXm4AOL78/s1600/image5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="257" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrkffNeznFLSoVDUD1hs7ppNlHADhHbwTk1-b0zKX5zmwNb4x0olKlpdG5f3-NHbGswg3b7-XRA8Mnh4bkANN66dPOYhxr44Pkj2b5Z3bh_3npV722DI09MB6FikLoU411ugNqXm4AOL78/s400/image5.jpg" width="400" /></a></div>
<br />
<br />
If you've never activated your profile then you may be prompted to do so.<br />
<br />
6. Here you can add all sorts of information including your profile image, email address, and any blogs you own that you want to appear under your profile...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4HZv0F0Lg-yIpYIWNgud8wtZnCnCaU9FZ9_tq-Jdng_q063IRKDM5TStY_rGZkFOvL4Ql0o9QkVEiiM466WSQANaTlisl-XnFp8WqJR1g-dfj_Tw0eq4T-Z_nXDC6yIKX9YzQDczwx3lu/s1600/image6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4HZv0F0Lg-yIpYIWNgud8wtZnCnCaU9FZ9_tq-Jdng_q063IRKDM5TStY_rGZkFOvL4Ql0o9QkVEiiM466WSQANaTlisl-XnFp8WqJR1g-dfj_Tw0eq4T-Z_nXDC6yIKX9YzQDczwx3lu/s640/image6.jpg" width="200" /></a></div>
<br />
<br />
7. To add a blog to your profile just click on the "Select blogs to display" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4sDzsckslXRoc7Th3WByi-IjJ-ToHf4PAmGb6mQHudrNgBvjNadLlAq7OuwhSfW_4JilCDgJ3fKVP8NvLxOVT8DsISUmze96ePcbXLHgaqvea4f9-ibBAIGXtadUMGw1T9kAtWZChfJcN/s1600/image7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="233" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4sDzsckslXRoc7Th3WByi-IjJ-ToHf4PAmGb6mQHudrNgBvjNadLlAq7OuwhSfW_4JilCDgJ3fKVP8NvLxOVT8DsISUmze96ePcbXLHgaqvea4f9-ibBAIGXtadUMGw1T9kAtWZChfJcN/s400/image7.jpg" width="400" /></a></div>
<br />
<br />
8. There you can check and un-check boxes next to the blog titles to select which ones will appear...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLKiETdpMMfX6I5cjDL9d0eIGj3OAgrAOjva8glGFojFPxf3BBwmEZSv2y12adj4bG6w8q3rz5g8xqQg3aK88EB2S0kiMbelvCfChPjgItHfzdRpGjEFpS2aMkf1_ES03F4YW8OK_Ka76b/s1600/image8.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLKiETdpMMfX6I5cjDL9d0eIGj3OAgrAOjva8glGFojFPxf3BBwmEZSv2y12adj4bG6w8q3rz5g8xqQg3aK88EB2S0kiMbelvCfChPjgItHfzdRpGjEFpS2aMkf1_ES03F4YW8OK_Ka76b/s400/image8.jpg" width="400" /></a></div>
<br />
This is especially handy for bloggers like me who have other blogs they use for testing and customer examples that they don't want to show up under their profile. <br />
<br />
9. Once you've made your selection/s then click the "Save Settings" button to keep your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfLrhZjoSaQWLQMnvWE2HCnYbnYN3-T_ZQFbVY0CqOcqdfREWt8a0E6tPo_tL0i_CYz36P3v_5TtiZ3s1LWw7SIBTzKT5XBKq6a5bT1NHjDxXj7Xm9EEpxiQoIffX1nWGvqrom9NrQtC2j/s1600/image9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfLrhZjoSaQWLQMnvWE2HCnYbnYN3-T_ZQFbVY0CqOcqdfREWt8a0E6tPo_tL0i_CYz36P3v_5TtiZ3s1LWw7SIBTzKT5XBKq6a5bT1NHjDxXj7Xm9EEpxiQoIffX1nWGvqrom9NrQtC2j/s400/image9.jpg" width="400" /></a></div>
<br />
<br />
10. To return to your profile and view your updates click on the "Back to Edit Profile" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR3bXpxvg89zqVjExC_aDAYX3rHcbktxJoPyORxY84ufQOH69ZLtOzadXc78VWxJ5RFIi9zqBLdS3Gu9P3JkL4U53MmkH59gFeDu0UoSygpUVb54zCvSv7_DnSfmOOooDzPqL827esiZsK/s1600/image10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR3bXpxvg89zqVjExC_aDAYX3rHcbktxJoPyORxY84ufQOH69ZLtOzadXc78VWxJ5RFIi9zqBLdS3Gu9P3JkL4U53MmkH59gFeDu0UoSygpUVb54zCvSv7_DnSfmOOooDzPqL827esiZsK/s400/image10.jpg" width="400" /></a></div>
<br />
<br />
11. Complete filling out your profile and then click the "Save Profile" button by scrolling down to the bottom of the page...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI9UcFFAMRVsm_5AH3D6BxMSRBprdS4jcsDt9nyrKaV8oeQrbOSqAOHhmt4Et_nTW-ltJDY2BKna-oCDKpKnlFqqoFd8ieB5vhjdPD9jepAlJYe7mENPn6wvc462Q-Cv6wtkVUa_oXM4TI/s1600/image11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI9UcFFAMRVsm_5AH3D6BxMSRBprdS4jcsDt9nyrKaV8oeQrbOSqAOHhmt4Et_nTW-ltJDY2BKna-oCDKpKnlFqqoFd8ieB5vhjdPD9jepAlJYe7mENPn6wvc462Q-Cv6wtkVUa_oXM4TI/s400/image11.jpg" width="400" /></a></div>
<br />
12. In the next window click on "View Updated Profile" to view your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU3esvwhfzzN9qZ8YeUkiUNZqRFKDxLot6REiDeOCCdByjjOOEGGLaYaTYmW9gyTegLpmjxyqRnqpoShyuFGprzwfkR3kB1B8p6O6bH9TBOKwAcJOcW2H_oLZBCFA4hmfI7K6LxRi80mZI/s1600/image12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU3esvwhfzzN9qZ8YeUkiUNZqRFKDxLot6REiDeOCCdByjjOOEGGLaYaTYmW9gyTegLpmjxyqRnqpoShyuFGprzwfkR3kB1B8p6O6bH9TBOKwAcJOcW2H_oLZBCFA4hmfI7K6LxRi80mZI/s400/image12.jpg" width="400" /></a></div>
<br />
<br />
That's it! I will be adding more information to this area, including more descriptions on the options offered within the Profile area, so you can check back for that in the future.<br />
<br />
Best,<br />
<br />Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com5tag:blogger.com,1999:blog-307932083687837946.post-43974399375734430942013-01-02T15:13:00.000-05:002013-02-09T13:45:49.833-05:00How to: Install Sidebar TagsIn this tutorial we're going to cover how to install and move sidebar tags on your Blogger blog. The sidebar area is the column or columns to the side of your main posting area. The process for working with sidebar elements is surprisingly easy and opens up a world of possibilities for customizing your blog. <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqvuiPLMnGndgagvlnIei97Q7NI27Iqu3K15iqcfWghx5525fcdiK2cNnl2EIHDZiPPQAXFFeaugaaWLiaTXAVrPewjQVgoWHBvEG3n_M86tHPfUDqgZS0vbbel_5kreXd4f-0UtvZBf-t/s1600/image0.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqvuiPLMnGndgagvlnIei97Q7NI27Iqu3K15iqcfWghx5525fcdiK2cNnl2EIHDZiPPQAXFFeaugaaWLiaTXAVrPewjQVgoWHBvEG3n_M86tHPfUDqgZS0vbbel_5kreXd4f-0UtvZBf-t/s400/image0.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<br />
Before we begin you'll need to have an image or two, set aside to install on your sidebar. You can find an assortment of free sidebar tags located within each of my designer blog themes by clicking this title: <a href="http://plumroselane-bckgrnds.blogspot.com/2010/09/themes.html" target="_blank">A-Z Blog Theme List</a> Be sure to have your image ready to use and in an easy to remember location on your computer. <br />
<br />
Once your image is ready we can begin~<br />
<br />
1. Log into your blog and navigate to the back area by clicking on "Design"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLEUjXUsKIh1ceL8zjngyhcvvPCiPrIZnQ4EnOo-LCBx0suZ-p6nywn4EerFvhBbkPT6OEUJF66HuCANTB2WJVmWOg8u29KxxwNKm57dKntnG9eEHvLOUFNPOqcYYrb6XHBrqFjvKsio7l/s1600/image1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="295" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLEUjXUsKIh1ceL8zjngyhcvvPCiPrIZnQ4EnOo-LCBx0suZ-p6nywn4EerFvhBbkPT6OEUJF66HuCANTB2WJVmWOg8u29KxxwNKm57dKntnG9eEHvLOUFNPOqcYYrb6XHBrqFjvKsio7l/s400/image1.jpg" width="400" /></a></div>
<br />
<br />
2. The back area looks like this...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZRbqjmsPqBVkJqnhfoKtbN8TgpGD_RoHQuKj26sEmbF303jnHwak9a55NMWSTFtWAOOyAZYRisMS2KUAAwQEBPbKQD25Z6slK4NROfzl2EwG3sBH_WvB4a-vJu3SS3x7tck6u56SdC72m/s1600/image2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZRbqjmsPqBVkJqnhfoKtbN8TgpGD_RoHQuKj26sEmbF303jnHwak9a55NMWSTFtWAOOyAZYRisMS2KUAAwQEBPbKQD25Z6slK4NROfzl2EwG3sBH_WvB4a-vJu3SS3x7tck6u56SdC72m/s400/image2.jpg" width="400" /></a></div>
<br />
<br />
3. Now click on "Layout" in the left link list...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh95FgpJkNKV2E5E5PEfUfTmsfZW2TaaQRrzy4b21cNFmWKiAp-xo6jWSnCew-7yG5ozCsvVMWZh2U3VCBy3s-EsXCNlNMOD4EJwm38hghUnFS2eZfw6PtPKanxlqXT5C3_6hBj85Jj0Lmy/s1600/image3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU9b9lXdXtBxqKyAikkmtVc15862gPa_F1l6Z7Kdh09SzdeVw9GerbDRfMFxLxG8lEA13UOeRzeuGK9hfevV5OhlAhtQS91XiThAK8lgISOsNj4Eds8_6e5VdWj5lBj0gOVXVJAr8XcvDo/s1600/image3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="275" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU9b9lXdXtBxqKyAikkmtVc15862gPa_F1l6Z7Kdh09SzdeVw9GerbDRfMFxLxG8lEA13UOeRzeuGK9hfevV5OhlAhtQS91XiThAK8lgISOsNj4Eds8_6e5VdWj5lBj0gOVXVJAr8XcvDo/s400/image3.jpg" width="400" /></a></div>
<br />
<br />
<i>This is the area we'll be working in to add a few sidebar images. You layout may look different than mine depending up how you have your blog set up. You can easily change your layout at any time by visiting the "Template Designer".</i><br />
<br />
3a. To add an image to your sidebar area we'll be using the "Add a Gadget" link. You'll see they appear in several locations within the Layout view...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgok4rfcwffgA8gmh9QOD-qopWnFmSCChpZQCGcoQ0TjzfJmuZ532mAbnuQNqw29ZHE6l22N4Q_YLCd1srxv7kxRox9D-lv7q2sUMF6GRiemVkw_ZhzuaccUX6vCsbJVvyzSHXZdxtdO_nD/s1600/image4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="293" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgok4rfcwffgA8gmh9QOD-qopWnFmSCChpZQCGcoQ0TjzfJmuZ532mAbnuQNqw29ZHE6l22N4Q_YLCd1srxv7kxRox9D-lv7q2sUMF6GRiemVkw_ZhzuaccUX6vCsbJVvyzSHXZdxtdO_nD/s400/image4.jpg" width="400" /></a></div>
<br />
<i>I find it easier to click the link with the area I want to add the gadget, this helps lesson the confusion that come when you have a lot of sidebar gadgets later on</i> <br />
<br />
4. So let's begin by clicking on the "Add a Gadget" in the sidebar area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkTwtOVhm6IhYId8lob2KF_dQFp9L8cPxMZC4TqskKaf1RqPi7FA0HNqHjbX9N6_uItMRBCps4pVfsPDfLBZg3nCJucQMnk7B9gkI_fSsR70jDk0PtvCwV1UUvJmysEg5uVbQPKFgHkCJB/s1600/image4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="293" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkTwtOVhm6IhYId8lob2KF_dQFp9L8cPxMZC4TqskKaf1RqPi7FA0HNqHjbX9N6_uItMRBCps4pVfsPDfLBZg3nCJucQMnk7B9gkI_fSsR70jDk0PtvCwV1UUvJmysEg5uVbQPKFgHkCJB/s400/image4.jpg" width="400" /></a></div>
<br />
<br />
5. A pop-up window will appear with a selection of choices....<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIUHUvapsezo7AL_EuWVF5VKzs0RnLOW-oOt-l5QP8weNBBYGOMXPrF-10RYy6phX9t1dUZBqnqjqxZYdpIQ_eN9EwowyawFwUThkP3GdEyu8q-E86pdfIvFjoJz0UPgcZCxfWTxeiphJ9/s1600/image5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIUHUvapsezo7AL_EuWVF5VKzs0RnLOW-oOt-l5QP8weNBBYGOMXPrF-10RYy6phX9t1dUZBqnqjqxZYdpIQ_eN9EwowyawFwUThkP3GdEyu8q-E86pdfIvFjoJz0UPgcZCxfWTxeiphJ9/s400/image5.jpg" width="387" /></a></div>
<br />
For those of you who are new to this area, this is how we add all sorts of bells and whistles to our blogs, from the "Followers" and "Subscribe" features to "Labels", "Archives" and "Polls", there truly is a plethora of sidebar goodies. I recommend taking the time to explore this area further and getting to know some of the tools offered here.<br />
<br />
6. For now, we'll scroll down to the "Image" gadget, at the time I'm writing this it's the fourteenth selection down...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIUxGAZ05beWLc9_Q-UqgP9FeaFPnQuf0CH1UA1u10RqoKo-P1Ewky6kqXroellaFFG0q6-FHWjMawXSbWis3BfKSJTF8AOeRXiwaRUL28nH07mCFmWNS6PvS0T7SDP8bLqK25Gs5UQMG4/s1600/image6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIUxGAZ05beWLc9_Q-UqgP9FeaFPnQuf0CH1UA1u10RqoKo-P1Ewky6kqXroellaFFG0q6-FHWjMawXSbWis3BfKSJTF8AOeRXiwaRUL28nH07mCFmWNS6PvS0T7SDP8bLqK25Gs5UQMG4/s400/image6.jpg" width="390" /></a></div>
<br />
7. To open the gadget you can click on either the title or the plus symbol...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZ9sy3_F5DjYOHHIpG3y0Rsh1Esz2mSPUVw6H20SYdHzGEUt5clLpGzPqhbnM77cYqCJC77H0-cGoazWnQLgl6S9GyKG16CW6NsY3Fv3nhWjqDgau1q71D0WPx97FubP787QJR4Zg89XFI/s1600/image7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZ9sy3_F5DjYOHHIpG3y0Rsh1Esz2mSPUVw6H20SYdHzGEUt5clLpGzPqhbnM77cYqCJC77H0-cGoazWnQLgl6S9GyKG16CW6NsY3Fv3nhWjqDgau1q71D0WPx97FubP787QJR4Zg89XFI/s400/image7.jpg" width="390" /></a></div>
<br />
<br />
8. You will now see the options appear for adding an "Image" gadget...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5HwogzA21gMb08l_Ut5Og_t9_5gy3hZlPynbA6WbiNabmfLqAlCdRuf4pS7aFtQzscEdzejmGog3FNRJaYAw7o2bwWWH-Q0ODcgtdYoToxvyMff00H_dhAArCvaX_Fgo8je3lgEFFDmcj/s1600/image8.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5HwogzA21gMb08l_Ut5Og_t9_5gy3hZlPynbA6WbiNabmfLqAlCdRuf4pS7aFtQzscEdzejmGog3FNRJaYAw7o2bwWWH-Q0ODcgtdYoToxvyMff00H_dhAArCvaX_Fgo8je3lgEFFDmcj/s400/image8.jpg" width="386" /></a></div>
<br />
<br />
9. Let's read over what the different options are for this section ~<br />
<br />
<b>Title</b> - this is where we can title the item which helps when organizing or rearranging your sidebar items. Leaving this area blank can create a nice clean final appearance to your blog.<br />
<br />
<b>Caption</b> - the information typed within this area will appear below the image. A good example is if you're holding a giveaway or sale you can insert the end date in this area.<br />
<br />
<b>Link</b> - if you would your image linked to a blog post, page or an outside webpage then this is where that information would go.<br />
<br />
<b>Image</b> - this section offers two choices; the "From your computer" option is to upload the image from your computer and the "From the web..." offers you the option of inserting a link so the image will show up. <i>We will be using the first choice for this tutorial.</i><br />
<br />
<b>Shrink to Fit</b> - the last option is a check box for the "Shrink to fit" option. This enables you to use a larger image and fit it within your sidebar area. The size it shrinks down to is dependent upon your own sidebar area settings at the time you're adding the image. I don't usually use this option myself because all of my free sidebar tags are already set to the standard size of 200 pixels wide.<br />
<br />
10. Now, to add an image ~ click on the "Browse" button to navigate to where you have your image/s saved...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwIdnpd2b4-eLb3kPkcdsKsHvDdKDBt4kUOt4dLM1sOdhju394S4FH0L5jVG0LsB9_hpOT6mOLQIlaAhzflS73KDVx0KSvkOBP6Dj6gKsvB6ihZuiWY_IU0KPp1mwO0zwRuI8AbAYSW-8k/s1600/image10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwIdnpd2b4-eLb3kPkcdsKsHvDdKDBt4kUOt4dLM1sOdhju394S4FH0L5jVG0LsB9_hpOT6mOLQIlaAhzflS73KDVx0KSvkOBP6Dj6gKsvB6ihZuiWY_IU0KPp1mwO0zwRuI8AbAYSW-8k/s400/image10.jpg" width="386" /></a></div>
<br />
11. Click on the image you wish to use...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEuLseNmntRT44DH5Q1E3dlR9nlFUyqNmp-pTgTWEmHiz6pC1c3WJ1sYGL_REpVTy-dCr7Ux_cjFNKBG_aeOVWGz63tGd7gYbUwZmTiQkf3pmhem5T2XyG3WfoAsmGpvSq64QYw-JErVts/s1600/image11.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="298" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEuLseNmntRT44DH5Q1E3dlR9nlFUyqNmp-pTgTWEmHiz6pC1c3WJ1sYGL_REpVTy-dCr7Ux_cjFNKBG_aeOVWGz63tGd7gYbUwZmTiQkf3pmhem5T2XyG3WfoAsmGpvSq64QYw-JErVts/s400/image11.jpg" width="400" /></a></div>
<br />
<br />
12. Then click "Open"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0USVQZyc46dSnqd6jHyvpV9Fu-ncG9j0ujeLrL8hVQLKNWR2yhVJfBH1xNaaxvlYgo5g9KztvykLrAgxUAOQXw-25efaRm-VtJU6ohtSofkQwjvraeZO961Fba1P9oxq7nnAt7Ab2CfZh/s1600/image12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="298" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0USVQZyc46dSnqd6jHyvpV9Fu-ncG9j0ujeLrL8hVQLKNWR2yhVJfBH1xNaaxvlYgo5g9KztvykLrAgxUAOQXw-25efaRm-VtJU6ohtSofkQwjvraeZO961Fba1P9oxq7nnAt7Ab2CfZh/s400/image12.jpg" width="400" /></a></div>
<br />
<br />
13. Once loaded, you'll see the image you selected appear in the window...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkiuwNR-tJNnWWI0v7DZRbEWGnl266xNbHDcOvEZBrpM7jwBJczxejFBCsgwvts797MlOSRWy7RJK8zq4aKR2xdittJZzbqWJLxr9EgGyIbaV1dRgn1WbfUpXrJgW0eFaq86tfgd5rFVbn/s1600/image13.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkiuwNR-tJNnWWI0v7DZRbEWGnl266xNbHDcOvEZBrpM7jwBJczxejFBCsgwvts797MlOSRWy7RJK8zq4aKR2xdittJZzbqWJLxr9EgGyIbaV1dRgn1WbfUpXrJgW0eFaq86tfgd5rFVbn/s400/image13.jpg" width="386" /></a></div>
<br />
<br />
14. You can add any other information you choose and once finished click "Save"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipTpPr2BfIq-KliaM4Az0tMxdUmMFLlNcJLl65-pfeytLT_zLT8-GtYRZ5yx7PMvvKilCIGmextBOG6RLJ_Wk4K3Ca1kDLqCkCo1BiFTYtYKHmdnKuCslQKNRC4l0xZpJnSJAoIBaDyf9k/s1600/image+14.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipTpPr2BfIq-KliaM4Az0tMxdUmMFLlNcJLl65-pfeytLT_zLT8-GtYRZ5yx7PMvvKilCIGmextBOG6RLJ_Wk4K3Ca1kDLqCkCo1BiFTYtYKHmdnKuCslQKNRC4l0xZpJnSJAoIBaDyf9k/s400/image+14.jpg" width="386" /></a></div>
<br />
<br />
15. Your new image will automatically be inserted at the top of your sidebar area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO6UddL_4r4XBVTaqW6ii1lMlE4ha3sbN4i2qCckxqt1mutIpC5tJ_eUt9bjZHwSTVf-IbG6nlFYzpybaQX2dVJ4hNJjm4Sk76kwpEJZOyBWkT1CeRqBgDPQGSH6UmfbCIk4FPk-OwkBdF/s1600/image15.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="312" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO6UddL_4r4XBVTaqW6ii1lMlE4ha3sbN4i2qCckxqt1mutIpC5tJ_eUt9bjZHwSTVf-IbG6nlFYzpybaQX2dVJ4hNJjm4Sk76kwpEJZOyBWkT1CeRqBgDPQGSH6UmfbCIk4FPk-OwkBdF/s400/image15.jpg" width="400" /></a></div>
<br />
<br />
...so if you have other images or sidebar elements there, you'll know the top one is new.<br />
<br />
16. If for any reason you wish to change the image you can simply click the "Edit" link to open the gadget window again...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwM4fTQHyR4hZwTvZ0NyWGrQKRmQCDUr-ZTHgS1xHfFTjXk6q5-PFzSuL17n4KpZWK3bK9UvpJutKazkzquvy5vKLR5GhfkB3wgC8zAJtQ04oUGRKQKV-97vs25GJthB_G7dKiTI1gcZkE/s1600/image16.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="347" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwM4fTQHyR4hZwTvZ0NyWGrQKRmQCDUr-ZTHgS1xHfFTjXk6q5-PFzSuL17n4KpZWK3bK9UvpJutKazkzquvy5vKLR5GhfkB3wgC8zAJtQ04oUGRKQKV-97vs25GJthB_G7dKiTI1gcZkE/s400/image16.jpg" width="400" /></a></div>
<br />
<br />
17. Once you have your image uploaded you have the option of moving it to a different location. To do this simply click on the image gadget and drag it to a new location...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMNXNlyVjpekSuOz2WG_O2JrgyD6bRh2wAmZ5oV6OSj0RSYtbfufHuWczAQqBXLzVwonKZHt8b7DePuIoyGhOo92xy5vFePQOogPpPpw63t2O8L5n6-5cMjndSrqbcnVDRxVOTEp5W0Pcm/s1600/image18.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMNXNlyVjpekSuOz2WG_O2JrgyD6bRh2wAmZ5oV6OSj0RSYtbfufHuWczAQqBXLzVwonKZHt8b7DePuIoyGhOo92xy5vFePQOogPpPpw63t2O8L5n6-5cMjndSrqbcnVDRxVOTEp5W0Pcm/s320/image18.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFG8Cim5NuxO4WXyBBX4lHkKYJMjcZzbYk16soRTh1DN75ZG5ZYkQVgJpN7zdKTKSBL0YnWHilsqr7fwBzaJVmc02e3NirM2qO851E494z6Y3WUE8V3w31mUv3XroYzN4w1cFKSYemAqWg/s1600/image17.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<br />
<br />
18. When you're finished rearranging your sidebar gadgets be sure to click "Save arrangement" to keep your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFG8Cim5NuxO4WXyBBX4lHkKYJMjcZzbYk16soRTh1DN75ZG5ZYkQVgJpN7zdKTKSBL0YnWHilsqr7fwBzaJVmc02e3NirM2qO851E494z6Y3WUE8V3w31mUv3XroYzN4w1cFKSYemAqWg/s1600/image17.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="295" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFG8Cim5NuxO4WXyBBX4lHkKYJMjcZzbYk16soRTh1DN75ZG5ZYkQVgJpN7zdKTKSBL0YnWHilsqr7fwBzaJVmc02e3NirM2qO851E494z6Y3WUE8V3w31mUv3XroYzN4w1cFKSYemAqWg/s400/image17.jpg" width="400" /></a></div>
<br />
<br />
19. To view your new changes click on the "View blog" button at the top...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_-3bwrPTHzI6ICaUpvOAZBXyqInQJyhZ8dLbHC5m5eLh-yfT4-L0pixxJC7xtUOxmI1w35P8SnzgfWBmpiU47_xSB0uZ3Jy9D0OwBBvi1GdP497O3djrn5ZsOtOtqzzijFpa_k7YdQPX3/s1600/image+19.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="291" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_-3bwrPTHzI6ICaUpvOAZBXyqInQJyhZ8dLbHC5m5eLh-yfT4-L0pixxJC7xtUOxmI1w35P8SnzgfWBmpiU47_xSB0uZ3Jy9D0OwBBvi1GdP497O3djrn5ZsOtOtqzzijFpa_k7YdQPX3/s400/image+19.jpg" width="400" /></a></div>
<br />
<br />
That's it! You can easily add and make changes to this area at any time by returning and using the steps we just followed above.<br />
<br />
Enjoy~ Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com13tag:blogger.com,1999:blog-307932083687837946.post-70136717270075819762012-12-06T01:10:00.001-05:002015-07-31T16:12:11.978-04:00How to: Add a Decorative Post DividerThe following tutorial will assist you in adding a post divider to
your own blog. Post dividers serve as a decorative division between
each blog posting.<br />
<br />
Post dividers are easily installed through the Template Designer area of your Blogger blog, by inserting a small snippet code into the Add CSS area. <br />
<br />
1. Before you begin you'll need to select a post divider image to use on your blog. If you've purchased one of my blog themes then you'll already have access to that code.<br />
<br />
a.) Each post divider image has the complete code listed below the image. You will use that code to install the post divider image on your blog. I suggest copying the code and temporarily pasting it to a text file on your computer ~ if you're using a Windows PC then a "Notepad" document is a good choice for that. This makes the process easier and less confusing.<br />
<br />
b.) In the example below I will be using the Whispers of Spring post divider and here is what that looks like on the page....<br />
<br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCEiKaP4bAV0VfccExqOg_xlNDf1xJpR6JGqE0kPTOTdZ_41U82JFsBSoCOTgvj2j6ahVeGJjgh2s78t0ynnPRRYsQoqqloAgTvK4w1OkBf5fNLfqRNKtH5NX4AsCMCFNHE1VQz6RFdsCr/s1600/PrL-WoS-divider-410px.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="63" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCEiKaP4bAV0VfccExqOg_xlNDf1xJpR6JGqE0kPTOTdZ_41U82JFsBSoCOTgvj2j6ahVeGJjgh2s78t0ynnPRRYsQoqqloAgTvK4w1OkBf5fNLfqRNKtH5NX4AsCMCFNHE1VQz6RFdsCr/s400/PrL-WoS-divider-410px.png" width="400" /></a></div>
<div style="text-align: center;">
<div style="text-align: center;">
<span style="font-family: Georgia,"Times New Roman",serif;"><b>410 wide image and code</b></span></div>
<div style="text-align: center;">
<div class="separator" style="clear: both; text-align: center;">
</div>
</div>
<br />
<center>
<textarea cols="35" id="code-source" name="code-source" rows="5">.post{margin: 0 0 40px 0;
width: 90%;
background: url(http://www.prl-images.com/images/post_dividers/PrL-FncflFly-divider-x410.png);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:4.5em;
}</textarea></center>
</div>
<br />
c.) <span style="font-size: x-small;"><span style="font-family: Georgia,"Times New Roman",serif;">To
install a post divider we will use the code found below the image
example, rather than the image itself. </span></span>I will copy the entire section of code above onto a Notepad document and leave it open for use a little bit later on. Now let's move on to installing the code onto our blog...<br />
<br />
2. Begin by logging onto your blog and navigating to the "Template" area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGYmylPZQ0j6nxjJmhI9t7VXZHrwV178txhYMG5IBSEUWPZDOzcQB-rGUkYoHGADxahN-R-sqsygrez4vV9dZXmqiSgno1n1HwGt6h-2gVdACLVUxCC8vpeNQX6CQujMh3mJDU2yoa_A2N/s1600/image+1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="222" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGYmylPZQ0j6nxjJmhI9t7VXZHrwV178txhYMG5IBSEUWPZDOzcQB-rGUkYoHGADxahN-R-sqsygrez4vV9dZXmqiSgno1n1HwGt6h-2gVdACLVUxCC8vpeNQX6CQujMh3mJDU2yoa_A2N/s400/image+1.JPG" width="400" /></a></div>
<br />
3. Next, click on the "Customize" button to the enter the Template Designer area of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6fypof7x2WxoEq_bCczznITbbF5urNyCpHmMm98cDjfHTjvmwwy32KFEGpwtvYTmaaw8ZaRbr8PaK57XoI8qx6fGZJ_FulLNRepP6Nubo6ZewRc8HfMCj7M3Bh1FEzYhWtKvGQDlFwqfZ/s1600/image+1a.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="346" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6fypof7x2WxoEq_bCczznITbbF5urNyCpHmMm98cDjfHTjvmwwy32KFEGpwtvYTmaaw8ZaRbr8PaK57XoI8qx6fGZJ_FulLNRepP6Nubo6ZewRc8HfMCj7M3Bh1FEzYhWtKvGQDlFwqfZ/s400/image+1a.jpg" width="400" /></a></div>
<br />
4. At the bottom of the left side menu, click on "Advanced"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4rz-ftFfE19bsBS-aA5ySpOi4i0CaFaJuXoxdI2_bA7QKr_kWh2QE0DyXJkza63zI456v7awlBu2sw8tRi9aemge91CGnxsEB_bxAJoLDq7m4tVztxFJBgnrc3hMd6QSq_GQa_KWmdztn/s1600/image+2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4rz-ftFfE19bsBS-aA5ySpOi4i0CaFaJuXoxdI2_bA7QKr_kWh2QE0DyXJkza63zI456v7awlBu2sw8tRi9aemge91CGnxsEB_bxAJoLDq7m4tVztxFJBgnrc3hMd6QSq_GQa_KWmdztn/s400/image+2a.jpg" width="400" /></a></div>
<br />
<br />
5. Now scroll down the inner menu selections until you see Add CSS and click on that....<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkJfnpJhtkkT6voC5V1TiE0INkhUA_5Kh6EMrCO49k2AK4q3TLsPFkYZQ8E2o5NlRQ8aIjcgCHIZL17WmirL2shU03JihcS-FdBmZ70IpEtNuU2JgK42TEcavLx4mY0v_oltVUExpQ5sol/s1600/image+4a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="268" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkJfnpJhtkkT6voC5V1TiE0INkhUA_5Kh6EMrCO49k2AK4q3TLsPFkYZQ8E2o5NlRQ8aIjcgCHIZL17WmirL2shU03JihcS-FdBmZ70IpEtNuU2JgK42TEcavLx4mY0v_oltVUExpQ5sol/s400/image+4a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<br />
6. This will bring you to the CSS area of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrdhOTFv3mBg5LJqlrQWMGeD5I_ckKcKQ6c5F7_xPaBWk_QNm3xondIPdeEg32YdW1ToH8epkEaRtFenAUawOgyvviPX5j3YWaBwMo_LQjs0zkpmmcbpoFuoNfoMH5wXiBjYQITOxGS4H/s1600/image+5b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="268" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrdhOTFv3mBg5LJqlrQWMGeD5I_ckKcKQ6c5F7_xPaBWk_QNm3xondIPdeEg32YdW1ToH8epkEaRtFenAUawOgyvviPX5j3YWaBwMo_LQjs0zkpmmcbpoFuoNfoMH5wXiBjYQITOxGS4H/s400/image+5b.jpg" width="400" /></a></div>
<br />
<br />
7. If you previously added other CSS changes to your blog then you may see some code appear in this section. In the example below, I have a snippet of code already inserted to center my banner...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjenNphzXc-kuQv01H7H2dv46LlF8uoi2kSy0cbK6yRVLHplyvIlnQfeCsRxvGvbSOmi4DkqjPESi8LHRzGCsMaN27wwklIvTh02CI3quEpHTxRsddmlcvfqaq7WF5CGcpuR6C3mmkd37sF/s1600/image+5a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="268" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjenNphzXc-kuQv01H7H2dv46LlF8uoi2kSy0cbK6yRVLHplyvIlnQfeCsRxvGvbSOmi4DkqjPESi8LHRzGCsMaN27wwklIvTh02CI3quEpHTxRsddmlcvfqaq7WF5CGcpuR6C3mmkd37sF/s400/image+5a.jpg" width="400" /></a></div>
<br />
If this is the case on your own blog them be sure to leave that code as is, <b><i>do not remove it</i></b>. We are simply going to add an additional bit of code below, so be sure your mouse is positioned below any pre-existing code.<br />
<br />
8. Now, copy the post divider code and paste it into the "Add custom CSS" area ~ again, being sure to paste it <i>below </i>any preexisting code/s...<br />
<br />
<pre>.post<b>{</b>margin: 0 0 40px 0;
width: 90%;
background: url(<span style="color: red;"><b>http://www.plumroselane.com/image.png</b></span>);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:<b>4.5</b>em;
<b>}</b></pre>
<br />
<i>The part shown in red is different for each image so I've made that a generic link in the example above. You won't have to make any changes to the code, as long as you're using one of my post divider.</i><br />
<br />
9. In my example the code now looks like this...<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglz-jD7hvd-6AWE1uqWSovMTbpg4634Myz63AnuRC7y6ukT-mwgggNElMTl-NoJczYsQUsQwzTXvIM_uN19-EoB6DU11PTOtdCe5SQMCSFE2mKc3J0EJGqd37QCVh6EoXv9zQsWRbGDrZZ/s1600/image+7a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="268" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglz-jD7hvd-6AWE1uqWSovMTbpg4634Myz63AnuRC7y6ukT-mwgggNElMTl-NoJczYsQUsQwzTXvIM_uN19-EoB6DU11PTOtdCe5SQMCSFE2mKc3J0EJGqd37QCVh6EoXv9zQsWRbGDrZZ/s400/image+7a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
10. With the code now in place you can now preview how the post divider image will appear. To do this, use the lower scroll bar on the right side to scroll down the sample view of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoqGtn6HEeVDIsjVm2PjNRkKV8GKtOmkV22xSUmsQJh-wQl6gxhxU5apLp_GLkAUM89qZzgxYqOvKvCZ9Ne-un-QcIpiEARG3L3Nzw65AFyt-7zDayRpkec_MnEf5dBVQUUgIllPHZHE0i/s1600/image+8a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="333" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoqGtn6HEeVDIsjVm2PjNRkKV8GKtOmkV22xSUmsQJh-wQl6gxhxU5apLp_GLkAUM89qZzgxYqOvKvCZ9Ne-un-QcIpiEARG3L3Nzw65AFyt-7zDayRpkec_MnEf5dBVQUUgIllPHZHE0i/s400/image+8a.jpg" width="400" /></a></div>
<br />
13. Continue scrolling down until you see the example post divider appear...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrHQbxvWLbvHdZSmLmDhMcgRL5OpiLFOgO-gr5VcDgxEdOtgI7y9yhx6XK9fE9xSMkJ4ZgSavLuIVPdkLraQhbgMRA5TcYdIzF9me1BBKUW6YBAxKsLq3pRMNQjzIBbbEgfOqdxVnLQmaY/s1600/image+9a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="333" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrHQbxvWLbvHdZSmLmDhMcgRL5OpiLFOgO-gr5VcDgxEdOtgI7y9yhx6XK9fE9xSMkJ4ZgSavLuIVPdkLraQhbgMRA5TcYdIzF9me1BBKUW6YBAxKsLq3pRMNQjzIBbbEgfOqdxVnLQmaY/s400/image+9a.jpg" width="400" /></a></div>
<br />
<br />
<i>If an example does not appear then double check to be sure you copied and pasted the entire code into that CSS area. In some cases the post divider may not show up. If this is the case the I suggest backing out of the Template Designer, do not save any changes, and start over again. Please remember that if you've previously installed a post divider you will have to remove that code before trying to insert a new one. </i><br />
<br />
14. With everything set, simply click the "Apply to Blog" button to save your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5O0VSyLl2Q1XKI0-CpqcUFXsl5AQuSCpqG3DJ-_JYNK0A1nc2CzxyC7SfNiZF617MyJcHXxa7_YC0mGtUrexGAIBhgOYszUi2mW7hypCvFDkvAU3dk4RHEntJOIe5qnfUqQLryjHnT5Cj/s1600/image+10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="263" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5O0VSyLl2Q1XKI0-CpqcUFXsl5AQuSCpqG3DJ-_JYNK0A1nc2CzxyC7SfNiZF617MyJcHXxa7_YC0mGtUrexGAIBhgOYszUi2mW7hypCvFDkvAU3dk4RHEntJOIe5qnfUqQLryjHnT5Cj/s400/image+10.jpg" width="400" /></a></div>
<br />
<br />
<b><i>Adjusting the space around your post divider</i></b>: <i>If you
find the post divider image appears to be cramped in under the bottom of your
posts then you can change the last number on the bottom line of the code to a higher number. This adjusts the margin between your posts and the post divider. Changing the number to a higher number, like 5.5, 6.5 or 7.0 will add more space between your blog posts and the post divider image.</i><br />
<br />
Enjoy!Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com13tag:blogger.com,1999:blog-307932083687837946.post-59303475922131302102012-11-17T17:25:00.000-05:002013-06-11T13:55:23.361-04:00How to: Setup and Adjust the Picture Window TemplateThis tutorial will cover how to install and modify Blogger's Picture Window template as a platform for using one of my Designer Blog Themes and Backgrounds. These steps include a combination of working within Blogger's “Template Designer” area and the Html code area. Do Not <i>Rush </i>~ It is recommended that you take your time and read through the steps carefully ~ this is something you'll want to set aside some time before beginning. Working with Html code can be very tricky so be sure to take it slow and read carefully.<br />
<br />
While this tutorial does not cover how to install a Designer background it’s a good idea to consider what background you will want to use. You can peruse my selection of free backgrounds through the <a href="http://plumroselane-bckgrnds.blogspot.com/p/backgroundsthemes.html"><b>Themes & Backgrounds</b></a> area of my blog. Here's the direct link for that: <a href="http://plumroselane-bckgrnds.blogspot.com/p/backgroundsthemes.html">http://plumroselane-bckgrnds.blogspot.com/p/backgroundsthemes.html</a><br />
<br />
Install a background is covered under a different tutorial so once you've completed this tutorial and have the template set up you can move on to: <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-set-up-decorative-blog-background.html"><b>How to: Install a Decorative Blog Background</b></a> and here's the direct link for that: <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-set-up-decorative-blog-background.html">http://plumroselane-tutorials.blogspot.com/2012/09/how-to-set-up-decorative-blog-background.html</a><br />
<br />
I can tell you that out of all of my tutorials this is the longest and perhaps the most time consuming but the rewards are huge. You will only have to complete this process one time and once completed you'll have the pleasure of easily changing out your background whenever the mood strikes you. Changing out background images is as simple and copying and pasting a bit of code. So take your time, get through this and you'll enjoy the rewards of making your blog truly <i>yours</i>.<br />
<br />
If you find you would rather not hassle with all of these changes, then I do offer this service and you may <a href="mailto:plumroselane@gmail.com">contact me</a> for more info on pricing.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<br />
Now on with setting up the template…<br />
<br />
<b><i>Selecting the Picture Window Template</i></b><br />
1. We'll begin by installing the Picture Window template so let's access your blog by clicking the "Design" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzTjCObmKeinX3Vz0U_Cz5qj3QrFZSv8DZ1H_7WquiLzs3pBaup26tho3SBieGAXwi5jOlgJSwEV1GR9NiZQQP_C8UPlSuljTp6n61kE8NC2FWthnPDrdAhMMKqRFDPRwWlCJtVETcRu4m/s1600/image1a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzTjCObmKeinX3Vz0U_Cz5qj3QrFZSv8DZ1H_7WquiLzs3pBaup26tho3SBieGAXwi5jOlgJSwEV1GR9NiZQQP_C8UPlSuljTp6n61kE8NC2FWthnPDrdAhMMKqRFDPRwWlCJtVETcRu4m/s400/image1a.jpg" width="400" /></a></div>
<br />
2. Click the orange “Customize” button to access the Template Designer area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9074HzODTCv1DhB19vKmbOZu74MmPqp_khHq2REDtFDYAe85p3jGTYFEhcYNzUqBO3QJHB2h-8CugmekKJdWSVvchTSPcREvcCt2w-tLqc_-lMz-JzITVppM-QzsxjJY4Nso0r2KkvKlq/s1600/image2a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9074HzODTCv1DhB19vKmbOZu74MmPqp_khHq2REDtFDYAe85p3jGTYFEhcYNzUqBO3QJHB2h-8CugmekKJdWSVvchTSPcREvcCt2w-tLqc_-lMz-JzITVppM-QzsxjJY4Nso0r2KkvKlq/s400/image2a.jpg" width="400" /></a></div>
<br />
3. We'll start by selecting the template ~ to do this simply click on the little image of the Picture Window template, there’s no need to click on any of the other options below that...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPJQl-ImE18VO25cSBIp9D1dJc0XIqzs4yXs77gXtLQleJzq2dDxtTMwNSWfnyaQWVVCbw-HY93DN1MEM0I2qyKSGlsjf1suZzKTvTjAeA1P9A-C5XfD5jCQwBBviwJGrXrIm-Q5AY5fr1/s1600/image3a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPJQl-ImE18VO25cSBIp9D1dJc0XIqzs4yXs77gXtLQleJzq2dDxtTMwNSWfnyaQWVVCbw-HY93DN1MEM0I2qyKSGlsjf1suZzKTvTjAeA1P9A-C5XfD5jCQwBBviwJGrXrIm-Q5AY5fr1/s400/image3a.jpg" width="400" /></a></div>
<br />
<i>With that selected we are now going to make some modifications to the default template settings. </i><br />
<i><br /></i>
<i><b>Modifying the Template in the Template Designer</b></i><br />
<i>These changes will remove some of the presets that would otherwise interfere with the beauty of designer themes and backgrounds, so let's move on..</i><br />
<i><br /></i>
4. Click on the “Background” link, second choice from the top in the left side link list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS40R_EftT7Sgj9EriWuqFRXPONB7mweZMYA9FsWm0-nJD7oplvPWxd3m0DhTmJlspVObOyFAB-p_vM8ImZL0IWNdewEMtqpEcjszZ82LDDRagKUhIIzAh7sxn-Dx8v8Gt4cfZy1RVeWJ-/s1600/image3b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS40R_EftT7Sgj9EriWuqFRXPONB7mweZMYA9FsWm0-nJD7oplvPWxd3m0DhTmJlspVObOyFAB-p_vM8ImZL0IWNdewEMtqpEcjszZ82LDDRagKUhIIzAh7sxn-Dx8v8Gt4cfZy1RVeWJ-/s400/image3b.jpg" width="400" /></a></div>
<br />
5. In this view you're going to remove the default background image ~ to do this, simply click the link "Remove image" show under the little image...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMmyVFmQZdIecHz_GLmr8V6TuhLlj9PSHGJRHCtSERTBBl7MRHbu3ifd4ujFqnzgDqtIZiZfP_0DFEu0hq42KMMeiJHn_CK7Qvtq9-ESbY_wAckTuvEmnSYnGYKwppj-hlUvLVyad85CS-/s1600/image4a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMmyVFmQZdIecHz_GLmr8V6TuhLlj9PSHGJRHCtSERTBBl7MRHbu3ifd4ujFqnzgDqtIZiZfP_0DFEu0hq42KMMeiJHn_CK7Qvtq9-ESbY_wAckTuvEmnSYnGYKwppj-hlUvLVyad85CS-/s400/image4a.jpg" width="400" /></a></div>
<br />
6. A pop-up window will appear, click "Ok"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuHK9D3BSIGkGRtPVlrze_UNajdvqIpSiSaXspsV4Qk96EsJums9M2jcWhpTRTCYJ_yXfp_3KhzYbjr0GtwAeF-w6xkAt6x0A0J3d0Msa2-hcGti9Exj6kIegl16WT4euUrDo-L4zRkF3l/s1600/image4b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuHK9D3BSIGkGRtPVlrze_UNajdvqIpSiSaXspsV4Qk96EsJums9M2jcWhpTRTCYJ_yXfp_3KhzYbjr0GtwAeF-w6xkAt6x0A0J3d0Msa2-hcGti9Exj6kIegl16WT4euUrDo-L4zRkF3l/s400/image4b.jpg" width="400" /></a></div>
<br />
7. Your view should now look like this with a blank spot were the image was...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7MugRmVtyZigwe45y3tDy-ijUP-lne0deKFPIXIRwB0siKsu065qBxcvej-0CAQhRNpWtpUINNo3acTPctA-tFBNfiiF06hx96cpbqUwPYm2KROD_A9akteU_6a9UfQIrnCqEsdEQTUR/s1600/image5a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7MugRmVtyZigwe45y3tDy-ijUP-lne0deKFPIXIRwB0siKsu065qBxcvej-0CAQhRNpWtpUINNo3acTPctA-tFBNfiiF06hx96cpbqUwPYm2KROD_A9akteU_6a9UfQIrnCqEsdEQTUR/s400/image5a.jpg" width="400" /></a></div>
<br />
<i>In this area you can also select a color scheme to match your future blog background. You can make a selection now or come back at any time to choose a new scheme or change your selection. You will also have the option of hand selecting your own color choices outside of the ones show here in other areas of the Template Designer.</i><br />
<i><br /></i>
<i><b>Backgrounds, Layouts and Sizing</b></i><br />
While we're in this area of the Template Designer, let's discuss sizing and layouts since these are also important aspects to consider when choosing a blog background. All of my backgrounds come in three sizes and you have a lot of options for how you want to use those sizes. The sizes that are listed for my backgrounds are 800, 940, and 1050 pixels wide. When we mention these sizes we are referring to the center area of your blog which includes the posting area as well as any sidebar areas you have set up.<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO_iDpnHTV2hd-utyzgyI6ln8iRtbyimtKULZ20YIGOfxCHka_i3ZftN47mxcAr6djoHK7IIPYP2OKBkAN-QROGgA7OUItduTpGNWJup8dcPzj2AsvvJO-66GI7xmFnTaxtCVIWfsJBanM/s1600/sizing+&+layouts.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="346" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO_iDpnHTV2hd-utyzgyI6ln8iRtbyimtKULZ20YIGOfxCHka_i3ZftN47mxcAr6djoHK7IIPYP2OKBkAN-QROGgA7OUItduTpGNWJup8dcPzj2AsvvJO-66GI7xmFnTaxtCVIWfsJBanM/s400/sizing+&+layouts.png" width="400" /></a></div>
<br />
<br />
The overall width of these areas are controlled in the "<b>Adjusts widths</b>" area of the Template Designer and here is a view of that page...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjstdktMmPySO3HluNQc0x7qAXI3ZI3_SSE29c0wTYKvkf05eYg2TTOX0C2EF2jwqGsHG1llZ6CT4O1625NQUfmTbjG3wyPHdhg5DTGyj-avbYZHIBPvdbuaN83ue_mB-4u17cvqxeiNCZD/s1600/image6a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjstdktMmPySO3HluNQc0x7qAXI3ZI3_SSE29c0wTYKvkf05eYg2TTOX0C2EF2jwqGsHG1llZ6CT4O1625NQUfmTbjG3wyPHdhg5DTGyj-avbYZHIBPvdbuaN83ue_mB-4u17cvqxeiNCZD/s400/image6a.jpg" width="400" /></a></div>
<br />
The layout of your blog which includes the amount of sidebar areas you have and where they sit next to your posting area are controlled in the "<b>Layout</b>" area and here is a view of that page...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMbpl3IFKejASlogJjUbkNvpu6RIdjXhukiM7rXDix9PyNQUAj7LVETOm0O4AxEwjSEhB6AI-hb4gYwODntS5p612SdtR8kb92_zV5uoUZKlMlBaWbXh8ziA4Y3vl04U8kSUJMMyLkBOSK/s1600/image7a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMbpl3IFKejASlogJjUbkNvpu6RIdjXhukiM7rXDix9PyNQUAj7LVETOm0O4AxEwjSEhB6AI-hb4gYwODntS5p612SdtR8kb92_zV5uoUZKlMlBaWbXh8ziA4Y3vl04U8kSUJMMyLkBOSK/s400/image7a.jpg" width="400" /></a></div>
<br />
<i>If this is your first time setting up one of the new templates then you’ll probably want to make some additional adjustments in the “Adjust widths” and “Layout” areas. Some standard width adjustments are:</i><br />
<br />
<center>
<i><b>2 Column Blog</b></i></center>
<center>
<i>Entire blog 800 – 860px</i></center>
<center>
<i>Sidebar 200 – 260px</i></center>
<center>
<i><br />
<b>3 Column Blog</b></i></center>
<center>
<i>Entire blog 940 – 1050px<br />
Sidebar 200px each<br />
or 450px if both sidebars are on one side</i></center>
<i><br />
</i> <i>You may need to play around with these settings a bit until you find a combination you like and I recommend coming back later once you’re finished with this tutorial.</i><br />
<i><br /></i>
<i><b>Final Template Designer Modifications</b></i><br />
8. Moving onto our final adjustments, let's click on “Advanced” at the bottom of the list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaSnxYprVDYVI7NpYq4V_qdRYo9PYuQVsZdtjnylmnp0ju7qgYT4shyphenhyphenSr3UlPPn-bUsir9SirTAr1UGDQTQRRy9JiVdRfswndqtC0QbcChjZ-9aIOvpBvWaDeEh0jI9tE0o_S1Euibqo_z/s1600/image8a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaSnxYprVDYVI7NpYq4V_qdRYo9PYuQVsZdtjnylmnp0ju7qgYT4shyphenhyphenSr3UlPPn-bUsir9SirTAr1UGDQTQRRy9JiVdRfswndqtC0QbcChjZ-9aIOvpBvWaDeEh0jI9tE0o_S1Euibqo_z/s400/image8a.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
9. This opens up a large subcategory with numerous additional setting options...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56RnGjYvlqd_YU32Caqq8S0Ddye8KLNHLXKbALFAiALuMHYV6Pkr7Y_SVOT6g4eYGhW5cx4j5_DerOEE2UnbKeXAIhTIWLbXqv88TEk2c8YkJIZhvIVsyixjDiRmrSKev1nLzjZPQyZAj/s1600/image9a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56RnGjYvlqd_YU32Caqq8S0Ddye8KLNHLXKbALFAiALuMHYV6Pkr7Y_SVOT6g4eYGhW5cx4j5_DerOEE2UnbKeXAIhTIWLbXqv88TEk2c8YkJIZhvIVsyixjDiRmrSKev1nLzjZPQyZAj/s400/image9a.jpg" width="400" /></a></div>
<br />
<br />
10. Now click on “Backgrounds” to adjust some of the presets...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIuWXkU-ZQI6AqC3JXg0kSWznkNgCLHMvKVU13lzEc3vVx4eGk2vs2otsK3du2_bA5EK7GahVR5bdreIwdW6EpbwLnC4YHzjaXdiVexy0-CfwviUJa6MDJw16n_vuzWkiVWklfTjBO6mS8/s1600/image9b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIuWXkU-ZQI6AqC3JXg0kSWznkNgCLHMvKVU13lzEc3vVx4eGk2vs2otsK3du2_bA5EK7GahVR5bdreIwdW6EpbwLnC4YHzjaXdiVexy0-CfwviUJa6MDJw16n_vuzWkiVWklfTjBO6mS8/s400/image9b.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
10 - a. Now, in the “Outer Background” section click on the small down arrow next to the black colored rectangle...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzCG5zaWpfFEPK2zVWcVEHv2jKjMxtlv2oNr5A8DssnaZ3eG1PyxO3uJlWTsmDziPG1kHscV81ATbLDVj_VJe1epO_Q6TfgA0RCdikXARJeJ1PQJOYYGuQEBdhTe6Yn4L85KaQ9h0-TMhV/s1600/image10a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzCG5zaWpfFEPK2zVWcVEHv2jKjMxtlv2oNr5A8DssnaZ3eG1PyxO3uJlWTsmDziPG1kHscV81ATbLDVj_VJe1epO_Q6TfgA0RCdikXARJeJ1PQJOYYGuQEBdhTe6Yn4L85KaQ9h0-TMhV/s400/image10a.jpg" width="400" /></a></div>
<br />
10 - b. and a pop-up window will appear...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqJZKcazXXoQAAjZzg8IaS2vLTmx_JhtO3P5be_k7XA_4UO4T2GdPxju0l9OP6jP5AMCDNOUyPE9Fjht-Ih64u9U4wXbTSBcGwWACH546HSLJNnTsCfIcY4apfWj34ez_wVoE5hWjHy_hR/s1600/image11a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqJZKcazXXoQAAjZzg8IaS2vLTmx_JhtO3P5be_k7XA_4UO4T2GdPxju0l9OP6jP5AMCDNOUyPE9Fjht-Ih64u9U4wXbTSBcGwWACH546HSLJNnTsCfIcY4apfWj34ez_wVoE5hWjHy_hR/s400/image11a.jpg" width="400" /></a></div>
<br />
10 - c. Click on the checkered square next to the word “Transparent”...<br />
<div style="text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0vO3k2uq9llg5BNmypVPIEe7rptjMavRaxvwRs1DHS8CWsQtLKvotV8kdUFOTY3dh6DmteNs04x083QQfCoyNgX4kXqlqRYn9VpIArSu1ZmZ7Rm78VC9m1XwIFVpZjVjCsjRZqzlvgo_J/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="137" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0vO3k2uq9llg5BNmypVPIEe7rptjMavRaxvwRs1DHS8CWsQtLKvotV8kdUFOTY3dh6DmteNs04x083QQfCoyNgX4kXqlqRYn9VpIArSu1ZmZ7Rm78VC9m1XwIFVpZjVjCsjRZqzlvgo_J/s400/image+1.png" width="400" /></a></div>
<br />
<br />
10 - d. Then click outside of the box to keep the selection and close the pop-up window. I usually just click on the gray area to the right of the color choices...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrqDc4ejVZ4_oaovkCS9WBMQbXf-2Sidk5wJ2dGOZ1OqaDJmGvLwI473mjFBrYIdifo2EEBbqJ0ZfxbL_ls9vUd-ZBki7UVDj96Dtr_2OffxJciGDiBM5an5tQKgsXALGQgJBbv_xdDqeJ/s1600/image12a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrqDc4ejVZ4_oaovkCS9WBMQbXf-2Sidk5wJ2dGOZ1OqaDJmGvLwI473mjFBrYIdifo2EEBbqJ0ZfxbL_ls9vUd-ZBki7UVDj96Dtr_2OffxJciGDiBM5an5tQKgsXALGQgJBbv_xdDqeJ/s400/image12a.jpg" width="400" /></a></div>
<br />
10 - e. Now moving along in the same manner, we're going to change the "Post Background" color to transparent as well, until the final outcome looks like this...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm2aHJrgweTOr2huDrOoArl0FUkK7Skblz61DSpC23EuF2BqNhrce4F_XHTQeDyEu7og3m0haPx3P88FLxkKWGSPnHEinKdq3RWE7Nz5E4BA2jXMTatlFLT5yOHjaYRRgcz8B9jLI2rNeQ/s1600/image13a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm2aHJrgweTOr2huDrOoArl0FUkK7Skblz61DSpC23EuF2BqNhrce4F_XHTQeDyEu7og3m0haPx3P88FLxkKWGSPnHEinKdq3RWE7Nz5E4BA2jXMTatlFLT5yOHjaYRRgcz8B9jLI2rNeQ/s400/image13a.jpg" width="400" /></a></div>
<br />
11. Next, using the scroll bar, scroll down and click on “Post”...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmk-weuKRt6DF2BPmeNhe7nITnhjJunEjqi4-VBXoRgVK0vSyPc6wxQ_sWd4CsWyxqjdQ3Vru6ttGHEMyjsqJKlq1jyVfRuCk_gxOvcgWfF0y3sS2pzEWLjSJP1EbL_xqD5mToC0odRUU9/s1600/image14a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmk-weuKRt6DF2BPmeNhe7nITnhjJunEjqi4-VBXoRgVK0vSyPc6wxQ_sWd4CsWyxqjdQ3Vru6ttGHEMyjsqJKlq1jyVfRuCk_gxOvcgWfF0y3sS2pzEWLjSJP1EbL_xqD5mToC0odRUU9/s400/image14a.jpg" width="400" /></a></div>
<br />
11 - a. In this section, click on the small arrow to change the “Border Color” to transparent as you did in the steps above...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjggtXqpXnNsiSlj7fVOtHt9pwbUjsHoCNSvcqvxPPP6JAWJ1W7OdHyvogMCAcgZDT0F6-GhMV5fxpMVP7wp5X1kYiwWAQkH9qDcjOghpPqqGzfA9bPWp0KBvtd15UytAvpPFzVzm0_tiFo/s1600/image15a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjggtXqpXnNsiSlj7fVOtHt9pwbUjsHoCNSvcqvxPPP6JAWJ1W7OdHyvogMCAcgZDT0F6-GhMV5fxpMVP7wp5X1kYiwWAQkH9qDcjOghpPqqGzfA9bPWp0KBvtd15UytAvpPFzVzm0_tiFo/s400/image15a.jpg" width="400" /></a></div>
<br />
<i>Be sure to only change the Border Color and don't touch the "Footer Text Color" ~ since you wouldn't want your footer text to disappear or be invisible.</i><br />
<br />
12. Now click the "Apply to Blog" button to save all of the changes you've made...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOtJHk-XzOFAYyU9bhidceeAcE3QQFL8iGfC1MfWEQpcA58-5StNq-cTOkN-kUBlWVrwS5Z71l4TlPJxQcdY0RMtMe-bz9UdYNElYdgCfUHsNfpC9OXQto0OVAxUxk5tW4RQ1bR3bs8IDs/s1600/image16.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOtJHk-XzOFAYyU9bhidceeAcE3QQFL8iGfC1MfWEQpcA58-5StNq-cTOkN-kUBlWVrwS5Z71l4TlPJxQcdY0RMtMe-bz9UdYNElYdgCfUHsNfpC9OXQto0OVAxUxk5tW4RQ1bR3bs8IDs/s400/image16.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: left;">
13. You have now completed the changes in the Template Designer area. If you were to take a look at your blog, the only presets still remaining area an outlined white center area and a gray bottom or "footer" area. We can now move on to making the final modifications in the Html area of your blog. To continue on to that area, click the "Back to Blogger" link at the top...</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8q4-AsGAsQA1lBFHu4H_Dsw4SOmPJfgqoWlszioMMw3vxgbJogjwGfwT2gaTEw12msplWdSsm4yUfZi0QxB3rZPpwWNCQaXPnKCrQOQ_aWjDWGQAw2TfPI0Vf2JxvmRuQ4tSav-TkGExV/s1600/image17.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8q4-AsGAsQA1lBFHu4H_Dsw4SOmPJfgqoWlszioMMw3vxgbJogjwGfwT2gaTEw12msplWdSsm4yUfZi0QxB3rZPpwWNCQaXPnKCrQOQ_aWjDWGQAw2TfPI0Vf2JxvmRuQ4tSav-TkGExV/s400/image17.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<b><i>Saving a Backup</i></b><br />
<i>Before we begin working in the in the Html area of your blog, it's important to make a backup copy of your blog. Working in Html can be tricky and one small mistake or mistype can wreak havoc. Since working with Html is like speaking another language (it can look like gibberish if we don't it), remembering what changes we made can be nearly impossible so it's always recommended that you make a backup of your blog's template. This will ensure that if something does go wrong you can revert back and start over.</i><br />
<br />
So, let's save a backup copy of your blog's template…<br />
<br />
14. On the “Template” page click on the gray “Backup/Restore” button toward the top right corner. <br />
<br />
<center style="text-align: start;">
</center>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaMeTb3uC4LNivqVv34oDPhoeF6jhoDQIN7QodC_JSfl6oday0qphpVEVp510s_VJ_YQ1SzcRuxHJyJwZ3kPqpQ7q7EIvH1PL6o39xICBf_snvwGEQ5mbeieK8uSLjGe38Jv9wwIAZIn8E/s1600/image18a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaMeTb3uC4LNivqVv34oDPhoeF6jhoDQIN7QodC_JSfl6oday0qphpVEVp510s_VJ_YQ1SzcRuxHJyJwZ3kPqpQ7q7EIvH1PL6o39xICBf_snvwGEQ5mbeieK8uSLjGe38Jv9wwIAZIn8E/s400/image18a.jpg" width="400" /></a></div>
<center style="text-align: start;">
</center>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
15. Click the orange “Download full template” button to save a copy to your computer... <br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZIIg-Tf0Kw_KaOHpX1le1Kj4MGgRNBIPZoEKN5zVp_h3xTQ3-PidHfZJWmNGwm34ZqrlmQx310-vBKFBbgcvfsfBLUbrUSJ6N6N2Scnuid9Jgi9cA8cIx_OafP8b87UZmcF02BB55AmXv/s1600/image19a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZIIg-Tf0Kw_KaOHpX1le1Kj4MGgRNBIPZoEKN5zVp_h3xTQ3-PidHfZJWmNGwm34ZqrlmQx310-vBKFBbgcvfsfBLUbrUSJ6N6N2Scnuid9Jgi9cA8cIx_OafP8b87UZmcF02BB55AmXv/s400/image19a.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
Be sure you know where you save the copy so you can easily find it should you need to use it in the future. When you're finished click the Close button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPs06efLoyxsvuNOiE04vy7jonbld9QQeWa0EEKNMcZEtd_ZfKgSaqkl1Ql7DynNAk2C6Og6I7KKb4kqOv0LdquGSQIhsVOVT5ea0dAUuanBPyFMruLMsdap2o9K50F9ij2yr6Pbt0BJoU/s1600/image19b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPs06efLoyxsvuNOiE04vy7jonbld9QQeWa0EEKNMcZEtd_ZfKgSaqkl1Ql7DynNAk2C6Og6I7KKb4kqOv0LdquGSQIhsVOVT5ea0dAUuanBPyFMruLMsdap2o9K50F9ij2yr6Pbt0BJoU/s400/image19b.jpg" width="400" /></a></div>
<br />
<i>With that done we can now safely move on to making changes in your Html code section.</i><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGgZ5R4dEzeo5DmNtGg9D2vapr04iuFTM50NjivPIb_vymlUIAcLwxGqTWlxsvRqrYOI01iijwmdNCvF7AyIi9AUj8aQutPyt0WyMtefx8rvfHg_t8mnxaryswcRVKSLybrEv6hGO-vw7m/s1600/PrL-section_break.png" /></a></div>
<i> </i><br />
So let’s begin with our final adjustments…<br />
<i><b>Adjustments to Html Code</b></i><br />
<br />
16. In the “Template” area of your blog, click the “Edit HTML” button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKZCTV4M5Eu7e0_E9SSnF6KShv0NGXSnDgoN7jbn6rMbs9ad0xs3Y8QPjEKLGSVKpmmrG-yZMOEOMOnn2bxN_fi4mvKIUSb9PqBHG2jtD79yhuRuebRDuuhMvYP2oAYZuVlezcFFG4zWbk/s1600/image20a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKZCTV4M5Eu7e0_E9SSnF6KShv0NGXSnDgoN7jbn6rMbs9ad0xs3Y8QPjEKLGSVKpmmrG-yZMOEOMOnn2bxN_fi4mvKIUSb9PqBHG2jtD79yhuRuebRDuuhMvYP2oAYZuVlezcFFG4zWbk/s400/image20a.jpg" width="400" /></a></div>
<br />
17. This is a view of the Html area of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTNQDqD_gn3a9qLEw42IRCsIkS2WcUGxhIagrJ3QLRb8oBAwVVoMgE6zgbod0k9LVa88RNEgafFGsDv40EJYvCvPRRNDZ2p5ysN_eX1LG5EDVdSEWGMqJwM4Wcl0WweJMGBnm6M56APYkM/s1600/image21a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTNQDqD_gn3a9qLEw42IRCsIkS2WcUGxhIagrJ3QLRb8oBAwVVoMgE6zgbod0k9LVa88RNEgafFGsDv40EJYvCvPRRNDZ2p5ysN_eX1LG5EDVdSEWGMqJwM4Wcl0WweJMGBnm6M56APYkM/s400/image21a.jpg" width="400" /></a></div>
<br />
18. To make changes in this area we'll first need to click the "Format Template" button to expand the code view. Then we will need to use the built-in "Search" feature to find existing code and replace it with modified snippets of code. To initiate the "Search" feature click anywhere within the coded area with your mouse, then click and hold down the "Ctrl" key on your keypad, then click the "F" key - "F" is for "Find". This will open up the "Search" bar...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUGJ6t9njhVHzh8F6AsATZIsaJW9L2U8x86gAfu8qmR2FYubNIIjhTcuzTO6bYevwPivQO15CzBmMtK8fiAno045blzlwHNpMNE8-DaVrUZuTJxRmT9W6xJSGlXetD0DdcmlFgN482Atj3/s1600/image22a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUGJ6t9njhVHzh8F6AsATZIsaJW9L2U8x86gAfu8qmR2FYubNIIjhTcuzTO6bYevwPivQO15CzBmMtK8fiAno045blzlwHNpMNE8-DaVrUZuTJxRmT9W6xJSGlXetD0DdcmlFgN482Atj3/s400/image22a.jpg" width="400" /></a></div>
<br />
19. With that initiated we're going to first remove the automatic white center background that’s preset in the template. So either type the words below, or copy and paste them, into the search area …<br />
<br />
<div style="text-align: center;">
<b><span style="color: #cc0000; font-family: Georgia, Times New Roman, serif;">main.background</span></b></div>
<br />
so it looks like so...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO2jmf_COX_jWMUEVAmeeSfTRdxr-VI2xYL_gJXu0tdFcBrp19rJfeavrcnqMaNbLQmZvvchJMq6RjZn_MxxGEcbBQE2hPqwpJhxO-S0XeU4BRMSizpLJePmB5h95ahtXqpnR4QMWxKuiu/s1600/image23a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO2jmf_COX_jWMUEVAmeeSfTRdxr-VI2xYL_gJXu0tdFcBrp19rJfeavrcnqMaNbLQmZvvchJMq6RjZn_MxxGEcbBQE2hPqwpJhxO-S0XeU4BRMSizpLJePmB5h95ahtXqpnR4QMWxKuiu/s400/image23a.jpg" width="400" /></a></div>
<br />
<i>Now click the "Enter" key on your keypad to find that entry in the code.</i><br />
<br />
21. You'll see the code immediately change with that snippet of code highlighted...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOflg7DpR5-C1nt-5UqX4x0uD0WTGb6l42dsDvlBbGjIMaPvObzhj9lBaWXLwKIfi_eyaiBEpT3Yjq1TyCfVARxmqa9PpYtv_I3Obe6MSmPvcRmTPAHV_86MszY9UcleU2QJhcsAVPrSfd/s1600/image24a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOflg7DpR5-C1nt-5UqX4x0uD0WTGb6l42dsDvlBbGjIMaPvObzhj9lBaWXLwKIfi_eyaiBEpT3Yjq1TyCfVARxmqa9PpYtv_I3Obe6MSmPvcRmTPAHV_86MszY9UcleU2QJhcsAVPrSfd/s400/image24a.jpg" width="400" /></a></div>
<br />
22. Here is a view of the section of code you will be replacing...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2kJ-0iGvZ9Ae6ga1-TVj8mdkx6LMJU0jVfJrWXNZwDr8PPrMIZZuNa5ctucMzmJvFhNmi9tUbRfSj6xzrja2y4zsrqDa_dxeFvx75_PMzQ9mT1Fryww95so86eiFp0g9m7Wyb5rmpuzEh/s1600/image25a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="45" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2kJ-0iGvZ9Ae6ga1-TVj8mdkx6LMJU0jVfJrWXNZwDr8PPrMIZZuNa5ctucMzmJvFhNmi9tUbRfSj6xzrja2y4zsrqDa_dxeFvx75_PMzQ9mT1Fryww95so86eiFp0g9m7Wyb5rmpuzEh/s400/image25a.jpg" width="400" /></a></div>
<br />
23. Now copy the code below and paste it over the entire code shown above ~ be sure to cover the beginning arrow just before the first "Variable" and the ending arrow that follows the second "20px"...<br />
<br />
<div class="codeview">
<b><span style="color: #cc0000;">
</span></b>
<br />
<center>
<b><span style="color: #cc0000;">
<code><textarea cols="55" id="code-source" name="code-source" rows="5"><variable name="main.background" description="Main Background" type="background"
default="transparent url() repeat scroll top left" value="transparent url() repeat scroll top left"/>
<variable name="main.padding.sides" description="Main Padding Sides" type="length" default="20px" value="20px"/>
</textarea></code></span></b></center>
</div>
<br />
24. It's important to preview your changes to be sure there are no errors so to do this, click the "Preview template" button at the top...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s1600/image26a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s400/image26a.jpg" width="400" /></a></div>
<br />
25. A preview of your blog will now appear where the Html code was visible and you can use the scroll bar to scroll down and double check to be sure your changes have taken and the white center area no longer appears...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s1600/image27a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s400/image27a.jpg" width="400" /></a></div>
<br />
26. With the correct changes made you can now click the "Edit template" button to revert back to the Html view...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s1600/image27b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s400/image27b.jpg" width="400" /></a></div>
<br />
27. And click the "Save template" to save your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s1600/image28a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s400/image28a.jpg" width="400" /></a></div>
<br />
With that you've just completed the first of three steps. Only two more to go and you're done, so let's move on on...<br />
<br />
28. Now we’re going to remove the gray shadow outline from the center post area. Let's first reset the search so we can find the correct snippet of code. To do this, use the scroll bar to scroll back up to the top of the code area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0yWjGCm-BbdjfUOxowwB5G23_r7Gja52FW6_akYQkDBFDqi4vwIVFzem90OLkogGLO2OXae2HgrKnOf42lYU2-hvJPShq_LvdebOiIzSZbVRl4VjYSCQWdk_jNljnNJq2GQ-Ck7_8nIPp/s1600/image29-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0yWjGCm-BbdjfUOxowwB5G23_r7Gja52FW6_akYQkDBFDqi4vwIVFzem90OLkogGLO2OXae2HgrKnOf42lYU2-hvJPShq_LvdebOiIzSZbVRl4VjYSCQWdk_jNljnNJq2GQ-Ck7_8nIPp/s400/image29-1.jpg" width="400" /></a></div>
<br />
and then click inside the Html code area to reset the search area to the top of the page.<br />
<br />
29. Now to find the next snippet of code, either type the words below, or copy and paste them, into the search area …<br />
<br />
<center>
<b><span style="color: #cc0000; font-family: Georgia, Times New Roman, serif;">region.shadow.spread</span></b></center>
<br />
so it looks like so...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr35-Cg-lY61xLOLqu2JLn9rkwUbcPVC5bXq-yNerkxBpbFCrgUI9865sWCBRWUlEW8o7FO2yjOj1oGgAbpatgOpPDjtk9QrArxB9wtWvRFnWdURiHGj_IhssIV6DSVqLnjBm0q7MxBo-6/s1600/image30.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr35-Cg-lY61xLOLqu2JLn9rkwUbcPVC5bXq-yNerkxBpbFCrgUI9865sWCBRWUlEW8o7FO2yjOj1oGgAbpatgOpPDjtk9QrArxB9wtWvRFnWdURiHGj_IhssIV6DSVqLnjBm0q7MxBo-6/s400/image30.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<i>Now click the "Enter" key on your keypad to find that entry in the code.</i><br />
<br />
30. You'll see the code immediately change with that snippet of code highlighted...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBeElB5jKQJUBEw9daEykGkzUw701QZSq_qNOCJ3-c5-f7vWvXWSfOZDUYtTETE_2vFQLm7tlR0G7XyQD22UnKwVTcBMBaqlB1X69MmYLIU-U8whcRg4Z1g48ZFWImJBEQGMtiTIoTnkVf/s1600/image31a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBeElB5jKQJUBEw9daEykGkzUw701QZSq_qNOCJ3-c5-f7vWvXWSfOZDUYtTETE_2vFQLm7tlR0G7XyQD22UnKwVTcBMBaqlB1X69MmYLIU-U8whcRg4Z1g48ZFWImJBEQGMtiTIoTnkVf/s400/image31a.jpg" width="400" /></a></div>
<br />
31. Here is a view of the section of code you will be replacing...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwcZK1-8Gsr9kddbcypYRyS2c1YofR81vHqixvxp7ZxhYmQ5JnboLG3z9j0ksR5rwgsSb4K9M3e5RDle-7ilR3lGEb1-JonRKRzFjmvWALJsxOFwfiqJGRCvGvOYMA9dg9kDpiGmfqc5yZ/s1600/image31b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="30" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwcZK1-8Gsr9kddbcypYRyS2c1YofR81vHqixvxp7ZxhYmQ5JnboLG3z9j0ksR5rwgsSb4K9M3e5RDle-7ilR3lGEb1-JonRKRzFjmvWALJsxOFwfiqJGRCvGvOYMA9dg9kDpiGmfqc5yZ/s400/image31b.jpg" width="400" /></a></div>
<br />
32. Now copy the code below and paste it over the entire code shown above ~ be sure to cover the beginning arrow just before the first "Variable" and the ending arrow that follows the second "1px"...<br />
<br />
<div class="codeview">
<b><span style="color: #cc0000;">
</span></b>
<br />
<center>
<b><span style="color: #cc0000;">
<code><textarea cols="55" id="code-source" name="code-source" rows="5"><variable name="region.shadow.spread" description="Main and Footer Shadow Spread" type="length" default="0px" value="0px"/>
<variable name="region.shadow.offset" description="Main and Footer Shadow Offset" type="length" default="0px" value="0px"/></textarea></code></span></b></center>
</div>
<b><span style="color: #cc0000;">
</span></b>
<br />
<i>Note: From time to time I've found that using the Search feature for this step doesn't find the correct section of code the first time. If you experience this too and the code does not look exactly like the example shown above, then simply scroll back to the top of the Html code area and click anywhere within the code ~ this will reset the Search function back to the top of the Html code and you can search again for this section of code.</i><br />
<i><br /></i>
<br />
33. Once again we'll preview the changes to be sure they took affect so click on the "Preview template" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s1600/image26a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s400/image26a.jpg" width="400" /></a></div>
<br />
34. Scroll down to double check that the shadow has been removed from the outside edge of your blog posts (this may be a little tough to see if you already have a blog background installed)...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s1600/image27a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s400/image27a.jpg" width="400" /></a></div>
<br />
35. With the correct changes made you can now click the "Edit template" button to revert back to the Html view...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s1600/image27b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s400/image27b.jpg" width="400" /></a></div>
<br />
36. And click the "Save template" to save your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s1600/image28a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s400/image28a.jpg" width="400" /></a></div>
<br />
With that we can now move on to making the final change to the Html code.<br />
<br />
37. In this final modification we will remove the dark gray footer background. Once again let's reset the search back to the top by using the scroll bar and scrolling to the top of the code area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0yWjGCm-BbdjfUOxowwB5G23_r7Gja52FW6_akYQkDBFDqi4vwIVFzem90OLkogGLO2OXae2HgrKnOf42lYU2-hvJPShq_LvdebOiIzSZbVRl4VjYSCQWdk_jNljnNJq2GQ-Ck7_8nIPp/s1600/image29-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0yWjGCm-BbdjfUOxowwB5G23_r7Gja52FW6_akYQkDBFDqi4vwIVFzem90OLkogGLO2OXae2HgrKnOf42lYU2-hvJPShq_LvdebOiIzSZbVRl4VjYSCQWdk_jNljnNJq2GQ-Ck7_8nIPp/s400/image29-1.jpg" width="400" /></a></div>
<br />
then click inside the Html code area at the top of the page.<br />
<br />
38. Now to find the next snippet of code, either type the words below, or copy and paste them, into the search area …<br />
<br />
<center>
<b><span style="color: #cc0000; font-family: Georgia, Times New Roman, serif;">footer.background</span></b></center>
<br />
so it looks like so...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfhH8sBdl9SzJcfS5ttYp57OlekRlK2OKj4lvWH4rcJz7b3dEnEYd-Wfva8af4wUx16rLs3yglNMvPD4MvhJTg9IEmIXi3hIW782AobnCsJrNj0mAMwzQyULxOb2bzO7HGZmEgRETCs69Y/s1600/image32a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfhH8sBdl9SzJcfS5ttYp57OlekRlK2OKj4lvWH4rcJz7b3dEnEYd-Wfva8af4wUx16rLs3yglNMvPD4MvhJTg9IEmIXi3hIW782AobnCsJrNj0mAMwzQyULxOb2bzO7HGZmEgRETCs69Y/s400/image32a.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<i>Now click the "Enter" key on your keypad to find that entry in the code.</i><br />
<br />
39. You'll see the code immediately change with that snippet of code highlighted...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7jw4E8sPLDayVhqKANkey9xOF-SAXTBzxjvol15hCKZ1B10_PV4W-LOz711c5idFfEGHPXrDIWJldo_L7EuUy64Hdxyu3JwWiL7grFZStqfptTsfKIXYRXf9sxXf3lYsr4an9vaJA2sU/s1600/image33a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw7jw4E8sPLDayVhqKANkey9xOF-SAXTBzxjvol15hCKZ1B10_PV4W-LOz711c5idFfEGHPXrDIWJldo_L7EuUy64Hdxyu3JwWiL7grFZStqfptTsfKIXYRXf9sxXf3lYsr4an9vaJA2sU/s400/image33a.jpg" width="400" /></a></div>
<br />
40. Here is a view of the section of code you will be replacing...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeO3s-x0rLvksKiyjo3ehY1OqulVSLqCzFBOtI0GAVtWMoharUGG0TVIWtG5gbdbgZrh7G_qPlhRVRqU51PISMeTZTz2xybC3-e5kt_ALW01M7aavchqNv7SFjwtP37udD6C9knfdBeCH2/s1600/image33b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="30" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeO3s-x0rLvksKiyjo3ehY1OqulVSLqCzFBOtI0GAVtWMoharUGG0TVIWtG5gbdbgZrh7G_qPlhRVRqU51PISMeTZTz2xybC3-e5kt_ALW01M7aavchqNv7SFjwtP37udD6C9knfdBeCH2/s400/image33b.jpg" width="400" /></a></div>
<br />
41. Now copy the code below and paste it over the entire code pictured<span style="color: #0b4000;"><span style="font-size: small;"><span style="font-family: Georgia,"Times New Roman",serif;"><span style="color: #0b4000;"><span style="font-size: small;"> </span></span></span></span></span>above ~ be sure to cover the beginning arrow that precedes "Variable"and the ending arrow that follows "left"...<br />
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<div class="codeview">
<b><span style="color: #cc0000;">
</span></b>
<br />
<center>
<code><textarea cols="55" id="code-source" name="code-source" rows="3"><variable name="footer.background" description="Footer Background" type="background"
default="transparent url() repeat scroll top left" value="transparent url() repeat scroll top left"/></textarea></code></center>
</div>
</div>
<b><span style="color: #cc0000;"></span></b>
42. Once again we'll preview the changes to be sure they took affect so click on the "Preview template" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s1600/image26a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGqcvgj4TkPY1ztRqE1azqiK9tvZKh7JHRqHV8Q1HwFbBTLiAmxvDgZ66XnSCxmfzK8SmXeCF6S8wVe5JDUm03sGkordsguPGd2lTYR_tMFm0MUweHNFgr0LuzrjBhyAZAoyhB-v1PpeL/s400/image26a.jpg" width="400" /></a></div>
<br />
43. Scroll down to double check that the gray color has been removed from the footer area of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s1600/image27a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctar8HU73v7TMx0HDeDCDLwa817JAu10EQ4DdHYFjfDwEYCaLBMIcrRoMe_XNoQ8OfRAdR100JQyLddPxkkVtb7wJe4R_moXOb5Wpptvtpnc6Lt0-nDXTF7oajBS0vsoJJ_wsu7cbmCKo/s400/image27a.jpg" width="400" /></a></div>
<br />
44. With the correct changes made you can now click the "Edit template" button to revert back to the Html view...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s1600/image27b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKpO9aydFHvAA-oQZbhbqA31BXhGVUjq5n_6sZAKliHOqGadazwaHbKBB6HvZRCwhhecg7UKrucBK0ti1aXKQWO-5K5tyiusa9ubRX37hIcGPjzlCFH-A1fyUvifOM5UlA4ovlJ6EsmG5N/s400/image27b.jpg" width="400" /></a></div>
<br />
45. And click the "Save template" to save your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s1600/image28a.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0PWB0IN05zWf7mgGo_LIgR4zB09d7GqVdFEygSU8ZxEjlMfdH2t9cEVD_4hFaENU0HDAh5Yn4abUSS-2xTYYncVuE68lu154EBm0weEFmNUJgWiRkuLad_PAnglLrps6MlfSTHL18naEJ/s400/image28a.jpg" width="400" /></a></div>
<br />
That’s it! Your blog template is now set up and ready for you to install a Designer Template or Background.<br />
<br />
If you find that any of the changes did not take affect then you can restore your previous template and start over with the Html changes. Only the Html changes will need to be redone. If you received an error message for any of the changes above then simply back out of the Html section without saving your changes and return again to start over.<br />
<br />
I hope you enjoy the modified version of the Picture Window template and all the options it offers for decorating your blog!<br />
<br />
<i><b><span style="color: #cc0000;">Update: </span></b></i><br />
<span style="color: #cc0000;">Due to recent changes in the Html section of Blogger blogs we are no longer able to offer support for this tutorial. Although the tutorial has been tested and is used regularly by our designers, the steps are often too complex for the novice blogger to successfully complete. If you are having difficulties, such as receiving Html error messages, then we recommend the following steps:</span><br />
<span style="color: #cc0000;"><br /></span>
<span style="color: #cc0000;">1. If English is not your primary language then it is recommended you seek out a tutorial in your own language. Working with Html code is too complex to use in a foreign language and using a translator will not deliver accurate results. </span><br />
<span style="color: #cc0000;"><br /></span>
<span style="color: #cc0000;">2. If you are receiving Html code errors then we recommend searching Google for an alternative tutorial as there are several others available in cyberspace. </span><br />
<span style="color: #cc0000;"><br /></span>
<span style="color: #cc0000;">We do offer template setup and modifications along with installation of our designer blog themes. If you area interested in this service please <a href="mailto:plumroselane@gmail.com">contact us</a> directly.</span><br />
<br />
Best~
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comtag:blogger.com,1999:blog-307932083687837946.post-26378297042250477242012-09-23T17:12:00.000-04:002012-12-15T20:07:30.537-05:00How to Write a Blogger Blog Post ~ videoIn this post we'll learn how to write a basic blog post in Blogger. I'm trying a new tool out for this by creating a video tutorial which I've inserted below. This is my first (ever) video tutorial so please bear with my nervousness until I get comfortable with this new medium. I will still be creating my written tutorials but they take much longer to create, approximately 4 - 6 hours each, so I will publish them as time permits. In the meantime I hope you find these helpful in trying to navigate Blogger's new interface.<br />
<br />
If you would like to view the video in full screen simply click on the video to be taken directly to my YouTube channel.<br />
<br />
<center>
<iframe allowfullscreen="allowfullscreen" frameborder="0" height="225" src="http://www.youtube.com/embed/mWv-wUVfblY" width="400"></iframe></center>
<br />
Enjoy~<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0tag:blogger.com,1999:blog-307932083687837946.post-15800209771345815352012-09-17T02:49:00.000-04:002012-12-15T20:53:51.537-05:00How to Add a Favicon to Your Blog<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzczI3CW6YbPxSXplyi1u-Wlns0WR7TamIzoCtMfyLAxrX5ESrPGzHCW0pt1Idd8ko-5zRMM_PwtLP8Q-GNcRq1pDMEB5QTwMO-6tHyLr8-FFy3VrGbjRJPNJM71sVJ6a8KX2LyqS5tClh/s1600/PrLfavicon.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"></a></div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJMKjXP1dBVm1K5XxZt6OfnKnOSJqI2uBaKHRwrCqspFX1nEIXOhTRLuvSyHv08S3WtIIHmrJosXO5Ejp56skZtXoE_CMuXkKHaLB33XivadcK1IZsCi-MoELMAWAr17pNMbRbzReU6q_9/s1600/250px-Wikipedia_favicon_in_Firefox_on_KDE.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="120" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJMKjXP1dBVm1K5XxZt6OfnKnOSJqI2uBaKHRwrCqspFX1nEIXOhTRLuvSyHv08S3WtIIHmrJosXO5Ejp56skZtXoE_CMuXkKHaLB33XivadcK1IZsCi-MoELMAWAr17pNMbRbzReU6q_9/s200/250px-Wikipedia_favicon_in_Firefox_on_KDE.png" width="200" /></a>With this tutorial I'll show you how to easily add a favicon to your blog. <span style="color: black;">A <b>favicon</b></span><span style="color: black;"><b>
</b>is the little icon associated with a website. It can appear in the
address bar when you're visiting a website or on a browser's tab or in your browser's favorites or bookmarks
area. Blogger's in a large white "B" surrounded by orange as show in the example below...</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM_U09HGUmkwgZwtGRGx3JfK_o5dSCMfRa5n74yYWO0Zdk2sSVxv-JwaGnfG3tRS0EzJbrVx7LQg_8vuSiSTzxwFOhE3nHvbWVRvHafP0YcpXcBVc3OfK9k2R551xjgYlPZDvl17Xhyphenhyphenm4D/s1600/image+0.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="215" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM_U09HGUmkwgZwtGRGx3JfK_o5dSCMfRa5n74yYWO0Zdk2sSVxv-JwaGnfG3tRS0EzJbrVx7LQg_8vuSiSTzxwFOhE3nHvbWVRvHafP0YcpXcBVc3OfK9k2R551xjgYlPZDvl17Xhyphenhyphenm4D/s400/image+0.png" width="400" /></a></div>
<br />
<span style="color: black;">These icons cater to the part of our brains which absorb symbols and icons, as described by </span><a href="http://www.blogger.com/%20http://rcm.amazon.com/e/cm?lt1=_blank&bc1=FFFFFF&IS1=1&npa=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=plumlane-20&o=1&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=0440351839" style="color: black;">Carl Jung</a><span style="color: black;">, but we'll save that topic for another day. For bloggers and indie business, they're a great way to personalize your blog and an easily recognizable symbol is you select something simple that personally relates to you and your blog.</span><span style="color: black;"></span><br />
<span style="color: black;"><br /></span>
<span style="color: black;">Before we begin ~ you'll need to select an image to use for your own favicon. It should be something simple like a flower, butterfly, or any other element and image size should be small and square <span style="color: black;">since favicons are square and you don't want yours to appear cut-off. <span style="color: black;"> I've never tested whether there are size limitations and favicons are usually </span><span style="color: black; font-style: italic;">very </span><span style="color: black;">small at 16 x 16 pixels, so here's a link to generate a free tiny favicon using your own image ~ </span><a href="http://tools.dynamicdrive.com/favicon/" style="color: black;">Dynamic Drive Favicon Generator</a><span style="color: black;">.</span></span></span><br />
<span style="color: black;"><br /></span>
Begin by logging into your blog, then click "Design" link found in the top right corner of your blog...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9eQi6MMyNuS-kRtJ6DuV3jca28nKXPOqcd9W1ZB8k2TFQLnblLAh5yO8rChCMgUkTZRuMJoSrFVPeOBtyo-kgrTFHCD9LWiInbRH8-kXEc5k1VumyUWbNLFf2cylPWC7UnjegqnAsXItq/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="222" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9eQi6MMyNuS-kRtJ6DuV3jca28nKXPOqcd9W1ZB8k2TFQLnblLAh5yO8rChCMgUkTZRuMJoSrFVPeOBtyo-kgrTFHCD9LWiInbRH8-kXEc5k1VumyUWbNLFf2cylPWC7UnjegqnAsXItq/s400/image+1.png" width="400" /></a></div>
<br />
Next click on the "Layout" link in the left side link area...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkP5E93KMQxUSabHWvCU_IuZjebSujO9Z1dZOHnS127eG3rNpfB-vUTTo0JJPl61cRdqNniivcOXq9gE9L_dTiTrprOgv_19OJfUuxRODiIqYp37rjVfpQ7iAbv79uexfbvflnLv_6Q8TO/s1600/image+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkP5E93KMQxUSabHWvCU_IuZjebSujO9Z1dZOHnS127eG3rNpfB-vUTTo0JJPl61cRdqNniivcOXq9gE9L_dTiTrprOgv_19OJfUuxRODiIqYp37rjVfpQ7iAbv79uexfbvflnLv_6Q8TO/s400/image+2.png" width="400" /></a></div>
<br />
Locate the "Favicon" rectangle and click on the "Edit" link...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYBqb2JuNBQuZRymyRIdtOqDCmsAetQ_dyj2J5Wtu3OrLXlC5DpQS3_VAsFeBMYkKhpllW5LpKtAwgFM7IJvkGBOC2Q318sSosM9NmPVevcK9zRrNJGPUrs_ehye4qh874idJHoXcmfDYO/s1600/image+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYBqb2JuNBQuZRymyRIdtOqDCmsAetQ_dyj2J5Wtu3OrLXlC5DpQS3_VAsFeBMYkKhpllW5LpKtAwgFM7IJvkGBOC2Q318sSosM9NmPVevcK9zRrNJGPUrs_ehye4qh874idJHoXcmfDYO/s400/image+3.png" width="400" /></a></div>
<br />
A pop-up window will appear, click on the "Browse" button to begin locating your favicon image...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVYMx1hasKbG5gGmxQh0NWJYLzPU9ioPrZeE4Et2OGuzpjKPtoX8CyKqj40yCmc2FLdnWkwxR1d2xu4P4t7g_1po_zLHedSLwDNPrjz8PmfDHW3P1OWv6sdyLt86iyCFA3hM-C7i1QnXY0/s1600/image+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVYMx1hasKbG5gGmxQh0NWJYLzPU9ioPrZeE4Et2OGuzpjKPtoX8CyKqj40yCmc2FLdnWkwxR1d2xu4P4t7g_1po_zLHedSLwDNPrjz8PmfDHW3P1OWv6sdyLt86iyCFA3hM-C7i1QnXY0/s400/image+4.png" width="400" /></a></div>
<br />
Navigate to your image, click on the image and then click "Open"<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz3jrLh7MknGu68cApHLrYklpKWI3P9afX70r96rPe8jGjzJJmaThyHgBKXCErMrtwjHyzd0nThEfP8dQeKgkP2raPTvyRSpB-Dl-Dq2v6USEqymA2GC_OILGaa6EL4n_lUri4tqOC8HFr/s1600/image+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz3jrLh7MknGu68cApHLrYklpKWI3P9afX70r96rPe8jGjzJJmaThyHgBKXCErMrtwjHyzd0nThEfP8dQeKgkP2raPTvyRSpB-Dl-Dq2v6USEqymA2GC_OILGaa6EL4n_lUri4tqOC8HFr/s400/image+5.png" width="400" /></a></div>
<br />
Now click the "Save" button...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnfkDlISYC7lYhSYZlBPm7xOr-NcxX42fo3v1LCL5MlSvTg_vJ8u-V4a4HGahLJ9qmPhZbjIQrW4TrYKVIteJFDf3irFIp7mgrNs8fIRQbIJkDy9mAUoAKevOhDzJeD6Px94EYd5xDsSJO/s1600/image+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnfkDlISYC7lYhSYZlBPm7xOr-NcxX42fo3v1LCL5MlSvTg_vJ8u-V4a4HGahLJ9qmPhZbjIQrW4TrYKVIteJFDf3irFIp7mgrNs8fIRQbIJkDy9mAUoAKevOhDzJeD6Px94EYd5xDsSJO/s400/image+6.png" width="400" /></a></div>
<br />
That's it! Your new favicon is now in place...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqL2WjXJHnMqs84E1wprlzweQvSxbQ6LVgaM4gQ6dms9Lp7Xenk6w2GYZ5MKPw9C1trynR6CPJYMThRD2jS3rYQwCK3OpvUAmUUCxFMDrLMylo6U_xQ4ECw4BOcEPac1epLbWRK25-GjKe/s1600/image+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="255" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqL2WjXJHnMqs84E1wprlzweQvSxbQ6LVgaM4gQ6dms9Lp7Xenk6w2GYZ5MKPw9C1trynR6CPJYMThRD2jS3rYQwCK3OpvUAmUUCxFMDrLMylo6U_xQ4ECw4BOcEPac1epLbWRK25-GjKe/s400/image+7.png" width="400" /></a></div>
<br />
Congratulations! Often times the actual change won't take affect in your browser until you've closed it and reopened so if it doesn't show up right away in that view just be patient. As long as it shows up in the "Layout" view, your favicon is properly installed.<br />
<br />
Enjoy~<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0tag:blogger.com,1999:blog-307932083687837946.post-72439527415132888372012-09-17T01:53:00.000-04:002013-01-12T19:35:37.073-05:00How to: Center a Blog HeaderIn this tutorial we will walk you through the steps for center a blog header (or banner as it is also called). If you need help installing your blog banner then please view this tutorial first: <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-install-blog-header-banner-image.html">How to Install a Blog Header</a> If you need a banner image I offer several free versions which you can find by browsing through my A-Z Theme List. <br />
<br />
Below is an example of a blog banner image in place but obviously set off center. The default setting for most Blogger templates is for the banner image to show up toward the left side of your blog as shown below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUR-NQx6GaSqgznZkti3et72wHA8ukXTUUtPFenTBiWFqVrEQStJ58a4xwTB2flSIWz_7lA6vq0KkrZHnsBAbhu8ct4FJKNXQb3cYGle8Rrlm5RhZkCWqz3dtcgDmWJrWRl4nUoK1MOXRy/s1600/image+0.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="220" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUR-NQx6GaSqgznZkti3et72wHA8ukXTUUtPFenTBiWFqVrEQStJ58a4xwTB2flSIWz_7lA6vq0KkrZHnsBAbhu8ct4FJKNXQb3cYGle8Rrlm5RhZkCWqz3dtcgDmWJrWRl4nUoK1MOXRy/s400/image+0.png" width="400" /></a></div>
<br />
So let's begin...<br />
1. Log into your blog and then click the "Design" link found in the top right corner...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh97aYWqAd9DZrjg8TsV5j5CBc-X-Ufd8QgGIIgaTm27Cc_RM_EgIJ1eufzIoKWYWcwJwDEf2vd7X_VjBk8b5qur-DZYrPmlR9paCP1fYyxs3nX4WgN70Fcg3294cHYC-74YvCg6lplyYgg/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="220" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh97aYWqAd9DZrjg8TsV5j5CBc-X-Ufd8QgGIIgaTm27Cc_RM_EgIJ1eufzIoKWYWcwJwDEf2vd7X_VjBk8b5qur-DZYrPmlR9paCP1fYyxs3nX4WgN70Fcg3294cHYC-74YvCg6lplyYgg/s400/image+1.png" width="400" /></a></div>
<br />
2. In the next window click on the "Customize" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgs6VfxmmkRRgdXWHfPaL-ATRZ3FcOBxBy3K3R9WLSacDaYv4EWhISg4DkQn1v4RFfRenDigmDFIvCZCOJOrB3_Z78PhF7kQ7Oujof7rOuW060x9_YbeCy5s100LfDbkDeQ-X93mDI_plv/s1600/image+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgs6VfxmmkRRgdXWHfPaL-ATRZ3FcOBxBy3K3R9WLSacDaYv4EWhISg4DkQn1v4RFfRenDigmDFIvCZCOJOrB3_Z78PhF7kQ7Oujof7rOuW060x9_YbeCy5s100LfDbkDeQ-X93mDI_plv/s400/image+2.png" width="400" /></a></div>
<br />
3. This will open the Blogger Template Designer which you can see an example of shown below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbmfnwlrEkYKxYJHT2Sohf6o9C0_HQjcq46aolP_42BhLUTYGwBOZOZj00yW5n8dQCp0SU6dR_CYfHLp7aoaZBgFQku2bMfN-71uFaiInHitJVVb3xXrTAxt3bgY0jPXxk_I2lWhE1ZGyH/s1600/image+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbmfnwlrEkYKxYJHT2Sohf6o9C0_HQjcq46aolP_42BhLUTYGwBOZOZj00yW5n8dQCp0SU6dR_CYfHLp7aoaZBgFQku2bMfN-71uFaiInHitJVVb3xXrTAxt3bgY0jPXxk_I2lWhE1ZGyH/s400/image+3.png" width="400" /></a></div>
<br />
4. Click on the "Advance" link in the bottom of the left side list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbD7huY-V3vxTCFNlcLwI1RfQ4nC0tDaWHO9zvHqNYQ-dlmZGsQu2CqpOL4NZB_vBW88h3CesRq6kgg9R8V94JohZHEs_3iwYOZS8VqqP9x0ODKl-jUVguPIKIbFfdtc7LK6E7D25_nkvU/s1600/image+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbD7huY-V3vxTCFNlcLwI1RfQ4nC0tDaWHO9zvHqNYQ-dlmZGsQu2CqpOL4NZB_vBW88h3CesRq6kgg9R8V94JohZHEs_3iwYOZS8VqqP9x0ODKl-jUVguPIKIbFfdtc7LK6E7D25_nkvU/s400/image+4.png" width="400" /></a></div>
<br />
5. Using the inner scroll bar...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKci-gNpPokBzXCvR668Tewt3TRgrbdctqdeEEx5GEfadmzoEWeeCPAWyBNDrk93mmeyHo22puHi5WFHT79nSs5flFNgDOcAizXYs2t8KGV7UnqK9Ueg58kgrJEmsuzYrpwNzSovdlMYnR/s1600/image+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKci-gNpPokBzXCvR668Tewt3TRgrbdctqdeEEx5GEfadmzoEWeeCPAWyBNDrk93mmeyHo22puHi5WFHT79nSs5flFNgDOcAizXYs2t8KGV7UnqK9Ueg58kgrJEmsuzYrpwNzSovdlMYnR/s400/image+5.png" width="400" /></a></div>
<br />
6. Scroll down to the "Add CSS" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgPvJIj-l9W4ptj2uh7DDLDJWra-NNsfmMzcWskKTr4b-xRI_YRK8EQW7zYwHWog2ysPvGo8jlTIZ_o8dPJofL4Iy2uYjoLFcm02NCnGTb2_YgOlLByaW02iGmwCQjRFHW4uvhY0LpnGNe/s1600/image+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgPvJIj-l9W4ptj2uh7DDLDJWra-NNsfmMzcWskKTr4b-xRI_YRK8EQW7zYwHWog2ysPvGo8jlTIZ_o8dPJofL4Iy2uYjoLFcm02NCnGTb2_YgOlLByaW02iGmwCQjRFHW4uvhY0LpnGNe/s400/image+6.png" width="400" /></a></div>
<br />
7. This is the area where you can add a snippet of CSS code to tell your blog to center the header...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifY8SVGgV0dmGSRYF_KOtsxPKqyjgtaHd2yu1q0qiO3M24G8pJeKPFSWVESHkR60rjs2xboLS6n4ohMD8kMYyDMywvNI5XCkGBxTw1Lz5H6XBEx4CkgpldYfDBMObp7AL0VoWLWx7zTd-s/s1600/image+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifY8SVGgV0dmGSRYF_KOtsxPKqyjgtaHd2yu1q0qiO3M24G8pJeKPFSWVESHkR60rjs2xboLS6n4ohMD8kMYyDMywvNI5XCkGBxTw1Lz5H6XBEx4CkgpldYfDBMObp7AL0VoWLWx7zTd-s/s400/image+7.png" width="400" /></a></div>
<br />
8. Now copy the code below and paste it into the rectangle...<br />
<br />
<center>
<textarea cols="20" id="code-source" name="code-source" rows="3">#Header1 {width:900px;margin:0 auto}
</textarea></center>
<br />
9. Now it should look like this...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE_Kxtxto5yWw2RzrVuuCT46b45TqM3p477ACUNu4pGqVQHa7D3gTSuRRNBx3ITFH4VJahB04R7ZIyYunlsBur1PwGJTNCokr9QGKm0XxgAOWACQ5O7_vHptrzERSg3Gsquhjddftfpk_J/s1600/image+8.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE_Kxtxto5yWw2RzrVuuCT46b45TqM3p477ACUNu4pGqVQHa7D3gTSuRRNBx3ITFH4VJahB04R7ZIyYunlsBur1PwGJTNCokr9QGKm0XxgAOWACQ5O7_vHptrzERSg3Gsquhjddftfpk_J/s400/image+8.png" width="400" /></a></div>
<br />
<i>Within the code you'll notice the number "900" ~ this is the standard size for all of my wide banners. This size, when used in combination with the "Shrink to Fit" option when uploading a blog is how you can achieve the best fit for your blog. Playing with both of these settings in different combinations will help you achieve the best look. </i><br />
<br />
10. To check your blog width, click on the "Adjust widths" link in the far left link list...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUdhwW3JY2Pl5GQZ8VC2dCShOERRvapdeh0M1SKI32orQCrTkX0ALTPdbUMsNxSRU8cqZJ3B2xtH_oHLY7OzmNvuE02JSUnq0M_FYe3P9JAuVG0BYRpa02BEff6jGgHacsE-261sKxCaxJ/s1600/image+9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUdhwW3JY2Pl5GQZ8VC2dCShOERRvapdeh0M1SKI32orQCrTkX0ALTPdbUMsNxSRU8cqZJ3B2xtH_oHLY7OzmNvuE02JSUnq0M_FYe3P9JAuVG0BYRpa02BEff6jGgHacsE-261sKxCaxJ/s400/image+9.png" width="400" /></a></div>
<br />
11. In case of my sample blog in this tutorial the blog is set to 860 pixels wide...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1iepRsBU0jhYNnmEaeXOTxWEftKFgipu-c_whKcHW_VyTKii2qUi4-AKv-ItsVD7lwT2EvcPcH5D_gHWzFzQJEfD3EP0QkaIxwwurZX00dhW4EYzoxDyShzE_iPU4obXmgIRxRmm7WACp/s1600/image+10.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1iepRsBU0jhYNnmEaeXOTxWEftKFgipu-c_whKcHW_VyTKii2qUi4-AKv-ItsVD7lwT2EvcPcH5D_gHWzFzQJEfD3EP0QkaIxwwurZX00dhW4EYzoxDyShzE_iPU4obXmgIRxRmm7WACp/s400/image+10.png" width="400" /></a></div>
<br />
12. So I'll jot this number down and return to the "Advanced" area by clicking on that link again...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpJqHk-CNEI2Hxgg78_q-ZnLBVW1KRdBjn2As2SJX9wOmwVjwQM4KFiYkBGvstxgxhOZxEIEB5NJhI6Z1kkcFCn0XCAVU61RaD-xHeLi3i_KSYt_QuCEcpLfMS6mPQH3DVE3BsiJ7VMOY6/s1600/image+11.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpJqHk-CNEI2Hxgg78_q-ZnLBVW1KRdBjn2As2SJX9wOmwVjwQM4KFiYkBGvstxgxhOZxEIEB5NJhI6Z1kkcFCn0XCAVU61RaD-xHeLi3i_KSYt_QuCEcpLfMS6mPQH3DVE3BsiJ7VMOY6/s400/image+11.png" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8sxvkdf2G-cRAWcOs8volP_2tvp3YIh_bd4DLVqmhJCWa5pAMYvAc_kNifp5QWmt5TIdXtYpGw6PJr817BkKamQCtvpyt36j6PremIuWXMnmVvtaawwNQ-cvVVV4HQoBnymjCZ5xH_zh7/s1600/image+12.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
13. Now, we can change that "900" to "860" as shown in the example below...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8sxvkdf2G-cRAWcOs8volP_2tvp3YIh_bd4DLVqmhJCWa5pAMYvAc_kNifp5QWmt5TIdXtYpGw6PJr817BkKamQCtvpyt36j6PremIuWXMnmVvtaawwNQ-cvVVV4HQoBnymjCZ5xH_zh7/s1600/image+12.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8sxvkdf2G-cRAWcOs8volP_2tvp3YIh_bd4DLVqmhJCWa5pAMYvAc_kNifp5QWmt5TIdXtYpGw6PJr817BkKamQCtvpyt36j6PremIuWXMnmVvtaawwNQ-cvVVV4HQoBnymjCZ5xH_zh7/s400/image+12.png" width="400" /></a></div>
<br />
14. And preview the changes in the preview area below to see how the changes have taken affect...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXcAu3u1tPyzoTRG1eMoHichVpWh2AMqoP5oCqDU-it-AbFSYYWmTifoWCOlsT4unQLofstt3_7cJsimhsYAnakuQLTsCCRpnAJj_lyBMT43inwgp5xmTIPsU2_rTJ2n_cItpUC1jNwwZF/s1600/image+13.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXcAu3u1tPyzoTRG1eMoHichVpWh2AMqoP5oCqDU-it-AbFSYYWmTifoWCOlsT4unQLofstt3_7cJsimhsYAnakuQLTsCCRpnAJj_lyBMT43inwgp5xmTIPsU2_rTJ2n_cItpUC1jNwwZF/s400/image+13.png" width="400" /></a></div>
<br />
15. In the example above it appears the banner has not moved. This is common and you may need to play around with the number a bit until you begin to see the results you're looking for ~ you can see a few examples of making changes in the screen shots below...<br />
<br />
<div style="text-align: center;">
:-----In this example the number is too small so the banner is cut off-----:</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: center;">
<img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfgnbXpUtw7j7ZARFNQEcD2si_yInw4nuUv52cLJyxAKekudWvHIRR3gXA8Q_eE5-qbi_mRQQr9nRrvxHkdZqSjELUnfEgzgHtyFYXz2qwUJHlF8liCyBUhWLrV3MhrFjLKI5it2TFri6D/s400/image+14.png" width="400" /></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
:-----In this example the number is too big so the banner is still sitting to the left-----:</div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNx1ODKTC3VvjLC8tHWLOZ4lH4NZs_jSzGZNmUphZd1kYF2QVsu-cgD6JlVK4wxGU6-di1AiFA85-iwaSyegLwimvjBU7k41jUPZ4a8I_eJFvRqRKaK9RtdvQxBXNMslWKC_T0vTAqLkFA/s1600/image+15.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNx1ODKTC3VvjLC8tHWLOZ4lH4NZs_jSzGZNmUphZd1kYF2QVsu-cgD6JlVK4wxGU6-di1AiFA85-iwaSyegLwimvjBU7k41jUPZ4a8I_eJFvRqRKaK9RtdvQxBXNMslWKC_T0vTAqLkFA/s400/image+15.png" width="400" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
:-----In this example the number is just perfect & the banner is centered-----:</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLeYgFREFJTurxVvbDUf-mlKPcv1gXPdjazjUTp75Acqpgj61L0dsHOlBAcrl9oqGgLm8eU7s7Lp6HJxXz_RD4KwMQ8inynJIQynIzPdi3P76a3bEUDGjV4LZG0bvlT4RFkSMBo5NabYpF/s1600/image+16.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLeYgFREFJTurxVvbDUf-mlKPcv1gXPdjazjUTp75Acqpgj61L0dsHOlBAcrl9oqGgLm8eU7s7Lp6HJxXz_RD4KwMQ8inynJIQynIzPdi3P76a3bEUDGjV4LZG0bvlT4RFkSMBo5NabYpF/s400/image+16.png" width="400" /></a></div>
<div style="text-align: center;">
<br /></div>
<br />
16. Now that you have your banner code in place and the image is situated just where you want it, click the "Apply to Blog" button to save your changes...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzfY6S2t86Ok5_Kzogu2q72FEghIxyAKj8FSbgc7kAxX7ILRWDq3ddnHD_J7rzI5985B2P5IUVq0Benzg2k98-KcRP13aqWU2cG_R0aPemI9x09hQd2jek0NLl6GQ3-LpaM2trnDbePKVW/s1600/image+17.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzfY6S2t86Ok5_Kzogu2q72FEghIxyAKj8FSbgc7kAxX7ILRWDq3ddnHD_J7rzI5985B2P5IUVq0Benzg2k98-KcRP13aqWU2cG_R0aPemI9x09hQd2jek0NLl6GQ3-LpaM2trnDbePKVW/s400/image+17.png" width="400" /></a></div>
<br />
That's it! You can now click on the "View Blog" link to view your blog and centered banner. Remember to use this tutorial in combination with my "<a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-install-blog-header-banner-image.html">How to Install a Blog Header</a>" to find the right adjustments and fit for your own blog.<br />
<br />
Enjoy~<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com13tag:blogger.com,1999:blog-307932083687837946.post-72541737835598480372012-09-17T00:25:00.000-04:002013-02-25T13:15:21.294-05:00How to: Setup a Decorative Blog BackgroundHere are some step-by-step instructions to help you navigate your way to
installing one of my decorative blog backgrounds to your blog. The process is fairly simple and the best part is once done, you can easily change your background whenever you like. <br />
<br />
All of my blog themes are now meant to be used with a modified version of the "Picture Window" template so if you don't have that installed or need help tweaking it you can follow along with this tutorial first: <a href="http://plumroselane-tutorials.blogspot.com/2012/11/how-to-setup-picture-window-template.html" target="_blank">How to: Setup & Adjust the "Picture Window" Template</a>. <br />
<br />
<i><b>Before we begin~</b></i><br />
Within each of my designer blog themes and backgrounds are boxes filled with code...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCiYsfk5_n8ZnEgG6k0RX_FVzOhNFzcEfAkx95rFhcE2YKxpTexKGgm6cro2MxJgKzYbVL4DPv8_OZlrTSlrRXByUtpkRSxc6UzpQmzP-AtLN4q4bQAqYjQRvQWCciAJnKzleTH0gVoK2e/s1600/image.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="274" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCiYsfk5_n8ZnEgG6k0RX_FVzOhNFzcEfAkx95rFhcE2YKxpTexKGgm6cro2MxJgKzYbVL4DPv8_OZlrTSlrRXByUtpkRSxc6UzpQmzP-AtLN4q4bQAqYjQRvQWCciAJnKzleTH0gVoK2e/s320/image.png" width="320" /></a></div>
<br />
This code is what we use to install a decorative background onto our blogs. To begin you will need to select a background you want to uses. You can peruse my library of blog themes and backgrounds by visiting this link: <a href="http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html" target="_blank">http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html</a><br />
<br />
Once you've selected a background you will need to copy the
code and paste it into a temporary location ~ I like using a text document,
such as "Notepad" (Windows users) since it's an easy place to temporarily store a snippet of code or text.<br />
<br />
What's behind this? This
code is used in a sidebar gadget to tell your blog to load a background image and
where to draw that image from. The image itself is stored on a designated location on the internet. <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsmDQfqWUkFDBa-aI5ynoRbRRnrGgvcEGB71cnCnX6K2S4mU53hFwJtzvce1ta8e3E7KSWe1aWWtaURwjeN7iVI9MyYf82oD7HFupj45vVCzhI_8YgNn6HJSAWYhk9t94cLEXqldADIvsP/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsmDQfqWUkFDBa-aI5ynoRbRRnrGgvcEGB71cnCnX6K2S4mU53hFwJtzvce1ta8e3E7KSWe1aWWtaURwjeN7iVI9MyYf82oD7HFupj45vVCzhI_8YgNn6HJSAWYhk9t94cLEXqldADIvsP/s1600/PrL-section_break.png" /></a></div>
<br />
So let's begin...<br />
<br />
Begin by logging into your blog, then click the "Design" link in the top right corner of your blog...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisim3WHNT2RE0XbzlWWpo_AV1sVCIQTgJb49BnEhRcu6yqwqVImDj0h50vMQggmSwnwwKd2WXia-wr7fW59xOfAHGMAkmvtzrETDrKWYOoNpTsoxuV37zvkQAjYN90Ik5sALg0Fvwgnk1V/s1600/image+0.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisim3WHNT2RE0XbzlWWpo_AV1sVCIQTgJb49BnEhRcu6yqwqVImDj0h50vMQggmSwnwwKd2WXia-wr7fW59xOfAHGMAkmvtzrETDrKWYOoNpTsoxuV37zvkQAjYN90Ik5sALg0Fvwgnk1V/s400/image+0.png" width="400" /></a></div>
<br />
<br />
Next click on the "Layout" link in the left side link area...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-H-UWiF9kovH9vQd7j8RFmN6BSmLRQCiaGjlsMHAOPznsn01CvuXBvbiTd5dJ_2l_X-DcT0nwQxO04Gfn3A4z4T5DkzxDMfoz0t_z8jjMp4Yp6WLw_mOjhEWt1n8vHerilrjtXXUl69ag/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-H-UWiF9kovH9vQd7j8RFmN6BSmLRQCiaGjlsMHAOPznsn01CvuXBvbiTd5dJ_2l_X-DcT0nwQxO04Gfn3A4z4T5DkzxDMfoz0t_z8jjMp4Yp6WLw_mOjhEWt1n8vHerilrjtXXUl69ag/s400/image+1.png" width="400" /></a></div>
<br />
In this next screen we can see a type of skeletal version of your blog layout with rectangular boxes representing different aspects of your blog...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLNmRHF6wpAYL6e33xHJuEciIXIwmGn83csIf3Axc_g94rix9J41SiDDeDRwV2A8TvMjgRqDNiGxZdXG_rxXZHlWzH-_GsJAJ9B6IjnfEX22g70IUZsbePiTeu6QIUT2raspAXmvdncxrP/s1600/image+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLNmRHF6wpAYL6e33xHJuEciIXIwmGn83csIf3Axc_g94rix9J41SiDDeDRwV2A8TvMjgRqDNiGxZdXG_rxXZHlWzH-_GsJAJ9B6IjnfEX22g70IUZsbePiTeu6QIUT2raspAXmvdncxrP/s400/image+2.png" width="400" /></a></div>
<br />
I find it easier to store my decorative background code at the bottom of my blog so that it's out of the way and I don't get it confused with others, so let's scroll down to the bottom and click on the "Add a Gadget" link...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg17Q2LJN-uc2drqvHIQAfsaTCUptJxn03NZXIH921N0X8soKHHWK0CVaq1c6Gz4Q629iqy0wS1x-b3TI2pINfM4FBFDoL1yWEFy1v-TeOUEF6QG-MgSqcgK-Ke6cWkw97F90yEtOyxTOJL/s1600/image+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg17Q2LJN-uc2drqvHIQAfsaTCUptJxn03NZXIH921N0X8soKHHWK0CVaq1c6Gz4Q629iqy0wS1x-b3TI2pINfM4FBFDoL1yWEFy1v-TeOUEF6QG-MgSqcgK-Ke6cWkw97F90yEtOyxTOJL/s400/image+3.png" width="400" /></a></div>
<br />
A pop-up window will appear with all the various gadget choices Blogger offers...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcIHJ4X5WPI54Gnig2Vo4Wb8RoARGjPqIOJk_3ZrqEkBGD4fZVgaLqoEEPY-9tc0uDsIte64gCjFtHTDLQ7PbOnN_QKyuOj2uHZp7AcEG5J2-sdYyjETM5jqYEbMH4M3G3aj1yIyTdAYL9/s1600/image+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcIHJ4X5WPI54Gnig2Vo4Wb8RoARGjPqIOJk_3ZrqEkBGD4fZVgaLqoEEPY-9tc0uDsIte64gCjFtHTDLQ7PbOnN_QKyuOj2uHZp7AcEG5J2-sdYyjETM5jqYEbMH4M3G3aj1yIyTdAYL9/s400/image+4.png" width="400" /></a></div>
<br />
We will be using the "Html/Java Script gadget so scroll down to that and select to add it, either by clicking on the title or on the blue + button...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaQZBb1nVGRf3e80EygC_5D59qJYq-4UF4BAN67Mzgm4zlsG0OxOrly24Gja9PSn6mTAhyphenhyphenhg_hZ8pI7qVr2ovdlBPU-LXMNSTS0b9UlMxnwsVTtwpq4dLBaZYZkBAZt4EiY3ElNXUUKjeZ/s1600/image+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaQZBb1nVGRf3e80EygC_5D59qJYq-4UF4BAN67Mzgm4zlsG0OxOrly24Gja9PSn6mTAhyphenhyphenhg_hZ8pI7qVr2ovdlBPU-LXMNSTS0b9UlMxnwsVTtwpq4dLBaZYZkBAZt4EiY3ElNXUUKjeZ/s400/image+5.png" width="400" /></a></div>
<br />
In the next window we see a large empty rectangle under the title "Content"....<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeMoj9ArOTmkGNAoy9G6kpXX2V3dHaQs4M1rjbL8TMExt7BHd4bLtapw-e59AzN0fYRBAouznCc0GBrja_cJ0OdKOHhLlkqPUEKLENNO4-QBxWrIaXCwYmzhvdMzI1k04N82jMV91CciMY/s1600/image+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeMoj9ArOTmkGNAoy9G6kpXX2V3dHaQs4M1rjbL8TMExt7BHd4bLtapw-e59AzN0fYRBAouznCc0GBrja_cJ0OdKOHhLlkqPUEKLENNO4-QBxWrIaXCwYmzhvdMzI1k04N82jMV91CciMY/s400/image+6.png" width="400" /></a></div>
<br />
This is where we will paste in the background code we have saved from earlier. The code may look slightly different that what's show below, depending upon which of my codes you're using, but go ahead and paste the entire code into the box...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKq0AtG6CdWGyIIugUt-jjL0v5ZvvZs3obicXSYLlpXloOHsz4H0hMM-Let7RXH209R3L6brVeSJbK8gJ33Nw8he2OFh0H__-3sJRHKjPWtVbt1byUu2nKFjL-0pDd_WsPfJLBh8dJg3YP/s1600/image+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="219" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKq0AtG6CdWGyIIugUt-jjL0v5ZvvZs3obicXSYLlpXloOHsz4H0hMM-Let7RXH209R3L6brVeSJbK8gJ33Nw8he2OFh0H__-3sJRHKjPWtVbt1byUu2nKFjL-0pDd_WsPfJLBh8dJg3YP/s320/image+7.png" width="320" /></a></div>
<br />
Once you have your code in place you can click the "Save" button...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyzJzBFB2Kk_OxyA-CBCOfUrTTIm_dZ2JvRgFikFylETAJ8aBSFzKEGkd84luJ9ui-yz4YWCtGbBI7sZjVrj_2lUqZEouW-R5taz1dkQSC8yD4SWbrLSrkAEPst7a-uo7goRTApXyMn20S/s1600/image+8.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyzJzBFB2Kk_OxyA-CBCOfUrTTIm_dZ2JvRgFikFylETAJ8aBSFzKEGkd84luJ9ui-yz4YWCtGbBI7sZjVrj_2lUqZEouW-R5taz1dkQSC8yD4SWbrLSrkAEPst7a-uo7goRTApXyMn20S/s400/image+8.png" width="400" /></a></div>
<br />
That's it! You can now check your new blog background by clicking on the "View Blog" button at the top...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitpBHo1XHMzZjlDXjd1-6cWWclu1w8s7toS_T-Nb-uq85uSwcbY36OzHAX6yuA3XJj4mcIugjjt1RYwQ4fiVXp4j1_aI00RMLN8iRx6vJ_L4EeVmMkvq7-tr7G3AePEWFjUqKfnVGKBQnF/s1600/image+9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitpBHo1XHMzZjlDXjd1-6cWWclu1w8s7toS_T-Nb-uq85uSwcbY36OzHAX6yuA3XJj4mcIugjjt1RYwQ4fiVXp4j1_aI00RMLN8iRx6vJ_L4EeVmMkvq7-tr7G3AePEWFjUqKfnVGKBQnF/s400/image+9.png" width="400" /></a></div>
<br />
♫Ta-da!♪<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZXPomV-SyS4t2YtCglknO1K-bCNi9Mg1BbU64MckUVur1stB1g7N4wdJHxiExCgnsq-8_LzujHy1sKVOwP0QrBAC2nCyUdfFNQ4hB8uTs5GttbNDzHTBNoCCifjh9uclGBoOG2cs0sIJ/s1600/image+10.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZXPomV-SyS4t2YtCglknO1K-bCNi9Mg1BbU64MckUVur1stB1g7N4wdJHxiExCgnsq-8_LzujHy1sKVOwP0QrBAC2nCyUdfFNQ4hB8uTs5GttbNDzHTBNoCCifjh9uclGBoOG2cs0sIJ/s400/image+10.png" width="400" /></a></div>
<br />
You now possess the knowledge to change your blog background whenever the mood (or season) strikes you ~ Congratulations! <br />
<br />
Enjoy~<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com21tag:blogger.com,1999:blog-307932083687837946.post-32455482072694716562012-09-16T17:07:00.002-04:002013-03-21T17:26:34.394-04:00How to Add a Post SignatureIf you're looking to add a decorative signature to your blog posts this tutorial is for you. Basically we'll be installing a snippet of code so that a signature image will automatically show up each time you write a new blog post. This saves you the step of manually inserting a signature image with each posting.<br />
<br />
<span style="font-weight: bold;">Before we begin:</span> You will
need a signature image - preferably a PNG with a clear
background so that any color background show through. You can
either create an image using a graphics program like <a href="http://www.gimp.org/downloads/" target="_blank">Gimp</a> or <a href="http://www.adobe.com/products/photoshop.html" target="_blank">Photoshop</a> or you can purchase a signature image from a designer like those I offer in my <a href="https://www.etsy.com/listing/60922204/blog-signature-image-custom-order" target="_blank">Etsy shop</a>.<br />
<br />
If you make your own you will need to host the image with an online image storage company like <a href="http://photobucket.com/" target="_blank">Photobucket</a> which will supply you with a direct link to the image. This link will be used in combination with some Html code so that your signature shows up with each blog post. Note that when you purchase a signature from a designer, most will host the image for you and supply you with the completed code.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQxMMtyoAZDc0wdsgOfi4LXAHJFCr2e4g5pGMzUcH44UDz80GcnE4VE6hbEJHVJOuIHHCn8qavW6_RpnogjslNpKxNy8wEcJ3gpkJ_671awurtm85fPmxbeGi6y-kAIbr61f2hG91MnVKc/s1600/PrL-section_break.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQxMMtyoAZDc0wdsgOfi4LXAHJFCr2e4g5pGMzUcH44UDz80GcnE4VE6hbEJHVJOuIHHCn8qavW6_RpnogjslNpKxNy8wEcJ3gpkJ_671awurtm85fPmxbeGi6y-kAIbr61f2hG91MnVKc/s1600/PrL-section_break.png" /></a></div>
<br />
Now that you have a link to your signature image, let's begin...<br />
<br />
1. Begin by logging into your blog, then click "Design" link found in the top right corner of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0wJsKvW4_e0-t51JribiKsruF6heh4_TB3e8NP_LR8MJRfXC0OI2eYWYgJWqA7suVui9a_EdrUKWc1NxSbbtIIH8RJaEJFmkH_pWXJTpVCdbcfutHsr_SYReaKGBgJIq4j6HzQirw0Lno/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="237" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0wJsKvW4_e0-t51JribiKsruF6heh4_TB3e8NP_LR8MJRfXC0OI2eYWYgJWqA7suVui9a_EdrUKWc1NxSbbtIIH8RJaEJFmkH_pWXJTpVCdbcfutHsr_SYReaKGBgJIq4j6HzQirw0Lno/s400/image+1.png" width="400" /></a></div>
<br />
2. Next click on the "Settings" link in the left side link area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnaFd3dR9n9dh4xBVWuqE9UYuNBf90RHudpJaKOfX9jJ6fyHo-ZvR_eXi5N7omnLZEtdLVijKQ8cFJ6Y1KVekomL33hyTHCKI76AXtwd__ZC7ZysejUjFaXg_nsC3_CO4iC2ofJ-hq2Rdj/s1600/image+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnaFd3dR9n9dh4xBVWuqE9UYuNBf90RHudpJaKOfX9jJ6fyHo-ZvR_eXi5N7omnLZEtdLVijKQ8cFJ6Y1KVekomL33hyTHCKI76AXtwd__ZC7ZysejUjFaXg_nsC3_CO4iC2ofJ-hq2Rdj/s400/image+2.png" width="400" /></a></div>
<br />
3. Now click on the "Posts and comments" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCHFWKGR55218eQOX9PBK4Y1bUhKJAVotmgTxisGQThQvfJtz3JQQ11JLuPHw0GHTlDZMS51FrxeKT5O6mclN5Xx_ayhX4h8quuO8T2T7utwEcjoUOQWLBaNoy4YkvbxyFo0qD4UaCPYpa/s1600/image+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCHFWKGR55218eQOX9PBK4Y1bUhKJAVotmgTxisGQThQvfJtz3JQQ11JLuPHw0GHTlDZMS51FrxeKT5O6mclN5Xx_ayhX4h8quuO8T2T7utwEcjoUOQWLBaNoy4YkvbxyFo0qD4UaCPYpa/s400/image+3.png" width="400" /></a></div>
<br />
4. Within this section, locate the second option down "Post Template" and click on the "Add" link...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirMqrgQQBiQ07ZUMEZU_U3ijxQaVklsrNxro9bUcE4RrJvf_d8y7SnRIOxaeqNMj10ocQeE-WVyyoFPW9a2cdF5-JKyMl6ci3Ccrj1sneJV-oXQpAdGGUi9FuKgwa7vtF4QnpxkJX0n-O2/s1600/image+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirMqrgQQBiQ07ZUMEZU_U3ijxQaVklsrNxro9bUcE4RrJvf_d8y7SnRIOxaeqNMj10ocQeE-WVyyoFPW9a2cdF5-JKyMl6ci3Ccrj1sneJV-oXQpAdGGUi9FuKgwa7vtF4QnpxkJX0n-O2/s400/image+4.png" width="400" /></a></div>
<br />
A rectangular area will appear, this is where you'll insert the Html code for your image signature.<br />
<br />
5. Copy the code below and paste it into the box...<br />
<center>
<textarea cols="20" id="code-source" name="code-source" rows="5"><p>
<image class="centered" alt="post signature" src="SIGNATURE URL"></image></p>
</textarea></center>
<br />
6. The box should now look like this...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt3GBC9Rj84raY3ZZzvi8MTDS7txq_6x2jVcFA1GCBuBZ9F-2Kr-fjcBP-ZJER5De-hXcX25xPQEPEN7rXr3kqsT3AbudPLmHUK0_Bs-hqTTiHDyR5BFo1J05Qlf7tDn2HhFCpJ06AdkcP/s1600/image+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="91" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt3GBC9Rj84raY3ZZzvi8MTDS7txq_6x2jVcFA1GCBuBZ9F-2Kr-fjcBP-ZJER5De-hXcX25xPQEPEN7rXr3kqsT3AbudPLmHUK0_Bs-hqTTiHDyR5BFo1J05Qlf7tDn2HhFCpJ06AdkcP/s400/image+6.png" width="400" /></a></div>
<br />
7. Then replace the words "SIGNATURE URL" with the address of where your
own signature image is stored. I'll insert mine in the example below...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-CQhqmysNXHFMsyoetHg-7N0nBplwZHbCCZ3QM98twnQxQY_WcTtBQgM3SaQm_7GMIkQ6TOfWR2zUpz2iOlhNtbQ-B1Awuyns0C1-Ld5laY23pfGy3y7nBGD_sl9S29Fn0gnkDD7SuWzY/s1600/image+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="91" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-CQhqmysNXHFMsyoetHg-7N0nBplwZHbCCZ3QM98twnQxQY_WcTtBQgM3SaQm_7GMIkQ6TOfWR2zUpz2iOlhNtbQ-B1Awuyns0C1-Ld5laY23pfGy3y7nBGD_sl9S29Fn0gnkDD7SuWzY/s400/image+7.png" width="400" /></a></div>
<br />
8. With you own link now inserted into the code, you can now save your changes by clicking the "Save settings" button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJz92Pw-ET39gADhl1SI2Sv_8c0zdb1lJc-VLastpjAB6A_CpZJQ-RMWjHnAm7-TA7RBZ4ONXcl4nhVAQ38N9F2q-8o6Q7aD5LTXaiQGUwnK7gvoAimH-rHVF1tsceKl7JlBHBl5dRXA-i/s1600/image+8.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJz92Pw-ET39gADhl1SI2Sv_8c0zdb1lJc-VLastpjAB6A_CpZJQ-RMWjHnAm7-TA7RBZ4ONXcl4nhVAQ38N9F2q-8o6Q7aD5LTXaiQGUwnK7gvoAimH-rHVF1tsceKl7JlBHBl5dRXA-i/s400/image+8.png" width="400" /></a></div>
<br />
9. Your signature image will now appear the next time you go to write a new blog post. To confirm that your signature image is correctly installed you can click the "New Post" button to open the new post screen...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRJLBCoJT40gJmtXHCXanVIKJYCXGi6IQpKnAIZdFeDkbv_rkv-DIxcrUmlMaCGrwdxmx3FMyzRZBGeYPM887C7XGIYtcqN0zAx8YWKnzAAwlSm4emHw6jJ4L9yBxANE1-lOyJUTvxYgu0/s1600/image+11.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRJLBCoJT40gJmtXHCXanVIKJYCXGi6IQpKnAIZdFeDkbv_rkv-DIxcrUmlMaCGrwdxmx3FMyzRZBGeYPM887C7XGIYtcqN0zAx8YWKnzAAwlSm4emHw6jJ4L9yBxANE1-lOyJUTvxYgu0/s400/image+11.png" width="400" /></a></div>
<br />
10. There your signature image should appear just as mine can be seen below... <br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx_qBl4TqYaFpk-8Mp2msU8NsBYUbuFZFrCVXz-qxTVc27GEgnJykoL7bi4yGuQT9d-UhLcb0P7hMh_ldsVV6GzlXKWPQAKKJ7uppUOzTDqbb1k4VrkEinUH69rTTfHOv4m9-44kutu2gp/s1600/image+9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx_qBl4TqYaFpk-8Mp2msU8NsBYUbuFZFrCVXz-qxTVc27GEgnJykoL7bi4yGuQT9d-UhLcb0P7hMh_ldsVV6GzlXKWPQAKKJ7uppUOzTDqbb1k4VrkEinUH69rTTfHOv4m9-44kutu2gp/s400/image+9.png" width="400" /></a></div>
<br />
11. If instead you see a broken image symbol...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji6h5dwFD3KzCP20afhZWPuZcAvCMN3SxQ7mR5DrTM1GFE1Q_eO_x_bpA-pGjZXL8lyUy-uTc8UgA35KIsCMPjsMd2a7X2BWqvBFpnPDeh_cKd9X8Z8vc7OZVUmHDXhRv7eBrN63_53Nlw/s1600/image+10.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji6h5dwFD3KzCP20afhZWPuZcAvCMN3SxQ7mR5DrTM1GFE1Q_eO_x_bpA-pGjZXL8lyUy-uTc8UgA35KIsCMPjsMd2a7X2BWqvBFpnPDeh_cKd9X8Z8vc7OZVUmHDXhRv7eBrN63_53Nlw/s1600/image+10.png" /></a></div>
<br />
then the link to your image may not be installed properly. You'll need to return to the "Posts and comments" area and double check each character to be sure the link is correct and none of the code was accidentally left out.<br />
<br />
Because the signature image was installed today, it will not appear in any previously written blog posts. If you would like to manually add an image signature to a specific blog post then follow the steps below. If you're happy with the results so far then, Congratulations!<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: center;">
<br /></div>
<i><b>Special Note</b></i>: At the time I am writing this, Blogger is currently experiencing a technical difficulty with displaying post signatures and preset signatures are showing up as a broken link. If you are experiencing this issue then for the moment you will need to manually install your image signature in individual blog posts which is covered below.<br />
<br />
<b><i>Manually adding a signature image~</i></b><br />
To manually add an image signature to a blog posts follow the steps below.<br />
<br />
1. Picking up directly from where we left off, click on the "View blog" link at the top of the page...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRJLBCoJT40gJmtXHCXanVIKJYCXGi6IQpKnAIZdFeDkbv_rkv-DIxcrUmlMaCGrwdxmx3FMyzRZBGeYPM887C7XGIYtcqN0zAx8YWKnzAAwlSm4emHw6jJ4L9yBxANE1-lOyJUTvxYgu0/s1600/image+11.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRJLBCoJT40gJmtXHCXanVIKJYCXGi6IQpKnAIZdFeDkbv_rkv-DIxcrUmlMaCGrwdxmx3FMyzRZBGeYPM887C7XGIYtcqN0zAx8YWKnzAAwlSm4emHw6jJ4L9yBxANE1-lOyJUTvxYgu0/s400/image+11.png" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56ghpNROY06gGqZS04Qu2XaDzYE3HdRLPBgwfUNkDsIwxx9_qZT_18qPK4794iT9_SZpwhV9ND_03yCMjl6fyPwq0kyMRkGKIdWs1zFPQmWXCFgkVDJj4Qus4IVkgx293YAEERHf6AV7M/s1600/image+12.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
2. Click you mouse within the box area and then click on the "Insert image" symbol...
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56ghpNROY06gGqZS04Qu2XaDzYE3HdRLPBgwfUNkDsIwxx9_qZT_18qPK4794iT9_SZpwhV9ND_03yCMjl6fyPwq0kyMRkGKIdWs1zFPQmWXCFgkVDJj4Qus4IVkgx293YAEERHf6AV7M/s1600/image+12.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56ghpNROY06gGqZS04Qu2XaDzYE3HdRLPBgwfUNkDsIwxx9_qZT_18qPK4794iT9_SZpwhV9ND_03yCMjl6fyPwq0kyMRkGKIdWs1zFPQmWXCFgkVDJj4Qus4IVkgx293YAEERHf6AV7M/s1600/image+12.png" /></a></div>
<br />
3. A pop-up window will appear, click on the "Choose files" button...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXdDCtSG1DhfNFTJtzNeJBZr6m3Aziy9pG_J5P0VEfBn8q5F5ck1z0791Md632h5RH3g4_VBJT42tafVKRIrRM55Xdk9UEPiYe0muylSA_i51K6YFpKUIf9c9DoTU3vatDxEO2d0YMkbKj/s1600/image+13.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXdDCtSG1DhfNFTJtzNeJBZr6m3Aziy9pG_J5P0VEfBn8q5F5ck1z0791Md632h5RH3g4_VBJT42tafVKRIrRM55Xdk9UEPiYe0muylSA_i51K6YFpKUIf9c9DoTU3vatDxEO2d0YMkbKj/s320/image+13.png" width="320" /></a></div>
<br />
4. Navigate to where you have your signature image saved, click on the image and then click...
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikRdDUT2XTxQWbl3_HftnLaCw6204VM-lrA4ikWo8LzMmChOPGMIscOdR4haHSow-yRE81LiudWD1393WL9sp9LgwSu0DaCcj7DwIMFcLGZXHuV9zxVYOuqClC_NhNpE9ZmzUt6R3TkoDY/s1600/image+14.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikRdDUT2XTxQWbl3_HftnLaCw6204VM-lrA4ikWo8LzMmChOPGMIscOdR4haHSow-yRE81LiudWD1393WL9sp9LgwSu0DaCcj7DwIMFcLGZXHuV9zxVYOuqClC_NhNpE9ZmzUt6R3TkoDY/s320/image+14.png" width="320" /></a></div>
<br />
5. In the next view click on the "Add selected" button...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOjxRRhhjk02WwcWcxJ-nYfD3yQ_j1bPiMJX6mCC6HZmWN4WIVa-f4R3PMO2SEAwUPAPb47LYhnDO7obM9HEodcmqYozXMXttrp93B0XtSZUbB7fw6cGk8BmNXolKyaI94KYMIUQVZAKiV/s1600/image+15.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOjxRRhhjk02WwcWcxJ-nYfD3yQ_j1bPiMJX6mCC6HZmWN4WIVa-f4R3PMO2SEAwUPAPb47LYhnDO7obM9HEodcmqYozXMXttrp93B0XtSZUbB7fw6cGk8BmNXolKyaI94KYMIUQVZAKiV/s400/image+15.png" width="400" /></a></div>
<br />
6. You should now see your signature image inserted into your post...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcP7_jGTeI1nqHAuyWnRc8eqQximrEr7THoBwOOrV4-L5EqJskSSLsLK7zal0VqSHTnc3aaYaYwSIp_A69WPgQAT0tWYRBHtk4nAJNpmiFU12OBk8MBQOOY3E-7JespNZw20IQfFbx8Tdl/s1600/image+16.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcP7_jGTeI1nqHAuyWnRc8eqQximrEr7THoBwOOrV4-L5EqJskSSLsLK7zal0VqSHTnc3aaYaYwSIp_A69WPgQAT0tWYRBHtk4nAJNpmiFU12OBk8MBQOOY3E-7JespNZw20IQfFbx8Tdl/s400/image+16.png" width="400" /></a></div>
<br />
7. If you want to change the location of your signature, simply click on the image and an option bar will appear....<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfZ0_nK7IVlIgce4h8gYSkA_eYTNzucbNf9fwn6KuWmVfsyBESefIqvKaSj_3mhZQQ1Z7hmdXOosv7T6Kkl-DBK6eVgWjKNCkqd71psX2dES8fFhioS4rO8Gb7aSWbdBxhswSFOydrvWrp/s1600/image+17.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfZ0_nK7IVlIgce4h8gYSkA_eYTNzucbNf9fwn6KuWmVfsyBESefIqvKaSj_3mhZQQ1Z7hmdXOosv7T6Kkl-DBK6eVgWjKNCkqd71psX2dES8fFhioS4rO8Gb7aSWbdBxhswSFOydrvWrp/s320/image+17.png" width="320" /></a></div>
<br />
8. Select where you would like your signature to appear and you image will move to that location... <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinzTWa1Z_ufoDwIXHOo7uaCz47F58ANQr3gpsXE8PegjEnaICW5lXT_qZK7GUvEg1iPNzSpCh27B5ilUvvsrjPfVtQGqwGUPvOpNjudslNGB-HeZx5BvA9uElAZs2v3eqLtfm7uf84SGZa/s1600/image+18.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinzTWa1Z_ufoDwIXHOo7uaCz47F58ANQr3gpsXE8PegjEnaICW5lXT_qZK7GUvEg1iPNzSpCh27B5ilUvvsrjPfVtQGqwGUPvOpNjudslNGB-HeZx5BvA9uElAZs2v3eqLtfm7uf84SGZa/s320/image+18.png" width="320" /></a></div>
<br />
That's it! Once you've completed writing your blog post you can click either the "Save" or "Publish" button to continue.<br />
<br />
Congratulations!<br />
<br />
Enjoy~<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com4tag:blogger.com,1999:blog-307932083687837946.post-61888658467617370332012-09-11T17:44:00.001-04:002013-01-12T19:15:54.775-05:00How to: Install a Blog Header (Banner Image)The information below will help you understand the "header" feature of
your blog, allow you to make modifications to this area, and enable you
to upload a decorative banner image to your blog.<br />
<br />
<span style="font-weight: bold;">{<span style="font-style: italic;">Before you begin: </span></span><span style="font-style: italic;">You
should have a banner image already saved on your computer. You can
download a free one or purchase one through an online boutique or
website. Here is <a href="http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html" target="_blank">a link</a> to my own designer themes where you'll find a selection of free and low cost banners.</span><br />
<br style="font-style: italic;" />
<span style="font-style: italic;">Be
sure to save your banner in an easy to find location so you can locate
it in the future. I like to save mine in a folder and title the folder
"blog images"</span>.<span style="font-weight: bold;">}</span><br />
<br />
1. Begin by logging into your blog, then click "Design" link found in the top right corner of your blog...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir1sWnl7irHMti2xh6D1ugOFO8dWun5VN1lTb_JmPzQsIaZihWMhxZsNwdRw99ERGSmgqABA-rwA9rfXLPI6_YNL1et3WMQsrpdza_IsopFR_2WsHOEYtaxLEvPcboluHse5-n1z6yWTcI/s1600/image+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="227" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir1sWnl7irHMti2xh6D1ugOFO8dWun5VN1lTb_JmPzQsIaZihWMhxZsNwdRw99ERGSmgqABA-rwA9rfXLPI6_YNL1et3WMQsrpdza_IsopFR_2WsHOEYtaxLEvPcboluHse5-n1z6yWTcI/s400/image+1.png" width="400" /></a></div>
<br />
2. Next click on the "Layout" link in the left side link area...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnUYqda2voRBtnFZ8av4xtXJ0Msi1or9b9BpSf5FRPTil6RgpUSH4ZAIGmKJBVYDc5WR6AhSvAdpcTWNBrhXMqG0IYkX5dcNEOQhYHSo-jOcCVbUqk_tDj99hSniWfzvGWpkkrTsIQVgMj/s1600/image+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnUYqda2voRBtnFZ8av4xtXJ0Msi1or9b9BpSf5FRPTil6RgpUSH4ZAIGmKJBVYDc5WR6AhSvAdpcTWNBrhXMqG0IYkX5dcNEOQhYHSo-jOcCVbUqk_tDj99hSniWfzvGWpkkrTsIQVgMj/s400/image+2.png" width="400" /></a></div>
<br />
3. In the next view look for the area with your blog title immediately followed by "(Header)", then click on the blue "Edit" link within this frame...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEe5YG-v5ssGoxrtCKiX-mhzkh7Jo0M6qMYL2DlmsX3ZSXKQSS3ZzGSmV6OKjPzjqM-MGgJRbZjL8kZ_Toku9JzQCNOHVgGN0xlilPgRSdXxCSzZ1oV95t-PFk8Xt9GmZ4-zTlY-14DQhV/s1600/image+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEe5YG-v5ssGoxrtCKiX-mhzkh7Jo0M6qMYL2DlmsX3ZSXKQSS3ZzGSmV6OKjPzjqM-MGgJRbZjL8kZ_Toku9JzQCNOHVgGN0xlilPgRSdXxCSzZ1oV95t-PFk8Xt9GmZ4-zTlY-14DQhV/s400/image+3.png" width="400" /></a></div>
<br />
4. A pop-up window will appear. Let's go through the list of items you'll see so can get to know this area of your blog...<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc7EI-vQFHHYoUfVNeeAvkAmJb5fXqE7UA3oOZ9qbRdxfYIxQP2-86JHVWmBe6RqdNvwl6n3XRp4QJwfTyRbh1HS3zjGLepSz6-PLnUjIe4BPRAbMQNs_GC2aUIcuMq0t5UncwEKwy_o7U/s1600/image+1.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472014804959650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc7EI-vQFHHYoUfVNeeAvkAmJb5fXqE7UA3oOZ9qbRdxfYIxQP2-86JHVWmBe6RqdNvwl6n3XRp4QJwfTyRbh1HS3zjGLepSz6-PLnUjIe4BPRAbMQNs_GC2aUIcuMq0t5UncwEKwy_o7U/s400/image+1.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
4. a. In the first and second rectangles you can change the name of your blog and it’s description…<br />
<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-qQy1fm29o14HD3jt2hOF5SkOHZJcXzo8Im7yRK9jSHf9PV79n2oYfm_wDTqLdMr9PctgMZX7fiZ_kru5tnO1qIXylEQJ84Rbm4_-Zau6zk10_bsZNWPPyhVZy8e6iXyMZyRpUoZxmLNJ/s1600/Image+1a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472016843166274" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-qQy1fm29o14HD3jt2hOF5SkOHZJcXzo8Im7yRK9jSHf9PV79n2oYfm_wDTqLdMr9PctgMZX7fiZ_kru5tnO1qIXylEQJ84Rbm4_-Zau6zk10_bsZNWPPyhVZy8e6iXyMZyRpUoZxmLNJ/s400/Image+1a.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<i>If you’re using a decorative blog header you won’t need to worry about including anything in this area since the information will be included on your banner image, unless you would like a description of your blog to appear directly under your blog header.</i><br />
<br />
4. b. The next area is where you can upload a banner image from your computer… <br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCTSfi1zL4uAwXK9HlJN54XMncUr12vBhRYHSw9sn2Jxb4Tnb0kxWG4CkSV2OIHKb_beN4gCGCAW8ATmclYD_jGsTlRu7tCxXl26QeV29HSTWJGRtHt5QQCJ7p4IQak7OfTMnOLOf0RRbh/s1600/Image+1b.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472022496549394" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCTSfi1zL4uAwXK9HlJN54XMncUr12vBhRYHSw9sn2Jxb4Tnb0kxWG4CkSV2OIHKb_beN4gCGCAW8ATmclYD_jGsTlRu7tCxXl26QeV29HSTWJGRtHt5QQCJ7p4IQak7OfTMnOLOf0RRbh/s400/Image+1b.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
4. c. Below that is where you can add your banner from an online location by inserting a link…<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjVD2h2NW0MAAR81ysDNf4j2NcNbBj8yJAcbgUkhtsVnWisHRZbwDvhjrASSqh9pTfHkuxlX7JiSfOWIbwi70QfuZ6tLZVx87oPXz9EBs3olB5UzkyRtyy9I4Dah4u8L88ZsdbdjzC11kg/s1600/Image+1b-2.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755473757075656258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjVD2h2NW0MAAR81ysDNf4j2NcNbBj8yJAcbgUkhtsVnWisHRZbwDvhjrASSqh9pTfHkuxlX7JiSfOWIbwi70QfuZ6tLZVx87oPXz9EBs3olB5UzkyRtyy9I4Dah4u8L88ZsdbdjzC11kg/s400/Image+1b-2.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
4. d. Next is the “Placement” area where you can select to have your description or blog title show up in combination with using a banner image…<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWSK1lHoPUDFCXMYb1-G9CdID596b9cvCmo2rQqLKXqG72HGwSPI1eUbNj6mb3OpkXX9J0C5ng3kX7SaSLqeMbC6iVzFZ3DAAFn1tBb7dGnVatHZ3l5smrKtXeFsIRQ0p0dRE-V4ZUYz2/s1600/Image+1d.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472035701508434" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWSK1lHoPUDFCXMYb1-G9CdID596b9cvCmo2rQqLKXqG72HGwSPI1eUbNj6mb3OpkXX9J0C5ng3kX7SaSLqeMbC6iVzFZ3DAAFn1tBb7dGnVatHZ3l5smrKtXeFsIRQ0p0dRE-V4ZUYz2/s400/Image+1d.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
4. e. Just below that area is the option to shrink the banner image to fit your blog’s layout…<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQkbS-Phqv4HUTpjrx9X-Y2UX9eaICRb811Wb9GJVh4x4skL_teEd5p3Fk9DS8OM-DJkgnOJ_l5dNx8f11xCUTdjkQItDftyjT4YHC4sVnbM29PtOkzXrO1xawalRuN7o6yO2Eglg6cS3u/s1600/Image+1c.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472030481905122" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQkbS-Phqv4HUTpjrx9X-Y2UX9eaICRb811Wb9GJVh4x4skL_teEd5p3Fk9DS8OM-DJkgnOJ_l5dNx8f11xCUTdjkQItDftyjT4YHC4sVnbM29PtOkzXrO1xawalRuN7o6yO2Eglg6cS3u/s400/Image+1c.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<i>This is helpful if you're planning on using a larger image and don't have the ability to resize the image by using a computer program.</i><br />
<br />
4. f. Just below that, in tiny print, is where you’ll see the size of your current header area based on what template you’re using and how you have that set up…<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd8FWi_Q03AUP-edT-IVaS-fmbcZ1pEt8P4WazNRbmsmRZVMAbzOsSWC6oALgIX4FrnFhPVEuYkdIT2Mc3_83wppFB7ca76-h1TloVYtiHRhY0M2hkz53ROQPhRI3c82O3RrPD7ed9MBFe/s1600/Image+1f.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474348162318210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd8FWi_Q03AUP-edT-IVaS-fmbcZ1pEt8P4WazNRbmsmRZVMAbzOsSWC6oALgIX4FrnFhPVEuYkdIT2Mc3_83wppFB7ca76-h1TloVYtiHRhY0M2hkz53ROQPhRI3c82O3RrPD7ed9MBFe/s400/Image+1f.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
4. g. And finally at the very bottom are the “Save” and “Cancel” buttons…<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSS_VH0fyehBmWMwJHywUaQiYx-5lu8GLjOA-T1_Ejv2QD-fUypf6fB1rAL_QNZ2KjJ7uequ9Sb2N8Stml7otmzIpyPt6Nnqdxzap_ulR-C4tOPSB2FsnRgsPnMV4ikxIzb4GOT4KwfgZG/s1600/Image+1g.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474354621901474" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSS_VH0fyehBmWMwJHywUaQiYx-5lu8GLjOA-T1_Ejv2QD-fUypf6fB1rAL_QNZ2KjJ7uequ9Sb2N8Stml7otmzIpyPt6Nnqdxzap_ulR-C4tOPSB2FsnRgsPnMV4ikxIzb4GOT4KwfgZG/s400/Image+1g.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<i>Now that you understand all of the features and options for the Header area, let’s install a custom blog header image and make a few selections to be sure it looks it’s best.</i><br />
<br />
5. We'll begin by choosing whether to click the "Shrink to Fit" option. This choice is only available <i>before </i>you upload your image but if you find you need to change the option you can simply remove the image and reload it again. So for this example we're going to click on the square to select this option…<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1e9JU8dgp0cJ5VDV_tSA4mDjV8zI6HbVmzkSFMPTbYzkt0xsEAX-2wv1_Jn98Ovl6V2hQXcIdmbKq4k9Hc5shtq3PXdiIvvzcWC9vwIaMnrrNAs1buqgDmN8yOTf-2b636qZRC8g2XPwR/s1600/Image+2.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474358223800306" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1e9JU8dgp0cJ5VDV_tSA4mDjV8zI6HbVmzkSFMPTbYzkt0xsEAX-2wv1_Jn98Ovl6V2hQXcIdmbKq4k9Hc5shtq3PXdiIvvzcWC9vwIaMnrrNAs1buqgDmN8yOTf-2b636qZRC8g2XPwR/s400/Image+2.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
<br />
6. Next, we’ll upload the banner image ~ to do this click on the “Browse” button...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqw0dZh2fK9x0wVnNnP-mEYaJ4F2oT-6IboY1OxKsyWAxDrKuXcP_UEVrzlh48yIag2kV_4jP4-bQaV8yhw1qdCQiLdzBFxZpna64LqilA8HXLjfszYpzBiq2AZJ-XhXT-vCSbIvD7PWbv/s1600/image+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqw0dZh2fK9x0wVnNnP-mEYaJ4F2oT-6IboY1OxKsyWAxDrKuXcP_UEVrzlh48yIag2kV_4jP4-bQaV8yhw1qdCQiLdzBFxZpna64LqilA8HXLjfszYpzBiq2AZJ-XhXT-vCSbIvD7PWbv/s400/image+4.png" width="400" /></a></div>
<br />
7. Now navigate to where you have your banner image saved, click on the image and<br />
then click the “Open” button…<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij9n46KwB0UmLJdJv2xuvh-X1mUqIdnVkxmfVMY0Z-KYM7opKH_iIWC5CxXXGHt0eh9b6VAemd8GmjEYaZB8RY0Rk3zWUcX2EVJrLWSZe4Wl_FuICeeQGItb5alSbhn_qcNpVjPwm5BeOV/s1600/image+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij9n46KwB0UmLJdJv2xuvh-X1mUqIdnVkxmfVMY0Z-KYM7opKH_iIWC5CxXXGHt0eh9b6VAemd8GmjEYaZB8RY0Rk3zWUcX2EVJrLWSZe4Wl_FuICeeQGItb5alSbhn_qcNpVjPwm5BeOV/s400/image+5.png" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9VmfxRLv0458Xi-v3D89bxX8iLrluo-lEf2CaGcXj2vHFDrvbA-58zo2dUPt5RpP8mwwBYEA_MHO5GwfBFCbsGA2lK25-_pK6Jc2djqynbUUK0e4_3sVWIgjvjqzj47JBw2pkbwbP_HXJ/s1600/image+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br /></a></div>
8. Your banner image will appear in the window and you can now click "Save"...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSywYsUEO6oJjeX5QwN5Uucr9LydbKd4PflFFocic7uKbSwX4zZJNr2ZMO7pyvThgrZyFsTqJ3Izw-ZRFJoUG37Rtnmb8-M7YpsOfqdPwNMqpraxx2Xi2eCaVkbE2FFKz-5e2KJNLr0qv7/s1600/image+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSywYsUEO6oJjeX5QwN5Uucr9LydbKd4PflFFocic7uKbSwX4zZJNr2ZMO7pyvThgrZyFsTqJ3Izw-ZRFJoUG37Rtnmb8-M7YpsOfqdPwNMqpraxx2Xi2eCaVkbE2FFKz-5e2KJNLr0qv7/s400/image+6.png" width="400" /></a><a href="http://www.blogger.com/blogger.g?blogID=307932083687837946" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a><a href="http://www.blogger.com/blogger.g?blogID=307932083687837946" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a><a href="http://www.blogger.com/blogger.g?blogID=307932083687837946" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<br />
9. You have now successfully installed a custom blog banner to your blog. To view your new banner simply click the "View blog" button at the top of the page...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif1Ysb-T6QVR3CvPOiU4CYtzEjV9AQIMW7YGBR9R0fKaaQK0Y8PCQggk8lhPgnnM2NguAGdObz7SbhoTq-Sj_BGWCI5Odsk39eqRLkr757vTEkjZvhLmJXn7LvekM8TtkGCZOp8HsmIFVA/s1600/image+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif1Ysb-T6QVR3CvPOiU4CYtzEjV9AQIMW7YGBR9R0fKaaQK0Y8PCQggk8lhPgnnM2NguAGdObz7SbhoTq-Sj_BGWCI5Odsk39eqRLkr757vTEkjZvhLmJXn7LvekM8TtkGCZOp8HsmIFVA/s400/image+7.png" width="400" /></a></div>
<br />
Congratulations! If you find that your header looks off center or misplaced then please refer to my <a href="http://plumroselane-tutorials.blogspot.com/2012/09/how-to-center-blog-header.html">How to Center a Blog Header</a> tutorial.<br />
<br />
Enjoy~Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com3tag:blogger.com,1999:blog-307932083687837946.post-22287606361252607232012-06-18T16:05:00.008-04:002012-11-17T17:19:05.949-05:00How to: Install a Decorative Blog Header - updatedThe information below will help you understand the "header" feature of your blog, allow you to make modifications to this area, and enable you to upload a decorative banner image to your blog.<br />
<span style="font-weight: bold;">{<span style="font-style: italic;">Before you begin: </span></span><span style="font-style: italic;">You should have a banner image already saved on your computer. You can download a free one or purchase one through an online boutique or website. Here is </span><a href="http://plumroselane-accessories.blogspot.com/2010/08/blog-headers.html" style="font-style: italic;">a link</a><span style="font-style: italic;"> to a selection I offer through my blog and for sale in my shop.</span><br />
<br style="font-style: italic;" />
<span style="font-style: italic;">Be sure to save your banner in an easy to find location so you can locate it in the future. I like to save mine in a folder and title the folder "blog images"</span>.<span style="font-weight: bold;">}</span><br />
<br />
Begin by logging into your blog, then click "Design" found in the top right corner of your blog or navigate to the "Design" tab.<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5d-76wREkitSBiplhTzx4-ZNRU6UVsqFPsOeCt7IflZ8X9PXlK1A4K5aczoROoCejDxR6E7P5ixmVLAgPr5Czxg3uGvoDjeAWJE_27J_oy3tPmJJxdYJ-SrIYi-BE4rgGgWJmMe6jCgFS/s1600/image1a.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5494212898065551170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5d-76wREkitSBiplhTzx4-ZNRU6UVsqFPsOeCt7IflZ8X9PXlK1A4K5aczoROoCejDxR6E7P5ixmVLAgPr5Czxg3uGvoDjeAWJE_27J_oy3tPmJJxdYJ-SrIYi-BE4rgGgWJmMe6jCgFS/s320/image1a.png" style="cursor: pointer; display: block; height: 196px; margin: 0px auto 10px; text-align: center; width: 320px;" /></a><br />
Then click on the "Edit" button found in the header section.<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCQcoyZe3EXoDI5EtoX9SMfDZzHISS3kfo3WDuLYtCQZGM6XyezookVNeqVCjLAfMdtpVCPQnVCNnHSuHfNMn5EqNGQ3gt3ASTEVJZDF-EVTxl3c-WZiV7RQwgFixVYF1i9uj_5yP39VE/s1600-h/installing+banners3.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5424472737962288354" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCQcoyZe3EXoDI5EtoX9SMfDZzHISS3kfo3WDuLYtCQZGM6XyezookVNeqVCjLAfMdtpVCPQnVCNnHSuHfNMn5EqNGQ3gt3ASTEVJZDF-EVTxl3c-WZiV7RQwgFixVYF1i9uj_5yP39VE/s320/installing+banners3.png" style="cursor: pointer; display: block; height: 254px; margin: 0px auto 10px; text-align: center; width: 320px;" /></a><br />
A pop-up window will open showing you a number of options.<br />
So let's go through the list of items you'll see...<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc7EI-vQFHHYoUfVNeeAvkAmJb5fXqE7UA3oOZ9qbRdxfYIxQP2-86JHVWmBe6RqdNvwl6n3XRp4QJwfTyRbh1HS3zjGLepSz6-PLnUjIe4BPRAbMQNs_GC2aUIcuMq0t5UncwEKwy_o7U/s1600/image+1.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472014804959650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc7EI-vQFHHYoUfVNeeAvkAmJb5fXqE7UA3oOZ9qbRdxfYIxQP2-86JHVWmBe6RqdNvwl6n3XRp4QJwfTyRbh1HS3zjGLepSz6-PLnUjIe4BPRAbMQNs_GC2aUIcuMq0t5UncwEKwy_o7U/s400/image+1.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
In the first and second rectangles you can change the name of your blog and<br />
it’s description…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-qQy1fm29o14HD3jt2hOF5SkOHZJcXzo8Im7yRK9jSHf9PV79n2oYfm_wDTqLdMr9PctgMZX7fiZ_kru5tnO1qIXylEQJ84Rbm4_-Zau6zk10_bsZNWPPyhVZy8e6iXyMZyRpUoZxmLNJ/s1600/Image+1a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472016843166274" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-qQy1fm29o14HD3jt2hOF5SkOHZJcXzo8Im7yRK9jSHf9PV79n2oYfm_wDTqLdMr9PctgMZX7fiZ_kru5tnO1qIXylEQJ84Rbm4_-Zau6zk10_bsZNWPPyhVZy8e6iXyMZyRpUoZxmLNJ/s400/Image+1a.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
If you’re using a decorative blog header you won’t need to worry about this area,<br />
unless you want to have the description to up under your blog header.<br />
The next area is where you can upload a banner image from your computer…<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCTSfi1zL4uAwXK9HlJN54XMncUr12vBhRYHSw9sn2Jxb4Tnb0kxWG4CkSV2OIHKb_beN4gCGCAW8ATmclYD_jGsTlRu7tCxXl26QeV29HSTWJGRtHt5QQCJ7p4IQak7OfTMnOLOf0RRbh/s1600/Image+1b.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472022496549394" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCTSfi1zL4uAwXK9HlJN54XMncUr12vBhRYHSw9sn2Jxb4Tnb0kxWG4CkSV2OIHKb_beN4gCGCAW8ATmclYD_jGsTlRu7tCxXl26QeV29HSTWJGRtHt5QQCJ7p4IQak7OfTMnOLOf0RRbh/s400/Image+1b.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
In the next area you can select to add your banner from an online location by<br />
inserting a link…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjVD2h2NW0MAAR81ysDNf4j2NcNbBj8yJAcbgUkhtsVnWisHRZbwDvhjrASSqh9pTfHkuxlX7JiSfOWIbwi70QfuZ6tLZVx87oPXz9EBs3olB5UzkyRtyy9I4Dah4u8L88ZsdbdjzC11kg/s1600/Image+1b-2.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755473757075656258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjVD2h2NW0MAAR81ysDNf4j2NcNbBj8yJAcbgUkhtsVnWisHRZbwDvhjrASSqh9pTfHkuxlX7JiSfOWIbwi70QfuZ6tLZVx87oPXz9EBs3olB5UzkyRtyy9I4Dah4u8L88ZsdbdjzC11kg/s400/Image+1b-2.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Next is the “Placement” area where you can select to have your description<br />
or blog title show up in combination with using a banner image…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWSK1lHoPUDFCXMYb1-G9CdID596b9cvCmo2rQqLKXqG72HGwSPI1eUbNj6mb3OpkXX9J0C5ng3kX7SaSLqeMbC6iVzFZ3DAAFn1tBb7dGnVatHZ3l5smrKtXeFsIRQ0p0dRE-V4ZUYz2/s1600/Image+1d.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472035701508434" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWSK1lHoPUDFCXMYb1-G9CdID596b9cvCmo2rQqLKXqG72HGwSPI1eUbNj6mb3OpkXX9J0C5ng3kX7SaSLqeMbC6iVzFZ3DAAFn1tBb7dGnVatHZ3l5smrKtXeFsIRQ0p0dRE-V4ZUYz2/s400/Image+1d.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Just below that area is the option to shrink the banner image to fit your blog’s layout…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQkbS-Phqv4HUTpjrx9X-Y2UX9eaICRb811Wb9GJVh4x4skL_teEd5p3Fk9DS8OM-DJkgnOJ_l5dNx8f11xCUTdjkQItDftyjT4YHC4sVnbM29PtOkzXrO1xawalRuN7o6yO2Eglg6cS3u/s1600/Image+1c.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755472030481905122" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQkbS-Phqv4HUTpjrx9X-Y2UX9eaICRb811Wb9GJVh4x4skL_teEd5p3Fk9DS8OM-DJkgnOJ_l5dNx8f11xCUTdjkQItDftyjT4YHC4sVnbM29PtOkzXrO1xawalRuN7o6yO2Eglg6cS3u/s400/Image+1c.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Just below that, in tiny print, is where you’ll see the size of your current header<br />
based on what template you’re using and how it’s set up…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd8FWi_Q03AUP-edT-IVaS-fmbcZ1pEt8P4WazNRbmsmRZVMAbzOsSWC6oALgIX4FrnFhPVEuYkdIT2Mc3_83wppFB7ca76-h1TloVYtiHRhY0M2hkz53ROQPhRI3c82O3RrPD7ed9MBFe/s1600/Image+1f.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474348162318210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd8FWi_Q03AUP-edT-IVaS-fmbcZ1pEt8P4WazNRbmsmRZVMAbzOsSWC6oALgIX4FrnFhPVEuYkdIT2Mc3_83wppFB7ca76-h1TloVYtiHRhY0M2hkz53ROQPhRI3c82O3RrPD7ed9MBFe/s400/Image+1f.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
And finally at the very bottom are the “Save” and “Cancel” buttons…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSS_VH0fyehBmWMwJHywUaQiYx-5lu8GLjOA-T1_Ejv2QD-fUypf6fB1rAL_QNZ2KjJ7uequ9Sb2N8Stml7otmzIpyPt6Nnqdxzap_ulR-C4tOPSB2FsnRgsPnMV4ikxIzb4GOT4KwfgZG/s1600/Image+1g.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474354621901474" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSS_VH0fyehBmWMwJHywUaQiYx-5lu8GLjOA-T1_Ejv2QD-fUypf6fB1rAL_QNZ2KjJ7uequ9Sb2N8Stml7otmzIpyPt6Nnqdxzap_ulR-C4tOPSB2FsnRgsPnMV4ikxIzb4GOT4KwfgZG/s400/Image+1g.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Now that you understand all of the features and options for the Header area,<br />
Let’s install a custom blog header image and make a few selections to be sure it<br />
looks it’s best.<br />
You’ll need to begin by selecting the “Shrink to Fit” option since this is only<br />
available before you upload your banner image, so click on the square to<br />
select this option…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1e9JU8dgp0cJ5VDV_tSA4mDjV8zI6HbVmzkSFMPTbYzkt0xsEAX-2wv1_Jn98Ovl6V2hQXcIdmbKq4k9Hc5shtq3PXdiIvvzcWC9vwIaMnrrNAs1buqgDmN8yOTf-2b636qZRC8g2XPwR/s1600/Image+2.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474358223800306" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1e9JU8dgp0cJ5VDV_tSA4mDjV8zI6HbVmzkSFMPTbYzkt0xsEAX-2wv1_Jn98Ovl6V2hQXcIdmbKq4k9Hc5shtq3PXdiIvvzcWC9vwIaMnrrNAs1buqgDmN8yOTf-2b636qZRC8g2XPwR/s400/Image+2.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
It’s important to select to shrink your banner so that the image shows up completely<br />
and is not cut off ~ even if the banner image is the exact size the width of your header<br />
it doesn’t hurt to shrink the image as it will simply show up in it’s full size.<br />
Next, we’ll upload the banner image so click on the “Browse” button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgULvyr3CnRUCv7roEYIadRF5Imw3CbsjVlCUOMCYix7Es_iy-tenz4xIncuuLoj6o-37jX4KcFvPJBgk5WkUGJ7XYZoZWJ2N5u5EU1AwayV0wgZoLyQaWOH0r03U5OZrqPtAwnmMXj2b7u/s1600/Image+2a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474362826219314" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgULvyr3CnRUCv7roEYIadRF5Imw3CbsjVlCUOMCYix7Es_iy-tenz4xIncuuLoj6o-37jX4KcFvPJBgk5WkUGJ7XYZoZWJ2N5u5EU1AwayV0wgZoLyQaWOH0r03U5OZrqPtAwnmMXj2b7u/s400/Image+2a.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Now navigate to where you have your image saved, click on the image name, and<br />
then click the “Open” button…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqofMh7bMGhdmrbPqoef05fkCCFPKDOfcReQYdkqH2bQ2HK15mZZ9WJnEzlk5rBWMacWsvTo_lq7LceSnyimcmC-0aXD1jdB6_rzJTgnoSI79SBm4SePYhjZcJ2DQJgCgi4r8PbY-aMfpV/s1600/Image+2b.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755474366007208242" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqofMh7bMGhdmrbPqoef05fkCCFPKDOfcReQYdkqH2bQ2HK15mZZ9WJnEzlk5rBWMacWsvTo_lq7LceSnyimcmC-0aXD1jdB6_rzJTgnoSI79SBm4SePYhjZcJ2DQJgCgi4r8PbY-aMfpV/s400/Image+2b.png" style="cursor: hand; cursor: pointer; display: block; height: 358px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
You can now select whether you would like a description of your blog to show up<br />
under the image or if you would just like the image to appear with nothing else….<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKuZLyUQ0vGW0ArRj84bjiWpiP6P3zHCnMjtynH01fSkeQDL0aJdrFCHt2SIUUjtEFgF3nO-wer6sbmGHvLtyqjsSoj1Q525K8bSwDJJp1DEJ9noAKyOM7uK0fLpaimz43yTFSxhJrD0Xj/s1600/image+3.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755476653976232786" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKuZLyUQ0vGW0ArRj84bjiWpiP6P3zHCnMjtynH01fSkeQDL0aJdrFCHt2SIUUjtEFgF3nO-wer6sbmGHvLtyqjsSoj1Q525K8bSwDJJp1DEJ9noAKyOM7uK0fLpaimz43yTFSxhJrD0Xj/s400/image+3.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Once you’ve made your selection click the “Save” button to save your image…<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRjBjEl4Qi-QNdcAwhtvGE8OFy1tQW-wcAvrUO3ASFR5IE25GO2EQdPF3MjHkyEJTViLpnj3kfK_S3fdZ19HnKQig_3m-OUko_k9nqvFo-YKn5QSkVUA_ZqD_kaOrw5BqOhoYccKLS77d1/s1600/image+4.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5755476657800333186" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRjBjEl4Qi-QNdcAwhtvGE8OFy1tQW-wcAvrUO3ASFR5IE25GO2EQdPF3MjHkyEJTViLpnj3kfK_S3fdZ19HnKQig_3m-OUko_k9nqvFo-YKn5QSkVUA_ZqD_kaOrw5BqOhoYccKLS77d1/s400/image+4.png" style="cursor: hand; cursor: pointer; display: block; height: 400px; margin: 0px auto 10px; text-align: center; width: 299px;" /></a><br />
Congratulations! Your new header is now in place and you have a working knowledge<br />
of this area you can change your banner image out whenever you like.<br />
<br />
Enjoy!Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comtag:blogger.com,1999:blog-307932083687837946.post-39676766821251480082012-05-25T22:45:00.002-04:002012-11-17T17:19:22.119-05:00Blogging TutorialsWhether you're looking for help with starting a new blog or just want to make your existing blog 'pretty' you've come to the right place. While I can never profess to being a guru, I am able to pass along my knowledge and help new bloggers get to know their way around blogland. My original prefab themes are some of the prettiest you'll find and my step-by-step tutorials are meant to empower the novice blogger by teaching them how to set up their blog in as few steps as possible with the least amount of headaches. If you're looking for more in-depth tutorials, please see the smattering of resources I use myself under the "Designer Tools" section in my sidebar.<br />
<span style="color: #dd007a; font-weight: bold;">Recent Blogger Changes</span>~<br />
Blogger has recently undergone some <b><i>major </i></b>changes and those of us who design custom blog themes have been scrambling to rewrite the library of tutorials we've published to help bloggers. Because of these changes you may find that you're using one of two Blogger interfaces ~ the old interface appears with a blue band running across the top...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfeYODrbnbGsGEMVR4gnOP77No4LKlnCnsO2sMUY5pdGydj5QPc_OBNhxvXpJG30ztdQ1H8Ojv_uOP6auPmATU57aVXyGfqLVQz2DtM5o4dIpqw0BnLnPauLE5FXGZ4j1w5OLpxx_EpXH-/s1600/screenshot-1.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="288" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfeYODrbnbGsGEMVR4gnOP77No4LKlnCnsO2sMUY5pdGydj5QPc_OBNhxvXpJG30ztdQ1H8Ojv_uOP6auPmATU57aVXyGfqLVQz2DtM5o4dIpqw0BnLnPauLE5FXGZ4j1w5OLpxx_EpXH-/s400/screenshot-1.jpg" width="400" /></a></div>
<div style="text-align: center;">
Old Blogger Interface</div>
While the new interface appears with a smattering of orange and mostly white area...<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimHKLXsBJIWy61j0tsPTAIOKqkxtN-n0aTM2T7klRrAVycdm0aUwmL5fOHYRvDHxBPE5tXREHEpMCqbTE2dRxBGPROZQs0FtKMLSkH61a9HVO1R-dowHVaIwudCmETyop5Fap9iruKI3WE/s1600/screenshot-2.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="283" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimHKLXsBJIWy61j0tsPTAIOKqkxtN-n0aTM2T7klRrAVycdm0aUwmL5fOHYRvDHxBPE5tXREHEpMCqbTE2dRxBGPROZQs0FtKMLSkH61a9HVO1R-dowHVaIwudCmETyop5Fap9iruKI3WE/s400/screenshot-2.jpg" width="400" /></a></div>
<div style="text-align: center;">
New Blogger Interface</div>
I am currently in the process of rewriting the collection of tutorials to address the new interface so you can look for the title below to be a working link very shortly.<br />
<span style="font-weight: bold;">Getting to Know the Blogger Interface</span> ~ <span style="font-style: italic;">coming soon!</span><br />
At this time Blogger currently offers the ability to <span style="font-style: italic;">revert back</span> to the 'old' user interface but this ability will probably go away sometime before the end of April 2012. I do encourage you to take advantage of this option, as long as it is available, if you want to use the nearly endless supply of creative original themes made by me and the plethora of other wonderful designers out there. And so I recommend beginning with the following tutorial...<br />
<div style="font-family: Georgia,";">
<br />
<b><span style="font-size: 100%; font-style: italic;">Before you begin... </span></b><br />
<br />
✻<a href="http://plumroselane-tutorials.blogspot.com/2012/01/blogger-interface-how-to-revert-back.html" style="font-weight: bold;">How to: Revert Back to the Old Blogger Interface</a><br />
<span style="font-size: 85%;"><span style="font-weight: bold;">Note:</span> I'm in the process of updating all of my tutorials for the new Blogger interface but in the meantime you can still use the tutorials below by reverting back to the old Blogger interface. In truth it's the easiest and most stable way to go as Blogger continues to work out the bugs of it's new Blogger Interface. </span><br />
<br />
Now that you're using the old and dare I say easier Blogger interface, I recommend moving onto to reading this brief <span style="font-style: italic;">explanation</span> about <span style="font-weight: bold;">templates and themes</span> ~ it helps to understand the basics behind setting up a designer theme and let's face it, that's why you're here, isn't it?! So now let's move on to...<br />
<br />
✻<a href="http://plumroselane-tutorials.blogspot.com/2011/10/understanding-basic-blog-design-issues.html" style="font-weight: bold;">Understanding Basic Blog Design Issues ~ Q&A</a><br />
<br />
Now that you have a little more knowledge under you're belt, you're ready to move on to making your own blog truly 'yours' with some fabulous theme elements. You can always find a complete list of my theme elements by visiting the "<a href="http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html"><span style="font-weight: bold;">Themes</span></a>" section and there are more fabulous add-ons to be found in the "<a href="http://plumroselane-accessories.blogspot.com/2010/01/blogging-extras.html"><span style="font-weight: bold;">Elements</span></a>" section.<br />
<br />
If you find you're not quite sure how to navigate your way around your blog yet then you may wish to skip down to the "Getting Started with Blogging" section first, which covers topics like writing your first blog post and working with pages. If you're ready to just dig in and make everything fabulous then let's begin with...<br />
<br />
<b><span style="font-size: 100%; font-style: italic;"><span style="color: #cc0000;">New Tutorial~</span></span></b><span style="font-size: 100%; font-style: italic;">This tutorial is the first in a long line of new tutorials I'm working on which use the Blogger "Template Designer". This new blogger tool is a fun user friendly design tool for personalizing your own blog. So dig in and give a try with...</span><b><span style="font-size: 100%; font-style: italic;"><br /></span></b><b><span style="font-size: 100%; font-style: italic;"><span style="color: #cc0000;">New! </span></span></b><a href="http://plumroselane-tutorials.blogspot.com/2012/05/how-to-use-simple-template-with.html"><b><span style="font-size: 100%; font-style: italic;"><span style="color: #cc0000;"></span></span></b></a><b style="color: #cc0000;"><span style="font-size: 100%; font-style: italic;"><a href="http://plumroselane-tutorials.blogspot.com/2012/05/how-to-use-simple-template-with.html">How to: Use the "Simple" Template with Designer Themes</a></span></b><br />
<br />
<span style="font-size: 130%;"><b></b></span><span style="font-size: 130%;"><b>Decorative Themes & Add-ons</b></span></div>
<div style="font-family: Georgia,";">
<span style="font-size: 85%;"> </span><b><span style="font-size: 100%; font-style: italic;">Essentials:<br /><span style="color: #cc0000;"></span></span></b></div>
<div style="font-family: Georgia,";">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-change-to-minima-template.html" style="font-weight: bold;">How to: Change to a Minima Template</a></div>
<div face="Georgia,"" style="font-weight: bold;">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-install-decorative-blog.html">How to: Install a Decorative Blog Background</a></div>
<div face="Georgia,"" style="font-weight: bold;">
<a href="http://plumroselane-tutorials.blogspot.com/2012/06/how-to-install-decorative-blog-header.html"><span style="color: #dd007a;"></span>How to: Install a Blog Header/Banner</a><span style="color: #dd007a;">✻</span><a href="http://plumroselane-tutorials.blogspot.com/2012/06/how-to-install-decorative-blog-header.html"><span style="color: #dd007a;"></span></a> </div>
<div style="font-family: Georgia,";">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-install-decorative-sidebar.html" style="font-weight: bold;">How to: Install Sidebar Tags</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-install-decorative-sidebar_06.html" style="font-weight: bold;">How to: Install a Sidebar Button/Badge</a> - copying html codes<br />
<a href="http://plumroselane-tutorials.blogspot.com/2012/03/how-to-add-favicon-icon.html" style="font-weight: bold;">How to: Add a Favicon to Your Blog</a></div>
<div style="font-family: Georgia,";">
<br /></div>
<div style="font-family: Georgia,";">
<b> <span style="font-style: italic;">Beyond Basics:</span></b><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-erase-pesky-lines-around-images.html" style="font-weight: bold;">How to: Erase Pesky Lines - </a><a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-erase-pesky-lines-around-images.html" style="font-weight: bold;">Around Images</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/08/how-to-add-signature.html" style="font-weight: bold;">How to: Add a Signature to Blog Posts</a></div>
<div face="Georgia,"" style="font-weight: bold;">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-setup-three-column-blog-layout.html">Setting Up a 3 Column Layout</a><br />
<br />
<a href="http://plumroselane-tutorials.blogspot.com/2011/04/how-to-add-post-divider.html" style="font-weight: bold;">How to: Add a Post Divider</a> - decorative dividing image</div>
<div style="font-family: Georgia,";">
<br />
<span style="font-size: 130%;"><b>Getting Started with Blogging</b></span><b><br /></b><b style="font-style: italic;">Basics:</b> <br />
<div style="font-family: Georgia,";">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-setup-blog.html" style="color: #336600; font-weight: bold;">How to: Setup a Blog</a> - on Blogger<br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-write-blog-post.html" style="color: #336600; font-weight: bold;">How to: Write a Blog Post</a> - includes adding images and links<br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/11/working-with-titles-labels.html" style="color: #336600; font-weight: bold;">Working with Titles & Labels</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2011/02/how-to-keep-it-clear-using-clear.html" style="color: #336600; font-weight: bold;">How to: Keep it Clear</a> - using clear background images<br />
<br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/10/how-to-set-up-edit-your-blogger-profle.html" style="color: #336600; font-weight: bold;">How to: Setup & Edit Your Blogger Profile</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2011/01/basics-of-following-followers.html" style="color: #336600; font-weight: bold;">The Basics of "Following" & "Followers"</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/11/how-to-control-spam-comments-report.html" style="color: #336600; font-weight: bold;">How to: Control Spam Comments & Report Blog Spammers</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2011/01/how-to-add-email-address-to-image-link.html" style="color: #336600; font-weight: bold;">How to: Add an Email Link to a Sidebar Image</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-create-pages.html" style="color: #336600; font-weight: bold;">How to: Work with "Pages"</a><a href="http://plumroselane.blogspot.com/2010/05/creating-pages.html" style="font-weight: bold;"><br /></a><br />
<b>Beyond Basics:</b><a href="http://plumroselane-tutorials.blogspot.com/2010/08/how-to-setup-blog-feed-for-feedburner.html" style="font-weight: bold;"><br /><span style="color: #336600;">How to: Setup a Feed for Your Blog (Feedburner)</span></a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-setup-subscribe-button-for-your.html" style="color: #336600; font-weight: bold;">How to: Setup a Subscribe Button</a> - for your blog feed</div>
<div style="font-family: Georgia,";">
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-add-google-analytics-to-your.html" style="color: #336600; font-weight: bold;">How to: Setup Google Analytics for Your Blog</a> - collecting statistical data for your blog<br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-link-your-blog-posts-to-your.html" style="color: #336600; font-weight: bold;">How to: Link Your Blog to Your Twitter Feed</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2011/04/setting-up-mobil-viewing-on-your-blog.html" style="color: #336600; font-weight: bold;">How to: Set up Mobile Viewing for Your Blog</a><br />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/how-to-link-your-blog-posts-to-your.html" style="color: #336600; font-weight: bold;"></a><b style="color: #336600;"></b><br style="color: #336600;" />
<a href="http://plumroselane-tutorials.blogspot.com/2010/01/adding-guest-author-to-your-blog.html" style="color: #330066; font-weight: bold;">Adding an Author (Guest User) to Your Blog</a></div>
<br />
<span style="color: #dd007a;">✻<span style="color: black;">This symbol indicates the tutorial has been updated to include screenshots from the new Blogger interface.</span></span><br />
<br />
Most of my tutorials are written for those who are not comfortable with computers and the internet - they are meant to be a literal step-by-step instruction. </div>
<div face="Georgia,"">
<br /></div>
<div face="Georgia,"">
Please help me, help you... if you find any broken links or errors I would love to hear from you so I can repair them. More tutorials will be added to this list as I create them.<br />
<br />
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEindF9hb7LDWnXZryKX92wh_LCO2tUE4V3DTYzU6hWl1EPH4U5xhOFRcDOZIs66fQd9B_usEuKB0Oh4d270g4UOU91UB4n8dGNa8sFhzLLLJPmEbrfhNkNB7h1Q7291CSC5Zuy3yP31cba-/s1600/PrL+separator.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5524216952289192050" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEindF9hb7LDWnXZryKX92wh_LCO2tUE4V3DTYzU6hWl1EPH4U5xhOFRcDOZIs66fQd9B_usEuKB0Oh4d270g4UOU91UB4n8dGNa8sFhzLLLJPmEbrfhNkNB7h1Q7291CSC5Zuy3yP31cba-/s400/PrL+separator.png" style="cursor: pointer; display: block; height: 50px; margin: 0px auto 10px; text-align: center; width: 171px;" /></a><br />
<span style="font-weight: bold;"><span style="font-size: 130%;"></span></span><br />
<span style="font-style: italic; font-weight: bold;">Now all of my </span><span style="font-style: italic; font-weight: bold;">tutorials </span><span style="font-style: italic; font-weight: bold;">in one fabulous package</span> <span style="font-style: italic; font-weight: bold;">for one low price</span><br />
<div style="text-align: center;">
<a href="http://www.etsy.com/shop/PlumroseLane?section_id=6681012"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5524210000465776466" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHZEsszrUShAWwjWK1F4RCfYz3H-_wQjSaEHroAjdydRP9KoxY7L5EuPRN50SXx3apsVTWNkICSoqXFKSKHdqVoSNTgMS00KYs1lRY6En7uIMpAS_9a8l1swzbnmncntPcSVgQI0FWO8a2/s400/PrL_Blogging_Tutorials_clear+back+image-+sm.png" style="cursor: pointer; display: block; height: 200px; margin: 0px auto 10px; text-align: center; width: 200px;" /></a></div>
<br />
$10.95 buys the complete set of <span style="font-weight: bold;">digital </span>tutorials<br />
all 25 tutorials in PDF format ~ including my exclusive three part series<br />
<br />
<span style="font-weight: bold;">"How to Create Your Own Blog Background"</span><br />
Click the book above to purchase from my Etsy shop...</div>
</div>
<br />
<br />
<div face="Georgia,"">
<div style="text-align: center;">
<span style="font-size: 130%;"><span style="font-weight: bold;">Need more help with your blog?</span></span></div>
<div style="text-align: center;">
<span style="font-weight: bold;">I'm happy to lend a hand!</span><br />
Click on the image below for more info...<br />
<br />
<a href="http://www.plumroselane.com/2010/04/helping-hand_03.html" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5524215526677877058" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisQe7XkNT0P8x7bZ7leUHwu7FQKDSyAAzVtm2SLzodhz_b3yM3XfPNQFx8ucxdL8lx5XTkF6cYRW7p7A1mKShZ9OUgRzaAWNAJdTyoGmW9Fw5rEwKuW10SNmARRwxe91JwcXK5hBLKJ4DS/s400/PrL-helping+hand.png" style="cursor: pointer; display: block; height: 148px; margin: 0px auto 10px; text-align: center; width: 200px;" /></a><br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1ffR9dCvjDI0qOPFR3tSRUNVP8nJX5nXbrgJWKGDP5d1NOC7t2fSxWOqlYg8R-XTXMvWr162zhoXbDZsZ5b8eHd-T_O_bE5qdTNqKfYuJzLgBmRVoPlE3_9P8vwfrVYUnnlrXZXMRQEWx/s1600/PrL+separator.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5524214878696166386" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1ffR9dCvjDI0qOPFR3tSRUNVP8nJX5nXbrgJWKGDP5d1NOC7t2fSxWOqlYg8R-XTXMvWr162zhoXbDZsZ5b8eHd-T_O_bE5qdTNqKfYuJzLgBmRVoPlE3_9P8vwfrVYUnnlrXZXMRQEWx/s400/PrL+separator.png" style="cursor: pointer; display: block; height: 50px; margin: 0px auto 10px; text-align: center; width: 171px;" /></a></div>
</div>
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comtag:blogger.com,1999:blog-307932083687837946.post-88669667673180516752012-05-25T22:00:00.000-04:002012-11-17T17:19:33.922-05:00How To: Use the Simple Template with Designer ThemesThis tutorial will cover how to install the Blogger "Simple" template as a platform for using Designer Themes like those offered in the <a href="http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html" style="font-weight: bold;">Themes</a> section of my site. This tutorial will cover using the Blogger "Template Designer" and some html code to achieve a clean background template.<br />
<br />
The tutorial images are based on using the old Blogger interface ~ if you wish to revert back to this interface to follow along with this tutorial then you can do so by clicking here: <a href="http://plumroselane-tutorials.blogspot.com/2012/01/blogger-interface-how-to-revert-back.html">How to: Revert Back to the Old Blogger Interface</a><br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn1uEHE4kHrAxlQpICqLd5zWR44TLfK8kmt_ijE_W9bNZrlTdDIrCpBeN1o_YrjuDOL5Y_PkmB6mHkLgNYXjd1HesEuQD23P5aX_pTd9oKskQg9J9MtnhedJ0Fw7Od-G7zN-MXVYdx5uSG/s1600/PrL-rectangle.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745824944361549746" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn1uEHE4kHrAxlQpICqLd5zWR44TLfK8kmt_ijE_W9bNZrlTdDIrCpBeN1o_YrjuDOL5Y_PkmB6mHkLgNYXjd1HesEuQD23P5aX_pTd9oKskQg9J9MtnhedJ0Fw7Od-G7zN-MXVYdx5uSG/s400/PrL-rectangle.png" style="cursor: hand; cursor: pointer; float: right; height: 22px; margin: 0 0 10px 10px; width: 44px;" /></a><span style="font-style: italic; font-weight: bold;">A tip</span> ~ through out my tutorials you'll find a selection of images, many of which appear to be blurry. This is to draw attention to the areas of focus which are usually outlined with a pink rectangle like that show to the right.<br />
<span style="color: #dd007a; font-style: italic; font-weight: bold;">Special note:</span> As with all of my tutorials, if you need to view a larger version of the example image simply click on the image to enlarge. Then click the "X" to return to the tutorial.<br />
Now, let's begin...<br />
First, log into your blog and click on the "Design" link at the top right on your blog...<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnuHHPovLnN4-QdxW5fUht3Ry3KUNaPzu6HoUlmX3fF0hr8VuNbbNu_tFTLU3fc1795J5ZTa6IkmlAIB6GQyK8G_8aa0s_9nNInVC6yz_8DyhuwFcUK3ampKvJ0LXO6lgXquIVImabT0pp/s1600/image+1.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745825128044337234" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnuHHPovLnN4-QdxW5fUht3Ry3KUNaPzu6HoUlmX3fF0hr8VuNbbNu_tFTLU3fc1795J5ZTa6IkmlAIB6GQyK8G_8aa0s_9nNInVC6yz_8DyhuwFcUK3ampKvJ0LXO6lgXquIVImabT0pp/s400/image+1.png" style="cursor: hand; cursor: pointer; display: block; height: 216px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Next, you'll see the "Design" tab, click on the "Template Designer" link...<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9SArrQe6IsDhotb0m7i-z1wsCxkpqtghzN1gcxLbRTSgYJtUriWX0jm8wTVh9QN5VeXfbOJowe_wrzsLHpTMMWwZ7JQWMZwbys2nEfzy5w0xzILZzC84XGDI7o4Qpuv7G4F3wdqwE-ANM/s1600/image+2.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745826799936865474" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9SArrQe6IsDhotb0m7i-z1wsCxkpqtghzN1gcxLbRTSgYJtUriWX0jm8wTVh9QN5VeXfbOJowe_wrzsLHpTMMWwZ7JQWMZwbys2nEfzy5w0xzILZzC84XGDI7o4Qpuv7G4F3wdqwE-ANM/s400/image+2.png" style="cursor: hand; cursor: pointer; display: block; height: 216px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
In the next view you'll see a selection of template choices at the top...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJzMJ0nHUX0RVEUaO4YyikDCvDVVrNG7uyYjtQD5mrfkJy0plWDcg0WnJ2x9tDYlWBWIXy4EA-3kLuk77rfZDtfTn64c1UN5wFA8RBO_ZfiQVbevWu5apZO43wKeo58P5Zb7rWZ1JK1oaw/s1600/image+3a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745834039448540146" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJzMJ0nHUX0RVEUaO4YyikDCvDVVrNG7uyYjtQD5mrfkJy0plWDcg0WnJ2x9tDYlWBWIXy4EA-3kLuk77rfZDtfTn64c1UN5wFA8RBO_ZfiQVbevWu5apZO43wKeo58P5Zb7rWZ1JK1oaw/s400/image+3a.png" style="cursor: hand; cursor: pointer; display: block; height: 216px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
and a screen shot of your current blog theme and layout below...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFMDKUuCu1CTpUkmSeS33dGhN8SZ6ZyYzqpxmzwgbsYPKGIWHuJIpIjNO0hka6t_cUqdhZ478Kngd6R_nQNrFM0U-Gdv-b4w4CzSir368wxPbImpxlCEnPdkvtn3kSNTFx9qpZWtUQQdnA/s1600/image+4a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745834046950986402" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFMDKUuCu1CTpUkmSeS33dGhN8SZ6ZyYzqpxmzwgbsYPKGIWHuJIpIjNO0hka6t_cUqdhZ478Kngd6R_nQNrFM0U-Gdv-b4w4CzSir368wxPbImpxlCEnPdkvtn3kSNTFx9qpZWtUQQdnA/s400/image+4a.png" style="cursor: hand; cursor: pointer; display: block; height: 216px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
We'll be focusing on the "Simple" template since this is the easiest to alter for using designer themes like the ones I offer here at Plumrose Lane...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKzC28QJbA7XfL_EQmsVsIumh_vybGtPoou1IBL1xdi24aJbS89NY-sxXijCkd5ibvrtKzDNFAaCwq6nmoba80EBquHeUrYA8KnMBkqBD5AIASqvgD0x_eUjtOMQ03og2Fs-OS7_sMh5Xm/s1600/image+5a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745835548080881410" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKzC28QJbA7XfL_EQmsVsIumh_vybGtPoou1IBL1xdi24aJbS89NY-sxXijCkd5ibvrtKzDNFAaCwq6nmoba80EBquHeUrYA8KnMBkqBD5AIASqvgD0x_eUjtOMQ03og2Fs-OS7_sMh5Xm/s400/image+5a.png" style="cursor: hand; cursor: pointer; display: block; height: 216px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<br />
<span style="color: #dd007a; font-style: italic; font-weight: bold;">Before we begin: </span>Through working the Template Designer I've found that selecting various templates, one on top of the other, can often leave snippets of code and glitches from previous templates. For this reason it's important to take note of the phrase just below the example templates ~ the one that says "You've customized this template: Remove customization". If this phrase does not appear then you may skip this step and continue on below however if this phrase appears, go ahead and click the "Remove customization"... <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbUv9rn0zGvWhy9zpKlicDJzmNasiFe7NYoz_hGh4ZFujecAH0h51AFna38pFMOg0Z4AHn0PqPZtxPdQ7HO97wX8ZB11JyLkVXKWkAuzpTHIM_5-FoKS2U3784vL6VS_wVRZ_Y7o919B9J/s1600/image+6.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745837238886164978" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbUv9rn0zGvWhy9zpKlicDJzmNasiFe7NYoz_hGh4ZFujecAH0h51AFna38pFMOg0Z4AHn0PqPZtxPdQ7HO97wX8ZB11JyLkVXKWkAuzpTHIM_5-FoKS2U3784vL6VS_wVRZ_Y7o919B9J/s400/image+6.png" style="cursor: hand; cursor: pointer; display: block; height: 282px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
This will clear any previous settings and in a sense allow you to begin with a clean slate. However, please note, if you click on this option <span style="font-style: italic;">after </span>working on your template it will reset <span style="font-style: italic;">all </span>of the changes you've made so be careful when choosing this option after continuing on with the following steps.<br />
Now moving on....<br />
To begin, we'll be using the first choice in the "Simple" template lineup so click on the blue and white image...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVD6OXFcR4X44-XI91-I3gahFDPpBlJrBGyaGQM1A5w5QXlqx0ECEarDL_mUcziQGUxDKA6atNHZRhUY1cY4bjTWWdUvePuEt45h6x5DcQyfVmJkfUVJMSWG4yl5mKY1ebzNK3sGr90EHj/s1600/image+7.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745838553279838354" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVD6OXFcR4X44-XI91-I3gahFDPpBlJrBGyaGQM1A5w5QXlqx0ECEarDL_mUcziQGUxDKA6atNHZRhUY1cY4bjTWWdUvePuEt45h6x5DcQyfVmJkfUVJMSWG4yl5mKY1ebzNK3sGr90EHj/s400/image+7.png" style="cursor: hand; cursor: pointer; display: block; height: 256px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
The nice thing about using the "Template Designer" is you'll see the changes you make immediately take effect...<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcztCwlDMPXBnVZkvahHYU2_JM3FtVnJlPdeGEsgIFKB89kdxDhn7bA1kwvs0A05e9IuVrb0Wn_hlZTJ3iLRz74NO9tBo2jPdwFI3-Sr2D-vlW3ark3eyIONpL8FAfA5KFvuRPXT9s8oTm/s1600/image+8.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745839926532971746" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcztCwlDMPXBnVZkvahHYU2_JM3FtVnJlPdeGEsgIFKB89kdxDhn7bA1kwvs0A05e9IuVrb0Wn_hlZTJ3iLRz74NO9tBo2jPdwFI3-Sr2D-vlW3ark3eyIONpL8FAfA5KFvuRPXT9s8oTm/s400/image+8.png" style="cursor: hand; cursor: pointer; display: block; height: 219px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<div style="text-align: center;">
note how the background has now changed to blue and white in the bottom example area</div>
Now that you've selected the "Simple" template, we're going to make some minor adjustments to remove the blue background and other standard settings with this template.<br />
So let's continue on by clicking the "Advanced" link in the left menu area...<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_A6xQFqAWqmIXCW4HmrbFUEtZ-pon61Hs1v95ahUnZIbc6jrgJKk5lPkQkBG2oZuX6wC6-i7auOk4iYmEgUVganuafoFJfIDNeQAnilVbeg-Npd3QSaiOTpRxSWgfTtP8a_lAPPL1Mo2a/s1600/image+9.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745840981701406930" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_A6xQFqAWqmIXCW4HmrbFUEtZ-pon61Hs1v95ahUnZIbc6jrgJKk5lPkQkBG2oZuX6wC6-i7auOk4iYmEgUVganuafoFJfIDNeQAnilVbeg-Npd3QSaiOTpRxSWgfTtP8a_lAPPL1Mo2a/s400/image+9.png" style="cursor: hand; cursor: pointer; display: block; height: 333px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Next find the "Backgrounds" link, second choice from the top, and click on that...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP5f7wo_DkhdCff_wZyfAQNH4W5PuvgzOjE7ACRFdvZ4rMOxKZwNFiMhv7s5Cf13gAoNXjnmPKWuCTFxXDNCYu8M469A7VOIZUlp40OVhBAAdha8O4I7QOUhPzcUJGuzGc5HYFVPennBQS/s1600/image+10.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745860688562085730" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP5f7wo_DkhdCff_wZyfAQNH4W5PuvgzOjE7ACRFdvZ4rMOxKZwNFiMhv7s5Cf13gAoNXjnmPKWuCTFxXDNCYu8M469A7VOIZUlp40OVhBAAdha8O4I7QOUhPzcUJGuzGc5HYFVPennBQS/s400/image+10.png" style="cursor: hand; cursor: pointer; display: block; height: 333px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Here we will change the background colors to transparent to allow the designer's background to show.<br />
We will be changing the color settings in each of the three areas to transparent...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLSgXcu2MvOyXiEIUxMLlADW-ihk-vwLIIV2KT4cg49-j81vKI34xc6FDYxdCARoBfne2Vxdz-MJVBnDRsKjimFaAH0t67x-l-rlEWOYZa-1PvhEfwlJDZhc3U6s3cImvMERSohz74hBFW/s1600/image+11.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745862344618867986" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLSgXcu2MvOyXiEIUxMLlADW-ihk-vwLIIV2KT4cg49-j81vKI34xc6FDYxdCARoBfne2Vxdz-MJVBnDRsKjimFaAH0t67x-l-rlEWOYZa-1PvhEfwlJDZhc3U6s3cImvMERSohz74hBFW/s400/image+11.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
So beginning with the first section "Outer Background", click the small arrow next to the color...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk_U9_EKYWGjjoW6Wtfvjzhmh9rfHz55bn_dp5mJ4I3uCjkmfpX_JoIrG8WBXcSUip_bFqZaQV2eRcyS7l7PqEl-5r1S3ORZVUaQYS40-7CtM10Iw7EeuzEBXpPg1WZOlSzAj5qMFmKiCb/s1600/image+12.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745863208710577458" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk_U9_EKYWGjjoW6Wtfvjzhmh9rfHz55bn_dp5mJ4I3uCjkmfpX_JoIrG8WBXcSUip_bFqZaQV2eRcyS7l7PqEl-5r1S3ORZVUaQYS40-7CtM10Iw7EeuzEBXpPg1WZOlSzAj5qMFmKiCb/s400/image+12.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
A drop-down menu will appear...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRBZD1l-4q_cgwrydPrtAggaVb0CODSuekuZHJH5JStJYRLxcIN6wBTnPoVSlEMgQEbi-3SfXkKhFPn1NNnfefTdmmAJQ0PXYm91G3k4jBq37-601K8ycU3CzwWB6W3c1OvK0wIe7I7xWi/s1600/image+13.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745863986240665458" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRBZD1l-4q_cgwrydPrtAggaVb0CODSuekuZHJH5JStJYRLxcIN6wBTnPoVSlEMgQEbi-3SfXkKhFPn1NNnfefTdmmAJQ0PXYm91G3k4jBq37-601K8ycU3CzwWB6W3c1OvK0wIe7I7xWi/s400/image+13.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Click on the small checked box next to "Transparent" to change the color...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjV-XAsOa5jn1lfDLkJ0YoJd1m8n0D4m56OEIqmQjIPEVmMQmCj5inSwcuJscc7gaRiiseq0LQTIAXcr5wZ5W_IxO7EkiATawnLTTrLzmi8SCgS9Bj9gA5sIL9-LQngZJ3rAYsod0ywVwqb/s1600/image+14.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745864869670415362" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjV-XAsOa5jn1lfDLkJ0YoJd1m8n0D4m56OEIqmQjIPEVmMQmCj5inSwcuJscc7gaRiiseq0LQTIAXcr5wZ5W_IxO7EkiATawnLTTrLzmi8SCgS9Bj9gA5sIL9-LQngZJ3rAYsod0ywVwqb/s400/image+14.png" style="cursor: hand; cursor: pointer; display: block; height: 285px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Immediately you'll notice the background color change in the screenshot area below...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxhRoa_-cY6rTjahXcn5p1vimuJCAVIbQJBaEmO9q3E4XnVSX4vx5obCCqQCxeIjHyHkVteDsK2HyecsvQKiwIEDbVu74AFqLa-kMVKGhqVrB2yDS0BaoZJNvsAu8ZmAA0C5AUVsT0m7kp/s1600/image+15.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745865854819373698" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxhRoa_-cY6rTjahXcn5p1vimuJCAVIbQJBaEmO9q3E4XnVSX4vx5obCCqQCxeIjHyHkVteDsK2HyecsvQKiwIEDbVu74AFqLa-kMVKGhqVrB2yDS0BaoZJNvsAu8ZmAA0C5AUVsT0m7kp/s400/image+15.png" style="cursor: hand; cursor: pointer; display: block; height: 218px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
We'll continue on, changing the color for the "Main Background" and "Header Background", if applicable, to transparent...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE_ZO-qdZipq4FyjcfGH-epbg_BjNXVK-Cczcc58l40GKO-8BtlropQvXo8XS9OJKeBU9HWkWkbQUfVMVkBpmVsqR2paQEqs6QDfRfTFRDj5hXhugY2-dS3UuOKXDLHAIBNkUyprq5JpBz/s1600/image+16.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745867517062891362" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE_ZO-qdZipq4FyjcfGH-epbg_BjNXVK-Cczcc58l40GKO-8BtlropQvXo8XS9OJKeBU9HWkWkbQUfVMVkBpmVsqR2paQEqs6QDfRfTFRDj5hXhugY2-dS3UuOKXDLHAIBNkUyprq5JpBz/s400/image+16.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Your "Backgrounds" section should now look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNIlNrTVyTi2Zg_qKqI_Cj831yThyC-o0Buh5hVnPng1s2jQcIJjE1vS36tkWulrf5pZ_O0JasAzNdiufxkUuBsFqdfz2OCi4Y3hDi8PhHTfVVoIb19q85N9k-X2luiCVZSrbW0kN5U6xX/s1600/image+17.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745868575656688178" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNIlNrTVyTi2Zg_qKqI_Cj831yThyC-o0Buh5hVnPng1s2jQcIJjE1vS36tkWulrf5pZ_O0JasAzNdiufxkUuBsFqdfz2OCi4Y3hDi8PhHTfVVoIb19q85N9k-X2luiCVZSrbW0kN5U6xX/s400/image+17.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
With that section completed we'll now move on to making additional changes to the template. While the background looks more suited for the designer theme, there are default settings which are still interfering with the overall look of the theme.<br />
We'll now move on down to the "Tabs Background" section, this is the seventh link down on the list...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiie5WFvovPdRsO8EyB93H7KiComleGGLEsJ4CRtzt6gOCNSHIpZLlRn1IFixrT7suVtNAW-GAulYQ2LYlPN9tEG_ZVqwzwGTWINQpvfgGZ8HrTClZX8DNid81bnyupfhwHGwDqRWK7ScTh/s1600/image+18.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745870175230821362" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiie5WFvovPdRsO8EyB93H7KiComleGGLEsJ4CRtzt6gOCNSHIpZLlRn1IFixrT7suVtNAW-GAulYQ2LYlPN9tEG_ZVqwzwGTWINQpvfgGZ8HrTClZX8DNid81bnyupfhwHGwDqRWK7ScTh/s400/image+18.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
We'll go ahead and change the "Background Color" and "Selected Color" settings to transparent as we did above and the end result should look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghA9hnSTCGdbKD48bj5jdg8I4GmmPj0TM2JMWJVaQ8C2d5_NODx7BpXTc7OpSEdxgf5vsfiUKCYQBhGMyRviuAkfJESFbwQP7XMivcZCGLXGaNRIYTMZU6dZYF4SA3dE89Uzg2ot8Sot1Y/s1600/image+19.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745872249488182242" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghA9hnSTCGdbKD48bj5jdg8I4GmmPj0TM2JMWJVaQ8C2d5_NODx7BpXTc7OpSEdxgf5vsfiUKCYQBhGMyRviuAkfJESFbwQP7XMivcZCGLXGaNRIYTMZU6dZYF4SA3dE89Uzg2ot8Sot1Y/s400/image+19.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
With that section completed we'll move on in the same manner to the "Post Footer" section. In this section we'll change only the "Background Color" and "Shadow Color" to transparent...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDjj_LZ_ofzNUqdLnrygLd30w6barineWU44s6PmgqgxfXnuMtmwv1wsoAFV3RS_dO96YG3BcyZx29YTmh8_JeIQR-EFICdZtUO86qmW-5NNKyYWtZAmOwWvDDOZCNnXkZJeKYJHyO1ujF/s1600/image+20.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745872259183830642" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDjj_LZ_ofzNUqdLnrygLd30w6barineWU44s6PmgqgxfXnuMtmwv1wsoAFV3RS_dO96YG3BcyZx29YTmh8_JeIQR-EFICdZtUO86qmW-5NNKyYWtZAmOwWvDDOZCNnXkZJeKYJHyO1ujF/s400/image+20.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Leaving the "Text Color" as it is.<br />
The next category we'll work on is the "Images", changing the "Background Color" and "Border Color" to transparent...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KqdSmOmEdT9qt9NLSKQcARqPJrw2xwnjl5o8-06hCU_jV2QSpjjDLHEGwonxkbATIzwnAutFFjA37xSruyCFnxjy29lTlgrzbGalbcwmmue7vJxNERkk9370xV4hSXmnkxGaKBA2YKvN/s1600/image+21.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745874665376348194" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KqdSmOmEdT9qt9NLSKQcARqPJrw2xwnjl5o8-06hCU_jV2QSpjjDLHEGwonxkbATIzwnAutFFjA37xSruyCFnxjy29lTlgrzbGalbcwmmue7vJxNERkk9370xV4hSXmnkxGaKBA2YKvN/s400/image+21.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<span style="color: #dd007a; font-style: italic; font-weight: bold;">Special note:</span> Looking at my example image above you'll notice a red dotted line appears in the lower screen shot area. This is a helpful guide that appears in certain sections of the Template Designer so don't be alarmed if this shows up. It's simply serves as a visual guide to show you what area you're making changes in.<br />
The last area we'll be working with is the "Accents" section where we'll change the "Separator Line Color" and "Tabs Border Color" to transparent...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzn4urS2HHzdP8QzA3YV7xS-jfakKe_e4noOZEMGp8hhy1WXjY4gvMZOKbLYGA4p6sM1fn-7RgQQlPTIRK_5AVdkBH_9rfqwzsFbUff-CODG19wx6Mpy0ohBaN36c2a0GX9bf1iKPhHThC/s1600/image+22.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745875769533251842" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzn4urS2HHzdP8QzA3YV7xS-jfakKe_e4noOZEMGp8hhy1WXjY4gvMZOKbLYGA4p6sM1fn-7RgQQlPTIRK_5AVdkBH_9rfqwzsFbUff-CODG19wx6Mpy0ohBaN36c2a0GX9bf1iKPhHThC/s400/image+22.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
To complete our work with the Template Designer we'll need to save the changes we've made so be sure to click on the orange "Apply to Blog" button on the top right side...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvqshFMuV_7B3qe32V8mCEZcv8cmf6KHVEyzuuIm-4wyGvMfrhohZm08GZ5bSjFj7NayY-53zAlkGOn9OHZoguAkLCn75FHT6gNtifhyaH3z54wN5v_750F3HTtYa2o237LE_0iZLqoxUp/s1600/image+23a.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745876906497169714" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvqshFMuV_7B3qe32V8mCEZcv8cmf6KHVEyzuuIm-4wyGvMfrhohZm08GZ5bSjFj7NayY-53zAlkGOn9OHZoguAkLCn75FHT6gNtifhyaH3z54wN5v_750F3HTtYa2o237LE_0iZLqoxUp/s400/image+23a.png" style="cursor: hand; cursor: pointer; display: block; height: 258px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<br />Our work in the Template Designer area is completed, however there are still a few more changes to be made before our theme is setup, so we will return once again to the Design area by clicking the "Back to Blogger" link in the right area, to the left of the orange button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiJSh-GWdVLONx33QDDhV0XNZAhlcC9U1OGcjFJivdRHLPdg4q85YwFW-kyCw6wQHonGWmsMiqWHvbMXgz3wTl5IIWh1ExIurcVRDG0XWrgv390bUEVmBDyK5XOQFPME40Ihb4AHBE6ykm/s1600/image+24.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745878102529815906" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiJSh-GWdVLONx33QDDhV0XNZAhlcC9U1OGcjFJivdRHLPdg4q85YwFW-kyCw6wQHonGWmsMiqWHvbMXgz3wTl5IIWh1ExIurcVRDG0XWrgv390bUEVmBDyK5XOQFPME40Ihb4AHBE6ykm/s400/image+24.png" style="cursor: hand; cursor: pointer; display: block; height: 247px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Back in the "Design" area you may notice some changes from how things looked before with your blog layout...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2Zrl1nhaIGIv6sjmFeQQ9LReeBIR1cItVvnlBR3fD-2O4lSfJVkRMhQeOXyffs-14bteJuf0shArwxtuMLoArXz8gIMxQVg6d1kstJjd81I62L3INc9OM9bfpu9hWaa3kpj2wGtZV-LIJ/s1600/image+25.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745893468706118818" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2Zrl1nhaIGIv6sjmFeQQ9LReeBIR1cItVvnlBR3fD-2O4lSfJVkRMhQeOXyffs-14bteJuf0shArwxtuMLoArXz8gIMxQVg6d1kstJjd81I62L3INc9OM9bfpu9hWaa3kpj2wGtZV-LIJ/s400/image+25.png" style="cursor: hand; cursor: pointer; display: block; height: 217px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
That's because each template has it's own default settings. For the "Simple" template the default settings are a staggered one column, two column, one column, layout. These aspects of the the template can also be changed and the size of each area can be modified in the "Template Designer" however we'll cover this in another tutorial.<br />
If you were to look at your blog at this point, it might look nearly perfect, as in the example below...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRPA5zwXLMm47brkr7CQ9e8BEbjz2r83IoFtXOZdteFUtkM8zgKdkulSTCuKGMp7SwYooxazn55BFN6JW8iDWInFCFEIzhzqUBDdUSJlPpJEcBnGPVeWHJCJCK7xk18Uetos8Qas7lM-uy/s1600/image+26.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745939978743034610" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRPA5zwXLMm47brkr7CQ9e8BEbjz2r83IoFtXOZdteFUtkM8zgKdkulSTCuKGMp7SwYooxazn55BFN6JW8iDWInFCFEIzhzqUBDdUSJlPpJEcBnGPVeWHJCJCK7xk18Uetos8Qas7lM-uy/s400/image+26.png" style="cursor: hand; cursor: pointer; display: block; height: 210px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
However, if you take a closer look you'll see that there are several aspects which are still off ~ extra shadowing and whiteouts that can interfere with a designer's theme, so we will now work on fixing those aspects. To do this we will need to work in the html area of your blog.<br />
<br /><span style="font-style: italic;"><span style="color: #dd007a; font-weight: bold;">~Take a Break~</span> if you're looking to take a short break, now would be a good time before moving on to this next section.</span><br />
Once again, we'll be returning back to the "Design" area of our blog so navigate to the "Design" tab and this time click on the "Edit HTML" link...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjucaHEOz6p5vBdgKW1pnsNii5y4-jFsSqLRLogTApZCWIHmDUG8RSvrriBqtFLUbEX_iT9ZoXvCMIHi72rE3h7QEmV5Tb3Qkjj9Z4muf33Ij_5zbwqCDSa6k2EKp1EEkc11qSgf0XwWADc/s1600/image+27.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745896588244652946" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjucaHEOz6p5vBdgKW1pnsNii5y4-jFsSqLRLogTApZCWIHmDUG8RSvrriBqtFLUbEX_iT9ZoXvCMIHi72rE3h7QEmV5Tb3Qkjj9Z4muf33Ij_5zbwqCDSa6k2EKp1EEkc11qSgf0XwWADc/s400/image+27.png" style="cursor: hand; cursor: pointer; display: block; height: 241px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<span style="color: #dd007a; font-style: italic; font-weight: bold;">Important note:</span> Before continuing on it is very important that you save a backup of your blog. Working in the html section can be tricky and so we want to be sure that any changes we make can be fixed by saving a backup.<br />
To do this, click on the "Download Full Template" link...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2yfUXb-5-bFP_mnBG2-y2RLcEERpKhGJdI8hRAGye8f6Y-x3lCQTFkMKuaK8pI3tGXBWy4XAkHWfsEk7e57B8JBHS99N9cexRHFTfh4CGTdNC7e9vtHVGPRcl5J1ri2cxFNPGnHWrnbAG/s1600/image+28.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745898065439696594" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2yfUXb-5-bFP_mnBG2-y2RLcEERpKhGJdI8hRAGye8f6Y-x3lCQTFkMKuaK8pI3tGXBWy4XAkHWfsEk7e57B8JBHS99N9cexRHFTfh4CGTdNC7e9vtHVGPRcl5J1ri2cxFNPGnHWrnbAG/s400/image+28.png" style="cursor: hand; cursor: pointer; display: block; height: 223px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
A pop-up window will appear, be sure the "Save File" button is selected and click "OK" to save a copy of your blog template to your computer...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLJYvSTc44XVbk9325Akjuy-xFnZsCKl1IeSHPEaWY21umU1qnNTlMAClxzN-LuMYto8SDx1hCqsVfLVsG0kVXBsqAQ-A_qYJ1P3AZqc_FIRORF-DswnPhLK-K9QcqPSbBi_vbUxu_yAlu/s1600/image+29.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745898910837229442" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLJYvSTc44XVbk9325Akjuy-xFnZsCKl1IeSHPEaWY21umU1qnNTlMAClxzN-LuMYto8SDx1hCqsVfLVsG0kVXBsqAQ-A_qYJ1P3AZqc_FIRORF-DswnPhLK-K9QcqPSbBi_vbUxu_yAlu/s400/image+29.png" style="cursor: hand; cursor: pointer; display: block; height: 223px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Be sure you note where the backup template is saved before continuing on with the rest of this tutorial so you can easily find it in the future if you need to. The file will look like this on a Windows computer...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw9DNhZASfbcupIrC5_QolyURr8wae4eFRvlVaArvjHGqjZojVJf-0v87YgGPOwRsFd16qcWl6FKBOFbQ8GSfep7WR2OijY4Gf5NgsKKtDb0yzJJs9WsJiINi09p-BWJGEQNfwBpDdGtHt/s1600/image+30.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745899900063489650" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw9DNhZASfbcupIrC5_QolyURr8wae4eFRvlVaArvjHGqjZojVJf-0v87YgGPOwRsFd16qcWl6FKBOFbQ8GSfep7WR2OijY4Gf5NgsKKtDb0yzJJs9WsJiINi09p-BWJGEQNfwBpDdGtHt/s400/image+30.png" style="cursor: hand; cursor: pointer; display: block; height: 359px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Moving back to your blog, we're now ready to begin working in the HTML code area. We're going to be making some minor changes to remove some of the extra shadowing that's default with the "Simple" template.<br />
<span style="color: #dd007a; font-style: italic; font-weight: bold;">Remember~</span><span style="font-style: italic;"> working in this area is extremely tricky, so please... take your time, be very careful ~ change only the items covered in this tutorial. If you find you've made a mistake, then simply leave this area <span style="font-weight: bold;">without saving</span> your changes and the mistakes you've made will not be permanent.</span><br />
We will now move down the open box area with html code in it. So let's begin by scrolling down slightly on the page so that this area is in the middle of our window...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAOTpFLBUM6kPr10BWISZuZiZlNq46QR0ud4yC_WI4jys_LApN7zr4wWIUTEKJjOd4dUumZvbZPdLn4jdgQjCx62aW6AV-oUozMI44_Adssesrm3GFCtyyjVDtssPWuknG21e_4mdE_d5W/s1600/image+31.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745901832866587202" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAOTpFLBUM6kPr10BWISZuZiZlNq46QR0ud4yC_WI4jys_LApN7zr4wWIUTEKJjOd4dUumZvbZPdLn4jdgQjCx62aW6AV-oUozMI44_Adssesrm3GFCtyyjVDtssPWuknG21e_4mdE_d5W/s400/image+31.png" style="cursor: hand; cursor: pointer; display: block; height: 338px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
In order to make changes to this area we will also need to activate the "Find" feature in our browser. This can be found in different locations depending upon what browser you are using but in most cases you can active this feature by holding down the "Ctrl" key ("Command" key on a Mac) and then click on the "F" key.<br />
In the version of the Firefox browser I use it appears at the bottom of the window and here is what that looks like...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidz3CsaklOmlOKA3LeZg9nTuYf4J7j-LslmbyCXNWxnbFD0B4c1X2sNgz3YOwEPJnCwNikQLibFJ20kJJj6m_JQb8L9v-YzSE0xBA9YzWyWZsl9wzStv1kpOPXtXZiWrU6JpKotMAb8KY0/s1600/image+32.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745903323891466866" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidz3CsaklOmlOKA3LeZg9nTuYf4J7j-LslmbyCXNWxnbFD0B4c1X2sNgz3YOwEPJnCwNikQLibFJ20kJJj6m_JQb8L9v-YzSE0xBA9YzWyWZsl9wzStv1kpOPXtXZiWrU6JpKotMAb8KY0/s400/image+32.png" style="cursor: hand; cursor: pointer; display: block; height: 334px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<br />
Now with the "Find" feature activated, we're going to begin searching for the items we need to delete. So let's begin by typing in the word "<span style="font-weight: bold;">shadow</span>" in the Find box like so...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPi8GxeenLI-_5zlY_-APqRBL5iW2xu0tc_lJJ4Ks26e-5COlF-dIJh2U_nFPK0BHbi7i2fhqPpURkC7sB9MGTQPxr3rThPw_LG8KlTl1I0SCCztGasQkoZ_sSBPalOyYeHn0FLzOLWgbR/s1600/image+33.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745904997390688626" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPi8GxeenLI-_5zlY_-APqRBL5iW2xu0tc_lJJ4Ks26e-5COlF-dIJh2U_nFPK0BHbi7i2fhqPpURkC7sB9MGTQPxr3rThPw_LG8KlTl1I0SCCztGasQkoZ_sSBPalOyYeHn0FLzOLWgbR/s400/image+33.png" style="cursor: hand; cursor: pointer; display: block; height: 334px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now click on the "Next" button, or in some cases "Find", and the first appearance of the word "Shadow" in the html code will show up highlighted as in the example below...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsqpPDU6IAQZIdh5LC5UkC8qhuTmk66scexpMdIXb2fTz-RliPq3y4Cx6bee6EQ9VtQURNLhISdCgFnyfCCUGA2QF4DPTILHk-2mZnSf6TekfQNzVvyjq2ngQw2XXaXESAkr81luan-1jq/s1600/image+34.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745906511027216738" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsqpPDU6IAQZIdh5LC5UkC8qhuTmk66scexpMdIXb2fTz-RliPq3y4Cx6bee6EQ9VtQURNLhISdCgFnyfCCUGA2QF4DPTILHk-2mZnSf6TekfQNzVvyjq2ngQw2XXaXESAkr81luan-1jq/s400/image+34.png" style="cursor: hand; cursor: pointer; display: block; height: 334px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now, locate the section "<span style="color: #dd007a; font-weight: bold;"><span style="color: black;">value</span><span style="color: black;">=</span><span style="color: #cc0000;">#eeeeee</span></span>" and change it to: "<span style="color: black; font-weight: bold;">value=</span><span style="color: #cc0000; font-weight: bold;">transparent</span>" so that section should now look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtk5aeJKsAgrB-NByAtJVQ6DSPrvVB2ME6m8hR9LFSv0MVa79tsJ7XAoIqDDbY39rkPzXFpIY4AFmRmy4T0A6aR04PGyZwAdMZnBVgRfVJejYif22hyphenhyphend2em-_joe9gaMH1EhAJCUZv3ATX/s1600/image+35.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745912323675860882" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtk5aeJKsAgrB-NByAtJVQ6DSPrvVB2ME6m8hR9LFSv0MVa79tsJ7XAoIqDDbY39rkPzXFpIY4AFmRmy4T0A6aR04PGyZwAdMZnBVgRfVJejYif22hyphenhyphend2em-_joe9gaMH1EhAJCUZv3ATX/s400/image+35.png" style="cursor: hand; cursor: pointer; display: block; height: 269px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now we're going to search for the next appearance of the word "shadow" in the code, so click on "next" or "find" to move to the next location where this word appears in the code...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKWtsM2jPsnzHlKXyBJ3Zt6ZMtzgLtTCwfwbP7Q3i0PnV2Apqr3j1m9Ir1x_CXmzf7blSVaKUNV4yu1hhzUxdrSdMELy8fCc8haHWEXamRqBMdQsEnWOkW2kGQt4bguwAwWoVRYB2MtyKs/s1600/image+36.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745914103103318482" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKWtsM2jPsnzHlKXyBJ3Zt6ZMtzgLtTCwfwbP7Q3i0PnV2Apqr3j1m9Ir1x_CXmzf7blSVaKUNV4yu1hhzUxdrSdMELy8fCc8haHWEXamRqBMdQsEnWOkW2kGQt4bguwAwWoVRYB2MtyKs/s400/image+36.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now, locate the section "<span style="font-weight: bold;">value</span><span style="color: #cc0000; font-weight: bold;">="40px"</span>" and change it to: "<span style="color: black; font-weight: bold;">value=</span><span style="color: #cc0000; font-weight: bold;">"0px"</span>" so that section should now look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibk6b7V7uvWXCQC6asaLXJ8qEWDkwzdIVl9t-vVbDERAhGpbSyKhf-Msq_sr8wnlk51EYNC4TEHmCwQOk_pJGIVVOvPh6GYn0X0uTKTuYGHldJpj3nOABTtgw4v8E79_OH9jquspsXTBkk/s1600/image+37.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745919312737277810" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibk6b7V7uvWXCQC6asaLXJ8qEWDkwzdIVl9t-vVbDERAhGpbSyKhf-Msq_sr8wnlk51EYNC4TEHmCwQOk_pJGIVVOvPh6GYn0X0uTKTuYGHldJpj3nOABTtgw4v8E79_OH9jquspsXTBkk/s400/image+37.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Once again we'll locate the next appearance of "shadow" which looks like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKTYO6smk9WK-a8OR1vXcZYibYFGIQNKLE-AK2Rd-xdwqkxbfk9SBL66tbgybzr2Xy-0ctDKzTv0QU2rLSn3IoKhHwis5BUCZm6yF4Opws057O60G1s8YnNdrkdEyZu84jSMaO_eLOCj2Q/s1600/image+38.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745922419874330994" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKTYO6smk9WK-a8OR1vXcZYibYFGIQNKLE-AK2Rd-xdwqkxbfk9SBL66tbgybzr2Xy-0ctDKzTv0QU2rLSn3IoKhHwis5BUCZm6yF4Opws057O60G1s8YnNdrkdEyZu84jSMaO_eLOCj2Q/s400/image+38.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now, locate the section "<span style="font-weight: bold;">value</span><span style="color: #cc0000; font-weight: bold;">="5px"</span>" and change it to: "<span style="color: black; font-weight: bold;">value=</span><span style="color: #cc0000; font-weight: bold;">"0px"</span>" so that section should now look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbyi1KuDokIfse__Dk5d_4FrQWFNAAXBsQL4ICs5w-fJttojNS-PRhQ-3ziFWdEHk1BDEyRVn8dK59xuo0tP5WAzsJ7hz3EgguwCzhws0tyslA_49YowPWrj22dYrzzDWomA9NOe6CSs2j/s1600/image+39.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745931308085048290" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbyi1KuDokIfse__Dk5d_4FrQWFNAAXBsQL4ICs5w-fJttojNS-PRhQ-3ziFWdEHk1BDEyRVn8dK59xuo0tP5WAzsJ7hz3EgguwCzhws0tyslA_49YowPWrj22dYrzzDWomA9NOe6CSs2j/s400/image+39.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Once again we'll locate the next appearance of "shadow" which looks like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnoD_R4_ju2L8l18NI2Z7OPGRI7wwsFoCQFB70JfM5r_5rgVpVwtKKwKoC-0LaJvwXBWxCfNnJZFc9EJ38xI95S1nl-eYJESvB2gvCMw5caeHsZ5NuOBoYIaRrofG6zDYUgRToR7J7lDhY/s1600/image+40.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745932417552472322" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnoD_R4_ju2L8l18NI2Z7OPGRI7wwsFoCQFB70JfM5r_5rgVpVwtKKwKoC-0LaJvwXBWxCfNnJZFc9EJ38xI95S1nl-eYJESvB2gvCMw5caeHsZ5NuOBoYIaRrofG6zDYUgRToR7J7lDhY/s400/image+40.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
Now, locate the section "<span style="font-weight: bold;">value</span><span style="color: #cc0000; font-weight: bold;">="10px"</span>" and change it to: "<span style="color: black; font-weight: bold;">value=</span><span style="color: #cc0000; font-weight: bold;">"0px"</span>" so that section should now look like this...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijaZHi07qT0evUoi5yqKd6ezjabTQPrTPOHcY_GeuLm0uMNsP82DxKJxpNsukGu3_Hby9Cl7arVUOXAGw_Ii-xXM_ENevSs3HgIEcL8DQZGakpseqm9iy1fhjYxMM2GCq6xuE9B98mlO3v/s1600/image+41.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5745936833968019154" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijaZHi07qT0evUoi5yqKd6ezjabTQPrTPOHcY_GeuLm0uMNsP82DxKJxpNsukGu3_Hby9Cl7arVUOXAGw_Ii-xXM_ENevSs3HgIEcL8DQZGakpseqm9iy1fhjYxMM2GCq6xuE9B98mlO3v/s400/image+41.png" style="cursor: hand; cursor: pointer; display: block; height: 354px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
With that we have now completed this revising the html area of your blog. The template is now set to a clean format.<br />
<span style="color: #dd007a; font-weight: bold;">Please note:</span><span style="font-style: italic;"> at the time I'm writing this I am still currently working on a way to remove the final "shadow" around images. While I have successfully removed them in the past, I've found that this portion is not dependable and so I will continue working on a fix for this portion before posting the remaining portion here.</span><br />
Now that you have your new template set up and in place you can continue on to using this tutorial to install one of my themes:<br />
Please take your time and investigate the "Template Designer" further where you'll find other fun features like adjusting the widths of your blog and sidebar area to accommodate different blog theme widths.<br />
Here are the sizes I've found that work the best with most designer backgrounds:<br />
<center>
<span style="font-weight: bold;">Two column - wide</span><br />"Entire blog size 900/"Right sidebar" = 360<br />
<br /><span style="font-weight: bold;">Three column - on either side</span><br />"Entire blog" size 920/"Left sidebar" = 200/"Right sidebar" =200<br />
<br /><span style="font-weight: bold;">Three column - both on right side</span><br />"Entire blog" size 930px/"Right sidebar" = 430px</center>
I hope this has been helpful and you enjoy working with this new template.<br />
<br />
Enjoy~<br />
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comtag:blogger.com,1999:blog-307932083687837946.post-5714392127921818722012-03-08T14:25:00.004-05:002012-11-17T17:19:51.863-05:00How to Add a Favicon Icon<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_de9DEQVfFctuz1zaDrjcZIbM8wgjecehXqssOaKLXRTlD7Tplqnylyp57SjyfYo-rEGTAZnJm6N34tVJqXrUnTa7fLD2J83QKyrcWWXrqQ-jWOPHgxJNfWTHBmazcdw8DhPE6tbm8igw/s1600/250px-Wikipedia_favicon_in_Firefox_on_KDE.png"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5631109446292466514" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_de9DEQVfFctuz1zaDrjcZIbM8wgjecehXqssOaKLXRTlD7Tplqnylyp57SjyfYo-rEGTAZnJm6N34tVJqXrUnTa7fLD2J83QKyrcWWXrqQ-jWOPHgxJNfWTHBmazcdw8DhPE6tbm8igw/s400/250px-Wikipedia_favicon_in_Firefox_on_KDE.png" style="float: right; height: 150px; margin: 0pt 0pt 10px 10px; width: 250px;" /></a><span style="color: black;">Today I'd like to talk about a new feature I noticed w</span><span style="color: black;">hile roaming around the back end of my blog. I noticed a new item I hadn't see before, there under the "Design" tab was a new goodie titled Favicon. </span><br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6A7PxQCEMz8DiXJXJEvubvmvkYUOONrpvshqu0JwkG7jxB2aJU8oERL-O0Qc8x2-mesHqSQeZXDUCuSTXfMQDdFZP22gOtzZpSon77x3edPrI43hjmJQ5bJ7Zf-5qBqk3Sqwm_jO5tvQD/s1600/plumroselane_fav_16x16.jpg"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5631111156147374946" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6A7PxQCEMz8DiXJXJEvubvmvkYUOONrpvshqu0JwkG7jxB2aJU8oERL-O0Qc8x2-mesHqSQeZXDUCuSTXfMQDdFZP22gOtzZpSon77x3edPrI43hjmJQ5bJ7Zf-5qBqk3Sqwm_jO5tvQD/s400/plumroselane_fav_16x16.jpg" style="cursor: pointer; float: left; height: 16px; margin: 0pt 10px 10px 0pt; width: 16px;" /></a><span style="color: black;">Now, for those of you who aren't familiar with this term, a </span><a href="http://en.wikipedia.org/wiki/Favicon" style="color: black; font-weight: bold;">favicon</a><span style="color: black;"> is the little icon associated with a website. It can appear in the address of a website or in your browser's favorites & bookmarks area. Mine is the little plumrose inserted above as an example. </span><span style="color: black;">These icons cater to the part of our brains which absorb symbols and icons, as described by </span><a href="http://www.blogger.com/%20http://rcm.amazon.com/e/cm?lt1=_blank&bc1=FFFFFF&IS1=1&npa=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=plumlane-20&o=1&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=0440351839" style="color: black;">Carl Jung</a><span style="color: black;">, but we'll save that topic for another day...</span> <span style="color: black;"><br /><br />Blogger has now simplified the process of adding a favicon icon to our blogs; where we once had to dabble in the html code section of our blogs, we can now easily upload an image and voila! Our own personal favicon appears</span>. <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKqx9OTMqGxkqlxqolRI4k5Y9AZM3BuRy0N6AbMpQi3lZhVHROgWwO2whNvBEvw3EgMgZ4FmEv6vvGGWTpmDlfHNDQZVqX09bj77Is15zS_Zmq2iLlYpf7Cego7RjRy8fD5l3_kfhAbzI9/s1600/image+1.png" style="color: black;"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5629631402276273666" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKqx9OTMqGxkqlxqolRI4k5Y9AZM3BuRy0N6AbMpQi3lZhVHROgWwO2whNvBEvw3EgMgZ4FmEv6vvGGWTpmDlfHNDQZVqX09bj77Is15zS_Zmq2iLlYpf7Cego7RjRy8fD5l3_kfhAbzI9/s400/image+1.png" style="cursor: pointer; display: block; height: 293px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><span style="color: black;">So, if you're interested in adding your own favicon to your blog simply navigate to the "Design: tab of your blog and click the "Edit" link next to the Favicon object to upload an image. I'm not sure if there are size minimums as favicons are usually </span><span style="color: black; font-style: italic;">very </span><span style="color: black;">small, so here's a link to generate a free tiny favicon online ~ </span><a href="http://tools.dynamicdrive.com/favicon/" style="color: black;">Dynamic Drive Favicon Generator</a><span style="color: black;">.</span><br />
<span style="color: black;">Enjoy~</span><br />
Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.comtag:blogger.com,1999:blog-307932083687837946.post-19217595415864389322012-01-31T19:36:00.007-05:002012-03-15T14:15:04.369-04:00Blogger Interface: How to Revert Back<span style="color: rgb(51, 51, 51);">For those of you who have been struggling to navigate your way around the new Blogger interface, I've written some easy steps below to revert back to the old interface. So just follow along and you'll be back to 'old' before you know it. And, as with all of my tutorials, if you need to view a larger version of the example image, simply click on it to enlarge.</span><br /><p>Log into your blog and navigate to this page, usually found by clicking on the "Design" or "Template" link in the top right hand corner of your blog...</p><p><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAr9uPX2CTbopnUoDzovQlDSZ1kPww26yS1I8PGq0UB2U37mPKzUUVUJ-3aa1Jvl69f-JcUqGOstlUQrhSbtu53H39haT8fCelcRxgMKSzMch9KSHZv3QZ_0zIEnDQUghR7BuaKW_T-SFW/s1600/screenshot+1.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 191px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAr9uPX2CTbopnUoDzovQlDSZ1kPww26yS1I8PGq0UB2U37mPKzUUVUJ-3aa1Jvl69f-JcUqGOstlUQrhSbtu53H39haT8fCelcRxgMKSzMch9KSHZv3QZ_0zIEnDQUghR7BuaKW_T-SFW/s400/screenshot+1.png" alt="" id="BLOGGER_PHOTO_ID_5703961120994479602" border="0" /></a></p><p>(Note: if you have more than one blog then you will need to click on a specific blog title ~ if you change the layout for one blog you change them for all of your blogs.)</p><p>Next, click on the little gear in the top right side...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho97KMQfdfIYWe1dA6wSKyTOkxYqYXlFve-YqTXryR99tJn_ozOWgQtEQOD-qWOnl0qeZ34iLhC29BYL1cETlotUPYWuOJrzB_iXm2pajhyphenhyphenbD8-vL6JG-3mfYWeUnh_bQeMrzUFYnwggi-/s1600/screenshot+1a.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 191px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho97KMQfdfIYWe1dA6wSKyTOkxYqYXlFve-YqTXryR99tJn_ozOWgQtEQOD-qWOnl0qeZ34iLhC29BYL1cETlotUPYWuOJrzB_iXm2pajhyphenhyphenbD8-vL6JG-3mfYWeUnh_bQeMrzUFYnwggi-/s400/screenshot+1a.png" alt="" id="BLOGGER_PHOTO_ID_5703961560385665362" border="0" /></a></p><p>Now click on "Old Blogger interface"...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfp42W1d0Mv9MVLvsyQMZj1UU-Puw5BhAMHAAzAxXmG9H0lNtpgiI0nqxvu6Pu5xFgc7xZnpkVUE185j4YdV3w6EWZC3YQh-XJOwIFpfeeCDkNP5DcsnYlJVgYOrKBey8L3AfcUXUkC7Jn/s1600/screenshot+1b.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 191px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfp42W1d0Mv9MVLvsyQMZj1UU-Puw5BhAMHAAzAxXmG9H0lNtpgiI0nqxvu6Pu5xFgc7xZnpkVUE185j4YdV3w6EWZC3YQh-XJOwIFpfeeCDkNP5DcsnYlJVgYOrKBey8L3AfcUXUkC7Jn/s400/screenshot+1b.png" alt="" id="BLOGGER_PHOTO_ID_5703961741560130162" border="0" /></a></p><p>You will now be reverted back to the old interface. All of my own tutorials are written for this interface and so you can now easily navigate these tutorials.<br /></p><p>I do plan on updating all of my tutorials to fit within the new interface once time permits so you can look for those down the line.</p><p>Enjoy~<br /></p><p><img class="centered" alt="post signature" src="http://i806.photobucket.com/albums/yy344/plumrose-lane/Blog%20Backgrounds/My%20Backgrounds/PrL-signature2.png" /></p>Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0tag:blogger.com,1999:blog-307932083687837946.post-31977020304409944612011-10-10T10:36:00.018-04:002012-12-15T20:55:56.405-05:00Understanding Basic Blogger Design Issues ~ Questions & AnswersBelow is a PDF discussing basic differences between templates and themes. This information is important if you are interested in using Designer Themes and Backgrounds like those I to bloggers. This information will help you make the most out of your efforts to create a blog look that's truly 'yours'. Please read this information before using my free prefab backgrounds ~<br />
<center>
<a href="http://www.scribd.com/doc/113641727/Answering-Basic-Design-Questions-for-Blogger-Blogs" style="-x-system-font: none; display: block; font-family: Helvetica,Arial,Sans-serif; font-size-adjust: none; font-size: 14px; font-stretch: normal; font-style: normal; font-variant: normal; font-weight: normal; line-height: normal; margin: 12px auto 6px auto; text-decoration: underline;" title="View Answering Basic Design Questions for Blogger Blogs on Scribd">Answering Basic Design Questions for Blogger Blogs</a> <iframe class="scribd_iframe_embed" data-aspect-ratio="" frameborder="0" height="500" id="113641727" scrolling="no" src="http://www.scribd.com/embeds/113641727/content" width="400"></iframe> <script type="text/javascript">(function() { var scribd = document.createElement("script"); scribd.type = "text/javascript"; scribd.async = true; scribd.src = "http://www.scribd.com/javascripts/embed_code/inject.js"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(scribd, s); })();</script></center>
<br />
Now that you have a little more knowledge under you're belt, you are ready to move on to modifying your own blog with some fabulous theme elements. You can easily find these by clicking the top navigation links on my blog or by visiting the "<a href="http://plumroselane-bckgrnds.blogspot.com/p/backgrounds-themes.html"><span style="font-weight: bold;">Themes</span></a>" and "<a href="http://plumroselane-accessories.blogspot.com/2010/01/blogging-extras.html"><span style="font-weight: bold;">Elements</span></a>" sections.<br />
<br />
Enjoy~ Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com2tag:blogger.com,1999:blog-307932083687837946.post-22599237849597083512011-09-08T13:04:00.025-04:002011-09-08T17:38:52.918-04:00How to: Setup Blog Posts on Facebook<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqSUvKQhv1NzO6CC91fYEdJX4azAJ_pc2E3XP4rzQT6yacC7Iz2hNABAhEQIBNNBsOzCcpKOkZWgtogLZpWnpujBYBb4cE-MVL2L4nHepVjeIjBLLIWyroKoD1LSgbyFlJGgSoYuSX_ZB/s1600/blogger+%2526+facebook.png"><img style="float: right; margin: 0pt 0pt 10px 10px; cursor: pointer; width: 103px; height: 147px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqSUvKQhv1NzO6CC91fYEdJX4azAJ_pc2E3XP4rzQT6yacC7Iz2hNABAhEQIBNNBsOzCcpKOkZWgtogLZpWnpujBYBb4cE-MVL2L4nHepVjeIjBLLIWyroKoD1LSgbyFlJGgSoYuSX_ZB/s400/blogger+%2526+facebook.png" alt="" id="BLOGGER_PHOTO_ID_5650106465747775202" border="0" /></a><span style="color: rgb(51, 51, 51);">This tutorial will cover how to setup your blog postings to automatically feed into your Facebook profile or business page. A personal profile is the standard page you receive when you sign up for a Facebook account. A business page is a separate page you can set up that's related to your specific type of business. Note: you must have a personal FB profile in order to set up a business page. For more information on businesses pages visit</span> <a href="http://www.facebook.com/help/search/?q=business+page">this link</a> <span style="color: rgb(51, 51, 51);">and to create a business page visit</span> <a href="http://www.facebook.com/pages/create.php">this link</a>.<p>For this tutorial you will need to have a <a href="http://www.facebook.com/">Facebook</a> profile page, and a business page if you are interested in adding your blog feed to that as well. We will begin with adding your blog posts to your personal page and then move on to adding them to your business page. </p><div style="text-align: center;"><span style="font-weight: bold;">Setting up Notes on Your Personal Page</span><br /><br /></div><span style="color: rgb(51, 51, 51);">To begin, log in to your Facebook profile and go to your profile page...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Ebsdnazvv4C5FB2aHTW2rLegn8PvYeqz0b756Psm55U9ZTHc8aDrnR11DjKCBfMazryr_sDNIi_9xIq_5iHI9VhaKvDOcLNFvTzZ_7sqQJBJxmRt5JM-PWiZtgBnWFZgMrbSepLODcZL/s1600/image+1.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 181px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Ebsdnazvv4C5FB2aHTW2rLegn8PvYeqz0b756Psm55U9ZTHc8aDrnR11DjKCBfMazryr_sDNIi_9xIq_5iHI9VhaKvDOcLNFvTzZ_7sqQJBJxmRt5JM-PWiZtgBnWFZgMrbSepLODcZL/s400/image+1.png" alt="" id="BLOGGER_PHOTO_ID_5650074579014541346" border="0" /></a><br /><span style="color: rgb(51, 51, 51);"><br />Next click on this link ~</span><a style="color: rgb(51, 51, 51);" href="http://www.facebook.com/editnotes.php?import">http://www.facebook.com/editnotes.php?import</a><span style="color: rgb(51, 51, 51);">~to be taken to the "Import Notes" page...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiws0d8lZQUrijIuKarjkCM8T5Q4TRystnG8PUq0rFRwE2ST8ONxLFzqFuEKBRwUaIQjnG4IOm5d-8xS4hQJvs9iNCXDUmAcTr8__QdtHepb4_Lt9qBQuJsHqh0syD2v_650_uuOzujga/s1600/image+2.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 179px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiws0d8lZQUrijIuKarjkCM8T5Q4TRystnG8PUq0rFRwE2ST8ONxLFzqFuEKBRwUaIQjnG4IOm5d-8xS4hQJvs9iNCXDUmAcTr8__QdtHepb4_Lt9qBQuJsHqh0syD2v_650_uuOzujga/s400/image+2.png" alt="" id="BLOGGER_PHOTO_ID_5650077695571841490" border="0" /></a><span style="color: rgb(51, 51, 51);"><br />Now enter the url or web address of your blog in the text box ~ be sure you enter the entire address by including the "http://" part so that it looks like this - "</span><span style="font-weight: bold; color: rgb(51, 51, 51);">http://</span><span style="color: rgb(51, 51, 51);">yourblogname</span><span style="font-weight: bold; color: rgb(51, 51, 51);">.blogspot.com</span><span style="color: rgb(51, 51, 51);">...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCZQpYgwV_DzpSwPW8OM3qmHoPoz_Pl51jXkKSMp3XRX5AWPaxwqJw82g-9qJNyBqghzia7uH_caip4ja47GLmygVQxJdidetYjzL7DpZNiuQ0us0BJwEJTWlPrr2vVsIbbwQF1jiMlYOl/s1600/image+3.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 277px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCZQpYgwV_DzpSwPW8OM3qmHoPoz_Pl51jXkKSMp3XRX5AWPaxwqJw82g-9qJNyBqghzia7uH_caip4ja47GLmygVQxJdidetYjzL7DpZNiuQ0us0BJwEJTWlPrr2vVsIbbwQF1jiMlYOl/s400/image+3.png" alt="" id="BLOGGER_PHOTO_ID_5650077614052366482" border="0" /></a><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCk6OpJuDasTUlcL5Vvt3Sd8QuMmI8p8gGQ7Hb5rh1O6US17rYCZMaw_PvuGjSfkEL82Z3YTHYouSAlk9AxLX0l9wcT49vweioUMzsh3XViW3eDFHKpacE24T3lG2QkN0o4T5m6-KqoTkG/s1600/image+4.png"><br /></a><span style="color: rgb(51, 51, 51);"><br />Next click that you agree to the Terms of Use and click the "Save Settings" button...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCk6OpJuDasTUlcL5Vvt3Sd8QuMmI8p8gGQ7Hb5rh1O6US17rYCZMaw_PvuGjSfkEL82Z3YTHYouSAlk9AxLX0l9wcT49vweioUMzsh3XViW3eDFHKpacE24T3lG2QkN0o4T5m6-KqoTkG/s1600/image+4.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 278px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCk6OpJuDasTUlcL5Vvt3Sd8QuMmI8p8gGQ7Hb5rh1O6US17rYCZMaw_PvuGjSfkEL82Z3YTHYouSAlk9AxLX0l9wcT49vweioUMzsh3XViW3eDFHKpacE24T3lG2QkN0o4T5m6-KqoTkG/s400/image+4.png" alt="" id="BLOGGER_PHOTO_ID_5650076838350744722" border="0" /></a><br /><span style="color: rgb(51, 51, 51);">On the next page click the "Confirm" button...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6hmN_msx5N7LmrArVwtGBmtP4WCNetCUd1dfTrLqxW1RadIqdMI80_Xn_Buyd3bOyANjKBKSkLeIqTlgwRD4Nf60k_U8J6HW7nrsJiMYr5cXFlW2KdqOrtPL5j70X5lfa4pOnhQbzSxac/s1600/image+5.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 103px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6hmN_msx5N7LmrArVwtGBmtP4WCNetCUd1dfTrLqxW1RadIqdMI80_Xn_Buyd3bOyANjKBKSkLeIqTlgwRD4Nf60k_U8J6HW7nrsJiMYr5cXFlW2KdqOrtPL5j70X5lfa4pOnhQbzSxac/s400/image+5.png" alt="" id="BLOGGER_PHOTO_ID_5650078596184808482" border="0" /></a><span style="color: rgb(51, 51, 51);"><br />That's it! Your previous posts will appear in the Notes area and any new posts you make will automatically show up...</span><a style="color: rgb(51, 51, 51);" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEjbeyV9X73V2eWVCutIsu6BmGmW418SzgbpER0QtafTLp4GGE7UEtl77Z57n5DidbUmYzxCBKar_-uZ7gEpJzjE8ka75PbGPwdrdueUfanp-AikBxe_4BL89BKzTCN4IYlBm53RtnYcR8/s1600/image+6.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 229px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEjbeyV9X73V2eWVCutIsu6BmGmW418SzgbpER0QtafTLp4GGE7UEtl77Z57n5DidbUmYzxCBKar_-uZ7gEpJzjE8ka75PbGPwdrdueUfanp-AikBxe_4BL89BKzTCN4IYlBm53RtnYcR8/s400/image+6.png" alt="" id="BLOGGER_PHOTO_ID_5650079248445647154" border="0" /></a><br /><span style="color: rgb(51, 51, 51);">If you have any problems with the process you can view the </span><a style="color: rgb(51, 51, 51);" href="http://www.facebook.com/help/?page=781">Notes: Bugs and known problems</a> section on Facebook for support. If you need any other help with Notes, either adding or stopping, visit this <a style="color: rgb(51, 51, 51);" href="http://www.facebook.com/help/?faq=175505105840822&ref_query=How+do+I+add+a+blog">help page</a><span style="color: rgb(51, 51, 51);"> on Facebook.</span><br /><br /><span style="color: rgb(51, 51, 51);">Now we'll move on to...</span><br /><br /><div style="text-align: center; color: rgb(51, 51, 51);"><span style="font-weight: bold;">Setting up Notes on Your Personal Page<br /></span><div style="text-align: left;"><span style="font-weight: bold;"><br /></span>Begin by logging into your Facebook account and navigate to your business page and click on the "Edit Page" button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXY-Sij_P-liX8fSzz9YqJlDBOzoRH0VrnGVXKA-zyTQEvQ_AyW34egXorW0pCaWxH6ZkZKvT1kvIOXUwDB6PrpThllaotPnoC4klof598X-AX5WEd2vliHq6kmM23cRuUVuw0OtZLVbTa/s1600/image+7a.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 279px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXY-Sij_P-liX8fSzz9YqJlDBOzoRH0VrnGVXKA-zyTQEvQ_AyW34egXorW0pCaWxH6ZkZKvT1kvIOXUwDB6PrpThllaotPnoC4klof598X-AX5WEd2vliHq6kmM23cRuUVuw0OtZLVbTa/s400/image+7a.png" alt="" id="BLOGGER_PHOTO_ID_5650093090045175426" border="0" /></a><br />Now click on "Apps" in the left sidebar area...<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNLyk4cSSKfobR3h7IQtd7-1PiSsp6Ffajpg01uv0Q6sLSWWp6xbFHZENxqnwPjDGoLFaDj0mXwJhGbzvHO_GATAq2yZ7TuJeVpUNdC2wZD48nqUqjit6FWJqbyPH70cbH5hNFq6O-9BHt/s1600/image+8.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 323px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNLyk4cSSKfobR3h7IQtd7-1PiSsp6Ffajpg01uv0Q6sLSWWp6xbFHZENxqnwPjDGoLFaDj0mXwJhGbzvHO_GATAq2yZ7TuJeVpUNdC2wZD48nqUqjit6FWJqbyPH70cbH5hNFq6O-9BHt/s400/image+8.png" alt="" id="BLOGGER_PHOTO_ID_5650093732665758386" border="0" /></a><br />On the next page you'll see an the area titled "Notes"...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTHUh-M-z8TfLeDBBmAFUPkSskCFG8wVbQigYyM6kSMcae6yi7Z-OF8t7gFAThGKkVQHHaowLqiOQZNjryE7_4R18z63JpZ6fttMaD1TCpIBAu-kK393Rg5yz1j34iOonjSBwCG2GLRghQ/s1600/image+9.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 283px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTHUh-M-z8TfLeDBBmAFUPkSskCFG8wVbQigYyM6kSMcae6yi7Z-OF8t7gFAThGKkVQHHaowLqiOQZNjryE7_4R18z63JpZ6fttMaD1TCpIBAu-kK393Rg5yz1j34iOonjSBwCG2GLRghQ/s400/image+9.png" alt="" id="BLOGGER_PHOTO_ID_5650094199055685922" border="0" /></a><br />Click on the "Go to App" link...<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxHAVjDPxEdDT_HMlnJMKj5RPp9gshm7fVinLeZrVvgZqGp7F43eSlY7UXOV3skw2Q91UgL9v_5azA_n8gWIZs7AQ9t9vvbB8qSuVF1kk0lAiMCXq54vERucm1zxaHyhxVhH959gNoQKjs/s1600/image+10.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 240px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxHAVjDPxEdDT_HMlnJMKj5RPp9gshm7fVinLeZrVvgZqGp7F43eSlY7UXOV3skw2Q91UgL9v_5azA_n8gWIZs7AQ9t9vvbB8qSuVF1kk0lAiMCXq54vERucm1zxaHyhxVhH959gNoQKjs/s400/image+10.png" alt="" id="BLOGGER_PHOTO_ID_5650095011185596866" border="0" /></a><br />On the next page click on "Edit import settings" found at the bottom of the left sidebar area...<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIbFcn0j_-csnCU28i-gle5ML9zH9O_w7enI-vgWY9w2zoecCVb8ei268bcZgY0nMeUoJnkvuXL5TEsKZBoIrMJqHtgPG3Q9Cs-fBgjAf1FNVmebb0iv58P53il05YzbR4N6DNTvx3Pv_p/s1600/image+11.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 255px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIbFcn0j_-csnCU28i-gle5ML9zH9O_w7enI-vgWY9w2zoecCVb8ei268bcZgY0nMeUoJnkvuXL5TEsKZBoIrMJqHtgPG3Q9Cs-fBgjAf1FNVmebb0iv58P53il05YzbR4N6DNTvx3Pv_p/s400/image+11.png" alt="" id="BLOGGER_PHOTO_ID_5650096175692921762" border="0" /></a><br />Now, just as you did above, enter your entire blog address in the box (be sure to include the http:// just as I've done in the example below), then click on the check box, and finish by clicking the "Start Importing" button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ-F305SioGEJbnQZumg5NhVwvXC_vlRXTkOOazqJ-YJrdEW3vC4TiGvZ0mdEXf86Y5t29hA4TA9PrQe1Qxttsz-25WEPRqfWsX_8Ratxg34Cuy26cZY3BBzDNqwLLhZlrhqHfOdEbDQ6g/s1600/image+12a.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 208px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ-F305SioGEJbnQZumg5NhVwvXC_vlRXTkOOazqJ-YJrdEW3vC4TiGvZ0mdEXf86Y5t29hA4TA9PrQe1Qxttsz-25WEPRqfWsX_8Ratxg34Cuy26cZY3BBzDNqwLLhZlrhqHfOdEbDQ6g/s400/image+12a.png" alt="" id="BLOGGER_PHOTO_ID_5650097352574659458" border="0" /></a><br />On the next page you'll see a preview of your blog feed, click on the "Confirm" button...<br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO9wcNlWwMutZclafHHpZfrudQAcQwPpzPLfXRr48Wl_nRt4r8kFsKMoeAEcXsAjn0uL3eDllKiHznqdRGIldNTrGjLSGAYYiwFU49iDlu0BqZpNsB-TTznW_aaxDT1ATA35H54WwQDy0w/s1600/image+13.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 283px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO9wcNlWwMutZclafHHpZfrudQAcQwPpzPLfXRr48Wl_nRt4r8kFsKMoeAEcXsAjn0uL3eDllKiHznqdRGIldNTrGjLSGAYYiwFU49iDlu0BqZpNsB-TTznW_aaxDT1ATA35H54WwQDy0w/s400/image+13.png" alt="" id="BLOGGER_PHOTO_ID_5650098237101676674" border="0" /></a><br />You should now see your own blog posts appear in the Notes section of your business page, just as mine are shown on my page below...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDNIb-ruxA5gbG5iz7tNAuDGgurqZvwss56mS-TpJIwCgEb8FGXsW0_QKcn7gWAAD8kHE00Ih5y3CcPuxyiEXq9LPqbhvUizMagqHmw3PLyBS2U3OlJueJ3OmlPnyzXzHq9h0pV-a79gcZ/s1600/image+14.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 363px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDNIb-ruxA5gbG5iz7tNAuDGgurqZvwss56mS-TpJIwCgEb8FGXsW0_QKcn7gWAAD8kHE00Ih5y3CcPuxyiEXq9LPqbhvUizMagqHmw3PLyBS2U3OlJueJ3OmlPnyzXzHq9h0pV-a79gcZ/s400/image+14.png" alt="" id="BLOGGER_PHOTO_ID_5650099478602040130" border="0" /></a><br /><br />And that's it! You've successfully added your blog feed ~ congratulation!<br /><br />As with the personal profile section above, if you encounter any issues with adding your blog feed, visit <a href="http://www.facebook.com/help/?faq=175505105840822&ref_query=add+a+blog+">this link</a> for further info.<br /><br /></div></div><span style="color: rgb(51, 51, 51);">Enjoy~ </span><p><img class="centered" alt="post signature" src="http://i806.photobucket.com/albums/yy344/plumrose-lane/Blog%20Backgrounds/My%20Backgrounds/PrL-signature2.png" /></p>Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0tag:blogger.com,1999:blog-307932083687837946.post-29914212481592541532011-04-24T11:56:00.003-04:002012-03-15T14:17:10.585-04:00Setting Up Mobil Viewing on Your Blog<p><span style="color: rgb(0, 0, 0);">I've just learned that Blogger is currently testing a new feature for viewing blogs on mobile devices. Up until this point, if you tried to view a blog through your mobile device, it appeared huge and was difficult to read in such a large state. This new feature reduces blogs down to a more readable size and organizes postings in a cohesive manner.<br /><br />To set up this feature on your own blog follow the simple steps below...</span></p><p>First you'll need to log into your blog and then click on this link: http://draft.blogger.com/home This area is called <a href="http://draft.blogger.com/home">"Blogger Draft"</a> and appears to be a duplicate of the regular "Dashboard" area of our blogs.<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4w4NnbP0UKEC0gMFybL8aYqwZ3v7-fYri7aMdZMFE5K8tBjY66NdN0j3TAm5DnhlLL_foX4J1BpRjfUlLJ29JrgqzsdeBiSySa2q7JLEPxNMADel70Q0mGRGFfAtLAK0AlxpRoYrTH17g/s1600/image1.png"><br /></a></p><p>There you will click on the "<span style="font-weight: bold;">Settings tab</span>" and then the blue "<span style="font-weight: bold;">Email & Mobile</span>" link...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4w4NnbP0UKEC0gMFybL8aYqwZ3v7-fYri7aMdZMFE5K8tBjY66NdN0j3TAm5DnhlLL_foX4J1BpRjfUlLJ29JrgqzsdeBiSySa2q7JLEPxNMADel70Q0mGRGFfAtLAK0AlxpRoYrTH17g/s1600/image1.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 338px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4w4NnbP0UKEC0gMFybL8aYqwZ3v7-fYri7aMdZMFE5K8tBjY66NdN0j3TAm5DnhlLL_foX4J1BpRjfUlLJ29JrgqzsdeBiSySa2q7JLEPxNMADel70Q0mGRGFfAtLAK0AlxpRoYrTH17g/s400/image1.png" alt="" id="BLOGGER_PHOTO_ID_5599544573731787922" border="0" /></a></p><p>At the top of this page you'll see a new section titled "<span style="font-weight: bold;">Mobile Template (beta)</span>"... <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9D-QE4NremUjY7WfDKUoY5nnb8CqCDq3GRq8ymIZSIQCyRxkqJFKPlB6tiRwr-4ziYjQJQcIedMyaCv2RNffDBZncd0BjbyI8wByEaGGVqKHtR0fUEr91_341kAjoJiOKNsggUFpG4Lb2/s1600/image2.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 338px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9D-QE4NremUjY7WfDKUoY5nnb8CqCDq3GRq8ymIZSIQCyRxkqJFKPlB6tiRwr-4ziYjQJQcIedMyaCv2RNffDBZncd0BjbyI8wByEaGGVqKHtR0fUEr91_341kAjoJiOKNsggUFpG4Lb2/s400/image2.png" alt="" id="BLOGGER_PHOTO_ID_5599544887663303026" border="0" /></a></p><p><br /></p><p style="text-align: center;">*In the online world "beta" usually denotes something new and in the testing stages.*<br /></p><p>In this area you'll want to click the small button next to "Yes, On mobile devices, show the mobile version of my template"...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwSk0y4A9g06lMo405YxlLtnVXfGrycXINqJBsgfw7SMBgSIouAsQidW0HxQ3VThBHxFYuLBGQW6QFokLl8S2-07G9pUmTx5czR_pzI7yEfcettFU1qp8ySh2_B4x_nfApTAy0HDxURLbD/s1600/image3.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 338px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwSk0y4A9g06lMo405YxlLtnVXfGrycXINqJBsgfw7SMBgSIouAsQidW0HxQ3VThBHxFYuLBGQW6QFokLl8S2-07G9pUmTx5czR_pzI7yEfcettFU1qp8ySh2_B4x_nfApTAy0HDxURLbD/s400/image3.png" alt="" id="BLOGGER_PHOTO_ID_5599545479311816882" border="0" /></a></p><p>Be sure to scroll down the to the bottom and click the orange <span style="font-weight: bold;">"Save Settings"</span> button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfheekO5O-I9JwB3bBLt4XvUoVxQ3EQNAo5qsDZYelUyK02tZP5lUGtPEnlScnDovRf2nLFPPiiACmQp1k1CGMbyNoNQekQrkL3IkCqp19vmnP47NrVB74LHG9Sn1f16yqFAefzBOqj2fY/s1600/image5.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 338px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfheekO5O-I9JwB3bBLt4XvUoVxQ3EQNAo5qsDZYelUyK02tZP5lUGtPEnlScnDovRf2nLFPPiiACmQp1k1CGMbyNoNQekQrkL3IkCqp19vmnP47NrVB74LHG9Sn1f16yqFAefzBOqj2fY/s400/image5.png" alt="" id="BLOGGER_PHOTO_ID_5599545737846197618" border="0" /></a></p><p>Once saved, you can then return to the top of the page and preview a sampling of your blog by clicking the blue <span style="font-weight: bold;">"Mobile Preview"</span> button...<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8P4ZfyJp99r60tkPPZ2vfOWTR70cBU2BhWCxlCPLQ5Gdvg9vAUdnRljx7bb7fgB7iSVC9DyRMsBF40RYHwGbuthFQJ59MtnbEg64l1qS6xS6V_A5hncpoZM0fVIr5LMtf5PWbY2pmW8lz/s1600/image4.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 338px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8P4ZfyJp99r60tkPPZ2vfOWTR70cBU2BhWCxlCPLQ5Gdvg9vAUdnRljx7bb7fgB7iSVC9DyRMsBF40RYHwGbuthFQJ59MtnbEg64l1qS6xS6V_A5hncpoZM0fVIr5LMtf5PWbY2pmW8lz/s400/image4.png" alt="" id="BLOGGER_PHOTO_ID_5599546027043744866" border="0" /></a></p><p>Something else I noticed in this preview is that certain features, like the image navigation area at the top of my blog, will not show up in mobile view so some of the navigation is missing however is does display a nice reduced version of blog and that's pretty sweet!</p><p>Enjoy~</p><p><img class="centered" alt="post signature" src="http://i806.photobucket.com/albums/yy344/plumrose-lane/Blog%20Backgrounds/My%20Backgrounds/PrL-signature2.png" /></p><div style="text-align: center;"><span style="font-weight: bold; font-style: italic;">Now all of my </span><span style="font-weight: bold; font-style: italic;">tutorials </span><span style="font-weight: bold; font-style: italic;">in one fabulous package</span> <span style="font-weight: bold; font-style: italic;">for one low price</span><br /></div> <a href="http://www.etsy.com/shop/PlumroseLane?section_id=6681012"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 200px; height: 200px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHZEsszrUShAWwjWK1F4RCfYz3H-_wQjSaEHroAjdydRP9KoxY7L5EuPRN50SXx3apsVTWNkICSoqXFKSKHdqVoSNTgMS00KYs1lRY6En7uIMpAS_9a8l1swzbnmncntPcSVgQI0FWO8a2/s400/PrL_Blogging_Tutorials_clear+back+image-+sm.png" alt="" id="BLOGGER_PHOTO_ID_5524210000465776466" border="0" /></a> <div style="text-align: center;"> $10.95 buys the complete set of my <span style="font-weight: bold;">digital </span>tutorials<br />all 25 tutorials in PDF format ~ including my exclusive three part series<br /><br /><span style="font-weight: bold;">"How to Create Your Own Blog Background"</span><br /><span style="font-weight: bold;"> </span><br />available only with this purchase.<br /><br />Click the book above to purchase from my Etsy shop..</div>Plumrose Lanehttp://www.blogger.com/profile/01618945315771968895noreply@blogger.com0