How to Customize your Search Bar in Blogger

I love taking charge of my blog's design. If you've stuck around long enough, you've seen that I've changed my blog's design multiple times. I was looking over my design and thought my search bar looked a little "blah." Not to mention, I didn't like how wide the search bar was. I only search one word at a time on other blogs, so I knew I wanted to minimize the real estate of my search bar.

I just changed my search bar so its background matches the theme of my current design. This is really easy to do yourself. Just go to Layout > Add Gadget > HTML and add any of the following HTML codes, or customize them to your liking.

Example 1: Here, I just changed the background color of the search bar:

The code for Example 1 looks like this:

<form action="/search" id="searchthis" method="get" style="display: inline;"><input id="search-box" name="q" style="background:#f3ba87;" size="30" type="text" /> <input id="search-btn" type="submit" value="Search" /></form>



Example 2: Here, I changed the button's text to "Find."

The code for Example 2 looks like this: 

<form action="/search" id="searchthis" method="get" style="display: inline;"><input id="search-box" name="q" style="background:#f3ba87;" size="30" type="text" /> <input id="search-btn" type="submit" value="Find" /></form>



Example 3: Dashed outline in black and button's text is changed to "Go."

The code for Example 3 looks like this: 

<form action="/search" id="searchthis" method="get" style="display: inline;">
<input id="search-box" name="q" size="30" style="border: 1px dashed black;" type="text" /> <input id="search-btn" type="submit" value="Go" /></form>

As you can see, very minimal changes were made from each code to the next. For more tips on customizing your Search bar, go my source here and here. Also, software such as GIMP will give you the HTML of the colors you are using (ex: #f3ba87 is the coral color of my blog). If you don't have GIMP (it's a free software which is pretty on par with Photoshop) you can use this site for HTML colors.

Organizing your Gmail inbox into folders

If you look at my house, you'd probably know that I'm the last person who should be doling out advice on organization. Anyone wanna come organize my life? While I continue on that quest, I am going to share with you something that has just made my blogging life a million times easier.

The lovely Aubrey tweeted the other day about how she organized her e-mails by color, and I was instantly intrigued. I already had several folders for giveaways, blog design, and media contacts for reviews. When Aubrey said she had a folder for comments, I knew I had to jump on it. And I did. Here's how you can ride that pony express, too.

Open up your Gmail account. For this tutorial, I am focusing on creating a folder solely for comments. If you notice, every time you receive a comment, Gmail usually labels them as 

"[Your Blog Name] New comment on Title of Your Blog Post"

Type that phrase into the search bar, leaving out the bit with the blog post title. Hit 'Enter.'

You will see a drop down menu with several input fields. Copy and paste that same search entry into the field labeled "Has the words" to eliminate any e-mails that are not blog comments. Click on the "Create filter with this search" on the bottom right of the pop-up window.

Once you click "Create filter with this search" the following window appears. Check the check box titled "Apply the label:" and pick the corresponding label.  If you haven't yet created a label for the type of e-mail you are filtering into a folder, click on "New label."

I entered "Comments" as the label for these e-mails, and clicked "Create." You will be back at the preceding screen. Check "Also apply filter to XX matching conversations." Then click on "Create filter" in the blue button.

Below, you can see that Comments is now a new category. An extra (but helpful) step will color-coordinate your labels so that you can easily scan your inbox for the individual labels. 

Simply click on the little dropdown arrow for that particular label at the right of the sidebar, and that dialogue box will appear.  Choose the color  you want to associate with the label and "VOILA!" Your inbox is now organized into folders AND by color.

Your main inbox will dump all e-mails but they will have color-coded labels in the subject field.

Enjoy!

Organizing Bloglovin' into Folders

Making the move to Bloglovin' can be confusing. Here's a little tutorial on organizing blogs into folders.

Above you can see my Bloglovin' account and the list of blogs I am following (so far). Some are organized into folders, whereas some aren't.

First, you must create the folders. Here's the easiest way:

1. Click on "FOLLOWING" (in gray) above the list of blogs you are following. It will take you to this screen:

2. From here, you can click on "Create new group" and create a new folder to start organizing blogs under.

Now, you can click on any blog, and using the drop down "Add to a group" button, select which category you want that blog under.

What categories have you created?

Don't forget! Tomorrow is the DEBUT of:

Hope to see you there!

Importing Google Reader feed to Bloglovin {tutorial}

Everyone in blogland is fuh-reaking out about this Google Reader drama. I never EVER used Google Reader, so I fail to see the urgency of all things related to this. Also, there has been no mention of GFC going away! I don't think anything major will come of this, however, for the past few weeks I have been moving my GFC following to Bloglovin.  It's just much more streamlined. 

You DO NOT have to transfer each blog manually.  Here's the EASY way to do it:

Step 1.  Log in and select "Settings."

Step 2.  Click on "Import blogs."

Step 3.  Select Google Reader.

Step 4.  Pour yourself a glass of wine.  When you return, all your blogs will have been imported and you are reading to sip and scroll.

Boom chicka bow wow! Done!

Now, please be a doll and follow me on Bloglovin, cuz, you know.  All the cool kids are doing it.

No-reply blogger

Annoying to the umpteenth degree.  I get a sweet comment, and I pour my little heart out replying and swoosh!  My message goes nowhere.  Why? Because you're a no-reply blogger.

It's not your fault, really.  I don't know why Blogger is set to piss people off by default.

Are you a no-reply blogger?

Chances are, that blogger whose blog you commented on, isn't a biatch.  She probably tried to contact you but your account was set up as "no-reply."  You just wasted your breath holding a grudge.

Here's how to be sociable again*:

Open your Blogger account.  At the top right will be your account with a drop down tab.  When you click on it you should see this:

Sorry...can't have my personal e-mail out there for  my stalkers :)


Click on "Blogger profile."

This is what you're looking for.  If you DON'T see the e-mail link here, you are a no-reply blogger.  Let's say you do, in fact, see this.  Do the next step anyway.

Click on "Edit Profile." (not pictured; top right of your screen)

You want to check those two little boxes there.  Yes, both of them.  Otherwise, people won't be able to find you (and your fabulous blog).  Capish?

There you have it.  You are now, for lack of a better term, NOT a no-reply blogger.

Congratulations.  Now you won't piss off other bloggers. (I kid but, really.)

*this tutorial was intended for those bloggers who have not upgraded to Google+

Please feel free to spread the word by grabbing this button and putting it on your sidebar.
(Your future frustrated self will thank you.)

<a href="http://www.northernbellediaries.com/2013/01/no-reply-blogger.html"><img border="0" src="http://i1324.photobucket.com/albums/u606/lisette_harrington/no-reply_zps6f79ebe3.png"/></a>

How to add a Signature or In-post ad in Blogger

Have you ever looked at a blog and thought, "I wonder how they got that nice signature inside their blog post?"  Or, how they got an in-post ad through Passion Fruit Ads rotating underneath that signature (like me).

Wonder no more.  Homegirl here is gonna show you how it's done.  Just because. 

You're gonna have to mess with your Template's HTML.  Breathe.  You can do it (it's really easy!)  Just make sure you have your signature image hosted somewhere like Photobucket.

1. YOU MUST back up your template.  Please do not contact me saying you went ahead and did this without backing up your template.  I will not be able to help you.  Seriously.  I won't.  I CAN'T STRESS THIS ENOUGH.  BACK IT UP!

First, go to your "Template" section on Blogger.

Under the top right section of your screen, there should be a "Backup/Restore" button.  Click on it.

Click 'Download full template,' and save the file on your computer.  Then back it up on your USB flash drive.  Then upload it into Dropbox (ok, I kid, but seriously save it somewhere safe).

Don't even think about proceeding if you haven't done this.  I'm serious.

2. Click on 'Edit HTML.'  Again, you'll be warned on the danger of this.  But because you're a good little cookie and have done as I instructed, you will be OK.  Because even if you do something disastrous as erase your entire blog (unlikely), you'll have it backed up and all you have to do is upload it again.  See?  Easy. 

3.  Click 'Proceed.'  The following screen will open up:

Click image to enlarge

4. Check the box to Expand Widget Templates

5. Press Ctrl + F to open the search box. (I can't tell you how long I searched for the next phrase without this trick!)

6. Type 'post-footer' into the search box and hit the Enter key.  Every time this snippet appears in your template it will be highlighted.  The specific one you are looking for looks like:

<div class='post-footer'>.

7.  After this code (you can hit the enter button to create an extra line if necessary) you are going to enter the Image URL of your image in a code that looks like this:

<img src='http://www.somewebsite.com/signature.png'/>

Make sure your URL is surrounded by the single quotation marks and the other symbols in blue.

8. You can also paste the Passion Fruit Ads HTML for your in-post ad under the code you just inserted.  (Make sure you know the width of the body of your blog first! I recommend no wider than 500px in your Passion Fruit ad setup.)

9. Hit 'Preview' and look at your blog in the window that opens.  If you are happy, save your new template (and backup once more). 

I hope this was straightforward.  

If you have any questions, please leave them in the comments.  I will try to reply directly to your comment in the comments section so that others can benefit from further clarifications!

Statement Entry Wreath

Feel free to refer to this tutorial provided by Stone Gable.  It was their blog that inspired me to create mine.  I FELL IN LOVE with this wreath and knew that the ONLY way to have my very own was to make it myself.

I had a difficult time finding the same flowers as they did, and I also had to buy a similar wreath.  Their wreath was full and lush!  I bought a similar one at Hobby Lobby for about $14.  I used a 40% off coupon as well.  This wreath cost me a pretty penny.  In hindsight, I should have paced myself and bought these stems with more coupons.

It has only been within the past week that I've discovered that Michael's, JoAnn, and Hobby Lobby all have iPhone apps that have exclusive coupons oftentimes NOT found in print or on their websites.  It really does pay off to have the biggest arsenal at your disposal! 

StoneGable used green berries.  I had no such luck at either Michael's or Hobby Lobby.  But I WAS able to find green grape bunches for $1.99 a bunch, and the darker berries were about $2.99 a piece.  The costliest member of the wreath were the small, bright green bunches of hydrangeas.  They run about $11 a stem (with only 5 bunches of hydrangeas on each stem!) so definitely use your coupons for those.  I used green Queen Anne's lace for the round green bunches.  It was a nice filler that also provided wonderful texture and dimension.

Here are pictures of my finished product.  Again, I apologize for my lack of tutorial, but I will be more than happy to answer any questions you have!