How To Add A Custom “PIN IT” Button To Your Blog

Blogger has changed so much since I started to use it years ago. It has come a long way and there is so much more customization that you can do with a blogger blog without needing a lot of coding experience/skill.

Clic to download

One of the first things I learned was adding a hover Pinterest “PIN IT” button to my blog. It is not only is it EASY to add a hover “PIN IT” button to a blogger blog, but you can customize your “PIN IT” button too.



This is how:


1. Design your “Pin It” graphic & save it as a PNG file. I use photoshop CS5 for grapics, but you can easily make your own “PIN IT” button using a free application like picmonkey.com. Or feel free to use one of my buttons (above)


2. Upload your graphic to a photo saving website. I use Photobucket or ImageShack.


3. Go into your blogger account and go to Template > Edit HTML.


4. Scroll almost all the way down the template until you locate the </body> tag.

5. Copy the code below and insert it right above the tag.

<script> //
<![CDATA[
var bs_pinButtonURL = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkvZ77KvemKh_8qotyZKyJw1rTghR2FfW6HiNgWgJkdJJAzHRa-wcQaKFsEd19SPFR_3l9-SdwkeNXY-w-5hvLnDxyYlPmTl0LPZmQakifvKhvxcc6Dj-f6-jwbkGam81BNnuAsH537caO/s1600/pinterestx1_72.png";
var bs_pinButtonPos = "center"; 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> <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 Oxana's Designs. // Visit http://oxanadesign.blogspot.com.co/2015/07/how-to-add-custom-pin-it-button-to-your.html // Feel free to use and share, but please keep this notice intact. </script>

6. To use your own button, replace the URL in line 3 with the direct link URL to the image. Make sure to keep the quotes.

7. Save, view your blog, and start pinning.

* You can also change the position of your “PIN IT” button. Find the part of the code that says “center” & try changing it to topleft, topright, bottomleft, bottomright. Play around with position to see what visually suits your blog.

Why should I have a blog signature?

The main aim of signature is to let others know who you’re. The signature must reflect who you are and what you blog as much as any other visual part of your blog. How often do you get FREE prime ad space to say whatever you want about you? Creating a custom signature allows you to really show off your personal style and add some fun to your posts.

You can use this easy tool to create your own (but I highly recommend to ask your blog designer to make one for you) :

MyLiveSignature

Now, I know is hard to remember to include the signature image every time you write a post... So, here is a little tutorial to make the signature appear automatically in your nexts posts.

Click here yo go to the tutorial by Her & Nicole

I'd like to see your signatures!!

6 Pinterest Marketing Tips for Success

#1 Pin great images!

#2 Share quality content

#3 Know your target market

#4 Follow pinners who have similar interests & share, Like, or comment on their pins

#5 Check your analytics frequently to see what pins are resonating with your followers & who's sharing your content

#6 Promote your Pinterest account on your website or blog with Pinterest widgets & share the fact that you’re on Pinterest across your social networks, via email & newsletter.

How to: Place your cursor over the image and it changes {BEFORE AND AFTER}

A rollover or mouse over image is a great image effect you will have seen used on lots of blogs and websites. When you use this effect with an image or picture you add to your blog, the image will change to a different image once you hover your cursor over it. It's also a very easy to use and can have so many uses.




Here's a preview of a rollover image. Place your cursor over the image to see it change:





You will need to have your images in a hosting service like ImageShack.

This is the code we use to make the image:

<a href="TARGET URL GOES HERE"><img src="URL OF FIRST IMAGE GOES HERE" onmouseover="this.src='URL OF SECOND IMAGE GOES HERE'" onmouseout="this.src='URL OF FIRST IMAGE GOES HERE'" /></a>

You now need to customize the code by adding the images you want to use & the address you want it to lead to when clicked. I recommend to copy this code and paste it on the notepad and there you can edit it.

Once the changes are made, you are done. You can place the image in your blog posts/sidebar or anywhere html can be used. To place in the post content you just need to select the HTML tab on the upper left and then paste the code.

HOW MANY page views is "normal" ?

The number of PVs (Page Views) per user will vary enormously from site to site. Whether having a low number of PVs per visit is good or bad will depend on the site.

You might expect a community site to have quite a few PVs, for example, but an editorial site with information on many subtopics might average only a few PVs per visit (especially if users are coming in through search) because users leave when they've found the information they're looking for.


To make matters more complicated, a user who looks at only a page or two today may come back again and again if he regards your site as an authoritative source of information on a broad topic.


That said, you may be interested in check out this study that shows some statistics to make you consider how is your blog/page doing:

 

Parenting blogs analytics study from Annie Phdinparenting

Also, here are 2 sites to help you check out the stats for your page:

Alexa       -       StatCounter