Freebie Fridays #40 - Pin-it Hover Buttons

With last Monday's tutorial in mind on how to upload custom made pin-it hover buttons to your images on Blogger, I thought it would be a nice idea to share some of those custom made buttons for this week's Freebie.

After downloading the buttons you can read the tutorial on how to add these images to your own Blogger blog and give your readers the opportunity to directly pin your blog images from your blog onto their Pinterest board. A little more exposure of your blog never hurts, right?

Okay, the pin-it hover buttons are all 75x75 pixels in size, which is the size of the hover button I use on this blog. All 20 buttons are in .PNG file and have transparent backgrounds, so they are perfect for the online use they are created for. I hope they will be helpful to you! See you next week!

Download the pin-it hover buttons here

Adding a custom Pin-It Hover Button to Blogger

You may have noticed that on this blog and on my personal blog The Daphne Files you see a so called Pin-it Hover Button appear at the top left corner of my post images. With this button readers can easily pin an image from the blog to their Pinterest board, which in return, will give your blog or website more exposure. So a lot of bloggers work with a Pin-it Hover Button, especially the ones that share great photography or recipe photography.

While Pinterest itself offers some guidance on installing one of their Hover Buttons on your blog, a lot of people want to use a Hover Button that matches the layout of their blog. And if you don't know how to create a gorgeous button yourself you can find designers on Etsy that sell them or are willing to make you a matching button. As of today I'm selling Blog Style & Makeover Kits that include Pin-it Hover buttons, so you might want to check that out.

But making a customized button or buying one, is one part of the process. Now you have to upload it to your Blogger blog. And today's tutorial is all about that! Before we start I want to mention that the coding I will use in this tutorial was originally written by BloggerSentral, so a big thank you to the designers over there!

STEP 1 - UPLOADING YOUR IMAGE ONLINE
Whenever you want to make an image 'clickable' so that it leads somewhere, you have to store that image (in this case the pin-it hover button) somewhere online. There are two ways to do this:

1. store the image in an online photo storage place like Photobucket or Flickr. Once you've stored your image there, these programs will make a link for this image, and this is the link you will need later on.
2. make a new post on your blog but don't publish it, keep it as a draft. Now upload the image in that post. Click on it with the right mouse button and choose the option to download the storage location. Now you've got your link too.

Just choose the option that works best for you, they both work.


STEP 2 - PLACING THE CODE INTO THE CODE OF YOUR TEMPLATE
To make it all work we will have to copy a piece of HTML coding into your blog's template coding.

1. Go to Blogger Dashboard and select option 'Template'. Once in the template option screen, choose option 'edit HTML'

2. Now you are in the coding of your blog and you will have to look for the line in the coding that says: </body>. Instead of scrolling down the coding until you're blue in the face, search for this tag by opening the search screen. You do this by typing Ctrl-F. Now you see a white search box in the upper right corner. Fill in the tag name there and give it an enter.



3. The search option has now located the </body> tag. Now we have to copy a piece of coding right above that tag. That piece of coding is:


<script>
//<![CDATA[
var bs_ButtonURL = "http://4.bp.blogspot.com/-s_Z2W0W4nDo/VLv0zL7TorI/AAAAAAAAIwk/wS8k8sOtYaU/s1600/Pin%2BButton.png";
var bs_pinButtonPos = "topleft";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script id='bs_pinOnHover' src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'>
// This Pinterest Hover Button is brought to you by bloggersentral.com.
// Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.
// Feel free to use and share, but please keep this notice intact.
</script>


Paste it above the </body> tag and it will now look like this:

4. The coding is now in, but we need to replace the orange colored text with the link to your pin-it image. Remember Step 1? That gave you the link coding, so please remove the orange piece of text and replace it with your own link.

5. The green text in the coding says 'topleft', that defines the position where your pin-it button will show up on your images. You can replace this for other locations if you wish: topright - bottomleft - bottomright - center

6. Save your template coding and your pin-it hover button should be visible now on your images.

Freebie Fridays #39 - Printable Business Card Design

Today, in the Freebie Friday's series, I'm sharing a printable business card design. For all you people that love to put their business info on a small piece of paper to hand out to potential clients and customers.

In my Etsy shop I sell several nice printable business card designs. So if this free design isn't exactly what you are looking for, hop on over to the shop and maybe you'll find a design that fits your business. All my business card designs are instant download items, which means that you can download the design right after purchase, add your text and start printing. And a printable business card is only $5, not that much of an investment ;-)

All my business card designs are US Standard size for business cards (3.5x2 inches). The cards are designed in 300 dpi .JPEG files, which guarantees good print results. The designs come with a back and front design for your card to which you have to add your own text.

Adding text to the cards isn't difficult at all, just follow the tutorial on how to add text to an image with the free image edit program Photoscape: http://www.thedutchladydesigns.com/2014/07/add-text-to-images-with-photoscape.html

So step up your business game with this free design or purchase another design at the shop!

Download the business card design here

A very cool color search tool - colors from image

Hi guys and girls! Happy Monday! Well, I like my job so much that I don't mind it being Monday again. Sorry for all you folks having a hard time starting up on Mondays.

I'm going to start off this week with a quick tip on a fantastic color searching/determining tool that I just found out about last week. I might call myself a designer, I mean, I have to put a description to what it is I'm doing, but that doesn't mean I know all there is to know about designing. Sometimes my clients actually give me very useful tips. And so did a lady last week.

We were working on a set of social icons for her and she needed them in colors to match other items on her website. But unfortunately the designer of these items hadn't given her the color codes of these items. Of course I could have spend some time trying to match the colors, but then she gave me a tip that made my job a whole lot easier. She knew of a program that could detect the color of an image and then let you know which HEX code corresponds with that color. Hallelujah!

The program is still in its Beta version, but it worked fine for me. You can find it over here: http://html-color-codes.info/colors-from-image/

All you have to do is upload your source image, click on the color in the image you would like to find the code for and the program will give it to you. Fantastic! This just saved me a ton of work in various projects.

And maybe it will help out other people as well. 

Till soon!

Freebie Fridays #38 - Winter Scrapbook Papers

While it is supposed to be Winter in my neck of the woods, it looked more like Autumn this last week. Grey, dark days, with lots of rain and wind. Not the kind of weather that makes you want to go outside.

If you are experiencing the same kind of weather, then it might be a good idea to snuggle up at home and keep yourself busy with some crafting. And to help you out a little I'm sharing 4 digital papers in Winter style this week for Freebie Fridays.

The papers are all 3600x3600 pixels in size and in 300dpi .JPEG file. Great for printing, but also nice to use for digital projects. You can upload them as background on blogs and websites or use them for digital scrapbooking and album making.

So instead of complaining about the weather, let's get creative and enjoy ourselves!

Download the set of Winter Scrapbook & Craft Papers here

Blogger Basics - Managing Basic Settings

Hi guys! After more than a week of radio silence, apart from last week's Freebie Friday, I'm back again with a short tutorial. And it's a tutorial in the category Blogger Basics, so it will probably be interesting for people that just started out using Blogger as their blogging platform.

While installing some blogs for clients over the last few weeks, I was a bit surprised to find out that quite a few of those clients asked me how they could change the tagline of their blog if they ever wished to do so. That was reason enough for me to write this tutorial, that might sound so simple to a lot of bloggers, but might help out a few that are just starting their blogging journey.

So today we're going to take a look at a small part of the blogger dashboard called Settings. More specifically, basic settings.

If you open your Blogger Dashboard, this is the screen you will see:

On the left side of the screen is a list with options and the bottom options is settings. That's the one we're going to take a closer look at today.

So press, the 'Settings' option to go to the next screen:

As you see, it opens the first option within the settings menu, which is 'Basic'. And that small section deserves some explanation. So let's go!

OPTION - TITLE

When you created your blog in Blogger you were asked to give it a title and an URL. But what if you ever wish to change that title? Then you come here, click the edit button, change the title and save it. Your blog will now show a different title, but will still have the old URL.

OPTION - DESCRIPTION

Description is just another word for tagline. If you fill in a little tagline here, it will appear underneath your blog title. Please don't make the tagline too long, because all this text will show up on your blog under your title. And having a paragraph long tagline just doesn't look so good. So for all my clients and readers who are asking themselves where they can fill in or change a tagline, this is the place!

OPTION - PRIVACY

Most bloggers will want this set to 'listed on blogger', otherwise your blog won't be visible to search engines, and how are readers ever going to find your then? The only reason to set this option to unlisted is when you want your blog to be private, just your own journal without people peeping into your writings.

OPTION - BLOG ADDRESS

This is where you can see the URL link of your blog. When you start out with blogger it will be something like www.yourblogname.blogspot.com. But if you ever decide to change it to a .com address like I did with The Dutch Lady Designs it will show here as well. In case you still have the .blogspot.com address, you can easily change the URL by editing it. But I wouldn't recommend it. If your blog already has readers and you change the URL, chances might be your readers won't find you back anymore.

OPTION - BLOG AUTHORS

If things are running smoothly you should see yourself listed as the one and only author of your blog. As you can see you have the option to add more authors, but only do this with people you trust and you've invited yourself to contribute to your blog.

OPTION - BLOG READERS

This is set to Public by default. You can set it to private if you only want certain folks to read your blog, but most of us want our 15 minutes of fame, so this will probably be a setting most of us don't mess with.

So this was the first short tutorial on managing a part of the dashboard. I'm planning on doing a lot more to help out my clients and readers that just started out as Blogger bloggers. Really, don't let yourself be intimidated by all the options. Blogging is just too much fun for that!

Till soon!

Freebie Fridays #37 - Social Media Icon Dots

Well, it's been rather silent on the blog this first week of the year. I had plans to post things, but unfortunately the first week of the year was probably not the best one.

While I entered the year with a positive vibe it was hard to keep it up this week. A person I knew suddenly died at a very young age, a friend of mine got diagnosed with breast cancer and on top of that came the news of that horrible shooting in Paris. Together with the rainy, grey weather, it kind of makes it hard to stay positive, I have to admit. So I had other things on my mind than writing tutorials, but I'll get to that over the next few weeks.

Because of all the sadness I decided it was up to me to stay positive, and what better way to stay positive than to share stuff. And this week I'm going to share an item with which I hopefully make a lot of people very happy. I made two sets of painted social media icons, one in grey and one in mint.

In each set you will find icons for: Bloglovin, Facebook, Google+, Instagram, Pinterest, Rss, Twitter and an empty icon. All icons are in 3 sizes to fit most sidebars: 75x75 - 55x55 and 40x40 pixels.

If you want to know how to upload these to a website and make them 'clickable', please view this tutorial: http://www.thedutchladydesigns.com/2014/05/how-to-make-social-media-icons-work-on-blogger.html

I hope they put a smile on your face and be of good use to you. Let's hope for a brighter week ahead!

Download the set of social media icons here

Love, Daphne

Freebie Fridays #36 - Cupcake Clipart

Hello everyone! I hope you all entered 2015 in a good way and let's hope it will be a loving, caring and prosperous year for all of us!

To share a little love I will kick off the new year on the blog with episode number 36 of Freebie Fridays. This time I'm sharing 3 cupcake clipart images in .PNG file.

I know I want to focus on eating a bit healthier this year, but I can't imagine never ever having a sweet treat again, so I'm not going to be too hard on myself. And after all, these cupcakes are virtual ones, so no bodies are being hurt by sharing this ;-)

See you all next week!

Download the set of cupcake clipart here