Rainy Day Templates - Fresh, Simple Style For Blogger

2010-05-22T17:06:00.000-07:00

Hello and welcome! Rainy Day Templates is a small blog design shop specializing in uniquely styled, limited-run premade templates for the Blogger publishing platform. All layouts come fully loaded with fun, interactive accessories and thoughtful touches, for a modern, high-impact look. Templates can be ordered just as they are, or customized with new colors and a choice of dozens of different fonts.

Thank you very much for your interest, but I'm afraid Rainy Day is officially closed. Blogger's made some pretty big changes for the past year, which make it difficult to do the sort of designs I've been creating, so I'm moving on to different projects. Feel free to have a look around for inspiration, though!

2010-05-22T10:34:00.000-07:00

All Ready Made templates are made over with your own blog title/tagline (and your own photos, for photo headers). If you upgrade to Customized Colors and Fonts, the template and all detailing will be made over in colors and fonts of your choosing. Graphics will be stored in your Photobucket account for you, and the header, template code, and accessories will be hand-installed by me. See the FAQ for more information about the process.

2009-09-28T18:08:00.000-07:00

Sonia. New layout! Two column design with unique post layout, navigation menu, and colored sidebar.

Purchase this template!

2009-09-26T16:30:00.000-07:00

Alexandria. New layout! Three column design with below-title categories, navigation menu, and favicon. Main column supports images up to 500px wide.

Purchase this template!

2009-09-26T16:01:00.000-07:00

Emily. Three column design with extra wide main posting column (accommodates images up to 588px wide), below-title date stamp, navigation menu, and sticky element. Included coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, comment section and block quote styling, tag cloud, comment bubble, favicon, matching pagination titles, and post signature.

Purchase this template!

2009-09-26T16:00:00.000-07:00

Samantha. New style! A dreamy, sweet look featuring a patterned sidebar, dashed detailing, and below-title categories. Includes Twit This! icon, Twitter bird, navigation menu, networking/feed buttons, styled and numbered comments, unlocked capitalization, below-title labels, styled block quote, signature, sticky element, and favicon. Main posting column supports images up to 500px wide.

Purchase this template!

2009-09-26T15:59:00.000-07:00

Catherine. Three column magazine-style layout with super wide main column (supports images up to 600px wide). Includes navigation menu, patterned background, networking/feed buttons, matching Twitter bird and Twit This! icon, below-title labels, styled, numbered comments, and styled block quote. Header will be made over with your own photo.

Purchase this template!

2009-09-26T15:58:00.000-07:00

Madeleine. Supports images up to 600px wide, and includes navigation menu, favicon, post title icon, signature, styled and numbered comments, styled block quote, Twit This! icon and Twitter bird, matching pagination titles, and coordinating networking/feed buttons.

Purchase this template!

2009-09-26T15:57:00.000-07:00

Emmeline. Two column layout supports images up to 588px wide. With navigation menu, background pattern sidebar detailing, italicized sidebar text, and blog footer detailing. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, pagination titles, styled block quote, styled and numbered comments section, hover pop! color links and post titles, post signature, favicon, and tag cloud.

Purchase this template!

2009-09-26T15:56:00.000-07:00

Camille. Three column, color bar design with patterned background sidebars and navigation menu. Supports images up to 500px wide, and includes matching favicon, coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, tag cloud, styled block quote, styled and numbered comments section, post signature, and below-title date stamp styling.

Purchase this template!

2009-09-26T15:55:00.000-07:00

Chloe. Photoblog with navigation menu, sticky welcome element, three column, divided footer, styled post footer, and below-title date stamp. Features styled, numbered comments section and Twit This! icon, and supports images up to 900px wide. Includes coordinating networking/feed buttons, Twitter bird, and optional post signature (not shown).

Purchase this template!

2009-09-26T15:54:00.000-07:00

Caroline. Two column, left-handed layout with post divider, inset navigation, image border styling, and scroll footer detail. Supports images up to 588px wide, and includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, pagination titles, styled and numbered comments section, styled block quote, hover pop! post titles, favicon, post signature, and tag cloud.

Purchase this template!

2009-09-26T15:51:00.000-07:00

Penelope. Three column magazine-style layout with below-title categories, button-style menu, color-adjustable widebar, image border, post divider, and styled, numbered comments. Supports images up to 588px wide, and includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled block quote, favicon, post signature, and matching pagination titles. (Header will be made over with your own photo - or none, if you prefer.)

Purchase this template!

2009-09-26T15:50:00.000-07:00

Evelyn. Two column design with photo header, narrow sidebar, navigation menu with dot detail, styled block quote and image border, and below-title category styling. Supports images up to 627px wide, and includes coordinating networking/feed buttons, matching pagination titles, Twitter bird and Twit This! icon, styled and numbered comments section, three-column divided footer, label cloud, and post signature.

Purchase this template!

2009-09-26T15:48:00.000-07:00

Susannah. Two column design featuring below-title labels and comments links. Supports images up to 700px wide, and includes coordinating networking/feed buttons, inset menu, pagination titles, styled block quote and comments section, favicon, matching Twitter bird and Twit This! icon, numbered comments, post signature, and italicized links.

Purchase this template!

2009-09-24T01:56:00.000-07:00

Juliette. Clean-lined, two column design with button-block navigation menu and contrasting sidebar. Features configured image border, styled block quote and comments section, numbered comments, matching Twitter bird and Twit This! icon, coordinating networking/feed buttons, "Welcome" and "more about me" titles, pagination titles, favicon, hover pop! color, and post signature.

Purchase this template!

2009-09-23T19:37:00.000-07:00

Love II. Wedding website with all the bells and whistles! Matching sidebar and page titles (customized to say whatever you'd like), matching favicon, coordinating guestbook form, and coordinating pagination. Wedding websites are fully installed, with titles linked up to blank pages for you to easily fill out at your convenience (because, um, planning a wedding is a wee bit of work...)

Purchase this template!

2009-09-23T16:53:00.000-07:00

Nanette. Simple, easily manageable and navigable blogsite which can be built upon with multiple menus, nesting pages, contact/submission forms, and payment buttons. (Details and live preview site coming soon!)

2009-09-22T00:46:00.000-07:00

Jordan. Tonally sweet photoblog with photo header, navigation menu, coordinating networking/feed buttons, "sticky" welcome section, matching Twitter bird and Twit This! icon, styled and numbered comments, post signature, and divided footer for extra storage (note: matching footer titles not included).

Purchase this template!

2009-09-21T16:21:00.000-07:00

Amelia. Clean-lined three column photo header template perfect for pro bloggers, with navigation menu, widebar area (supports multiple elements) and split sidebar underneath with columns sized to frame 150px wide sponsor buttons just right. Includes coordinating networking feed/buttons, post signature, below-title categories, matching Twitter bird and Twit This! icon, comment bubble, styled comments section and block quote, and numbered contents. Header will be made over with your own photo.

Purchase this template!

2009-09-21T03:42:00.000-07:00

Hannah. Two column design with transparency play title, inset navigation menu (which can be moved up top), coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled and numbered comments section and block quote, tag cloud, and pagination titles.

Purchase this template!

2009-09-20T17:32:00.000-07:00

Allison. Two column layout with navigation menu and decorated, stacked sidebars, below-title date styling, hover pop! color, coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled and numbered comments section and block quote, tag cloud, unlocked capitalization, favicon, post signature, and personalized pagination (made over with your custom phrasing).

Purchase this template!

2009-09-17T17:31:00.000-07:00

Isabelle. Two column layout with inset navigation menu, and layered patterns. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled block quote, styled and comments section, post signature, tag cloud, favicon, and hover pop! post titles and links.

Purchase this template!

2009-09-17T17:28:00.000-07:00

Sofie. Three column design with banner header, double line details, centered titles, dot post divider, and navigation menu (not shown). Main column supports images up to 540px wide. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled and numbered comments section, styled block quote, favicon, tag cloud, post signature, and hover pop! color for post titles and links.

Purchase this template!

2009-09-13T17:32:00.000-07:00

Sydney. Clean-lined, modern layout with stacked, separated sidebars, post divider and button-style navigation menu. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, hover pop! color links and post titles, styled and numbered comments, styled block quote, below-title date stamp, post signature, pagination titles, favicon, and tag cloud.

Purchase this template!

2009-09-13T04:50:00.000-07:00

Charlie. Extra large main posting column supports images up to 870px wide, navigation menu with search box, sticky element area, and three column divided blog footer. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, optional post signature, and styled, numbered comments section.

Purchase this template!

2009-09-12T17:30:00.000-07:00

Zoe. Two column photo strip design with left-aligned sidebar, extra wide main column, and outlined images. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, styled and numbered comments section, optional post signature, and hover pop! links and post titles. (Header will be made over with your own photographs.)

Purchase this template!

2009-09-12T01:04:00.000-07:00

Abbie. Simply sweet three-column, tag-style header design with sidebar dividers and top navigation menu. Includes coordinating networking/feed buttons, matching Twitter bird and Twit This! icon, hover pop! color links and post titles, styled block quote and comments section, tag cloud, favicon, post signature, and pagination titles.

Purchase this template!

2009-09-11T17:28:00.000-07:00

Misha. Two column layout featuring icon detail post titles, navigation menu, separated sidebar elements, and below-title date stamp styling. Includes matching Twitter bird and Twit This! icon, coordinating networking/feed buttons, post signature, pagination titles, styled and numbered comments section, styled block quote, and hover pop! color post titles and links. Note: Sidebar profile styling extra.

Purchase this template!

2009-09-10T03:52:00.000-07:00

Caitlin. Photoblog with navigation menu, sticky welcome element and divided, three-column footer. Includes coordinating newtworking/feed buttons, matching Twitter bird and Twit This! icon, numbered and styled comments, favicon, optional post signature, hover pop! color post titles, and pagination titles. Order the Misha as is, or order a change of colors, and choose from dozens of patterns that we'll base your design on.

Purchase this template!

2009-09-09T13:24:00.000-07:00

Kathleen Two column, bordered layout with flourish-patterned, italicized sidebar, blog footer detail, below-title labels, and centered date stamp. Includes matching Twitter bird and Twit This! icon, styled and numbered comments section, styled block quote and post images, matching RSS button, post signature, and pagination titles. Navigation menu can be added at no charge.

Purchase this template!

2009-09-09T08:30:00.000-07:00

Love. Blogger-based wedding website with photo header and floral detailing, plus matching menu titles and complete "de-bloggification". Menu titles will be made over with your wording choices. Includes matching guestbook form (not shown), favicon, and pagination titles.

Single Sell Design

2009-05-23T17:08:00.000-07:00

Details coming soon!

Custom Design

2009-05-23T10:35:00.000-07:00

Thank you for your interest in Rainy Day custom design. Unfortunately, I'm not currently accepting new clients for custom work, and I'm afraid there isn't a wait queue at this time.

PRICE LIST

2009-03-22T02:45:00.000-07:00

Listed prices are subject to change.

Custom Favicon - varies
Many of the templates include favicons. If you purchase a Custom Colors + Fonts package and your template includes a favicon, it will be revised to match your design's new colors. However, if your template doesn't come with a favicon, or you'd like a different one, I can create a custom one for you. Price varies on whether or not the image/design you'd like is something I can create myself, or if I'll have to purchase an illustration from iStock. Custom favicons start at $8 for simple shapes - if I need to pick something up from iStock, the price would be the cost of the illustration plus a $10 handling/resizing/recoloring fee.

Matching Sidebar Titles - $3-5/per
Matching sidebar titles can be in any of the design fonts listed here (or any free font you know of, or have found online). They'll permanently replace your regular sidebar titles, and you won't be able to edit them once they've been installed. If you move gadgets around in your Layout, the matching titles will move with them, but titles cannot be transferred between gadgets after installation. Cost varies depending on style - plain text titles (no background color) are $3 each, and those over a background color (example: the footer titles at the bottom of this template) are $5/each.

Tag Cloud - $8
Many of the templates come with tag clouds installed, but if you'd like one added to a template that doesn't, I'll just need to know the two colors you'd like it to range between, and which of these websafe fonts you'd like it to appear in.

Sidebar Profile Styling - $10
You can always add a standard profile gadget to your template, right from your Layout. I also provide instructions on how to style your sidebar profile using HTML (in the way I've done on some of the templates) right here. However, if you'd me to take care of putting together something for you, I can do so. I'll resize and upload your photo, to which I can add a decorative border or a drop shadow; I'll also take care of configuring the text of your bio/welcome message. If you'd like a small custom "more about me" title, I'll create and add one of those, as well.

There are several different styles of sidebar profile styling, shown on various templates. If you'd like to add this option to your package, please let me know which template exhibits the style you'd like, and have your photo/text decided upon and available at the time of your order.

Sticky Element Styling - $10
All of the templates come with a sticky welcome element. What's this? Most clients who purchase photoblog templates like to use the sticky element to post their logo/title, a profile picture, and or some welcome text. I provide instructions on how to configure a sticky element to look like the one I've styled on the Charlie template right here - here's another set explaining how to add just a photo and greeting.

However, if you'd like me to take care of creating a sticky element section for you, I can do so. I'll take care of resizing your photo, logo/title and text to fit the space perfectly (it can be a bit of trial and error). If you'd like a matching greeting title, such as the "Welcome..." title in the sticky section of the Chloe template, I can create one of those to match your blog, as well. If you'd like to add this service to your package, please hold off on making your payment until you have the content for this decided upon and available.

Post Layout Changes - varies
If you'd like the arrangement of your labels, date stamp, comments link, or post sign-off changed from how it looks on the sample template, I can usually do so. Likewise if you'd like changes to the alignment of certain titles. Just let me know what you have in mind! (Cost ranges from $5 to $10)

File Saving - $10
If you think you'll want to update your blog header at some point, or you'd just like the peace of mind of knowing your blog is backed up from head to toe, this is the option to choose. I'll save a copy of your graphic images, for easy revisions. I'll also keep a copy of your template HTML on file. Please note that this fee covers the cost of saving the files - actual updates are an additional fee, listed below.

Header Update - $10
If you've opted for the file saving option and you'd like me to update your header using the graphic images I have on file for you, updates are $10 each. Note: updates include simple changes of title or image exchanges; more complex revisions may be more.

PAYMENT

2009-03-14T16:33:00.000-07:00

Thank you for your interest in a Rainy Day template. At this time, the shop is currently closed to new business.

Template Features

2008-12-21T18:10:00.000-08:00

Each Rainy Day template is loaded with features that will keep your blog stylish, functional, and best of all, highly customizable. The templates are easy to use, easy to personalize, and have all the same drag-and-drop widget functionality as Blogger's Template Designer options. Please see individual template descriptions to find out what features each layout offers specifically, but in most cases, the templates include:

When Blogger introduced the Template Designer, they removed the "front end" color and font options (the fun stuff), and forced bloggers to use their new, more generic layouts if they wanted control over those things. The Template Designer
gives bloggers the ability to quickly manipulate the layout of their blog design (including the width of columns, plus certain color and font choices), but it limits the extent to which the blog can be customized.

With a Rainy Day template, you'll have control over the color choices for nearly ALL variables of the design (things like your above-post date stamp, post title font, navigation menu, multiple hover and border colors, comment box and blockquote colors, etc.) In other words, I give the fun stuff back! To make these changes, you'll just click over to the "Edit HTML" tab and type in the color codes of your choice (directions provided here). You'll also be able to change your individual font choices (for things like blog posts, post titles, footer text, etc.), if you so desire. Please see the FAQ for a more detailed explanation of the difference between my layouts and those of Blogger's Template Designer.

A block quote is a section of blog text offset from the rest by color, font, or other detailing. Most templates feature a block quote with a colored background and a styled border. Block quotes are great for highlighting recipes or other important info, and are easy to use - simply highlight the text you wish to offset using your mouse, then click the quotes icon above the compose box.

An optional set of four small buttons which can be placed in your sidebar, sticky welcome section, navigation menu, or blog footer, and hyperlinked to Google Reader, your RSS feed, and your Facebook and Twitter pages - great for encouraging interaction and reader loyalty.

A small, bird-shaped icon appearing below your individual blog posts, a Twit This! icon allows readers to instantly tweet about your blog post on Twitter (optional).

A bird image that can be placed in your blog's sidebar and hyperlinked to your Twitter page. Placed near an HTML gadget of your Tweet stream, it's a fun, instant update for your readers of your goings-on (optional, of course).

An optional personalized sign-off that appears at the end of your blog posts.

A comment box featuring a background color or pattern, plus border styling (comment form must be set to "embeded" to see this detail). In most cases, you'll be able to change the color and border color of the comment box easily, right from your layout.

Individual comments will be numbered - perfect for giveaways and to facilitate reader discussion (comment form must be set to "embeded" to see this detail).

Most standard Blogger templates feature sidebar titles and post footer text "locked" into uppercase; all Rainy Day templates are made over with unlocked capitalization, so you can retain control over the look of these details.

A space at the top of your blog posts for posting announcements and welcome messages - see here for a visual.

The standard text of "previous entries", "newer entries", and "home" replaced with fonts to match the template header or sidebar.

PACKAGES

2008-12-20T18:33:00.000-08:00

The Ready Made package is the simplest and most affordable option for getting a new look up and running quickly.

Learn more about the Ready Made package...

If you like the layout and design of one of the templates, but would prefer it with different colors and/or different fonts, this is the option to choose.

Learn more about the Custom Fonts and Colors package...

If you have an existing business for which you'd like me to create a coordinating blog template or blogsite, there are a few different options to choose from.

Learn more about the Business Branding package...

Want something a little more personalized? With a Built to Suit package, you'll be able to assemble the perfect template for you, from the ground up.

Learn more about the Built to Suit package...

how to add hyperlinked sidebar buttons to your blog

2008-11-08T02:19:00.000-08:00

If you've added any matching sidebar buttons to your template order - you'll need to add them to your sidebar and create a hyperlink between the button(s) and whatever you want the button(s) to link to. There are a few ways this can be done.

Picture Gadget. If you only have a single button, you can simply upload to your sidebar from your Layout as a Picture gadget. Simply click the blue Add a Gadget link wherever you'd like the button to be. Choose Picture, and then upload the button directly from your desktop. You can then insert the URL you want the button to link to in the blank "link" space.

Remember, you can link a button to a single post, an outside link such as another website, or even a label with your blog. (For more info about using labels as links, see here).

HTML/JavaScript Gadget. You can also add the button as an HTML/JavaScript gadget. Doing so will allow you to control the alignment of the button(s) (so, place it/them perfectly in the middle of your sidebar), as well as add multiple buttons that will sit flush vertically or horizontally. Here's how:

1. Upload the button as an image to any blog post on your blog under the Edit HTML (not Compose) setting (the size you choose doesn't matter).

2. Copy/paste the image's HTML code into a JavaScript/HTML gadget from Layout / Add a Gadget. After you've grabbed the image's HTML code, you can actually delete it from the blog post (and republish or delete the post). This is since once you've uploaded an image to a blog post, it will remain stored in your Blogger Picasa album (which is also where the image will be hosted).

3. Looking at the image HTML code, this is roughly what you'll see:

Replace the portion of the code in red with the URL you want the button to link to. This is how the hyperlink is created, and what will cause clicking on the button to link to a post, blog label, other website, etc.

So, if for instance I want the button to link to rainydaytemplates.com, this is what I'll change the href portion of the code to:

Or, if I wanted to link the button to the "photoblog" label from my shop, I would change the href portion of the code to this:

This way, clicking on the button will bring up all posts with the label "photoblog".

4. Finally, if you'd like clicking on the button to launch a new browser window, add target="_blank" just before onblur:

5. Save the gadget, refresh your blog, and check to make sure you've hyperlinked the button correctly.

If you have two buttons that you'd like centered on one line, upload and add the second HTML code directly after the first one, and remove all spacing between the two. You'll have a single block of HTML that'll look roughly like this:

6. Next, frame both images using this center alignment code:

<div style="text-align: center;">HTML CODE GOES HERE</div><div style="text-align: center;"></div>

(Replace HTML CODE GOES HERE with the HTML code for your images.) Now you'll have a single block of HTML that'll look roughly like this:

If you have four buttons, first add, hyperlink, and center the top two, then add, hyperlink, and center the bottom two immediately after that. In other words, center each horizontal line of buttons separately.

RETURN TO HOW TO'S FOR BASIC INSTALLATION
RETURN TO CLIENT RESOURCES

Client Respones

2008-11-01T02:40:00.000-07:00

I'm so excited about my blog's facelift! - Blair, Joie de Vie Jewelry and Accessories

You are the best. It was so worth the wait. I LOVE IT! I was trying so hard through so many iterations to get something like your template but nothing would do. I am just over the moon excited. - Nicole, Girl Photography

I received a comment on my blog last week calling my blog "soooo serene." Besides having a serene & delightfully charming blog, I also have the most patient & talented blog designer in Ellie. The enhanced modifiability is an awesome bonus feature, as well. Her buttons are the honest truth; she truly beautifies the blogosphere. - Bethany, Bethany Anne

I love it! I am so, so happy. Thank you! - Courtney, Courtney Kimbrough Photography

Ellie, I cannot thank you enough. I absolutely love what you've done. It's perfect. Exactly what I was looking for and SO MUCH more! I could sit and stare at my blog all day long - it's so pretty! I'm completely thrilled with both the blog and the Twitter background. They're perfect and just so me! You've made this whole experience an absolute joy - completely pain free, no hassle - and the whole thing has been done in the space of about 5 days! What a star! - Honey, Honeyfitz Dreams

Ellie, you are awesome. The blog looks AWESOME. Ack. You rock, you rock. - Lindsay, Our Little House Blog

Ellie is funny, competent, thorough and based on the testimonies left on her site, capable of embracing a myriad of design aesthetics. She, as she says on her website, "bend[s] Blogger templates to [her] will" in absolutely wonderful ways. What you're left with is not only a customized front-end but more options for back-end customization than I ever thought possible...Overall, I am 100% pleased with the Rainy Day Templates experience and I would absolutely recommend her services to anyone who is looking for a Blogger facelift or complete overhaul. - Meaghan, oh meaghan

Ellie is very talented and I highly recommend working with her! - Shannon, My little corner of the internet.

THANK YOU! It looks great :) - Brittany, Portabella Photography

Thanks so much again. Your blog designs are the best I've seen so far out there in the internet world that I've searched. - Virginia, lovely little parties

Thanks so much for the beautiful template! My blog seems so much more professional and streamlined, and I've already got tons of compliments from my friends and readers. It was great working with you, and I appreciate your patience and 50+ emails! Your template makes my baked goods look even sweeter! I would recommend your services to anyone :) - Erica, Erica's Sweet Tooth

Thank you so much!!! I love the blog!! - Erin, Erin Pot Pie

I am loving it! The page looks lovely! It's everything that I wanted! You are fantastic!!! :) - Mimi, Irresistible Icing

OMG! Thank you SO much! I LOVE it! It was such a pleasure working with you! You don't know how happy and satisified I am! - Majell, Majell del Castillo Events

Looks fantastic! YAAAAAAAAY! Thank you so much for all of your help. You're amazing!!! - Tracy, Tracy Tendean Photography

I just wanted to thank you for doing my blog. I absolutely love it. You did an awesome job. Thanks so much for brightening my week. - Tammy, Life From My Teacup

Thanks so much for helping me out, your designs are fantastic! - Rebecca, Rebecca Jane

Everything looks amazing Ellie! I'm so glad I waited, because I could never find anything better. The template works just like a factory one, which is great because there won't be glitches. :) Everything was set up so quickly, so my readers didn't have to go through a period of confusion. ** I COULD NOT BE HAPPIER!!! ** You're a doll to work with, and you're so knowledgeable. The next time I need a template, I'm not even looking anywhere else!...For those of you waiting, it's worth the wait! Hang in there, cuz you won't find a more sweet gal to work with, or cuter templates that everyone loves! - Tiana, Tiana Smith

LOVE!! Everything looks fabulous. You are wonderful! - Angela, Angela Smith Photography

*gasp* I think I'm in love! Seriously... it's perfect! Eek! I love, love, love it! I even just did a goofy little clap over here. YES! - Emily, Zolirew

OMIGOD!!!! I LOOOVE IT!!! :)) Ellie I'm so happy... I really want to thank you for everything. You were so patient, you don't know how much I appreciate it. - Marie, Blushing and Sweet

I absolutely LOVE it!!! There's no way I could have come up with a better color combo!! It's perfect. Fabulous job! Thanks so much. - Cara, Rick and Cara 814

Ellie!!!!!!!! OMG OMG OMG! took a first look and I am too excited...It's wonderful Ellie thanks, Mwah! Big Kiss. - Gisele, Breakfast, Lunch, Dinner, Punch

Thanks for everything, you were such a doll to work with. - Rebecca, Ella Minnow Pea

OH WOW that looks AWESOME!!!!!!!!!! Thank you so much once again for all your wonderful help! - Esther, My Bride Story

I'm so excited about my new look! I've been working with Ellie over at Rainy Day Templates for the last month on an updated blog design. She's been absolutely wonderful to work with and I would highly recommend her to anyone looking to freshen up their site. - Kelly, Keg Design

Thanks again for the blogsite. You are simply amazing and the perfect example of someone who takes pride in customer service. When it came time for my 4th site/blog, the only answer to my design needs were you. The response from everyone has been overly positive (of course). Enjoy your holidays and thanks again for going out of your way to help me out. As I said before, you are the blogosphere version of Santa ... you wake up one morning and there it is! A wicked blog design:) PS - 2 of my friends are now sporting RDT blogs and they too look amazing. Everyone loves Ellie!! - Allison, Om I Yoga

I absolutely positively LOVE LOVE LOVE IT! You are amazing ! Thank you so much. This may be a little forward but LOVE YOU! - Lisa, Sing!

Ah, i love it! it looks just lovely. i can't wait to start blogging on it. You've been such a rockstar through this whole entire thing. it's been a blast. You are so the bomb! - Amanda, I Could Be Ordinary

I just love your work and somehow I find the need to keep creating blogs! - Nita, Kitchen Stories

I absolutely love it!!!!! Wow how wonderful it looks!!!!!! I love it!!!!!! yay!!!!!! Thank you so much Ellie!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! I love it, you are so talented and I bet the biggest reward is making people happy when they see your work, that is the best part!!!! THank you!!!!!!! - Katie, Healthy Diva Eats

I have been quite busy with studying for my finals but I just want to let you know I cannot thank you enough for all you did to my blog! I absolutely LOVE it!!! You were so accommodating to my needs and you worked very efficiently! I will probably be in contact with you again soon to spice up my blog some more :) I just can't get enough! - Jenna, Jenna's Journey

That is perfect! I love it! You are a miracle worker. - Lydia, Ever Ours

Ellie! Thank you SO MUCH! It looks amazing!! You are so talented and were great to work with! Thank you thank you! xoxo - Olivia, Everyday Musings

You are awesome! I love it! I just got a message a minute ago from a photo friend...already saying that she loves it too. Thanks again for everything. You were equally as easy to work with. - Charla, Charla Blue Photography

Thank you so much for all the help and the work you put into creating a new layout for my blog, it really made the whole process so easy and I have to say that I love your Client Resources, it is so good! I am still working on the adjustments but it feels very good already and I have already got a lot of compliments! Thanks again for making this such a pleasant experience! - Ilva, Lucullian Delights

I have been wanting to do some major renovations on SWYNTS for months now, and after I found the wonderful creations of Ellie at Rainday Templates, I knew her style was exactly what I had in mind. Ellie is a complete doll and does BEAUTIFUL work. The whole process was super easy and I really didn't have to worry about a thing. I am in love with the new look and I can't thank this woman enough. :) If you are looking to update your blog or want to add anything special, please go check her out! - Lauren, Say What You Need To Say

Ellie, it is perfect!! I just love it so much! YEAY!!!!!! SO EXCITING!!! - Leila, Lulu Cooks and Juju Eats

Dear wonderful Ellie, we are so excited about it! I plan on sending a slew of people your way—this looks great! - Leslie, Modern Kiddo

Rockin! Well thank you so much again. So glad I did this, and you're so helpful as always! - Frenchie, TBD

Ummm, can I just say that I effin' love it!!! Seriously, I think looks awesome! - Kate, Pink Peony Girl

It all looks fantastic! I am already adding photos and text. It's a great setup... really easy to use. I love it!! - Elizabeth, E + K Wedding

Holy cow, I am so excited for the new and definitely 1000% improved blog design! The best part was I didn't have to switch to another blog format, which is what I was trying to avoid. Bigger pictures, easy to navigate and much cleaner. Thanks Ellie, you are the bomb.com! :) - Rebekah, Lowe Photography

Everything looks perfect! Great work Ellie, as always. - Nina, Simply Sapphira Photography

Ahhh I'm so excited!! - Natalie, Natalie Jennette Photography

OMGosh!! I LOVE the blog!!!! I am so excited, I cant believe it looks so amazing! I LOVE it!!!!!! Thank you, thank you, thank you!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! - Natasha, natasha montero photography

Looks fabulous!!!! - Allie, flower allie

This was the best experience! My blog is shiny and polished and loved by my readers. It's now clean and easy to navigate and makes me perk up every time I take a gander! Thank you for being such a wonderful and easy breezy designer! - Jamie, Jamie's Rabbits

It has been my pleasure to work with Ellie from Rainy Day Templates + Blog Design. We have spent the last 8 weeks, 28 emails and a crazy 5 am phone call with Ellie. She is an awesome gem! I am truly grateful for all the help she has given me - Katie, Not Just Vanilla

Okay, i LOOOOOOVE it!! It looks just as I imagined it would! And better! I'm absolutely in love with it! You are blog genius, thank you SOOO much! - Madelyne, maddie e. photography

You. Are. AWESOME! I love love love it and am so excited to get it launched soon!!! I can't thank you enough - and you've worked SO quickly! I am beyond impressed! It's been a pleasure working with you. THANK YOU!! - Elise, Pennyweight

I LOVE IT!! Thank you so much for your patience. I am definitely going to write about how "A+" this experience was even though I tried really hard not to be so A+! - Alice, A Plus Alice

I CAN'T THANK YOU ENOUGH! I love it. Thanks a million!!!!! - Amanda, amanda b photography

LOVE IT!!!!!!! You are amazing! - Lisa, Through Lisa's Lens

Oh, I'm so excited!!!! Thanks for everything Ellie! You rock my world. - Elizabeth, simple fancies

Thanks again for all you did. I've already gotten a few emails and comments about the new layout! I am so stoked! You were a delight to work with - I appreciate all you've done! - Naomi, Rockstar Diaries

Thank you!!!!!!!!! Heaps of love for being patient with me!! - Sherri, beyond red and green

OMG!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! I LOVE IT ELLIE!!!!!!!! YOU ROCK MY SOCKS! ...it's beautiful - I'm uber excited! It's more than I coulda hoped for. Thank you so much. You are my hero! - Nely, All About {N}

Okay Ellie, we are in love. Obsessed even. I keep staring at the template and I LOVE IT. It's just perfect. So much more professional and high-end. - Andrea and Jodi, Gwyneth Paige

Thanks so much for getting this to us so quickly!!...The blog looks super duper fantastic. We are so excited for our blog to stand apart from our competition. You have helped us achieve this goal... You are awesome!! - Amanda, domicile

i can't rave enough about Ellie and how easy she was to work with, and fast! i am super thrilled with my new blog layout and page. the whole look just feels so much more in tune with what i wanted chicpea studio to be. so if your blog needs a new face lift and you use Blogger go to Rainy Day Templates. believe me you will be happy you did. - Jennifer, chicpea studio

I love it, thanks so much Ellie! - Rachelle, truffled ruffle

It's perfect, Ellie! Thanks again for all of your hard work on this, you're fantastic...you have been a dream to work with!! I am positive you've heard this a million times before, but you seriously rock. Seriously. - Michelle, Chick Pea Cottage

I love it, I love it, I love it! :) Thank you for all your patience and hard work!! - Ellen, Ellen Benson Photography

Thanks so much. You are providing an incredible service for such reasonable costs. I have been toiling away at my blog template to no avail. The blog was so ugly I could not bring myself to actually publish a post. Then you came like a bright, shiny blogging angel to usher me from generic blog template hell. :) - Emilee, crazy for choux

Oh my goodness, I can't believe the difference an amazing template makes...I absolutely love it...Thank you so so much, Ellie. You really saved the day. :) - Katie, Save Gocco

Thanks so much! I love it and after spending some time putting it all together I am loving it! The client resources were so helpful and I appreciate it so much. - Jenny, Anything Pretty

Looks awesome. - Alicia, Seaside Invitations

Thank you so much, Ellie! goodLife {eats} looks fabulous, fun, and professional. I love the work you've done and would recommend you to anyone looking for an affordable blog redesign. So happy I was able to work with you! You're a great asset to the blogspot blogging community. There's no need for an ugly blog! - Katie, goodLife {eats}

Love it... love it... love it! Thank you so much :) - Amy, Hiley Creative Photography

Ellie, you rock! This looks soo good! I love, love, love it!!! You truly are very talented and so much fun to work with. - Nirvana, Nirvana's Kitchen

I'm so so so happy with it. Thank you for making this so easy and great and totally beautiful. - Katie, Art Wall

Thank you Ellie i love it... It will be quite a big step up for my humble little blog. - Jennifer, chicpea studio

I really love it, it looks SO perfect. - Amanda, Martinis or Diaper Genies?

Ellie, you have no idea of the joy and excitement on the other hand of your screen....You are making the blog so nice and pro while remaining feminine and fun :) Your business can't be anything but a success. Your work is fabulous. If you did not live this far enough I'd deliver goodies to your mailbox!! THANK YOU!!! - Helen, Tartelette

Oh thank you so much, I love it!!!!! You're very good and quick too! I am so happy I found your website! - Sandra, Sandra Brzezinski Photography

I wanted to tell you it was a huge pleasure to work with you and I'm so happy with how my blog turned out! I appreciate your attention to detail and the quick turn around time. I'm passing your name along for sure. - Karen, Dinner with Julia

You are so awesome! Thank you so much for your quick response and such professionalism...You are amazing in how efficient and hard you work!!! I really love how the blog you created looks. Very nice! - Gloria, Grand Engagements

AWESOME ELLIE! You were a pleasure to work with and I’m so excited about this great new look! - Lynn, Paris Hotel Boutique Journal

Thank you so much for the fast response!...And I love love love my new blog!! - James, Clickr Photography

My blog has been around for one year. I jumped right in without a lot of direction. Over the course of the past year I have played in the blog design waters with no satisfaction. i knew I wanted to hire someone to help me but was looking for someone who could help with my personal taste. When I first discovered Ellie of Rainy Day Templates I knew I had found my match! Her whimsical, classy and elegant blog designs caught more than my attention. Ellie went above and beyond all of my expectations. She listened to my ideas and tastes. From there she was able to recreate better than anything i could imagine on my own. I would recommend her again and again. Thank you Ellie for such beautiful work and taking my blog to that level I dreamed of! - Jennifer, Maple N' Cornbread

I think it looks fabulous! I'm so excited! - Allison, Calligraphy & Design

Thanks so much for everything, Ellie! I am in love with the new template. Great work. - Melissa, Chicago Girl Gone Mild

You're the best, Ellie! I have no doubt that, should you feel like relocating to Bloomington, Indiana, we would be BFFs in a heartbeat. Thanks!!!!!! - Shaina, Post Smith

I just wanted to let you know just how much we love our design--I had a few people say to me "wow, it looks incredibly professional-it must have cost you a fortune!" I am happy to pass your name along to them in hopes that they can get affordable, stunning websites, too! I really appreciate your help and guidance through the whole process. You're great, Ellie-thank you so much! - Eve, Eve & John

Ahhh I love it! Gahh thanks! I think it looks amazing, I'm so excited! - Mia, Amelia Katz Photography

Ellie, you're awesome for doing this! Really took a big headache off my plate in trying to learn how to do it myself! I can't say enough good things about this experience. I'm so excited about the blog! - Stacy, S. Jacobsen Photography

Thank you, thank you, thank you for all you've done. You've been fantastically patient while I ran ahead three hundred paces from sheer excitement and fell behind another hundred trying to learn the ins and outs of the blogger platform. I'm truly grateful and I couldn't possibly offer you enough praise. I will recommend you highly. - Erica, Self Not Stuff

Wow, it looks great! I simply adore it! That's exactly how I wanted to be!...And to be honest, I truly believe that this is the most beautiful template from all romanian bloggers :) And this, thanks to you! - Ina, Lifestyle blog

We love it!!! !! !! Thank you! Gracias para todo!! - Rebecca, Dream Within Reach

Love it girl!!! Awesome job! It looks so great! I'm so excited! :) :) Thank you! - Robyn, Be Creative Everyday

Thanks for the blog design...great work. :) - Shea, Mint Photo Lounge

Eee!! I loovvveeeee it! It's so awesome & the color choice was perfect! - Holly, French Fries, Gravy, and Motherhood

It's just perfect! You are so great at what you do. What a great talent and so organized! Thank you again! Love it! - Laci, Laci Davis Photography

You're like a Santa for bloggers!! I go to bed, wake up and "POW!!" new and fun things surprise me the next day. :) Thanks for doing the little extra annoying tasks. Simply amazing! - Alison, A Hot Pink Petticoat

If you're looking for complete creative control, but don't want to deal with all the HTML junk, Ellie's your gal. And she's CHEAP, to boot! - Jenny, LIttle Green Notebook

Fabulous, I can't thank you enough for making me a fantastic blog! It matches my website and my personality! I'm so happy! :) - Megan, Expressions Paperie

Oh Ellie! Thank you! The blog looks FAB! I am very excited! It was a pleasure to work with you...Thank you again! - Merissa, Merissa Cherie

I couldn't be more pleased with Ellie...her prices are beautiful and customer service speedy & fantastic. I'm both poor & cheap so I am really, really excited that I was able to afford (and justify) a nice layout finally, especially one I'm 100% pleased with! - Ameya, wonder & wander

I asked my readers for advice on how to redesign my blog and somebody smartly suggested your site. It has been such a pleasure to work with you. You are insanely talented and explain things as you go along--love, love, love that. Thank you so much! - Susannah, Petunia Face

A huge THANK YOU to [Ellie]! Check her out if you have the opportunity. She really is FABULOUS! - Martine, Making Paper Designs

I have to thank...Ellie Moore, who worked with me, listened to me, gently helped me make good conclusions and sound decisions, and made this whole process extremely fun (and affordable). Ellie, you are amazing. - Garrett, Vanilla Garlic

You have made the whole blog design experience a real treat compared to tearing my hair out to learn Blogger codes. Thanks for making it so simple! - Debbie, hand pecked designs

I’m so excited about the blog…it looks great!!! - Marsha, The Savvy Photographer

You have amazing talent! I really like the new layout!! This has been such a fun experience. Thank you! Thank you! - Kyle, midwest retreat

I love it, love it, love it and it was a pleasure working with you. Thank you so much for your time and effort - well worth the $35. - Kate, Mollie and Finn

Ellie was fast, friendly, and GOOD! If you're looking for complete creative control, but don't want to deal with all the HTML junk, Ellie's your gal. And shes' CHEAP, to boot! - Jenny, Little Green Notebook

I am BEYOND EXCITED! I screamed, I did. I love it, Ellie! You have been a pleasure to work with. I am going to tell every friend who will listen how great you were! THANK YOU SO MUCH! - Kelly, High Street Market

I don't think I could be more in love with it. Ellie was amazing. If you are even thinking about redoing your blog in the least little bit, I couldn't more highly recommend Rainy Day Templates. What fabulosity! - Jennifer, absent minded

I was so excited when I saw my new blog. Looks beautiful and so professional. I can't wait to hear comments about it. Thanks for working so fast and emailing me through the whole process. I really appreciate working with you. So pumped. - Helen, Cuisine d'Hélène

I am loving my new template. It's exactly how I wanted it to look. I love going back to my blog. It has now become my happy place because I'm finally satisfied with how it looks. - Damaris, Within the Corners of My Kitchen

Thank you so much! It looks great and I just love it all! - Jill, the good life for less

I am LOVING my blog! It came together so well. I really appreciate the time that you took putting it together for me and the previews you sent! THANK YOU! - Belinda, Belinda Olsen Photography

It's PERFECT! I'm ecstatic! No, ecstatic doesn't even come close to how happy I am because of your work. Bravo, Ellie. Seriously. Thank you is insufficient to express how grateful I am to you and your talent. Not only am I overjoyed at how the template looks I am even more thrilled with your professionalism, patience and listening ear to make my vision reality. I will tell all my friends who use Blogspot about you. Then again, my weblog speaks for itself! Thank you, thank you, thank you. - Jennifer, In Medias Res

YAY!!!! It looks awesome! LOVE it! Thank you!!!!!! I'm sending EVERYONE your way Ellie! You're amazing to work with and you've got mad skills girl! - Merrit, Merrit D. Photography

My new blog design is a hit! I've gotten so many compliments on it. Best of all, it totally reflects my own design sensibilities and perfectly fits the tone of my blog writings and photos. I enjoyed every aspect of putting this together. You made it so easy and fun. Thanks for letting me have so much input, much more so than I ever expected. - Minnie, Mama Without Borders

I just wanted to drop you a note to say thank you! We love the way our blog looks and we are working to make all of our online media match now :) I finally had a chance to read your tutorial on the photos and we used those instructions for our most recent post - it's a HUGE improvement. Thanks again! - Susan, Bella Weddings

Thank you sooo much!!! i love it! looks great! I love your website and services!!! - Nita, le {e} petitmonde

Ellie is AMAZING! I knew nothing about blogs and she was able to create something better than I could imagine with very vague suggestions! She was so patient with me and helped me with every step of my experience. I love my site and get so many compliments already! I could never have done it without her! - Laurie, Angels Among Us

With limited input Ellie kept surprising me with totally “Kerri” ideas without the pressure of dictating my vision in painstakingly specific detail. She was wonderful to work with from start to finish and should anyone else be considering a fresh face for their blog I enthusiastically recommend her. - Kerri, McCashew

I really appreciate you being so patient and so readily available to try out all the random ideas...I think your creativity helped a lot because I'm a bit all over the place...you really helped me focus on the goal of the design (simple, classic, chic ,and reader friendly) even though at times I had random ideas. - Amy, Relentless Bride

I am so thrilled with my blogs, website, and etsy banner. You've been a dream to work with and so patient with the non techie person I am. - Alison, A Hot Pink Petticoat

Ellie is great at throwing options out there and letting me work through the design. I highly recommend her to anyone interested in a new look. Many thanks! - Pittsy, Pittsy's Place

Ellie gave my blog a much needed upgrade and I can fully recommend her to you in a heartbeat! Really, really nice gal (yes, even on email). Superb customer service! Super affordable and a dream to work with. :) - Brenda, Kuga Designs

Thank you again for such a great design. I'm super happy with it, have gotten lots of great compliments and can't wait to launch the website based on the new blog! I'd be happy to recommend you to anyone looking for a great custom design at a reasonable price. - Carey, Lasso'd Moon Designs

I highly recommend Ellie to anyone who is looking for that new and improved look! She is very patient, by the way, and won't make you feel like an idiot for asking tons of dumb questions (not that you would, but I sure did). - Jora, Domestic Reflections

Fan-bloody-tastic! I would never have considered making over my blog until I saw Rainy Day Templates, and then I just had to have one! The process from start to finish was really quick, but that isn't to say Ellie rushed the job. She took time to listen to my bizarre requests and nailed the look I wanted completely. The biggest praise I can offer her is that people have commented that it is 'very me', she got where I was coming from right from the start. I am recommending her to practically everyone and I will definitely be coming to her again when I set up my next blog in a year's time. - Adele, TwentyFour Blackbirds

Ellie took the time to get to know me and what blog fit my personality and needs! And to top it off she did this on Thanksgiving, quickly and so inexpensive! If you ever decide you want a blog face lift I highly recommend her! - Meaghan, I Kicked Cancer's Ass

I'm no web design genius, but when I came across Rainy Day Templates, I knew I'd found the perfect person to give Listen & Learn music a complete facelift. Ellie worked tirelessly (not to mention amazingly fast!) to produce an awesome new look for my site. She listened to all of my needs and tweaked even the tiniest details to meet my needs. So if anyone is in need of a blog overhaul, I definitely recommend Ellie!!" - Rachel, Listen & Learn Music

The best direction I could offer Ellie was "I like bright colors and patterns." She created a totally perfect design for my blog which not only fits my writing but my personality as well. She was a dream to work with, and her humor made the process a snap. I've considered starting another blog just so she can create another design for me. No, really, I have. Anyway, I highly, highly, highly recommend her! - Tricia, Be Happy Be Happy

Thanks so much for all of your help, amazing services and fun emails. :) You have been absolutely amazing!!!! So excited!! - Nasilele, Nasilele Photography

I love it. I mean, I'm freaking speechless! And that rarely happens! Thank you so much! - Ashley, Ashley Graceless

WE LOVE, LOVE, LOVE IT! It looks so fantastic, I can't thank you enough! You rock!
I will totally recommend you! You are amazing! - Sheri, Capture It Photography Blog and Capture It Photography Blogsite

Initially, I was completely lost when it came to what I wanted my blog design to look like. I gave Ellie a couple of my scattered thoughts and she was able to give me so many options as to what I might like! She let me tweak any and every aspect that I wanted, and was always able to get back to me very quickly with new suggestions and drafts. Now that it is all said and done, I could not be more pleased with the outcome! I really loved how involved she allowed me to be in the process, while still bringing her amazing eye for design to help guide me along the way! I know I am biased, but I think I have one of the cutest blogs on the web thanks to Ellie! - Kim, Life with Lily

how to make an image "unclickable"

2008-10-31T20:04:00.000-07:00

If you'd like to make it such that clicking on an image in your blog - either in a post or in an HTML/JavaScript widget in your sidebar - doesn't lead anywhere (such as to the image's Picasa album page), here's how:

1. Look at the HTML code for the image. If it's an image in your blog post, you'll need to be under the Edit HTML tab (not Compose). You'll see something about like this:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s1600-h/PHOTO.jpg"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>

2. Delete the href section of the HTML, shown below in PINK:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s1600-h/PHOTO.jpg"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>

3. Backspace if necessary, so that the catch(e) {}" tag is flush against the > symbol. The modified code should look something like this:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>

Publish the post (or save the HTML/JavaScript gadget). That's it!

RETURN TO TUTORIALS

change text size in your sidebar or sticky elements

2008-10-23T08:54:00.000-07:00

You can always change the size of your blog text within your compose window. But what if you'd like to change the size of text in your sidebar or sticky welcome element? (for instance, on this sample template, "photographer photo source here" is in a smaller font than the rest of the element).

You can use this simple bit of framing code to change the size of text in any HTML/JavaScript gadget. Just copy/paste the following codes, and replace TEXT HERE with whatever words you'd like to be in the different size. These size classifications are relative to the regular text font size that you have set under Layout / Fonts and Colors.

For extra small text:

<span class="Apple-style-span" style="font-size:x-small;">TEXT HERE</span>

For small text:

<span class="Apple-style-span" style="font-size:small;">TEXT HERE</span>

For medium text:

<span class="Apple-style-span" style="font-size:medium;">TEXT HERE</span>

For large text:

<span class="Apple-style-span" style="font-size:large;">TEXT HERE</span>

For extra large text:

<span class="Apple-style-span" style="font-size:x-large;">TEXT HERE</span>

RETURN TO CLIENT RESOURCES

add a "sticky" element (permanent post)

2008-10-23T08:34:00.000-07:00

All templates now come with an extra element section in the layout, located directly above the main posting column (the Blog Posts section):

This is sometimes called the "sticky" element, since you can use it as a sort of permanent post (it won't have a date stamp or any post footer content).

Using it is simply a matter of adding gadgets to the section by clicking Add a Gadget and making your gadget selection from the Blogger menu (in the above picture, an HTML/JavaScript widget has already been added). You can use it as a profile section, a greeting, for announcements, to add your Twitter bird or networking buttons to - anything you'd like! It will always sit at the top of your blog posts.

It's just like a sidebar element, so you can add multiple elements, as well. But remember that since it's just like a sidebar element, it will have the same settings, including font styling, title styling, alignment, and line height as your other "regular" sidebar elements. But you can use tricks like changing text colors and font size to help customize it.

There are instructions on how to configure a simple sticky element section with an image and some text right here. And don't forget, you can use these tricks for changing text colors on your sticky element, as well.

RETURN TO TUTORIALS

accessories + special touches color change guide

2008-10-17T15:59:00.000-07:00

1. colors for Twitter bird (will be the same for the Twit This! icon). You can just say "use colors from my palette" if you don't want to specify an exact shade for each bit of the bird.
2. colors for Google Reader button
3. colors for RSS button
4. colors for Facebook button
5. colors for Twitter button
6. comment box background color
7. comment box border color

Also, if you'd like the comments themselves to be a particular color, size, or font style, just let me know!

RETURN TO COLOR CHANGE GUIDE

add a search box to your blog

2008-10-17T02:05:00.000-07:00

My super fancy matchy search boxes have been a bit unreliable lately, so until I find a better code for them, I'm providing this basic search box code that you can add anywhere to your blog. Just copy/paste the code into an HTML/JavaScript widget/gadget in your Page Elements. Depending on how your navigation menu is formatted, you can also try adding the box directly after the code for your menu.
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 1px solid #ffffff" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>
If you'd like to give the box a colored border, change the hex color code, below in PINK, to any hex color code you'd like:
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 1px solid #FF6666" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>
You can also change the solid line surrounding the box to dashed or dotted, or even increase the 1 value to make the border thicker:
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 2px dashed #FF6666" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>

RETURN TO TUTORIALS

how to add a stylish profile section to your sidebar

2008-10-17T01:23:00.000-07:00

You can always add a basic Profile gadget to your blog right from your layout. Just go to Design / Page Elements, then, wherever you'd like the profile to be, click "Add a Gadget" and choose "Profile." (You can drag/drop this gadget to another part of your layout after you've created it, too.) You can edit the content of this section, as well as the picture, from your main Blogger Dashboard. However, this can be a bit limiting, since the image will be very small, and you'll be locked in to whatever bio content appears on your Blogger profile page.

If you'd like something a little more visually appealing, you can use a couple of quick, simple tricks to make your sidebar "About Me" just a bit more stylish, such as on this sample template - or this one. All you need is a Flickr account and about five minutes. Here's how:

1. First, upload your profile picture to Flickr (if you don't have an account, no worries, it's free!). Click on the individual picture to bring up a row of options above it. Choose "Edit Photo", and wait for the Picnik application to load.

2. Under Edit, crop or resize your photo as you like.

3. Under Create / Effects, use the various color processing tools to tweak your photos colors, convert it to black and white, or to give it a vintage tint.

4. Under Create / Frames, you can add a border (or two!), or round the photo's edges.

If you have a Premium Picnik account, you'll be able to add a drop shadow to your photo, or a postage-style stamp frame - or even a Polaroid-style frame.

If your sidebars have a background color other than white, and you'd like to add a drop shadow effect (so that the image looks like this over your colored sidebar), you'll need to know the hex code color value of your sidebar background. This is super easy to find. Just go to Design / Edit HTML, and scroll down a bit until you see this section:

#sidebar {
width: 320px;
float: right;
background: #F2F9F8;
border: 1px solid #cccccc;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */eak-word; /* fix for long text breaking sidebar float in IE */
}

NOTE: depending on your template, you may have a colored background widebar, instead of sidebar. Also, your sidebar/widebar background color may be different, but what you're looking for is a six-digit code (such as what's in red above).

Now, go back to your photo on Flickr, and choose the drop shadow option. Leave the Shadow Color black (or you can try grey), but change the Background Color to the hex color code from your Layout. You can just copy/paste the code into the box, and hit Enter for the change to take effect.

5. Save your image, and return to your Blogger layout.

6. Upload your image to any published post in your blog, under the Edit HTML (Not Compose). If you'd like the image to sit to the left of the sidebar/widebar (example), upload it under the "left" alignment setting. If you have a smaller sidebar (or a larger picture), and you'd like it to sit in the middle of the column (example), upload it under the "center" alignment setting.

Copy/paste the HTML for the image into an HTML/JavaScript gadget from your Page Elements.

7. You can now type whatever bio content/greeting you'd like, and it will appear directly to the side and under (for left-aligned images) or below (for center aligned images) the picture.

If you'd like the effect of having multi-level text, such as this, you can use paragraph division tabs to create a new line (the equivalent of hitting Enter). Just type the first line, such as Your Name, then type this paragraph tag:

<p>

Then, type your next line, such as Los Angeles, California (or just skip to your main "about me" content). Add a new paragraph tag each time you want to start a new line.

And don't forget that you can control the colors of this text by following these directions!

RETURN TO TUTORIALS

about color changes

2008-10-10T03:49:00.000-07:00

Like one of the templates, but not in love with its color scheme? No problem. The entire design can be made over in any colors you'd like! First, select the "+color change" option from the drop-down purchase menu underneath the template's description. Then when I receive your order, I'll get in touch to ask what colors you'd like for your blog.

There are are four options for communicating the color changes you'd like - you can choose what's easiest for you, depending on how much control you'd like over the template's new design:

1. You can look at a diagram of the template (I'll provide a link), labeled with all of the variable color sections, and give me your specific color choices (hex color codes) you'd like for each element. I'll need color choices for the background(s), borders, blog title, header elements, all accessories and special touches, including Twitter birds and Twit This icons, networking/feed buttons, and comments and block quote sections.

2. You can create a palette on Colour Lovers (or any site of your choice, as long as it provides hex color values), save the palette online, and furnish me with a link to where it's been saved. I'll use these colors as the basis for your redesigned template. If you'd like specific colors used in specific ways, please let me know before I begin reworking the template.

3. You can send me a .jpg, .gif, or .png file of a palette or other illustration/image, such as appears below. I can import this image into Illustrator and "grab" the colors from it for as close a match as possible. I'll use these colors as the basis for your redesigned template. Again, if you have specific notions about what colors you'd like where, please let me know before we get started.

4. You can refer me to your existing website, or one of the other templates - or any website/blog that uses the color scheme you'd like.

Whichever method you choose, you'll be allowed two rounds of revision to your color choices without additional cost. After that, additional rounds will be $10 each.

obtaining your RSS and Google Reader feeds

2008-10-08T14:58:00.000-07:00

To configure your coordinating networking/feed buttons, you'll need to get the URLs for your blog's RSS feed and Google Reader feed. It's super simple.

1. To obtain your RSS feed, click the RSS button that appears in your browser address window, to the far right. It'll look something like this:

A new browser page will appear, showing your RSS feed. It'll look something like this:

Move your cursor up to the browser window, highlight the URL (http://... address) that appears, and copy/paste it to your clipboard/desktop. The URL will look something like this:

feed://www.rainydaytemplates.com/feeds/posts/default

This is the address you'll plug into your RSS networking button's HTML code.

2. To obtain your Google Reader feed, go to http://www.google.com/reader/view/

Click "Add a Subscription" and enter your blog address into the window that appears. When the page refreshes, showing your blog content, grab the URL in the browser window.

This is the address you'll plug into your Google Reader networking button's code (the "G").

RETURN TO INSTRUCTIONS FOR ADDING NETWORKING/FEED BUTTONS
RETURN TO HOW TO'S FOR BASIC INSTALLATION
RETURN TO CLIENT RESOURCES

how to add your post signature

2008-10-05T16:31:00.000-07:00

To make your post signature appear automatically in each of your blog posts, here's what you'll do:

1. Upload the signature image to Photobucket (or another free image hosting service of your choice).

2. Copy/paste the HTML code for the image to your desktop/clipboard. You may have to mouse over the image to get the code box to pop up and appear like this:

3. Back at your blog's Dashboard, go to Settings / Formatting, scroll down to the empty Post Template box, and copy the HTML code for your signature image into that box. It'll look something like this:

Save. All new posts will automatically start with the signature image appearing in the compose window, which you can then space down as you like.

IMPORTANT - if your blog has any kind of border appearing around your post images, you'll need to sandwich the image HTML with the following code:

<div class="customimage"> {SIGNATURE HTML CODE HERE} </div>

This will prevent the border that appears around your post images from appearing around your post signature. When you add the code, the Formatting box will look something like this:

Save, return to your layout, and start a new post. You should see the signature automatically appear in the compose window.

RETURN TO HOW TO'S FOR BASIC INSTALLATION

RETURN TO CLIENT RESOURCES

how to's (for basic installation template orders)

2008-10-05T15:15:00.000-07:00

If you've ordered a template with basic installation, most of the template's design has been installed and set up for you, including the template code itself, your header, the Twit This! icon, the comments section and block quote styling, all color/font settings, any image border styling, personalized pagination titles, and a blank navigation menu for you to plug your links into.

However, now you'll need to add your menu links, configure your Twitter bird and networking buttons, and add your post signature. If your template comes with any matching titles or buttons, you'll need to add those, as well. Here are easy-peasy instructions on how to do all of these things:

How to Configure Your Navigation Menu
How to Add Your Twitter Bird
How to Add Your Networking/Feed Buttons
How to Add Your Post Signature
How to Add and Hyperlink a Sidebar Button or Title

You really don't need any kind of HTML knowledge to do this stuff, I promise. =) Just go slow and follow the instructions, step by step. However, if you feel you'd rather not deal with it, you can always purchase upgraded installation, at the bottom of this page. If you decide you do need help with installation, that page will also tell you the information I'll need to help you, so please have that ready. Thank you!

About Me

2008-09-29T17:28:00.001-07:00

Hiya, I'm Ellie, and this is my humble little enterprise. I started Rainy Day after I discovered a weird knack for (and addiction to!) bending Blogger templates to my will. I have no formal training in graphic or web design, but I'm a creative problem solver, continually learning new tricks.

I create the templates from my home in downtown LA, where I live with an English Mastiff named Chaucer. When I'm not hunched over my laptop, I can often be found snapping photos, running, or napping. Thank you very much for stopping by Ye Olde Template Shoppe!

adding networking/feed buttons to your blog

2008-09-26T06:26:00.000-07:00

Adding your navigation/feed buttons to your blog is easy! Just follow these steps to create the hyperlink between the button image and the URLs of your Twitter, Facebook, RSS, and Google Reader pages.

1. Upload the Twitter button to a new, blank post on your blog, under the Edit HTML (not Compose) tab and the "none" alignment setting. You'll see a strip of HTML that looks roughly like this:

2. Replace the code in red with your complete Twitter page URL, leaving the quotes intact. Now the strip of HTML will look something like this:

(Remember, your code will be different, but what you're looking for is the section following href=)

3. Next, add "target="_blank" to the code, just before href, giving you this:

This will cause clicking on the button to launch a new browser window. If you'd prefer not to launch a new window, you can skip that step.

4. Now, space the whole block of HTML code down a few lines, to give yourself a little room to do the next button. Repeat the process for each of the remaining buttons.

If you don't know how to obtain the URL for your Google Reader or RSS feeds, see this page.

5. When you've hyperlinked each image to its URL, copy/paste the entire block of code onto your desktop or notepad (anywhere you save a temporary bit of text). Once you have the HTML for your buttons, you can actually republish the post you used (or delete it, doesn't matter) without actually publishing the images for the buttons themselves. This is since once you've uploaded an image to your post, it's been saved to your Blogger Picasa album.

6. Return to your Layout, and choose Add a Gadget, wherever you'd like your sidebar buttons to be*. Choose a JavaScript/HTML gadget, and paste the entire strip of HTML for all of your buttons into the gadget window.

Remove all of the spacing between the blocks of code to get the buttons to scoot together. You'll have a big, continuous block of HTML that'll look something like this:

7. In order to center align the group of buttons, frame the entire block of HTML in the following code:

<div style="text-align: center;">HTML CODE GOES HERE</div><div style="text-align: center;"></div>

(Or If you'd prefer to left or right justify the buttons, change "center" to "left" or "right", accordingly.) Now the block will look something like this:

Save the gadget and refresh your blog (by clicking the header) before checking to make sure the buttons have been added correctly.

*In most cases, the sample templates have the networking buttons added to the sidebar area. In some instances, however, the buttons have been added into the same JavaScript gadget as the navigation menu, or in the post footer area, or in the element directly above the main posting area. You may wish to experiment with where you'd like your buttons to be.

RETURN TO HOW TO'S FOR BASIC INSTALLATION
RETURN TO CLIENT RESOURCES

adding a Twitter bird and tweet stream to your blog

2008-09-25T08:22:00.000-07:00

Adding your Twitter bird to your blog isn't tricky - it's just a matter of uploading the image to your blog, then doing some cutting and pasting. Here's what you'll do:

1. Upload the image for your Twitter bird to any blank blog post, under the Edit HMTL (not Compose) tab. In order to determine what alignment setting to upload it under (left or center), you'll need to decide where you'd like the bird to be. If it's a smaller-sized bird, you might want it to sit on the left side of your sidebar, with your Tweets appearing to the right and below the bird, like it does here. If this is the case, choose the left alignment setting.

Or you might prefer the bird to be centered in your sidebar, and have your tweets appear directly below it (how it looks here). If this is the case, choose the "center" alignment setting.

2. Once the image has been uploaded to your blog post, you'll see a strip of HTML code that looks roughly like this:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s1600-h/BIRD.jpg"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>
3. Replace the href section of the code, shown above in PINK with the complete URL of your Twitter page, giving you something like this:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://twitter.com/rainydaydesign"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>
Remember, your image code will be different, but what you're looking to replace is the bit of code after href=

4. Now, add "target="_blank" to the code, just before href. The HTML code will now look roughly like this:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" target="_blank" href="http://twitter.com/rainydaydesign"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>
Adding this little bit of code is what will cause clicking on the bird to launch a new browser window (so that your visitors don't navigate away from your blog). If you'd prefer not to launch a new window, skip this step.

5. Cut the entire strip of HTML code from your post, and copy it to your notepad, desktop, document, etc. Return to Layout (when the pop up window appears asking you if you're sure you want to navigate away from this unsaved post, click "yes" - you don't need to either save or publish the post you've just used).

6. Click Add Gadget, and choose HTML/JavaScript. When the pop up window launches, paste the entire code for your Twitter bird image into it, and click Save.

7. Check from the "front end" of your blog to make sure your bird is appearing correctly. If he's not, try again. If he is, awesome! Go on to the next step....

8. Copy/paste the following code directly after the HTML code for your bird, in the same HTML/JavaScript gadget.
<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">follow me on Twitter</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>

9. Change "rainydaydesign" to your own Twitter user name, in both instances it appears.

10. You can change the 2 towards the end of the code to anything between 1 and 5. This is the number of recent tweets that will appear immediately after your bird.

If you'd prefer the bit that says "follow me on Twitter" not to appear, delete the section in PINK below:
<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">follow me on Twitter</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>

Or, you can change "follow me on Twitter" to say whatever you'd like. Just replace the pink highlighted code below with your own invitation:
<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">follow me on Twitter</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>

For instance:
<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">Let's get tweety together.</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>

That's it! You've just Twitterfied your blog! Depending on whether your bird has a background color applied to it, or if the image is on a transparent background, you may wish to experiment with moving the bird around your blog, to see where you like him/her best. You can put the image in your sidebar, above your main posting column, in the footer section, etc.

RETURN TO CLIENT RESOURCES

changing your post footer content

2008-09-08T15:24:00.000-07:00

Your post footer content is the section underneath (or in some cases, above) your blog posts that says "posted by...", "labels:" and "comments."

You can change these areas to say whatever you'd like, including to say what I have on some of the sample templates ("filed under", "said Ellie", etc.)

Here's how:

1. Go to Design / Page Elements.

2. Click Edit, at the bottom right corner of the Blog Posts widget.

3. In the pop-up window that appears, you'll see a series of boxes. You can edit the content of your post footer by changing what's inside these boxes.

For instance, if you'd like your post footer to say "xoxo, Ellie", you'll replace the bit that says "posted by" with "xoxo,".

If you'd like "labels" to instead say "and then filed it under", you'll replace the bit that says "labels" with "and then filed it under", etc.

This is also the area where you can change the formatting of your above-the-post date stamp and below-the-post date stamp.

RETURN TO TUTORIALS

wonky fonts or color settings

2008-09-08T10:04:00.000-07:00

There are two different places where you can change the font of your blog posts. From Layout / Fonts and Colors, or from the drop down menu at the top left of your blog posts.

As a rule, I strongly discourage bloggers from changing the color or font settings of their text within the blog post itself. I only recommend you do that for the occasionally enlarged or differently colored title, such as directed here. Otherwise, you'll have to deal with a lot of HTML color, font, and size tags which can be difficult to work with unless you're familiar with them.

In general, you should always make your font, font size, and color choices from Layout / Fonts and Colors.

However, if you do find that your fonts, font sizes, or color settings have gone wonky because you've been modifying them within the blog post, the easiest fix is to just re-do those posts for which there is a problem.

1. Looking at your blog (as a normal visitor would do), click/drag to highlight the text of the post you're having problems with. Copy this text to your notepad, desktop, a document, etc. Right click (PC) or Drag/drop (Mac) the images used in your post to save those, as well.

2. Open the problem post, and make sure you're under the Edit HTML (not Compose) tab.

3. Erase the entire post.

4. Copy/paste the text of post back in, and re-upload your images.

5. Republish the post.

RETURN TO CLIENT RESOURCES

posting two or more images on one line

2008-09-05T07:04:00.000-07:00

If you'd like to post two images on one line (such as I did here), you need to do a little bit of math:

1. Determine the width of your main wrapper, by following the second set of directions here.

2. Determine the padding and image border width of your template by following the same directions (step #3).

3. Now, here's the formula...

main wrapper width - 2(padding + image border width) = how much space you have for two images on one line. In other words, if your main wrapper width is 600, your padding is 4px, and your image border is 1px, here's your equation:

600 - 2(4 + 1) = 590
or
600 - 10 = 590

That means, you'll have 590 pixels worth of width in your main column, in which you can post images. Now, there's a bit more math to be done, since you'll need to divide that number by the number of images you want to post in one line.

If you want to post two images in one line, you'll divide 590/2, giving you 295. That means that both images can be 295 pixels wide, to sit on the same line.

You may have to play around a little bit to get the exact size and spacing you want, but once you determine the right size for two images (or three, etc.), jot it down so you don't forget.

RETURN TO TUTORIALS

Blogging 101: labels as menu titles

2008-09-03T02:52:00.000-07:00

One option for organizing content on your blog is to use individual labels from your blog as links in your menu.

If you're not sure what a label is (also called a "tag" or a "category"), go to Posting / New Post. At the bottom right-hand corner of your blog composition window you'll see a bit that says "Labels for this post:". In the open space to the right of that, you can type in keywords to classify the content of your blog post. These keywords are what's called "labels", and they will appear above or below (depending on the styling of the template) the blog posts they go with.

If you're brand new to blogging, it's a good idea to try this concept out in order to understand how it works. Just write a post, and add the label "sample". Click publish (this is an important step). See how it says "sample" at the bottom of the post you've just written? Now, click on the actual label itself. Your blog will refresh, and you'll see a little window that says "Showing All Posts With Label Sample" at the top of the page. Underneath that window, the post you wrote will appear. If you were to to label several posts with the word "sample" and then click that label, your blog would refresh showing ALL the posts to which that label is applied. Getting a sense of the potential?

Now, here are some ways you can utilize this option:

Say for instance you're a florist, and you'd like to classify each post that has a photo of one of your bouquets as part of your portfolio. Your navigation menu can contain a "Portfolio" title, linking on which will bring up all posts that have your portfolio label - all posts in which pictures of your bouquets appear. Then prospective clients can see all posts with examples of your work all in row by clicking the "portfolio" link at the top.

Other ideas for labels in your menu: Press (for professionals), Engagement (for photographers), Favorites, Bargains (for decorator blogs), Recipes (for chefs), etc.

To see an example of how this all works, check out this template. If you click the menu title "Affianced", it will bring up all the posts I've published which contain that label.

To use a label as a menu title, simply click on that label in your blog, on any blog post where it's applied. Your blog will refresh, showing a status bar that says "Showing newest posts with label tips". Copy the URL for this page - it will look like this:

http://www.onepixeldashed.com/search/label/tips

and insert into one of the "URL of TITLE X" part of your navigation menu's HTML. Then replace the "title" with the label itself. When you're done, the line of code will look like this:

<li><a href="http://www.onepixeldashed.com/search/label/tips/">tips</a></li>

RETURN TO TUTORIALS

Blogging 101: posts as menu links

2008-09-03T02:35:00.000-07:00

One way to organize content on your blog is to use a post as a sort of "page" on your blog. We call these post-pages. For instance, say you'd like to write up a small bio about yourself or your company, and would like it easily accessible to your readers, by way of your navigation menu. In other words, you'd like it configured such that clicking a certain title in your navigation menu will bring up a certain post-page.

Here's what you'll do...

1. Write a blog post that contains the content you'd like to share. It could be an "About Me" post containing your bio information, a "Contact" post containing your email or company address - maybe even a list of links to your favorite shops that you've titled "Favorites".

2. Publish the post. (This is a very important step.)

3. Click on the post title. When the blog refreshes, you'll see that the only post on the page is the one whose title you've just clicked on.

4. Move your cursor up to your browser's address window. This is the line at the top of your browser page containing the URL (http://www.... address).

5. Highlight the entire URL, and copy/paste it to your notepad, desktop, etc. It'll look something like this:

http://blog.blogspot.com/2006/09/about.html

Insert this URL into the appropriate place in your menu, replacing one of the URL OF MENU TITLE sections of code. Then replace the MENU TITLE with whatever you'd like, such as "About" or "About Me".

RETURN TO TUTORIALS

Blogging 101: "about" content

2008-09-02T12:45:00.000-07:00

Sometimes people get confused about how and where they can post "About" content on their blogs. These are the options:

1. You can have an About section in your sidebar. This would be a photo of yourself and some bio content.

If you'd like to put an "About" section in your sidebar, either you can do so yourself (by clicking the Add a Profile gadget from Layout), or you purchase the Profile Styling option from the extras & options page, and have me create one that's a bit more stylish (a larger picture, with a frame or drop shadow, a matching title, etc.).

Please note that there's no way to link sidebar content to a horizontal menu. Your visitors will find your "About" content by seeing it in your sidebar.

2. You can have an "About" post, which contains (for instance) a photo of yourself and some bio content. This post can then be linked to your horizontal menu, so that when visitors click on the title "About" (or whatever you'd like it to say), it brings up the published post with your information.

3. You can link your Blogger profile to your horizontal menu. This way, when visitors to your blog click on the "About" title in your navigation menu, it will launch your Blogger profile.

4. You can use a "sticky" welcome element section to contain your "About" content. This content will not move, and will remain static the top of your blog posts.

RETURN TO TUTORIALS

now and later FAQs

2008-08-28T05:06:00.000-07:00

I've found that many of the same questions come up both during and after the process of setting up your blog, so I put together this second FAQ. Hopefully it will anticipate and answer any questions you might have.

NOW

Why is the sidebar content on my preview site different than the sidebar content on the sample template?
The sidebar content shown on the sample templates (blog rolls, archives, welcome sections, etc.) is exactly that - sample. You'll be in charge of adding and creating all of your own sidebar content, and deciding what to title it.

Can you change my post footer wording to say the same thing it says on the sample template?
After installation, you'll be able edit that content to say whatever you'd like under Layout / Blog Posts. Feel free, of course, to use any of the devastatingly clever wording I've come up with.

I'm getting a template with a photo header. Will I be able to change it later on?
You can change your header image anytime you'd like! Here are instructions how.

Can I redirect my blog to a custom domain with my new template? I don't want the .blogspot tag in my address.
Yep - you can do so from Settings / Publishing. You can actually purchase your custom domain right through Blogger. Very easy, quick, and cheap.

Will you take care of re-directing my blog to my custom domain for me?
Sorry, no, that's not a service I provide.

Can you create a matching feedburner box/button for me?
Sorry, no. I don't know very much about feedburner, so I don't really like to mess with it.

How do I pay for the extras/accessories I'd like?
I'll have you settle up with me just prior to installation, by visiting my PayPal page.

Where will I put my "About Me" info? Do those go on separate pages?

This post explains the what, where, and how of "About Me" content.

Also, there's an explanation of the difference between blog posts and web pages right here.

I'm confused about menu titles, menu links, and how that information is linked up. Do I need to make separate blogs for each thing that goes in my menu?

Please read this post about navigation menus, and this post about posts v. pages.

I'm not sure yet what I'd like to put in my navigation menu, or I don't have those posts/labels ready yet that I'd like the titles linked to. Can you add this information later?

If you'd like me to come back into your blog and add your menu information later, after I've installed the rest of the template, I can do so for an additional $5.

Will I be able to change the photo I've chosen for my blog header?

You're welcome to change out your header image(s) at any time yourself, but you'll need to supply your own finished, correctly-sized header to do so. Please note that the Zoe and Jordan templates aren't formatted to allow you to switch out just the images - the entire header area, including title/tagline, would need to be recreated. Likewise, the Amelia header image and blog title are on the same level (in other words, removing the picture will remove the blog title). The Charlie header image can be replaced at any time with any 930px wide image.

You're setting up my profile styling for me with a picture I've supplied. Will I be able to change that picture out later on?

You can always edit any of your sidebar content yourself, later on. But bear in mind that if I'm styling your profile, I'm doing so by using an HTML/JavaScript widget, not a standard Profile widget. You can always add your own Profile widget (Layout / Add a Gadget / Add a Profile) yourself, and then change the photo that's used on your Blogger profile page.

But if you'd like to change the photo I've added to your sidebar, you'll need to first resize it, then upload it to a post, then copy/paste the image HTML into the HTML/JavaScript widget in your sidebar. And if I've given your profile picture any kind or border or drop shadow, that special effect won't transfer over to your new picture. The picture itself would need to have the border/drop shadow re-added by me.

LATER

Where's my personalized pagination?
It won't show up until you have enough posts showing on your first page to warrant a second page. To find out how many posts-per-page you have set, go to Layout / Blog Posts. You can change the number to whatever you'd like, but I don't recommend more than 10-12 posts per page, otherwise your blog may load rather slowly and cause visitors to leave.

Where's my Twit This! icon?
Twit This! icons only appear when an individual post title is clicked on. This is also called the post-page.

Where's my post signature?
If you have a post signature that appears above the post footer divider line, it will only appear on future posts (though I may have added it to one or two of your posts to check the code). When you write a new post, the code for the signature will automatically appear in the post window; just space it down once or twice, and then compose your post as usual.

Where's my Blogger Navigation bar? The long skinny bar at the top through which I sign in?
By default, and since most clients request it (because it's fugly), I disable the Blogger NavBar. If you'd prefer to keep it, there are super easy instructions on how to add it back right here.

Where's my site meter?
That's part of the sidebar content that needed to be saved prior to installation. I try to make sure that's very clear beforehand, but I apologize if you missed that bit.

how to post larger images (updated editor)

2008-03-24T01:37:00.000-07:00

If you prefer to use the updated editor, and you'd like to post larger images to your blog, here's how. (Though please note: mine is just one set of instructions, for one method - there are other methods that may be easier for you, and other sets of instructions across the web for accomplishing the trick.)

The good news the updated editor is that it allows you to post images in the "extra large" size, as large as 640px wide. Simply make sure you're under the Compose tab, then select the image icon (tiny landscape) from above the compose window. Choose your file, and when the image has loaded, select the extra large size.

However, if you have a larger main column (such as a photoblog), and you'd like even larger images, you'll have to do some quick HTML tweaking.

1. First, before uploading your image, you'll have to presize it to perfectly fit your template. To find out the maximum size images that your main column can accommodate (without spilling over), please see that template's description. (If you have a custom template, see here.)

You can presize your images for free on Photobucket or Flickr if necessary.

2. After uploading your image to the blog post under Compose, click the Edit HTML tab. You'll see the block of the image's HTML, something like this:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s1600/3750991751_087e5a9547_b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="428" src="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s640/3750991751_087e5a9547_b.jpg" width="640" /></a></div>
Find and delete the height tag, highlighted above in PINK.
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s1600/3750991751_087e5a9547_b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s640/3750991751_087e5a9547_b.jpg" width="640" /></a></div>
Now, change the width value, highlighted above in GREEN, to the width of your presized image. For instance, if you have the Charlie, you'll change that value to 870px:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s1600/3750991751_087e5a9547_b.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/_f9kYcQ0o01M/S6nQNgpykpI/AAAAAAAAUtU/J7Hh4zd94Y4/s640/3750991751_087e5a9547_b.jpg" width="870" /></a></div>
Publish the post. Your image should be the correct, full size.

**Note: I've noticed that with the Charlie template (and possibly the other photo templates with large main columns), you need to choose "Left" alignment to get the images to sit correctly in the middle of the column.

RETURN TO TUTORIALS

PACKAGE DETAILS

2008-03-10T07:56:00.000-07:00

The Ready Made package is the simplest and most affordable option for getting a new look up and running quickly. The template you choose will be "retrofitted" with your own blog title (and tagline, if you have one), but there will be no changes to the fonts or colors of the layout. If it's a photo blog template, the header photo(s) will be replaced with your own image(s).

Includes free installation of template and all accessories, link-up of the optional social media and subscription buttons (Facebook, Twitter, Google Reader, and RSS), and storage of any images (such as background patterns) in your Photobucket account.

After installation, if you so desire, you may make your own font/color changes to the design by following these instructions.

For information on exactly what options you'll be able to control, please see the individual template descriptions here.

When you place your order, you'll fill out a short form that gives me all the information and materials I need to get started. I'll be in touch shortly after that to let you know I've received your order, and send over a preview of your header for your approval ASAP. Once you approve your header and give me your Blogger and Photobucket passwords, I'll get you set up.

Prices for the Ready Made package vary by template, and range from $40 to $65; you can view the full price list right here. Extras such as custom favicons - and extra services such as sidebar profile styling or sticky element styling - can be added to this package, à la carte. See extras.

If you like the layout and design of one of the ready made templates, but would prefer it with different colors and/or different fonts, this is the option to choose. The header design will be "retrofitted" with your title (and tagline, if you have one) and remade in any colors and/or fonts you'd like. If the template contains any background patterns, those will be changed to your desired color scheme, as will all coordinating accessories. Includes free installation of template and accessories, link-up of the optional social media and subscription buttons (Facebook, Twitter, Google Reader, and RSS), and storage of any images (such as background patterns) in your Photobucket account.

When you place your order, you'll fill out a short form giving me the information and materials I need to get started; I'll be in touch shortly after that to let you know I've received your order. Using the content you've provided, I'll create a blog header and accessory set for you to approve, as well as a swatch of background pattern (if appropriate to your template). In some cases, I may provide either a mockup image or a live preview site for you to review. As soon as you approve these details, I'll install the template and all coordinating accessories for you, as well as a blank navigation menu (it will be up to you to add your own menu titles and links, following these directions).

Prices for the Custom Colors + Fonts package vary by template, and range from $60 to $85; you can view the full price list right here. Extras such as custom favicons - and extra services such as sidebar profile styling or sticky element styling - can be added to this package, à la carte. See extras.

PLACE YOUR ORDER

2008-02-25T20:33:00.000-08:00

coming soon!

About Enhanced Modifiability

2008-02-12T18:30:00.000-08:00

If you've customized the color or font settings of your Blogger blog, you know that you can make these changes under Layout / Fonts and Colors, in the scroll box. It's there that you can change the font of your blog text, blog title, blog description, and sidebar titles, and the color of your blog text, post titles, and links/visited links.

What I've done is gone through and made coding changes to each of my templates so that in addition to control over these basic variables, you'll have control over many more variables of the template design. You'll be able to change things up and experiment to your heart's content!

Some of the added variables I've given the templates include:

post title font
background color (for blogs with a solid color background)
sidebar/widebar background color (such as the Penelope)
comment box background color and border
hover pop! color (the color that appears when your links are moused over - great for adding a subtle accent)
block quote color background color and border
navigation menu bar background color
navigation menu titles color
navigation menu hover color
multiple border colors (so that you can individually control the colors of all borders on your blog)

And for those templates that feature background colors to sidebars, widget boxes, sidebar titles, etc. (such as the sidebar colors of the Misha and Susannah and the sidebar title background color of the Emily), I've added those options as variables you can control, as well.

And best of all, it's super easy to make the adjustments you'd like, since you don't need to mess with your template code at all. Check it out:

And remember, if you don't like the standard color options given in the selection boxes to the right of the scroll box, you can always simply enter in any hex color code you'd like, to the far right box - just remember to hit enter after typing it in.

Terms and Condition

2008-01-21T10:21:00.000-08:00

Publishing Format. Please note, these templates are for use on Blogger (Blogspot) hosted blogs only. Your blog can always have a custom domain name (such as rainydaytemplates.com vs. rainydaytemplates.blogspot.com), but it has to be hosted ON Blogger. If you don't sign into your blog through blogger.com, I can't help you.

Styling Limitations. Please note that the fonts of blog text, post titles, tag cloud text, post footers, and date stamps must be web safe fonts.

Refunds. Refunds are rewarded only in exceptional cases, such as where I terminate an open project or decline to begin one.

Layout Arrangement. Template layouts are permanent and as shown in individual descriptions here. In other words, if a sample template has a left-hand sidebar, you won't be able to switch that sidebar to be on the right-hand side, after installation. Likewise, if a template has two columns, you won't be able to add a third column yourself, after installation. Bottom line: the number of columns and their placement cannot be changed, after installation.

However, in most cases, I can build the exact custom template you need - I call this a Frankenblog (so, if you'd like an Emily template, but with the column arrangement of the Penelope, etc.). Just let me know what you have in mind! (Additional fees apply.)

Image Hosting. Please note that I now require all clients to sign up for a free Photobucket account in order to host their own graphics (it only takes a minute to set up a free Photobucket account). This is where I'll store any backgrounds on your blog, your TwitThis! icon, the networking/feed buttons, and any other sidebar graphics I've created for you. Since template installation is always free, I'll just need your Photobucket sign-in info, and I'll take care of uploading and storing those images in your account for you.

Access. In order to create, install, or support your blog, I will need temporary permission to sign in to your Blogger account. I do not email template HTML codes for any reason, and require an actual, existing Blogger blog to install your template into.

File Saving. Please note that unless you've specifically requested I do so, I will not save your header or other graphics, nor will I retain a copy of your template HTML. (My wee laptop simply doesn't have enough memory.)

Support. Please understand that due to the sheer number of blogs I install, I cannot possibly provide technical support for them all myself. Instead, I provide all clients access to an ever-growing resource directory with tutorials and tips I've written, plus links to outside instruction. If you're new to blogging, please understand that I'm unable to provide general blogging instruction or guidance. Please also note that I do not provide assistance with Google Analytics, domain redirection, or Feedburner/email subscription. It is your responsibility to back up both your own template and the images used on your blog, and I strongly urge you to do so. If there's a problem with your blog, in some cases the easiest solution will be to reinstall the template.

I strongly encourage clients who are brand new to blogging to create a Blogger blog and familiarize themselves with it before placing an order for a template. This should be a blog utilizing the "Old Template" style templates (launched 2006), selectable from Design / Edit HTML (not a template utilizing Blogger's Template Designer). At the very least, you should be able to create posts, upload photos, add labels to your blog, and add and rearrange gadgets within your layout. My templates function in exactly the same way as the "factory" template you start your blog with, but if you need general blogging guidance (such as for the things listed in the previous sentence) after installation, I will refer you to this page.

Payment. Payment must be made in full prior to project start. When you're up in queue, I'll get in touch to answer any quick questions you have, but I do ask clients to make full payment for their package before we move beyond that.

Template Usage. The template you're purchasing is single-use only; you may not apply it to multiple blogs. If you'd like the same template applied to a second blog, just ask! I'll set it up for you, and just charge a small multiple use fee. You may not resell or redistribute any of the templates.

Graphics. Please don't grab the graphics off of your blog and put them on your Twitter page. Chances are I won't mind you using the designs that way, but I'd appreciate you asking beforehand. Likewise, please don't grab the graphics from the templates to create buttons, badges, or other design elements.

Cutest Blog on the Block Warning / Disclaimer. If you currently have - or have had in the past - a free Cutest Blog on the Block background/skin installed on your blog, there may be a problem removing that background when the new template is installed. In the past it's never been a problem (just a matter of removing the HTML/JavaScript gadget it's stored in), but I'm now seeing problems with the backgrounds "sticking" or even reappearing out of nowhere when a new template is installed (and several comments in their forum are echoing this complaint) I strongly recommend clients steer clear of adding any background/skin from CBOTB for this reason.

Prices. Listed prices are subject to change. When clients are up in queue, they'll be invited to review and approve the current pricing for the package/extras they'd like before proceeding with payment.

Project Selection. Please understand that while I'm so very grateful for the many business propositions I receive, I cannot possibly take on every project that is presented to me. I choose only those projects that I feel are well-suited to my skills and availability. Likewise, I reserve the right to terminate an open project, if I feel I cannot meet the client's demands, or if a project has ceased to be profitable and/or enjoyable to me.

If for some reason I do terminate a project, a refund will be issued in full.

Client Availability & the Disappeared File. Please understand that I'm an exceptionally busy bee, and it's important that I keep open projects on track and progressing at a reasonable speed, so that my many, lovely, patiently waiting clients can be attended to as quickly as possible. If you feel you'll be unable to respond to emails within a few days, or that you'll be unavailable to review/discuss your template details in a timely manner, please consider another design shop. I'm afraid that if you disappear, without notice, for much more than a week, I will file your order under "Disappeared" and move on to the next client in queue. You'll have the choice of having your order be shuffled to the bottom of the queue, or paying a penalty fee of $50 to resume immediately.

I'm not fond of having a nasty policy like this in place, but it's become a necessity due to the number of clients who drop the ball for weeks (if not months) at a time, and then resurface suddenly hoping to resume work immediately. I can only have a set number of open projects at any given time, for my sanity...please be considerate of this.

Porfolio. I reserve the right to display all work, including finished templates and preview sites, for purposes of promotion and advertisement.

Post-Installation Modifications. Just about any change you'd made to a template can be made by me, prior to installation, for an extra services fee. This includes column addition, column rearrangement, post rearrangement, font and color changes, and more. See here for more info.

Clients are welcome to further modify the templates on their own after installation, but please note that (for what I would hope are obvious reasons) I provide limited instruction on how to do so. If tutorials for the way you'd like to modify your template after installation are not already posted here - and you'd prefer not to pay me to make x changes for you - you'll need to research and learn how to make those changes yourself.

Linkback. All templates (with the exception of wedding websites) will be installed with a small, unobtrusive text link at the bottom of the page. By placing your order, you agree to leave this link intact for as long as the purchased template is in use on your blog.

Tutorials

2008-01-15T00:32:00.000-08:00

Below are links to information/instructions that may or may not be relevant to your particular template, depending on what layout you have. There are also tips and tricks for styling your blog posts with color, styling your sidebar, and more. I add to this section as I can, so feel free to check back.

Please note that these instructions are all written for the "old editor" version of the post editor (which you can select under Settings / Basic), and I haven't updated them to reflect recent changes to Blogger's widget options (i.e., the new option to add pages).

You're more than welcome to make any modifications to your blog that you'd like, add new HTML, play with your template's code, etc. But whether you do so or not, I strongly urge you to back up both your template itself, your images, your menu links, and your sidebar content. I don't retain a copy of your any of your graphics or your HTML unless you've specifically requested I do so. In other words, your blog is in your hands now - take care of it!

p.s. These tutorials are written as a courtesy to my own clients, but if you're not a client and you're taking advantage of them, tips are always appreciated!

GENERAL TROUBLESHOOTING + TEMPLATE RELATED FAQ

BLOGGING 101

• Navigation Menus Explained
• Labels As Menu Links
• Posts As Menu Links
• "About" Content

POST CONTENT

• Add Your Post Signature to Your Blog
• Change Fonts and Color Settings on Your Blog
• Change Your Post Footer Content
• Changing Color Values for Specific Text in Your Posts or Sidebar
• Post Larger Images on Your Blog (old editor)
• Post Larger Images on Your Blog (updated editor)
• Post Two or More Images on One Line
• Make an Image "Unclickable" NEW!
• Add a Line Break ("read more...") To Your Posts NEW!
• How to Add Hearts or Other Shapes to Your Post Footer
• How to Selectively Remove an Image Border

SIDEBAR CONTENT + MENUS

• Add A Twitter Bird and Tweet Stream to Your Blog
• Add Your Networking/Feed Buttons to Your Blog
• Add Hyperlinked Sidebar Buttons to Your Blog NEW!
• Add a Search Box to Your Blog NEW!
• Add a More Stylish Photo or Greeting to Your Sidebar NEW!
• Change Color Values for Specific Text in Your Posts or Sidebar
• Change the Size of Your Text in Sidebar or Sticky Elements NEW!
• Center Items in Your Sidebar
• Make Multiple Buttons/Badges Sit Vertically Flush in your Sidebar
• Configure Your Navigation Menu
• Add a "Sticky" Element (Permanent Post) NEW!
• Configure A "Sticky" Welcome Element
• Configure the "Sticky" Welcome Post/Title Section for the Charlie Template
• Make an Image "Unclickable"
• How to Customize the Invitation Link on Your Tweet Stream
• How to Create an Ombre Effect Tag Cloud

GENERAL BLOGGING

• Find Your Blogger NavBar
• Back Up Your Template and Header
• General Troubleshooting and FAQs
• Upload Your Own Header
• Support Your Favorite Blog Designer and Grab My Button!

OUTSIDE INSTRUCTION + TUTORIALS

• Add a Recent Posts Widget
• Add a Recent Comments Widget
• Add a Subscribe-by-Email box
• Create an HTML Grab Box (for buttons, etc.)

If you don't see the instructions you're looking for, the Template-Related FAQ probably has your answer!

pattern library

2008-01-03T10:32:00.000-08:00

Patterns are numbered from left to right, one row at a time. Those that can accommodate a change of colors have an asterisk.

add a label as a title in your navigation menu

2007-12-18T12:46:00.000-08:00

1. First, decide on a label you'd like to use as a link in your menu. Maybe it's "portfolio" or "recipes" or "favorites" or "travels."

2. Make sure this label is applied to at least one PUBLISHED post.

3. Go to a post where the label is applied. Make sure that you're looking at your published blog (in other words, you should be seeing your blog as usual - you shouldn't be looking at the list of posts under Posting / Edit posts)

4. Click on the label itself. You'll see a status window come up that says "Showing All Posts With Label X", where X is the label you've designated.

5. Move your cursor up to your browser window, and highlight the URL (the http://.... address) that's showing.

6. Copy/paste this entire URL down to your notebook, text edit, document - wherever.

7. This URL is what will go into your navigation menu - it'll look something like this:

http://rdtff.blogspot.com/search/label/portfolio

Paste this URL into the appropriate place in your navigation menu (replace one of the URL OF MENU TITLE sections with it).

FAQ

2007-11-05T16:33:00.000-08:00

• What blogging platforms do your templates support?
• Do you design formal websites, or design for Wordpress?

• How does this work?
• What fonts can I choose from, for a customized template?
• I'd like the post layout changed; is this possible?
• I'd like the template layout changed; is this possible?
• I'd like to combine one or more template; is this possible?
• How do I install my new template?
• How long does it take to fill my Ready Made template order?
• What forms of payment do you accept?
• I don't have a PayPal account - can I mail you payment?

• Will I still be able to add new sidebar content with one of these templates?
• What's the difference between a Rainy Day template, and one created using Blogger's Template Designer?
• Will previously published posts, images, or comments disappear when the new template is installed?
• Will I be able to change the format of my date stamp? Say, from December 1, 2010 to 12.1.10?
• Will I be able to change the format of my post footer content? Say, from "labels" to "categories", etc.?
• How do I post images in a larger size, to fit the template I want?
• Can I still add the LinkWithin script to one of these templates? (the "You Might Also Like" boxes)
• Can I still redirect my blog to a custom domain with one of these templates? I don't want the .blogspot tag in my URL.
• Will you take care of redirecting my blog to a custom URL for me?
• If I already have LinkWithin or Google Analytics added to my template, will it still be there after installation?
• Will you add Google Analytics to my blog?
• I use Disqus for comments; will those comments transfer over to the new template?
• What items can I include in a navigation menu?
• The sample template I like only has four menu titles. I need five.
• How do I use the blockquote feature?
• Why do I need a Photobucket account?
• Can I host my images somewhere other than Photobucket?

• Can I change the pictures on the Evelyn template after installation?
• Can I change the pictures on the Penelope template after installation?
• Can I change the picture on the Catherine template after installation?
• Can I change the picture on the Charlie template after installation?

What blogging platforms do your templates support?
The templates are for the Blogger (.blogspot) publishing platform only. Your blog can always have a custom domain name (such as rainydaytemplates.com vs. rainydaytemplates.blogspot.com), but it has to be hosted ON Blogger. If you don't sign into your blog through blogger.com, I can't help you.

Do you design formal websites, or design for Wordpress?
Nope and nope, I'm afraid. I've really gotten attached to Blogger's simplicity and flexibility - this very site is a Blogger blog, in fact. I've heard complaints about the difficulty/complexity of the Wordpress platform, and seen hosting problems with WP blogs. Blogger is simple, fun, and FREE!

jump to the top

How does this work?
Simply choose the template you'd like, decide if you'd like it just as it is or customized with new colors and fonts, then follow the link to the payment page. I'll get in touch ASAP and collect the information/materials I need from you to get started. If you've ordered a ready made template, I'll create a header for you to approve and ask for your Blogger/Photobucket sign-in info, to get you set up. If you've ordered the template with customized colors or fonts, I'll show you a full mockup of your choices before installation.

What fonts can I choose from, if I order a Custom Colors and Fonts template package?
You can choose from any of these for your header, pagination titles, and any matching sidebar titles (note: matching sidebar titles are an optional extra). Here are the web-safe fonts you can choose from for the blog body (post titles, sidebar titles, text, etc.). If you find something else free on the web that I can download, there's no charge for that. Or, if you'd like me to purchase a particular font to use on your blog, I can do that, too.

I'd like the post layout changed; is this possible?
Yup, usually. Feel free to shoot me an email before placing your order, to make sure I can do what you have in mind.

I'd like the template layout changed; is this possible?
Yup, usually not a problem. If it's a simple matter of widening/shrinking columns, that's a very inexpensive tweak I can make easily. Just let me know what you have in mind when you place your order - or fire me over a question beforehand if you'd like.

I'd like to combine one or more template; is this possible?
Yup, I can usually do Frankenblogs. Shoot me an email describing what you have in mind; I'll let you know if I can do it, and if there would be any additional cost.

How do I install my new template?
I'll take care of that for ya. I'll just need your Blogger sign-in info (email and password) and about ten minutes to get you set up.

Once we start, how long does it take to fill my order/complete my project?
Once I receive your Ready Made template order, please allow 3 to 5 days to hear from me. From there, we should get you set up within just a few weekdays. Templates ordered as is (no changes of color or font) will obviously take less time than those customized with new colors and fonts. Additional options (things like matching sidebar titles, etc.) and multiple revisions will extend the turnaround a bit - but it's still a fairly quick process.

After we begin, it's always helpful if you can consolidate all of your questions and suggested revisions into as few emails as possible.

What forms of payment do you accept?
PayPal only (you can pay with a credit card, a debit card, or a check - and you don't actually need a PayPal account to use their payment system).

I don't have a PayPal account - can I mail you payment?
You don't actually need to have a PayPal account to use their payment system; you can pay by credit card or check, as well. But I do occasionally make exceptions and allow clients to mail me payment, if they have a PayPal phobia for some reason.

jump to the top

Will I still be able to add new sidebar content with one of these templates?
Yep. You can add new content as you like, and drag/drop it around your layout, under the Design/Page Elements tab.

What's the difference between a Rainy Day template, and one created using Blogger's Template Designer?
When Blogger introduced their Template Designer, they removed the "front end" color and font options, and replaced those with a selection of generic, but somewhat modifiable designs. My templates are based on the original HTML code (what Blogger now calls the "Old Templates", seen below your layout's code, under the Edit HTML tab). My templates do not use the Template Designer, and are not compatible with that option. In other words, if you'd prefer to use the new Template Designer for your blog, I can't, say, add a cute background, or customize your post layout, etc. If you use one of my designs, you'll have control over certain features (the cute, fun stuff), but you won't be able to easily widen/shrink your layout columns (as you can with the Template Designer).

I urge new bloggers to check out Blogger's Template Designer, and see whether they prefer the options it offers to those that my templates offer.

Will previously published posts, images, or comments disappear when the new template is installed? What about sidebar content?
Nope, all of that will transfer right over.

Will I be able to change the format of my date stamp? Say, from December 1, 2010 to 12.1.10?
Yep; you can make that change under Design / Page Elements, by clicking the Edit link at the bottom right of the Blog Posts box.

Will I be able to change the format of my post footer content? Say, from "labels" to "categories", etc.?
Yep; you can edit the phrases used for "labels", "comments", and "posted by" from Design / Page Elements. Click the Edit link at the bottom right of the Blog Posts box, and then make whatever changes you'd like.

How do I post images in a larger size, to fit the template I want?
There are instructions for uploading larger-sized images to Blogger across the web; there's also one in my own tutorials section. Depending on what version of the post editor you use (which can be selected under Settings / Basic), you may find one or another method easier. The method I use (which requires use of the old editor) involves resizing the image, uploading it to your post, then stripping the height/width size tags.

Can I still add the LinkWithin script to one of these templates? (the "You Might Also Like" boxes)
Absolutely. If you're familiar with how to add JavaScript, you can add LinkWithin to your template's code.

Can I still redirect my blog to a custom domain with one of these templates? I don't want the .blogspot tag in my URL.
Yep, and it's a snap to do so, from Settings / Publishing.

Will you take care of redirecting my blog to a custom URL for me?
That's not actually a service I offer at this time, no. But it's really quite easy to do so, from Settings / Publishing - you can purchase the domain name right from Google, in fact.

If I already have LinkWithin or Google Analytics added to my template, will it still be there after installation?
The LinkWithin script should survive, but I can't guarantee it; there's a chance you may have to add it back afterward. Google Analytics will not.

Will you add Google Analytics to my blog?
I don't offer that service at this time, no.

I use Disqus for comments; will those comments transfer over to the new template?
You'll actually need to re-add the Disqus script after I install your template; the comments will reappear once you do that.

What items can I include in a navigation menu?
I've got some handy information about navigation menus right here.

The sample template I like only has four menu titles. I need five.
No worries. Just let me know if you need a specific number of menu links in your navigation menu; I'll include that number when I install the template. There are also instructions in the tutorials section for adding a different number of menu links on your own.

How do I use the blockquote feature?
Just click/drag to highlight the text you'd like blockquoted, then click the quote icon up above the composing window.

Why do I need a Photobucket account?
Virtually all of the templates feature graphics which must be outside-hosted. This means that when visitors come to your blog, these images are "dialed up" from another source. Due to the large number of blogs I install, I cannot host everyone's graphics myself.

Photobucket is free and very easy to set up; once you have an account, you'll just need to provide me with your sign-in info, and I'll take care of uploading all of your graphics for you upon installation.

Can I host my images somewhere other than Photobucket?
I do ask clients to use Photobucket, since that's where 99.9% of my images and clients' images are stored, and I'm most familiar with their format. Flickr is for photo sharing only, not graphics storage.

jump to the top

Can I change the pictures on the Evelyn template after installation?
Short answer: no. The Evelyn has two header portions (the top title and the bottom photos) divided by a navigation menu. The bottom photo section is added as HTML, so it isn't something you can just pop pictures in and out of. However, I can switch out your images for you a $10 update fee. Please note that if you think you'll want the upper title section of your header changed at some point, you'll need to pay for the file saving option (an additional $10), either at the time of your purchase or prior to installation.

Can I change the pictures on the Penelope template after installation?
Short answer: no. The header section of the Penelope is a finished .gif image that combines both the blog title and the photo next to it. That photo isn't a separate element you can change pictures in and out of. However, if you think you might want to update your header at some point, you can purchase the file saving option ($10), so that I can easily update your header down the road with a new picture. Header updates are $10 each.

Can I change the picture on the Catherine template after installation?
Short answer: no. The header section of the Catherine is a finished .gif image that combines both the blog title and a photo (the photo isn't a separate element you can change pictures in and out of). However, if you think you might want to update your Catherine header at some point, you can purchase the file saving option ($10), so that I can easily update your header down the road with a new picture. Header updates are $10 each.

Can I change the picture on the Charlie template after installation?
Yep. The header photo of the Charlie is uploaded directly to the header from Layout. If you'd like to change it yourself after installation, just make sure to size your photo to 930px wide.

jump to the top

Blogging 101: post VS pages

2007-08-28T03:04:00.000-07:00

Sometimes people get mixed up about the idea of blog "pages", asking me how they can create individual pages for their bios, portfolios, etc.

The thing to realize is that while a traditional website has individual pages that all look different from one another, and support different content, a blog doesn't have individual pages. It only has a series of posts, listed in reverse chronological order.

Visually, the main difference between a website and a blog is that with a blog, the sidebar content (including any link lists, blog rolls, sidebar menus, buttons, badges, etc.) will always be visible to you and your readers.

So if you're wondering what "page" your About Me or your contact info will go on - remember, it won't go on a page at all. You can't have separate pages for different topics, or certain content. You can't have separate pages, per se, at all.

The best you can do with a Blogger blog is use individual posts as pages. We call these "post-pages". You can write a post titled "About Me", for instance, and place a link to that post either in a menu or your sidebar. Or you can write a post containing your contact info, call it "Contact", and have a link to that in your navigation menu.

Just remember that no matter what post your reader is viewing on your blog, s/he'll also see your sidebar(s).

ordering a template with a photo header

2007-08-05T10:36:00.000-07:00

Please be sure you have the photo(s) picked out that you'd like to be used in your header before ordering your Jordan, Amelia, Charlie, Penelope, or Zoe template.

I can take care of shrinking any photos proportionally, but if you'd like them cropped, edited, or color-processed in any other way, I'll ask you to please do that beforehand. Tip: Picnik on Flickr is an incredibly fun and useful tool! =)

Here are the minimum sizes your photo(s) need to be, to fit these template headers:

Amelia 960px wide*
Jordan 930px wide*
Charlie 930px wide*
Penelope 300px wide
Zoe 160px tall

*Remember, I can only shrink an image proportionally. If you only have a standard 4x6 ratio photo, that will not work for a short, wide header such as the Amelia, Jordan or Charlie has.

You'll either need to find a different, wide angle photo, or crop a very large version of a horizontally-based, 4x6 ratio photo such that it stays very wide, but relatively short (no taller than 350px or so; otherwise, the photo will cover a huge portion of your blog, and prevent readers from seeing any content).

If you're not sure how large your image is, you'll need to find out the pixel width. There are a couple easy and free ways to do so online. If you have a Flickr account, you can upload your image there, then use the Edit Photo option to find out the image width. You can also use Photobucket in the same way.

(Tip: you can easily tell if your photo is as wide as the sample template's header image by visually comparing them, too.)

If you're still having trouble determining whether your image is wide enough to use as a header, just send me the largest size of it that you have - I'll tell you whether or not it it's wide enough to be used as a header for the template you'd like.

Again, please note that if your photo is not wide enough to act as a header, I cannot "stretch" it - doing so will distort the image.

pattern change guide

2007-08-05T06:00:00.000-07:00

Want a template made over with a different background pattern? Pick your pleasure! You can either choose something from my own library, find or make something from the resources below, or select a seamless pattern from iStock (up to 10 credits).

Happy browsing! =)

BACKGROUND PATTERN SOURCES
My iStock lightbox (personal favorites I've bookmarked)
Squidfingers (clean, small-scale)
Hip and Twendy (bright stripes, dots)
Citrus Moon (fancy, arabesque, geometric)
Kollermedia (simple, geometric)
Plaids
Tartans (check the Gallery Hall of Fame for the best starting points)
Ginghams
Textures Archive
Pixel Patterns (small scale)
Pattern Cooler (busy, geometric, retro, large scale, intricate - some damask and floral)
Colour Lovers (various, make your own)
Ava 7 (brights, retro)
Better Textures
The Inspiration Gallery (muted damasks, moire)
Make Your Own Stripes
Make Your Own Tartan
Make Your Own Shapes (also great for making solid color textures)

color change guide

2007-07-30T04:30:00.000-07:00

If you'd like to designate the colors for the specific sections of your template, here's what you'll do:

First, find the name of the template you'd like in the list down below. Click its name to launch its color change chart page. Here you'll see a diagram of the template, labeled with all of the sections that can be changed. Simply jot down your hex code color choices (I just need the hex code, not the color name) for these sections. If you'd like something kept the same as it appears in the sample template, you can just put "same."

Alternately, you can create a palette (and either send me the image of the palette or the link to where it's posted), and use that to designate your choices. So for instance if this was your palette...

...you could just say A) purple B) grey, etc. (because then I'd have the exact shades to apply).

Next, go to THIS page, where you'll see diagrams of the blog accessories and comment box, and do the same thing.

You can find several pages of hex code color charts here, and here's a page with some pretty pastel values. Or if you'd like to play with finding your own perfect color, this generator should do the trick.

If you need an RBG to hex translator, here's a link for that; and here's one for Pantone to hex.

TEMPLATE COLOR CHARTS
Abbie
Allison
Amelia
Camille
Caroline
Charlie
Emily
Emmeline
Evelyn
Hannah
Isabelle
Jordan
Juliette
Kathleen
Love
Love II
Madeleine
Marnie
Penelope
Sofie

configuring a sticky element

2007-07-30T00:14:00.000-07:00

One way to have a nice looking sticky element is to use both an image and some welcome text to greet your blog's visitors. If you'd like your sticky element to have these items, here's how to do that. (For basic info about how to locate and use a sticky element, please see this tutorial.)

1. Presize an image (such as a portrait of yourself) to about 100 or 120px wide using Photobucket, Flickr, etc.

2. Upload the image to any blog post under the "left" alignment setting. Make sure you're under the Edit HTML tab, not the Compose tab.

3. Copy/Paste the HTML for this image to your clipboard.

4. You can now actually erase the HTML for the image and republish the post, since once you've uploaded the image to any blog post, a copy of it remains in your Blogger Picasa album.

5. Go to Layout, and click Add Gadget in your new sticky element section (directly above Blog Posts). Choose an HTML/JavaScript gadget.

6. Paste the HTML for the image into the pop up box that launches.

7. Type your welcome message or greeting directly after that.

If you'd prefer your image to be to the right of your text, choose "right" alignment setting when you upload the image.

Since the sticky element has the same font/alignment/title settings as your sidebar elements, if you want to have separate paragraphs, you'll need to add paragraph tags each time you want to start a new paragraph - just type the less-than symbol, then the letter p, then the greater-than symbol, or this:

Type these characters immediately preceding any sentence that you want to begin a new paragraph.

If you'd prefer your image to be to the right of your text, upload it using the "right" alignment setting.

RETURN TO CLIENT RESOURCES

upload your own header

2007-07-25T10:34:00.000-07:00

Uploading your own header image to your blog is a snap. First, make sure your header image is sized to fit your template. If you need to know what size your header image should be, here's how to find out:

1. Go to Design / Edit HTML
2. Scroll down until you see the section that looks like this:

#header-wrapper {
width:1000px;
margin:0 auto 0px;
border:0px solid $bordercolor;
margin-top: 0px;

The width given is the size your header image should be.

Now, go to Design / Page Elements, and locate the Header widget box.

1. Click the little blue link that says "Edit".
2. When the pop up box that says "Configure Header" launches, click "Choose File" and select your header image file from your desktop.
3. Make sure you've got "Instead of title and description" and "Shrink to fit" checked.
4. Save.

RETURN TO TUTORIALS

making buttons/badges vertically flush

2007-07-24T02:11:00.000-07:00

If you have a number of buttons or badges you'd like to post in your sidebar, but you'd like them to sit flush vertically (be on top of one another, instead of spaced out), there are two ways to do that.

METHOD ONE

1. Upload the button to any blog post. Make sure to do so on Edit HTML mode, not Compose. Once you've uploaded the button, cut/paste the HTML for it onto your notebook, dashboard, etc. Once you've copied this code, you can actually delete it from the blog post (since once it's uploaded, a copy remains in your Blogger Picasa album) and either republish the post, delete it, or save it as a draft.

2. Go to Layout, and open and HTML/JavaScript widget. Paste the HTML code into this widget, and drag it to wherever you'd like it to be.

3. Repeat as necessary with the remaining buttons, adding the codes for them one at a time, directly after one another. If you'd like the buttons to link to outside sources (such as another website), here's how to do that. And if you'd like to center them, here's how to do that.

METHOD TWO

1. Upload the button to Photobucket or Image Shack, or any image hosting site you'd like.

2. Copy paste the HTML code for the button (given next to the image upon upload) into an HTML/JavaScript widget. If you'd like the buttons to link to outside sources (such as another website), here's how to do that.

RETURN TO CLIENT RESOURCES

changing color values for specific text

2007-07-24T01:33:00.000-07:00

Something neat to do to add visual impact to your blog posts is to change the colors of individual words, phrases, or even punctuation.

For an example, check out the Jordan template. See how at the beginning of the first sample post the bits that say "tucson, arizona", "chris richards", and "elaine taylor" are in a different color, but are not hyperlinks?

To change the colors of portions of your blog text, first make sure you're in the Compose mode. Then click and drag to highlight the word or words you want to change the color of. Click the little color palette icon above, and choose a color.

But what if you want a color that's not in this choice of 70 basic colors? Here's how to do that.

1. From Compose mode, click/drag to highlight the text you want to color change.
2. Click the palette icon, and choose any color to change the text. Doesn't matter what color you pick; you'll change it in just a second.
3. Now, switch over the Edit HTML mode.
4. Look for the part of the HTML that represents this color-changed text - "color: #(FF6666);

The bit in parenthesese is the color tag, and can be replaced with any hex color code you'd like. You can change sections of text, individual letters, or even punctuation, such as I did with the bullets on this post.

To obtain exact color matches, there are a few things you can do.

1. You can see what hex code values are applied to various fonts on your blog by scrolling through the options that have been assigned in Layout / Fonts and colors.
2. You can see what hex code values are applied to your borders, background, etc. by pulling colors from your blog template. Just go to Layout / Edit HTML, and scroll down looking for six digit hex codes such as #fab883, #47f7f7... etc.
3. You can upload something from your blog, such as your header image, etc. to this site, which will generate hex code values.

Even more good news! This same method of changing text colors can be used in your HTML/JavaScript widgets, as well. Just click "Rich Text" to switch over and choose a color from the palette, then click back to the HTML mode to edit the color value.

RETURN TO TUTORIALS

Blogging 101: navigation menus

2007-07-08T08:43:00.000-07:00

Navigation menus are really simple, once you understand the concept behind them. Just remember, each menu title needs to have a corresponding URL (a link) to go with it. (This URL is the place that clicking on the title will take you to.) Here's an example:

home / http://blog.blogspot.com
about / http://blog.blogspot.com/2006/09/about.html
twitter / http://www.twitter.com/rainydaydesign
portfolio / http://blog.blogspot.com/search/label/portfolio
contact / mailto:ellie@rainydaytemplates.com

In this list, clicking on the title "home" will take me to the blog itself. Clicking on "about" will take me to a post titled "about" (you can tell it's a post, since there's a date in the URL). Clicking on "twitter" will take me to my twitter page. Clicking on "portfolio" will bring up all posts with the label "portfolio". Finally, clicking on "contact" will launch an email to me.

The above are just sample menu items, of course - your navigation menu titles can be anything you want, as long as you have an URL to link to each of them. These are the things that a menu can link to:

Any Website or Blog. For instance, your menu can be linked to your Flickr page, your Facebook page, your Twitter page, or your own business website.

A Post On Your Blog. So if for instance, you'd like to use a post as a sort of "page" on your blog, you can do so. One option would be to write a post titled "About Me", which could contain a description of yourself and maybe a photo. Remember though that these will not really be separate pages, since your sidebar content will always appear on every page of your blog. They'll just be what's called post-pages - individual posts that are used to organize information.

Another option for a post-page is a "Contact Me" post, containing your email, phone number, etc.

Some other things that make good post-pages: Testimonials, FAQs, or Pricing. Some people even like to save sidebar space by using a blog post as a place to put a list of links.

To obtain the URL of an individual blog post (post-page), just click on that post title. The URL of the new page that refreshes, with only that post on it, is the URL that will go into your menu. (Confused? Here's a more step-by-step explanation of how to use post-pages).

A Label On Your Blog. One option for organizing content on your blog is to use individual labels from your blog as links in your menu. If you're not sure what a label is (also called a "tag" or a "category"), go to Posting / New Post. Then check out the bottom right-hand corner of your blog posting window - you'll see a bit that says "Labels for this post:". In that space, you can add keywords to classify the content of your blog. These keywords - labels - will appear above or below the blog posts they go with (depending on the styling of the template).

Say for instance you're a florist, and you'd like to classify each post that has a photo of one of your bouquets as part of your portfolio. Just type the word "portfolio" in the labels window on each of the posts you'd like the label applied, and republish those posts. Your menu can then be linked between the word "portfolio" in your menu and all posts that are labeled with the word "portfolio". Then prospective clients who visit your blog can see all posts with examples of your work all in row by clicking the "portfolio" link at the top.

Other ideas for labels in your menu: Press (for professionals), Engagement (for photographers), Favorites, Bargains (for decorator blogs), etc.

To obtain the URL of a label, just click on the label itself. A page will come up saying "Showing All Posts With Label X" - the URL of this page is what will go into your menu. (Confused? Here's a more step-by-step explanation of how labels work).

Your Blogger Profile Page. If you'd like an "About Me" link in your menu, but you don't want to write a post page, we can link to your Blogger profile (you know, this thing). To obtain the link for this, simply open your Blogger Profile page and copy/paste the link.

Your Email Address. You can also designate one of your menu titles as a direct contact button, so that when a visitor clicks on "Contact" or "Contact Me", it will launch the person's email application and start a new message to you.

Your RSS feed. See the little bit at the bottom of your blog that says "Subscribe to: Posts (Atom)"? That's your RSS feed; it can be linked to your navigation menu. To obtain the link for it, just click on it. Then grab and copy/paste the URL of the page that launches. Another way to obtain your RSS link is to click the RSS button in your browser window.

http://www.rainydaytemplates.com/2007/01/color-and-font-settings.html

RETURN TO TUTORIALS

configure the sticky welcome post for Charlie

2007-06-15T23:15:00.000-07:00

I've styled the sticky welcome post/title area of the Charlie template with three parts: a bio picture on the left, the welcome/about text in the middle, and the title/logo on the far right. There are a few different ways to configure a sticky section, and you're welcome to experiment, or find other directions online. Here's how I do it:

1. First, make sure you're using the "old editor" version of the post editor, selectable under Settings / Basic (down towards the bottom, below "Global Settings").

2. Then, size your self portrait/profile pic and title/logo to the sizes you'd like them to be. For the best look, they should be roughly the same height. On the Charlie sample template, the left-hand photo is about 200px wide by 145px high, and the title/logo is about 200px wide by 135px high. So when you size your photo and logo, you can adjust these values as you like, depending on whether you want these items larger or smaller. And remember, you can always resize any image for free using Flickr or Photobucket. You may need to crop (or add) white space around your photo or logo, to even things up.

3. Upload your profile pic to any published blog post under the "Left" alignment setting and the "Edit HTML" tab (not "Compose"). Copy/paste the HTML for this image to your clipboard. Then, delete the image and re-publish the post. You don't need to actually publish the image, since once you've uploaded it, it's saved to your Blogger Picasa album - this is where the image's HTML will be stored.

4. Go to Design / Page Elements, and select Add a Gadget from the element bar directly above the Blog Post element. From the pop up window options, choose HTML/JavaScript. When the Configure HTML/JavaScript window opens, paste the HTML code for the profile image from your clipboard into this space, and save.

5. Next, repeat the procedure with the image for your title/logo, only this time, do so under the "Right" alignment setting. Return to Design / Page Elements, and open that same HTML/JavaScript gadget. Copy/paste the HTML code for your title/logo image immediately following the HTML code for your profile pic. Again, you don't need to actually publish the image of your title/logo in the blog post you "used" - you only needed to upload the image so that its HTML would be stored in your Picasa album.

6. Finally, just type in your welcome message/bio directly following the HTML for these two images. You may wish to use the <p> tag to break your message into paragraphs (just type <p> before every word you want to start a new line). Switching to the "Rich Text" option with the Configure HTML/JavaScript gadget will allow you to modify the text's color and styling. I also have instructions modifying text color (beyond the choices given) and text size.

Save the gadget, and you should see your profile image, welcome message, and logo/title, in that order.

In order to not have the text "spill under" the images, make sure that these images (your logo/title and bio pic) are at least as tall as the content of your welcome message. If they're not, you can add some white space padding beneath the image(s), using any paint/graphics program.

If you'd like to make the images of your profile photo or logo/title "unclickable" (meaning, clicking on them doesn't open their Picasa storage page), here are directions for that.

NOTE: you certainly don't have to include all of this content in your sticky element; just leave off any that you don't want. If you'd prefer just one image and some text in your sticky element, here are instructions for that.

RETURN TO TUTORIALS

how to selectively remove an image border

2007-05-26T09:22:00.000-07:00

If you have a template that's configured to have a border around the images, and you'd like to disable that border selectively for a particular image, here's how:

1. Upload the image to your blog post. If you resize your images to be larger, do so now.
2. Click the Edit HTML tab above your post window (so that you're under Edit HTML, not Compose).
3. Locate the image's HTML, and use the following code to frame it:

<div class="customimage"> {IMAGE HTML CODE HERE} </div>

This will work no matter what kind of image border you have - even just a plain solid line.

Note: this trick is for Rainy Day Templates that have been recently installed, as well as all future templates. All recently and new templates contain a code in their HTML that the above code "speaks to", in order for the disabling effect to work. In other words, if you don't have the main source code in your template, the above trick won't work.

And remember, since you can post images as large as your main column allows, adjusting for your image border/padding, disabling the border will allow you to post images a bit larger (since the border/padding won't be there).

RETURN TO TUTORIALS

how to create ombre tag cloud

2007-05-26T09:21:00.000-07:00

I installed a template yesterday, and saw an accidental effect I've never noticed before. But I think it's so awesome, it's worth being applied on purpose. Check it out:

Ombre!

If you have a tag cloud installed on your template, and you'd like it to have this gradient look, here's how:

1. Open the Labels gadget - you'll see the Configure Labels window pop up.
2. Next to Sorting, choose "By Frequency".
3. Uncheck the "Show number of posts per label" option.
4. Save.

That's it! Your cloud will fade evenly between the two shades configured in your template code.

RETURN TO TUTORIALS

how to customize the invitation link on your tweet stream

2007-05-26T09:20:00.000-07:00

If you have a tweet stream on your blog, you can change the "follow me on Twitter" invitation link to say whatever you'd like. Just open the HTML/JavaScript gadget that contains your stream and replace the pink highlighted code below with your own invitation:

<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">follow me on Twitter</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>
example:
<div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Tweet, Tweet!</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/rainydaydesign">Let's get tweety together.</a>
</div><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/rainydaydesign.json?callback=twitterCallback2&count=2" type="text/javascript"></script>
Other possibilities:

I lead, you follow.
Follow me into the dark...
get over here!
psst! over here...
come and get me

Get creative!

RETURN TO TUTORIALS

how to add hearts or other shapes to your post footer

2007-05-26T09:19:00.000-07:00

At the bottom of the Samantha template, I've added a pair of hearts around the post footer content:

Dig it? Wanna try it? Here's how:

1. Go to Design / Page Elements
2. Click the Edit link, at the bottom right corner of the Blog Posts widget.
2. When the Configure Blog Posts window launches, decide where you want your heart to go. You can type the code anywhere there's a text box to be typed in, under Post Page Options (the "posted by" box, the "on/at" box before the date, the "comments" box, etc.) Here, I've placed it before "Posted by":

Experiment to see the effect of placing symbols before, after, or in between tags. Some ideas...

♥, Ellie
→ talk to me!
with ♡, ellie

The codes for several shapes can be seen here.

Codes can also be used in post titles, sidebars, welcome sticky sections, etc.!

RETURN TO TUTORIALS

how to add "read more" divider tags to your posts

2007-04-12T20:18:00.000-07:00

Adding a "read more" line break to your blog posts is a piece of cake. If you use the updated post editor (selectable under Settings / Basic), you can follow these directions to add the break.

However, if you're using the old editor version of the post editor, your post composition window won't have the jump break icon option above it. But no worries, you can just type in some easy-peasy HTML to create the break. Here's how...

1. Write the portion of your blog post that you'd like to appear before the break.

2. Then, wherever you'd like the line break to appear, add the following code:



This will create the line break in your post.

3. Type the remainder of your post immediately after this code.

4. Publish.

If you'd to modify what the line break says, you can do so under Layout / Blog Posts. Just click the Blog Posts element, and when the Configure Blog Post window comes up (it'll look like this:)...

...change the "post page link text" from "Read more" to "more after the break" or "don't stop now..." or whatever you'd like.

RETURN TO TUTORIALS

Tip Jar

2007-03-13T17:59:00.000-07:00

Since many of the services I provide for clients are quick fixes, small upgrades, or other fast favors, I find it simpler to provide a tip jar rather than to invoice such easy-peasies individually.

So if I've done you a solid, this is the place to say, "Hey, thanks Ellie!", in any denomination you'd like. Thank you so much!

about Charlie

2007-01-21T19:35:00.000-08:00

If you'd like to use a photograph for the Charlie template header, the photo needs to be very wide, but fairly short. The image used in the sample template is 930px wide by about 350px tall (it's a wide angle photo). A regular 4x6 dimension photograph, when sized to 930px wide, will cover most of if not the entire screen - your visitors will see nothing but one huge image when they land on your page, and will need to scroll down quite a ways to see the actual blog. And that would not be good.

An image can always be shrunk, but you cannot selectively shorten it while keeping it wide - it will distort it like crazy, and may cause significant eye strain/and or injury to your blog's visitors.

So if you'd like to use an image for the Charlie template header, it should be 930px wide, and really no more than 400px tall. I'm happy to resize (shrink) your photo for you, but if it needs to cropped or otherwise processed, I'll ask you to do that yourself (cropping and color can be a pretty subjective thing, taste-wise). You can play ad infinitum with your images on Flickr, Picnik, and Photobucket.

backing up your template and header

2007-01-15T03:22:00.000-08:00

To back up your template, go to Design / Edit HTML. Click "Download Full Template" to download a copy of your template to your desktop.

To save your header image, either right-click (PC) or control+click (Mac) to save the image to your desktop.

If you have other images applied to your blog (such as in your menu or sidebars), please save these as well.

RETURN TO TUTORIALS

finding your Blogger NavBar

2007-01-15T02:27:00.000-08:00

Your Blogger NavBar, if you had it enabled before, would be the long skinny bar at the top of your blog that says "Customize" and "Next Blog".

By default, and since most clients request it (since it's kinda ugly), I disable the Blogger NavBar.

If you'd prefer to have your Blogger NavBar restored, go to Design / Page Elements, and scroll down until you see this code:

#navbar-iframe {
height: 0px;
}

Delete this strip of code, and save your template.

Remember that you can always access your layout by clicking on the "quick edit" pencil icon below your blog posts. If this isn't visible on your blog, you can enable the icon from your Layout / Blog Posts. Your blog's visitors won't see this pencil icon - only you will.

They also won't see the blank space surrounding the pencil or wrench icons (by sidebar items), either.

You can also quickly access your dashboard and blogs by bookmarking this address for easy clickage:

http://www.blogger.com/home

RETURN TO TUTORIALS

centering items in your sidebar

2007-01-15T02:14:00.000-08:00

To center the HTML code for an image (say, of a button, badge, or an Etsy or Flickr mini gallery), frame the block of HTML code in the following code:

<div style="text-align: center;">{HTML CODE}</div><div style="text-align: center;"></div>

2. Save. The badge, button, or gallery should sit in the middle of your sidebar. Three cheers for symmetry! (Though unfortunately, this trick doesn't work on some outside JavaScript badges - Flickr widgets, for instance, and Amazon badges.)

This trick also works with text.

If you'd like the item to be left justified, just change "center" to say "left" on both tags; likewise, you can change them to say "right" as well. Like this:

<div style="text-align: right;">{HTML CODE}</div><div style="text-align: right;"></div>

RETURN TO CLIENT RESOURCES

general troubleshooting + template-related FAQ

2007-01-15T02:11:00.000-08:00

Many answers to common questions can be found in the general FAQ.

HOW DO I LOG INTO MY BLOGGER ACCOUNT? I DON'T SEE THE BLOGGER NAV-BAR ANYMORE..
Explanation here.

HOW DO I CHANGE THE COLOR OF MY BLOG TEXT, POST TITLES, ETC.?
Directions here.

HOW DO I CHANGE THE HOVER (MOUSE-OVER) COLOR OF MY POST TITLES OR NAVIGATION MENU?
See link just above.

MY BLOG LOOKS DIFFERENT THAN THE PREVIEW SITE LOOKED (DIFFERENT SIDEBAR CONTENT).
Remember, any sidebar content that appeared on the preview site - or on the sample templates - is just sample sidebar content. It will be up to you to add all of your own sidebar content after the new template is installed.

I'M HAVING TROUBLE ADDING LARGER IMAGES.
The tutorial I provide for uploading larger images will only work if you're using the "old editor" version of the post editor, selectable under Settings / Basic. Also: mine is just one set of instructions, for one method - there are other methods that may be easier for you, and other sets of instructions across the web for accomplishing this trick.

If you're having trouble following my own instructions, definitely see if you can't find clearer ones - or an easier method - for you, online. I really know of no other way for me to be any clearer in my explanation of how to do it, than what I've posted here. And please remember, I provide all of these tutorials as a courtesy.

IS THERE A WAY TO CHANGE THE DEFAULT SIZE OF IMAGE UPLOADS?
None that I know of, no. For now, anyway, if you use my method of upsizing your images, each individual image has to be pre-sized then stripped of its height/width size tags. But you're welcome to explore the net for an easier method!

BLOGGER NAVBAR (bar at the top that says "Customize" and "Next Blog" NOT APPEARING.
Explanation here.

GOOGLE ANALYTICS OR SITE METER ACTING WEIRD (STATISTICS DON'T SEEM RIGHT).
The code for your Google Analytics or Site Meter will need to be added back after installation of the new template.

WONKY FONTS OR COLOR SETTINGS.
Explanation and instructions to fix this here.

UNABLE TO REMOVE PADDING BETWEEN NET./FEED BUTTONS.
Make sure you're using the "old editor" version of the post editor, which you can select from Settings/Basic.

NOT SEEING "ALIGNMENT: NONE" OPTION.
Make sure you're using the "old editor" version of the post editor, which you can select from Settings/Basic.

WANT BLOG LINKS TO LAUNCH NEW PAGES
As best I know, you cannot individualize links in your sidebar link lists or blog rolls to launch as new pages. You can use the target="_blank" trick (see the middle of THIS page for an explanation) for menu links and links in HTML/JavaScript gadgets, but I'm afraid I don't know how to do that for individual links in link lists.

TAG CLOUD NOT APPEARING.
In order for your tag cloud to appear properly, you need to have at least one label applied to more than one post. Also, make sure you don't have any punctuation in any of your labels.

SIDEBAR "JUMPED" TO BOTTOM OF PAGE
Make sure you haven't posted anything in your main column or sidebars that is wider than those columns can support. In other words, if your main column is 610px wide, don't post images that are 630px wide. Likewise, if you have a sidebar that's 150px wide, make sure the things you post there (images, buttons, etc.) are no wider than that. More details here.

POST SIGNATURE NOT APPEARING.
Your post signature will only appear on posts composed after the signature was installed.

HOW DO I CHANGE THE NUMBER OF TWEETS SHOWING?
See step #10 here.

BOX APPEARING AROUND POST SIGNATURE.
If you have any kind of image borders, you'll need to add a small bit of code to "frame" the code of your post signature under Settings/Formatting. Directions are at the bottom of this page (where it says "IMPORTANT").

I'M A CLIENT, AND I'D LIKE TO CHANGE X ASPECT OF MY PURCHASED TEMPLATE MYSELF - HOW DO I DO IT?
Please see Post-Installation Modifications portion of my terms & conditions.

I'M NOT A CLIENT, AND I'D LIKE TO CHANGE X ASPECT OF MY OWN BLOG TEMPLATE, MYSELF. HOWEVER, I CAN'T FIND INSTRUCTIONS FOR HOW TO MAKE X MODIFICATION IN THE FREE TUTORIALS YOU'VE POSTED. DO YOU HAVE ENOUGH SPARE TIME TO PUT ASIDE YOUR PAID PROJECTS AND WRITE UP SOME INSTRUCTIONS FOR ME, FOR FREE?
I sure don't.

BLOG LOOKS DIFFERENT ON CERTAIN BROWSERS..
Cross-browser incompatibility can cause some minor elements of your blog to look different, depending on browser - things like underlining not appearing correctly, or hover effects not manifesting, or fonts looking different. I cross check all templates in the latest versions of Firefox, IE, and Safari, but I can't always control every tiny detail for all three browsers. If something looks off to you, first make sure you're on the most updated version of your browser. If you'd like me to change the fonts on your template, cross-check (across multiple browsers) how these fonts look to you, and select one that you like the look of, no matter the browser.

FAVICON NOT APPEARING.
See above. In particular, Internet Explorer can be a pill about displaying favicons correctly. Try restarting your browser or clearing your cache. Occasionally, for whatever reason that mystifies me, a properly installed favicon will fail to display in one browser, but appear correctly in the other two. If yours is one of these lucky ones, I'm happy to refund you for the cost of it - but I'll need to remove the favicon code entirely (which means that no one will see it, including those using browsers that do display it).

BLOG LOOKS WEIRD AT WORK.
Some workplace computers have firewalls in place that can make your blog look wonky (a sidebar appearing larger than normal, etc.). Sometimes it's because that computer's browser isn't updated, and sometimes it's because of inter or intra-networking limitations. Unfortunately, there's no way I can address whatever that issue is without being on that computer. If it's essential to you that your blog look the same on every computer, let me know, and we'll find a new template for you.

SEEING WEIRD PENCIL/WRENCH ICONS ON BLOG.
Those are "quick edit" icons, which allow you clickable access to your blog and sidebar widgets. Only you can see them, as well as the extra white space around them. But if you'd prefer to disable them, you can do so via Layout / Blog Posts (just uncheck the box that says "Show Quick Edit Icons".

MISCELLANEOUS PROBLEMS.
If something's wonky with your blog, 99.9% of the time it can fixed by clicking "Revert widget templates to default" under Layout / Edit HTML (the link is down below the code box. It's sort of the catch-all fix it. Doing so won't affect any of your content, and it won't erase any of your sidebar elments/widgets, either. However, it will reset some of the deeper settings of your template, and remove your Twit This! icon, numbered comments, tag cloud, and revert the styling of your post title/footer section to the "factory" styling.

If you're having a problem with your blog that you can't figure out, just ask me to take a look. If it appears to be something faulty through my own mishandling, I'll take care of reinstalling the above accessories for free. However, if the problem appears to be due to a change you've made yourself, there will be a $15 charge to add back the above accessories and special touches.

WEIRD PHOTOBUCKET LOGO APPEARING ON MY BLOG.
If you see a Photobucket logo appearing suddenly on your blog, it means that one of two things is happening.

1. Photobucket is performing routine site upkeep/maintenance (typically in the middle of the night). You'll know this is the case if you see the Photobucket logo and a phrase like "We're Doing a Little Work Right Now ... Your Image Will Be Back Soon" or "Site Maintenance ... Your Image Will Return Shortly".

Just wait a minute or two and click refresh, and all should be good. (Photobucket supports A LOT of information - if they didn't do site maintenance every so often, everything would crash.)

2. A pattern or an outside-hosted image (such as an icon or image title) has failed to load for some reason, possibly because of exceeded bandwith.

If this happens, go to Design / Edit HTML, and scroll down until you see this bit of code:

Delete the entire highlighted code to disable the background. If you have multiple background patterns/images, scroll down until you see any other URL addresses applied as backgrounds, and delete those lines, as well. Then just shoot me an email and I'll figure out what's up.

I've never once had a single problem with my image hosting or had this occur, but I want you to be in control of your blog just in case.

RETURN TO TUTORIALS

how to post larger images (old editor)

2007-01-15T02:08:00.000-08:00

Note - This tutorial for uploading larger images will only work if you're using the "old editor" version of the post editor, selectable under Settings / Basic. If you'd like to post larger images using the updated editor, see these instructions. Also: mine is just one set of instructions, for one method - there are other methods that may be easier for you, and other sets of instructions across the web for accomplishing this trick.

Blogger, by default, shrinks all images to 400px wide when you upload them. But you can actually post images as wide as your main posting column (taking into account your image border and padding). Here's how:

Unfortunately, Blogger won't automatically size your images to the perfect size for your template. So first, you'll have to pre-size your image to the maximum width your template can accommodate, given in the template descriptions here. If you need to, you can use Photobucket or Flickr to do this for free.

(If have a custom template, see here.)

Upload the image into your blog post, under the "None" alignment setting. Make sure you're viewing your blog post under the Edit HTML tab (not Compose). This is roughly what you'll see (though your image code will vary):

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s1600-h/PHOTO.jpg"><img style="cursor:pointer; cursor:hand;width: 400px; height: 267px;" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>

Delete only and exactly the GREEN section of code, making sure to leave the quote intact. These are the height and width tags.

Now find the part of the code saying s400, below in PINK:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s1600-h/PHOTO.jpg"><img style="cursor:pointer; cursor:hand" src="http://3.bp.blogspot.com/_f9kYcQ0o01M/S6htmcxzW1I/AAAAAAAAUqA/55IxYUE8MWo/s400/PHOTO.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5451727856259521362" /></a>

Change that to say s800. This will allow the image to "jump up" to a size as large as 800px wide (which is why resizing the image beforehand is a necessary step). If you have the Charlie or Jordan template, change it to say s1600. This will allow the image to jump up to as large as 1600px wide.

Click Publish Post. That's it!

To have two or more images centered within the post, upload them all under the "None" alignment setting and the "Edit HTML" tab. Then under the "Compose" tab, click/drag to highlight the images, and choose the center alignment setting from the icons above (the middle set of parallel lines). Note: you'll have to make sure that the total width of the images, combined with the padding/border of your images, doesn't exceed the width of your column.

If you have a custom template, or you're not sure what the maximum width of images you can post is, here's how to find out:

Go to Layout / Edit HTML. Scroll down until you see the bit of code saying "main wrapper" (exact codes will vary). Find the width line:

#main-wrapper {
width: 510px;
background: #ffffff;
padding-left: 12px;
padding-right: 10px;
border-right: 1px solid #C3E5E4;
margin-left: 0px;
padding-top: 0px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Jot down the width listed.

Scroll further down until you see the .post img section of your template:

.post img {
padding:4px;
border:1px solid #cccccc;
}

Double the value given for the border width, and add it to double the value given for the padding. So if your template has a 1px border and 4px of padding, the number you'd get would be 10.

Subtract this number from the width of your main wrapper. The resulting value is the maximum width, in pixels, of images you can post on the main column of your blog. For example, in this instance, 510-10=500px. In other words, 500px wide would be the widest size image this particular template could support (or, multiple images that add up to 500px wide total).

RETURN TO TUTORIALS

how to configure your navigation menu

2007-01-15T02:05:00.000-08:00

When I install your navigation menu, I'll set it up with "blank" menu titles and URLs for you to fill out. It'll look like this:

<div id="newnavbar"><ul>
<li><a href="URL OF TITLE ONE"> title one</a></li>
<li><a href="URL OF TITLE TWO"> title two</a></li>
<li><a href="URL OF TITLE THREE"> title three</a></li>
<li><a href="URL OF TITLE FOUR">title four</a></li>
</ul></div>

To configure the menu, replace the sections in PINK with your menu titles. Then replace the sections in GREEN with the URLs (http://... addresses) that go with these titles, making sure to leave the quotes intact. Here's an example:

<div id="newnavbar"><ul>
<li><a href="http://www.rainydaytemplates.com">shop</a></li>
<li><a href="http://www.rainydaytemplates.com/2008/09/about-templates_29.html"> about me</a></li>
<li><a href="http://www.twitter.com/rainydaydesign"> twitter</a></li>
<li><a href="http://www.onepixeldashed.com/search/label/tips/">tips</a></li>
</ul></div>

Any URL can be used as a link in your menu, including individual posts on your blog, other websites, or labels (also called "tags" or "categories") from your blog. If you've never configured a navigation menu before, don't worry! It's fairly easy, and here's some more help:

HERE is a general overview of navigation menus (what can go in them, how they work).
HERE is an overview of how you can use labels as menu links, and
HERE are instructions on how to place a label into your menu
HERE are instructions on how to use a post-page from your blog as a menu link.

If you'd like clicking on a menu title to launch a new browser window, add target="_blank" just before href.

To use a menu title as a direct contact button (such that clicking on the word "contact" will open the visitor's email application and start a new email message directed to you) change "URL OF TITLE X" to "mailto:ellie@gmail.com", replacing the code with your email. Then change title x to contact or email me, etc.

When I install the menu, it will include space for four titles and links. If you accidentally delete the menu gadget, simply copy and paste the following code into an HTML/JavaScript widget:

<div id="newnavbar"><ul><li><a href="URL OF MENU TITLE ONE">MENU TITLE ONE</a></li><li><a href="URL OF MENU TITLE TWO">MENU TITLE TWO</a></li><li><a href="URL OF MENU TITLE THREE">MENU TITLE THREE</a></li><li><a href="URL OF MENU TITLE FOUR">MENU TITLE FOUR</a></li></ul></div>

If you'd like more than four titles, you can simply copy/paste the following codes for five, six, and seven links into the HTML/JavaScript widget:

Five menu links:

<div id="newnavbar"><ul><li><a href="URL OF MENU TITLE ONE">MENU TITLE ONE</a></li><li><a href="URL OF MENU TITLE TWO">MENU TITLE TWO</a></li><li><a href="URL OF MENU TITLE THREE">MENU TITLE THREE</a></li><li><a href="URL OF MENU TITLE FOUR">MENU TITLE FOUR</a></li><li><a href="URL OF MENU TITLE FIVE">MENU TITLE FIVE</a></li></ul></div>

Six menu links:

<div id="newnavbar"><ul><li><a href="URL OF MENU TITLE ONE">MENU TITLE ONE</a></li><li><a href="URL OF MENU TITLE TWO">MENU TITLE TWO</a></li><li><a href="URL OF MENU TITLE THREE">MENU TITLE THREE</a></li><li><a href="URL OF MENU TITLE FOUR">MENU TITLE FOUR</a></li><li><a href="URL OF MENU TITLE FIVE">MENU TITLE FIVE</a></li><li><a href="URL OF MENU TITLE SIX">MENU TITLE SIX</a></li></ul></div>

Seven menu links:

<div id="newnavbar"><ul><li><a href="URL OF MENU TITLE ONE">MENU TITLE ONE</a></li><li><a href="URL OF MENU TITLE TWO">MENU TITLE TWO</a></li><li><a href="URL OF MENU TITLE THREE">MENU TITLE THREE</a></li><li><a href="URL OF MENU TITLE FOUR">MENU TITLE FOUR</a></li><li><a href="URL OF MENU TITLE FIVE">MENU TITLE FIVE</a></li><li><a href="URL OF MENU TITLE SIX">MENU TITLE SIX</a></li><li><a href="URL OF MENU TITLE SEVEN">MENU TITLE SEVEN</a></li></ul></div>

changing fonts and color settings

2007-01-15T01:58:00.000-08:00

In order to change the color settings for your blog, you'll just click over to the Design / Edit HTML tab, scroll down just a little until you see the <Variable name> section, and then replace any hex color codes you want to change with new ones of your choosing (color chart here). Depending on what template you've purchased, the options you'll have control over will vary, but in general, you'll see several options, including "text color", "link color," etc. The section will look roughly like this:

For instance, you might want to change the link hover color. In that case, you'd look for the link hover variable, highlighted in the image below:

Once you find the variable you want to change, simply replace the given hex color code with a new one of your choosing. Just be careful not to delete any of the surrounding code.

You can play around with different color values and hit the "preview" button to see how it looks before saving (though you won't be able to see "hover" colors until you save the template and mouse over them).

Note: I strongly urge clients to back up their template before making any changes.

The same directions apply if you'd like to change one or more of the font options in your layout. Click over to the Design / Edit HTML tab, and scroll down a bit until you see the <Variable name> section. Towards the bottom of this section, you'll see the font options. Depending on what template you have, these will vary, but the section will look generally like this:

So if, for instance, you'd like to change the text font, simply find that variable...

...and replace it with the font you'd prefer, such as Arial. The updated code would then look like this:

You can play around with different web safe font options, and preview to see what you like. Remember, you can only use web safe fonts, such as these, and again, remember to back up your template first!

RETURN TO TUTORIALS

a quick message for the Weddingbee asker-afters!

2005-12-22T13:53:00.000-08:00

(written 12.22.09)

Hey you crazy people! That's very cool of you to follow up and be interested in my goings-on - I'm touched. Here's the long and short of it: After I left Weddingbee, I started The Lucky Nest, which was to be a sort of newlywed nesting blog. However, about five minutes into our marriage, my husband and realized we don't want kids. LOL. So much for the nesting end of things.

So yeah, it felt kind of weird to have a blog called The Lucky Nest when you don't want children. And yes I know, there's other sorts of nesting, etc. But just the whole nest-eggs metaphor alone made me uncomfortable, so I redirected The Lucky Nest to Elliequent.com. You'll see if you click to Elliequent that it's a private blog. I made it private for a number of reasons (and these are in no particular order):

1. it contains strongly opinionated posts about politics, religion, marriage, and parenting
2. my in-laws found it (LOL, but not at the time)
3. it was publicly tied to my business; I didn't want to alienate potential clients
4. I've become a much more private person (I even dumped Facebook!)

But really, people, you're not missing much. I seriously have like zero time to blog, and even if I did, it isn't a huge priority for me these days.

The nutshell summary of my life since Weddingbee: my husband and I moved to LA, where he acts and I do this. We're very happy to be pursuing our creative passions du jour, with no one but one another and our much beloved dog to answer to. We live in a loft downtown, and love being in the mix of things down here, and all the cultural and social stimuli that come with it. We've got big travel plans for the upcoming year that may or may not make news on the soon-to-bow shop blog.

That's it. That's all I've got to report from Lovebug Land. Exciting, no? Again, thanks for giving a hoot, and for the lovely words about my WB writings. I hope everyone's engagement/wedding/honeymoon is going/going off/went off grandly.

-Ellie

BACKGROUND PATTERNS

2005-11-10T23:59:00.000-08:00

Squidfingers (clean, small-scale)
Hip and Twendy (bright stripes, dots)
Citrus Moon (fancy, arabesque, geometric)
Kollermedia (simple, geometric)
Plaids
Tartans (check the Gallery Hall of Fame for the best starting points)
Ginghams
Textures Archive
Pixel Patterns (small scale)
Pattern Cooler (busy, geometric, retro, large scale, intricate - some damask and floral)
Colour Lovers (various, make your own)
Ava 7 (brights, retro)
Better Textures
The Inspiration Gallery (muted damasks, moire)
Make Your Own Stripes
Make Your Own Tartan
Make Your Own Shapes (also great for making solid color textures)

DESIGN FONTS

2005-11-10T23:58:00.000-08:00

If you'd like to preview how something will look in a certain font, here's how:

1. Google the name of the font to find the site where it can be downloaded/bought.
2. Go to that site, and find that font.
3. On DaFont, use the Custom Preview option on the font's download page. MyFonts offers a Sample Text box, and Veer offers a preview using the Flont feature.

WEB SAFE FONTS

2005-11-10T23:57:00.000-08:00

If you'd like any of the fonts of the blog text, post titles, date stamp, post footer, navigation menu, or sidebar titles to be different than what's shown on the sample template, you can choose any of the web-safe options below. These can be individualized (so, your post titles can be Century Gothic, your text Palatino, your date stamp Rockwell, etc.)..

*Arial / ARIAL / arial / Arial / Arial

Arial Black / ARIAL BLACK / arial black / Arial Black / Arial Black

Book Antiqua / BOOK ANTIQUA / book antiqua / Book Antiqua / Book Antiqua

Century Gothic / CENTURY GOTHIC / century gothic / Century Gothic / Century Gothic

Copperplate / Copperplate / copperplate / Copperplate / Copperplate

*Courier / COURIER / courier / Courier / Courier

Futura / FUTURA / futura / Futura / Futura

Garamond / GARAMOND / garamond / Garamond / Garamond

*Georgia / GEORGIA / georgia / Georgia / Georgia

Gill Sans / GILL SANS / gill sans / Gill Sans / Gill Sans

Lucida / LUCIDA / lucida / Lucida / Lucida

Palatino / PALATINO / palatino / Palatino / Palatino

Rockwell / ROCKWELL / rockwell / Rockwell / Rockwell

*Times / TIMES / times / Times / Times

*Trebuchet MS / TREBUCHET MS / trebuchet MS / Trebuchet MS / Trebuchet MS

*Verdana / VERDANA / verdana / Verdana / Verdana