CoffeeShop "Contact Me" Mini-Envelope Icon!

I am sure you have seen those cute little Contact Me Envelopes all over blogs and websites. You click on these little guys and your email program automatically opens up with their email address. Nifty right! Well, today I am going to share the "secret" to putting one on your blog. :-)


Image and video hosting by TinyPic


I love these little envelopes.
and with the help of this amazing tutorial (sorry, this link does not work now), I made one of my own. So if you want to save some time, please check the bottom of this post for my free CoffeeShop Contact Me layered .psd Envelope download.



This is what the image will look like when you open it up in Photoshop or Photoshop Elements. It looks scary with all of those layers, but you only have to change the color of the heart and little letter, and adjust the text.

Simply click on the top pink Solid Color adjustment layer box to change the heart color and click on the blue Solid Color adjustment layer box to change the letter color. You can remove the heart by turning off the heart layer. :-) And you can customize the text (the text layers are circled in the image above).

Then "Merge Visible" if you are putting this on a background that is not white, or "Flatten" if the background is white. Then Image, Image Size and adjust the width of the envelope to taste. I made the one I posted above 150px wide. Make sure to adjust the image size, the original envelope is HUGE!

Upload the little envelope to an image sharing site (make sure to adjust the size before uploading) such as TinyPic and copy the Direct Link for Layouts.

Paste the code you see below (put your email address where it says "youremailaddress" and the Direct Link you copied in place of the TinyPic URL already there) in a post or on a HTML gadget in Page Elements in Blogger. Remove the center code if you don't want the image centered.

<center><a href="mailto:youremailaddress@yahoo.com">
<img src="http://i49.tinypic.com/npkyl4.jpg"> </a></center>


And you will see this:





Download the incredibly cute CoffeeShop Envelope Icon file HERE or HERE!

If you have any questions, please post them them in my CoffeeShop Flickr Group!

25 Comments:

Joanie February 7, 2010 at 10:28 PM  

Very cool!

Sylvia February 8, 2010 at 12:07 AM  

As usual, great tutorial Rita.
I already put it up on my blog instead of the plain ole wording.

Matilda February 8, 2010 at 12:26 AM  

omg thank you so much for this. I have been googling the last couple of days for a tutorial like this, and today when I check my blogger updates I saw this. It has been a god send.

Thank you so very much

mwah!

Lori February 8, 2010 at 12:40 AM  

Thank you for freebies. Link on your post was added to Lori's freebie list

Kim Burmeister February 8, 2010 at 7:44 AM  
This comment has been removed by the author.
Life's Captures, by Jewels Martin February 8, 2010 at 9:16 AM  

My Envelope was big too.

Rita February 8, 2010 at 9:23 AM  

Thanks everyone!

And you have to make the envelope small via Image Size before uploading! I explain how to do that in the tutorial. :-)I made the original one large so it can be adjusted to any size.

Rita

Gretchen Clark February 8, 2010 at 9:34 AM  

Thank you SO MUCH for these tutorials and making them easy to understand...you ROCK!!!

CBH-Freebies Search February 8, 2010 at 9:36 AM  

Thank you so much for this Freebie. I want to let you know that I posted a link to your blog in CBH Digital Scrapbooking Freebies, under the Page 11 post on Feb. 08, 2010. Thanks again.

Staci Brock February 8, 2010 at 10:18 AM  

Very cute! What a fun idea, thinking I just may have to add this to my blog. Thank you for putting it all together, making our lives easier!!!

CraftCrave February 8, 2010 at 11:02 AM  

Thank you! This blog post will be advertised on CraftCrave in the DigiFree category today (look for timestamp: [08 Feb 04:00pm GMT]).

Lori Decoite February 8, 2010 at 12:19 PM  

great tut rita! Thanks!

Jerry Jones February 8, 2010 at 12:38 PM  

Hmmm, you must be reading my mind, which can be a scary thing, but I have been needing a contact form for me blog, thanks and hugs.

Amy February 8, 2010 at 1:58 PM  

Thank you! I love it & I love your blog. Thanks for everything!

The Hatch Family February 8, 2010 at 3:36 PM  

Thanks so much for this! I followed the instructions, and made it great without any problems. I'm finally getting the hang of this:)

Letitia February 8, 2010 at 9:34 PM  

I love your blog! Thanks for sharing these wonderful tutorials with the rest of us. You're awesome!!!

Liren February 9, 2010 at 12:20 PM  

I just wanted to say thank you so much for these awesome tutorials. I'm newish to to your site, but in such a short time, I've learned so much from you! This will definitely come in handy!

Mimi February 9, 2010 at 11:53 PM  

Thanks, Rita. I just added your mini-envelope to my blog!

saramellander February 12, 2010 at 5:28 AM  

SO cute!!!

Yeti February 19, 2010 at 8:32 AM  

Love your take on this! Thanks for leaving a link back to our tutorial.

Yeti

YetiKitn.com

Mrs Jelly February 22, 2010 at 2:56 PM  

I'm so happy somebody told me about your blog! I can see your tutorials will be a massive help to me!

Darla June 5, 2010 at 1:41 PM  

Rita! You Rock!
I have had more fun on your blog today! Learning about actions and storyboard templates and now Blogger tutorials! I've now got a "Add this" and a "contact me" graphics on my blog. Thank you for your great and easy to follow directions.
Darla

Kelly June 28, 2010 at 1:28 AM  

I'm not sure how I found your blog, but I'm so glad I did! I just put your Contact Me envelope on my blog and thanks to your tutorial, it was really easy - even for someone like me who is not a photoshop/flickr/html whiz!
Thank you!

Anonymous January 2, 2011 at 5:04 PM  

Hello,

Thanks for sharing this link - but unfortunately it seems to be down? Does anybody here at www.thecoffeeshopblog.com have a mirror or another source?


Thanks,
William

Rita January 2, 2011 at 5:37 PM  

William, you are right, the link doesn't work anymore. I will look for another link, but until then you can download the one I made and edit it as needed. Rita