Tuesday, September 29, 2009

Add Digg vote on your posts

Add Digg vote on your posts



step #1
First, go to 'Layout' tab and choose the Edit HTML section ( Layout>Edit HTML )
Image

Step #2.
For this step you need to backup your template (click the 'Download Full Template' to backup your template)
Image


Step #3.
To start editing your template, please click the 'Expand Widget Templates'
Image


Step #4.
Use Ctrl+F to find this code line:

<div class='post hentry'>
<a expr:name='data:post.id'/>



Step #5.
Paste the below code above that line:
Code: Select all
<!-- syafzpic DIGG -->
<div style='float:right; margin-top:4px;'>
<script type='text/javascript'>
digg_url = "<data:post.url/>";
digg_skin = "compact";
digg_window = "new";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'></script>
</div>


Step #6.
Save.

Add DZone button on your posts

Add DZone button on your posts

step #1
First, go to 'Layout' tab and choose the Edit HTML section ( Layout>Edit HTML )
Image

Step #2.
For this step you need to backup your template (click the 'Download Full Template' to backup your template)
Image


Step #3.
To start editing your template, please click the 'Expand Widget Templates'
Image


Step #4.
Use Ctrl+F to find this <data:post.body/> code line.

Step #5.
Copy and paste the following code below the <data:post.body/> code line:
Code: Select all
<script type="text/javascript">
var dzone_url = '<data:post.url/>';
</script>
<script type="text/javascript">
var dzone_title = '<data:post.title/>';
</script>
<script type="text/javascript">
var dzone_style = '1';
</script>
<script language="javascript" src="http://widgets.dzone.com/widgets/zoneit.js"> </script>

Step #6.
Save.

Add ReTweet on every post


Add ReTweet on every post


step #1

First, go to 'Layout' tab and choose the Edit HTML section ( Layout>Edit HTML )
Image

Step #2.
For this step you need to backup your template (click the 'Download Full Template' to backup your template)
Image


Step #3.
To start editing your template, please click the 'Expand Widget Templates'
Image


Step #4.
Use Ctrl+F to find this <a expr:href='data:post.url'><data:post.title/></a>
Copy and paste the following code below the code line:

Code:

<script type='text/javascript'>
size = &#39;small&#39;;
</script>
<script src='http://www.retweet.com/static/retweets.js' type='text/javascript'/>



Step #6.
Save.

View full size in Blogger


View full size in Blogger


Small
Image

Large
Image

My friend ask me a favor..."Syarhanz, can you help me to view my thumbnail picture to it full size" he said.
After a week, I found the solution... :idea:
Here is the solution!


Step #1:
- Go to Layout > Edit HTML. Tick on the Expand Widget Templates

Step #2:
- Copy and paste this code before the </head> tag...

Code: Select all

<script src='http://jqueryjs.googlecode.com/files/jquery-1.3.js' type='text/javascript'/><link href='http://www.wallheaven.com/fullsize/fullsize.css' media='screen' rel='stylesheet' type='text/css'/> <script src='http://www.wallheaven.com/fullsize/jquery.fullsize.js' type='text/javascript'/><script type='text/javascript'>jQuery(document).ready(function(){jQuery("img").fullsize([]);});
</script>



Step #3:
- To view your thumbnail picture in a large/full size, please add this code in your post:
Code:
 
<img src="[color=#0000FF]URL SHORT IMAGE.jpg[/color]" alt="Me" longdesc="[color=#0000FF]URL FULLSIZE IMAGE.jpg[/color]" />

Step #4:
- Done! :D

Activate avatar on your blogger comments


Activate avatar on your blogger comments



Show your Avatar/Gravatar on your blogger comments...

Step #1
First, go to 'Layout' tab and choose the Edit HTML section ( Layout > Edit HTML )
Image

Step #2.
For this step you need to backup your template (click the 'Download Full Template' to backup your template)

Image


Step #3.
To start editing your template, please click the 'Expand Widget Templates'
Image


Step #4.
Use Ctrl+F to find this line.
<dl id='comments-block'>

and REPLACE it for the following code:

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>


Step #5.
After doing that, look for this line:

<a expr:name='data:comment.anchorName'/>


and ADD the following code right after it:


<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>



Step #6. 

- Save it. Done!

Click this link to register your avatar:
http://en.gravatar.com/

Thank you for visiting...

..::syarhanz::..




Simple Page Peel Effect for Blogger


Simple Page Peel Effect for Blogger

Image

1. Use Ctrl+F to find the </head> tag

2. Then, put these codes before the </head> tag.

Code: Sellect All
<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://i625.photobucket.com/albums/tt337/syafzpic/Forum%20upload%20only/syafzpic-PageSubscribe.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>




3. Next, paste this(below) code after the <body> tag.
Code: Sellect All
<div id='pageflip'>
<a href='http://feeds.feedburner.com/BloggerGangz'><img alt='' src='http://i625.photobucket.com/albums/tt337/syafzpic/Forum%20upload%20only/syafzpic-PageFlip.png'/></a>
<div class='msg_block'></div>
</div>



4. Done!

Add StumbleUpon button into Blogger posts


Add StumbleUpon button into Blogger posts



Image
Add a button to your site to make it easy for your visitors to submit your content to StumbleUpon.


Step #1
First, go to 'Layout' tab and choose the Edit HTML section ( Layout>Edit HTML )
Image

Step #2.
For this step you need to backup your template (click the 'Download Full Template' to backup your template)
Image


Step #3.
To start editing your template, please click the 'Expand Widget Templates'
Image


Step #4.
Use Ctrl+F to find this <data:post.body/> line.

and REPLACE it for the code below:
code:

Code: Select all
<p><data:post.body/></p><<a expr:href='"http://www.stumbleupon.com/submit?url="
+data:post.url'><img alt='StumbleUpon' border='0' src='http://www.stumbleupon.com/images/stumble7.gif'/>
</a>




Step #5.
Save it. Done!

You can choose other StumbleUpon button at this link:
http://www.stumbleupon.com/buttons.php?pgtype=profile



Add Yahoo! Messenger Pingbox in your site

Add Yahoo! Messenger Pingbox in your site



Nice to meet you again friends.Today I have a something special for you..


Image

Chat privately with visitors on your social network profiles, blog, or website through Yahoo! Messenger.
Send and receive IMs with your visitors when you sign into Yahoo! Messenger. IMs between you and each Pingbox visitor are private.

ImageImageImageImageImageImage



Follow these STEPS to put Yahoo! Messenger Pingbox in your site...


First, go to this link:
http://messenger.yahoo.com/pingbox/studio/

Second, choose your Background theme and Text size & colour.

Third, Choose or create your online and offline greetings

Fourth, name your Pingbox and click the save button.

Then, choose a website. I suggest you to choose 'Any Website'

COPY the code given and PASTE it in your blog/website.

Finish!



P/S:
- Visitors can chat with you when your Pingbox is on.
- Make sure your Pingbox is on by signing in to Yahoo! Messenger.
- Get the newest Messenger to take advantage of all the Pingbox features


Please reply me for any question.

Sunday, September 27, 2009

Tracking online user

Tracking online user

Hi..

Image
Image
Tracking online people!
How?
check this out!


1. First, open this link in a new tab
Code: Select all
http://whos.amung.us/

2. Then, click the Blogger button. For example, see below. You will be directed to your blog immediately. If you haven't log in into you Blogger, please log in first.
Image

3. Select your blog and click the ADD WIDGET button. See the example below...
Image

4. Done!

P/S: To see where the online user from, just click the tracker. See the example below
Image

Add your facebook badge in blog

Add your facebook badge in blog

hello!
We meet again!

Want to know how to put the facebook badge in your blog?
Let's follow the steps below...

Step 1:
Copy the link below and open it in the new tab...
Code: Select all
http://www.facebook.com/badges.php


Step 2:
For this step, you need to log in to your facebook account

Step 3:
Image
Choose to add the badge to the Blogger

Step 4:
You will see your facebook badge in your sidebar after you finish it...

Happy blogging...

Saturday, September 26, 2009

Make a blog with beautiful template???

  • First, go to the search and type blogspot.com. Click at Create your free blog. Click the at Create a blog.
  • Second, fill the empty blank with email address, password, display name and Word Verification. Do not ever forgot to accept the terms. Click the Continue.
  • Third, put your blog title and blog address(URL). After that, you put the correct Word Verification.
  • Lastly, choose a template..Start blogging...Finish.

If you want to change the template, you search the web : blogger template at the google search. Click the first blogger templates. There are many blogger templates in there. Choose the best one for your blog.Click at the templates.Download the template. After that, go back to the layout in your blog. Click at edit HTML. Browse the computer that for the template had been downloaded. Upload it. Comfirm & Save. Save template. Lastly, you only need to view blog। (End)


 

Blogger Tips and Style Copyright © 2009 Community is Designed by Free Blogger Template