Saturday, July 16, 2011

Introducing the "Share This Groovy Coolness" Gadget for Blogger!




I've just created ANOTHER new widget/gadget to go under every post of your Blogger blog. If you like it, please feel free to add it to your blog!

Before you do this, however, there are a few steps you MUST do (it's easy) before you incorporate this code into your blog:

1.  I would recommend that you make a copy of your template before doing any of this.  You can do this by going to SETTINGS and saving a copy to a file on your computer.

2.  Copy ALL of the code below (IN BOLD) into Notepad or Word some other notemaker software:


<br/>
<br/>
<br/>
<!-- Groovy Chicky Coolness Share Start-->
<a href='http://www.chickthatbytes.blogspot.com'><img alt='' src=''/></a><style>
img{border:0;}
#wrapper{width:488px; height:110px; background-image:url(


http://4.bp.blogspot.com/-QB_cIlNhUC8/TiHNPZBd9uI/AAAAAAAA3sk/3kDlnfHheb8/s1600/share+this+groovy+coolness.png); position:relative; background-repeat:no-repeat; background-color:transparent;}
#wrapper ul{position:absolute; width:600px; top:42px; left:3px; list-style-type:none;}
#wrapper li{float:left;}
</style>
<div id='wrapper'>
<ul>
<li><g:plusone size='tall'/></li>
<li>
<!-- Facebook button-->
<a expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Share On Facebook' height='' src='http://1.bp.blogspot.com/-aBDTDuUC4kc/TiDReTYEtNI/AAAAAAAA3r0/bYhHYHdjyEY/s1600/facebook.jpg' width=''/></a>
</li>
<li>
<!-- Digg button-->
<a expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Digg This Post' height='' src='http://3.bp.blogspot.com/-Eg2xlr_tloY/TiDRcL0RCPI/AAAAAAAA3rw/bl606-PpUhQ/s1600/digg.jpg' width=''/></a>
</li>
<li>
<!-- Stumbleupon button -->
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Stumble This Post' height='' src='http://1.bp.blogspot.com/-35DYCln-xRk/TiDRfCyejuI/AAAAAAAA3r8/6SmNo7L2bFk/s1600/stumbleupon.jpg' width=''/></a>
</li>
<li>
<!-- Twitter button BE SURE TO CHANGE THE NAME IN BLUE TO YOUR TWITTER NAME-->
<a class='twitter-share-button' data-count='vertical' data-via='tkgoforth' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></li>
<br/>
<br/>
</ul></div>
<br/>
<a align='left' href='http://chickthatbytes.blogspot.com/2011/07/introducing-share-this-groovy-coolness.html' target='_blank'><font color='#ff559c' size='small'>CHICKY GROOVY COOLNESS GADGET</font></a><br/>
<!--End Sharing Groovy Chicky Share Gadget http://www.chickthatbytes.blogspot.com-->
<br/><br/>

ONCE THE ABOVE IS COPIED, THEN

3.  Enter YOUR TWITTER NAME in the TWITTER area where my twitter name is (in BLUE) that you pasted into Notepad (or Word, or whatever you used.  [Or, you can GO HERE to TWITTER and set up your twitter button to look different than the one I have.  Be sure to include YOUR TWITTER NAME information.  THEN paste all of that code EXACTLY AS IT IS within the red area.]

4.  Once these things are all done:


Go to your Blogger Dashboard, and then go to DESIGN. Then go to EDIT HTML. Click on the check box to EXPAND WIDGETS.

Then, on the top of your browser, go to EDIT then FIND (or use ctrl+F).  In the "Find" box at the bottom of your browser, type in <data:post.body/> and then click the "next" button" on the right of it.  (You want to find this code in your template).

Once you find this code, COPY AND PASTE the above code you copied into Notepad (and changed with your twitter name) just after the code. Preview it, and you will find that it will show up below every post!

Let me know what you think!







CHICKY GROOVY COOLNESS GADGET


Friday, July 15, 2011

Introducing the Groovy Chicky Share Gadget for Blogger!

I've just created a new widget/gadget to go under every post of your Blogger blog. If you like it, please feel free to add it to your blog!

Before you do this, however, there are a few steps you MUST do (it's easy) before you incorporate this code into your blog:

1.  I would recommend that you make a copy of your template before doing any of this.  You can do this by going to SETTINGS and saving a copy to a file on your computer.

2.  Copy ALL of the code below (IN BOLD) into Notepad or Word some other notemaker software:

<br/>
<br/>
<br/>
<br/>
<!-- Groovy Chicky Share Start-->
<a href='http://www.chickthatbytes.blogspot.com'><img alt='' src=''/></a><style>
img{border:0;}
#wrapper{width:488px; height:110px; background-image:url(http://2.bp.blogspot.com/-OcCVujyv-pM/TiGabLdhPLI/AAAAAAAA3sc/23IQBzD4xCE/s1600/SHARE+THIS+GROOVY+POST.png); position:relative; background-repeat:no-repeat; background-color:transparent;}
#wrapper ul{position:absolute; width:600px; top:42px; left:3px; list-style-type:none;}
#wrapper li{float:left;}
</style>
<div id='wrapper'>
<ul>
<li><g:plusone size='tall'/></li>
<li>
<!-- Facebook button-->
<a expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Share On Facebook' height='' src='http://i553.photobucket.com/albums/jj377/goforthjtj/facebook-4.jpg' width=''/></a>
</li>
<li>
<!-- Digg button-->
<a expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Digg This Post' height='' src='http://i553.photobucket.com/albums/jj377/goforthjtj/digg.jpg' width=''/></a>
</li>
<li>
<!-- Stumbleupon button -->
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Stumble This Post' height='' src='http://i553.photobucket.com/albums/jj377/goforthjtj/stumbleupon.jpg' width=''/></a>
</li>
<li>
<!-- Twitter button -->
<a class='twitter-share-button' data-count='vertical' data-via='tkgoforth' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></li>
<br/>
<br/>
</ul></div>
<br/>
<a align='left' href='http://chickthatbytes.blogspot.com/2011/07/introducing-groovy-chicky-share-gadget.html' target='_blank'><font color='#ff559c' size='small'>GROOVY CHICKY GADGET</font></a><br/>
<!--End Sharing Groovy Chicky Share Gadget http://www.chickthatbytes.blogspot.com-->
<br/><br/>




 ONCE THE ABOVE IS COPIED, THEN

3.  Enter YOUR TWITTER NAME in the TWITTER area where my twitter name is (in BLUE) that you pasted into Notepad (or Word, or whatever you used.  [Or, you can GO HERE to TWITTER and set up your twitter button to look different than the one I have.  Be sure to include YOUR TWITTER NAME information.  THEN paste all of that code EXACTLY AS IT IS within the red area.]

4.  Once these things are all done, continue....



Go to your Blogger Dashboard, and then go to DESIGN. Then go to EDIT HTML. Click on the check box to EXPAND WIDGETS.

Then, on the top of your browser, go to EDIT then FIND (or use ctrl+F).  In the "Find" box at the bottom of your browser, type in <data:post.body/> and then click the "next" button" on the right of it.  (You want to find this code in your template). 

Once you find this code, COPY AND PASTE the above code you copied into Notepad (and changed with your twitter name) just after the code. Preview it, and you will find that it will show up below every post! 


Let me know what you think!





CHICKY GROOVY COOLNESS GADGET


Monday, July 11, 2011

Wanna Know How To Remove the Blogger Banner from the Top of Your Blog?

If you are like me, you think that the Blogger banner at the top of your Blogger Blog is a little "loud" and somewhat "annoying."    Here is what it looks like (click image to enlarge):


 
As you can see, I don't have it on my blog anymore, even though this is a Blogger blog.


Want to know how to remove it, quick and easy?

Here's the trick.  Go to your dashboard and click on the "Design" tab.





From there, click on the little box that says "Edit HTML."



From there, scroll down to your blog TEMPLATE DESCRIPTION (this shouldn't be that far down):



 Right after this, and before "/* Variable definitions" you are going to add the following CSS code (copy and paste this): 

#navbar-iframe {
display: none !important;
}




 Be sure to SAVE your work, and check out your blog!  You will like it!

I got this information from the website:  http://blogger-templates.blogspot.com/2005/01/remove-navbar.html.  They have some nice templates you might want to check out!








CHICKY GROOVY COOLNESS GADGET


T.K. Goforth is a musician and author of the well-received book "Chord Piano is Fun!" She also writes a music blog called "Chord Piano Chick's Mostly Musical Musings.
Chord Piano Is Fun