Saturday, September 26, 2009

What is twittering and best twitter apps

What is twittering?
Twitter is a free social networking and micro-blogging service that enables its users to send (twittering) and read messages known as tweets. Tweets are text-based posts of up to 140 characters in length. Updates (tweets) are displayed on the user's profile page and delivered to other users who have signed up to receive them. Twitter is often described as the "SMS of Internet".


Twittering example


  • Twitter user BlogAndSEO tweet message "Just write article about twittering"


  • when twitter user BlogAndSEO click on button update message is published (tweeted) and all 20 followers of user BlogAndSEO will see his message (tweet)

    Tweet a new message to twitter


  • Now, all followers see a new message, more followers more people see this message


Retweet - what it is and how to retweet



The retweet ("RT") allows Twitter users to share the best links, and tweets they find from others.



  • 20 people see message of user BlogAndSEO because he have 20 followers, but in case one of the twitter followers retweet this message, let's say user the_gman all of the_gman followers will see BlogAndSEO's message, and hey, the_gman have 92521 followers!!!

  • the_gman send this message : "RT @BlogAndSEO: Just write article about twittering"

  • Twitter user BlogAndSEO benefit from retweet because the_gman have many followers

Short guide how to retweet

RT @OriginalPoster: RetweetedMessage


Retweet example
RT @BlogAndSEO: Just write article about twittering



How to know you have been retweeted


Go to web address http://www.retweetist.com/users/. Enter the user name and you will get last 30 day retweets for entered twitter user. This is how you can track your retweets.


Retweets web application

Manage twitter followers


Twitter followers are twitter users who follow your messages. One of the methods to increase number of twitter followers is to follow other twitter users. Because you follow twitter user there is a chance that he will follow you back, specially if you share common interest with him.


To find and follow twitter users by tag use : wefollow application.
Enter tag and you will get twitter users who have most followers and twittering about chosen tag.


Twubble - can help expand number of people you follow — it searches twitter friend graph and picks out people who you may like to follow


Mycleenr - sort twitter friends by time of their last tweets. It can be used to easily delete inactive users from friend (following) list


Just Tweet It - directories with twitter users, very useful. You can add yourself to one of this directories to get more followers. You can find Twitter Tools Directory also.


Twitter buttons - if you have your own web site or blog you can put a twitter button which link on your twitter account. This is one more way to get more twitter followers. On site Twitter buttons you can find some interesting twitter buttons.


Tweeting links


You want to put hyperlink in tweet. Don't worry, it is enough to write URL and twitter will automatically convert it to linkable short URL.


Example:
Text entered in twitter:

just write new article about making your own strip http://interestingwebs.blogspot.com/2009/09/make-your-own-comic-strip-online.html

Posted twitter message:

just write new article about making your own strip http://bit.ly/17K9F1

For those who want more control with links in tweets I suggest tinyURL web site.


This is useful in case:
  • you want to write fully 140 character tweet and don't have enough space, make tiny URL before posting tweet and save space for more text

  • you want decide to how you tiny URL text will look like (for example http://tinyurl.com/comicweb for original url http://interestingwebs.blogspot.com/2009/09/make-your-own-comic-strip-online.html)

Twitter hashtags


The twitter hashtag is used to designate topics or categories of information in tweet. A hashtag is a way for others to find information about your keywords even if they are not following you.


Format for hashtag: #WORD
Hashtag example: #blogspot

When you have tweet with hashtag, twitter users can click on hashtag (it is linkable) word and see last tweets which have this hashtag. For example if you click on this #blogspot hashtag you will find last real-time tweet results containing #blogspot hashtag.


Monday, September 7, 2009

Make your own comic strip online

Do you know that you can easily make your own comic on web. And you don't need to be artist. There is a strip generator on web. You can use made characters and just dragging those characters in your strip or make your own characters. You can add bubbles with text inside it (speech balloons), different objects and shapes.

stripgenerator.com is very funny and easy to use. I believe that stripgenerator is one of the best comic generators on web. My rate is excellent. Try and see!

Let's see a comic I maked in 15 minutes:



Make a strip

What can be done with strip generator


  • use existing drawings of humans, beings, objects, shapes and bubbles


  • easy drag end drop of existing objects to strip


  • add speech balloons and enter your text


  • change size and rotating existing objects


  • add and remove frames


  • generate a custom character


  • embedding comics in other web pages


  • searh strip gallery...



Guide to make your own strip (comic book) online


  • go on stripgenerator.com


  • click on "Create strip"


  • drag & drop objects in frames and make your own comic


  • you can use character generator to create your custom made characters

    Character generator on strip generator


  • you can embed strip with copy & paste code in embed text box

On stripgenerator page you can publish your strip blog, leave messages on their forum, search last strip blogs...


Wednesday, September 2, 2009

No tooltip bug in Firefox 3.5

After upgrading firefox to 3.5.2 version I noticed that there is no tooltips. Tooltips are missing and instead of missing tooltip there was small white rectangle cursor box. I found solution for this problem with a help of google.


It is no tooltip bug (or blank tooltip bug) in Firefox 3.5. Solution is to uninstall and reinstall the latest version of Google toolbar for Firefox. To be sure that problem is in Google Toolbar try to start Firefox in safe mode. If Firefox in safe mode properly display tootips then source of problem is in one of the add-ons (probably Google Toolbar for Firefox)


To uninstall Google toolbar for Firefox click Tools-->Add-ons, choose on Google toolbar and click Uninstall


Uninstall google toolbar

This article refer to no tooltip bug or blank tooltip bug in Firefox 3.5.


Friday, August 28, 2009

Star rating system on your blog

How to install star rating widget to your blog or web site? You will find guide in this article. First we will take a look at free star rating and recommendation system outbrain.com. Outbrain.com is a content ranking and recommendation widget for blogs, RSS, magazines and news. Second, we will show how to implement outbrain star rating on blogger (this widget can be installed on the other blog platforms too). In the third section you can learn about blogger reactions feature and blogger star rating feature which exists only in draft mode.


Star rating widget - outbrain


One option is to use star rating and recommendation widget which you can find on web address www.outbrain.com. Outbrain star rating widget can be easily installed to different blog platforms (Typepad, Blogger, Wordpress, Drupal) and to FeedBurner RSS feed. Star rating system is very straightforward to install on blog. In second section you can find example of installing outbrain rating system on blogger. It can be installed on web sites too, by embeding generic java-script code on your site.


Outbrain star rating widget loook like this:


Star rating blogger widget

Outbrain star rating widget is composed of 5 star rating part and recommendations part. In star rating part you can see how many visitors rated page and average rating. In recommendations part there are personalized recommended links selected by outbrain rating system. You can exclude recommendations if you like.


If you are registered to Outbrain rating system service you can track rating of every post in your blog:


Blog post reports in outbrain rating system


Installing Outbrain rating widget on blogger



  • Register on www.outbrain.com (you can install rating system without Registering on outbrain site but then you will not have blog reports)

  • Sign in to outbrain site and click on "Claim your blog"

  • Enter blog URL, chose Yes for Install rating widget, Select your blogger platform and select language

    Claim blog on outbraing rating system

  • On Add Page Element click on Add Widget button and your blogspot blog have outbrain rating star widget on every post

Maybe you will need uninstall instructions for outbrain star rating widget for blogger:


  • From your Dashboard:
    Click Layout >> Edit (on Ratings by Outbrain) >> Remove Page Element

  • if ratings still appear in blogger

  • find and remove code :

    <b:widget title="Ratings by outbrain" type="HTML">


  • This code can be found on the layout tab in the "Edit html" section. Remove this code.


Blogger star rating and reactions feature



Blogger have its own five star rating feature. This feature exists only in blogger drat mode. To use blogger draft mode you should login on web address http://draft.blogger.com.


Blogger star rating feature

This feature didn't work well on my blog. There was problem with loading, one time it worked and another time did not.


Guide to use blogger star rating feature:
  • log in blogger draft mode

  • click Layout --> Page Elements in "Blog Posts" click on Edit

    Blogger edit posts


  • in Configure Blog Posts page check "Show Star Ratings" checkbox

    Blogger show star rating checkbox

Blogger reactions feature

Blogger also have reaction feature. With this feature visitors can check one of offered reactions and blog owner have feedback.


Blogger reactions feature

Instructions for installing blogger reactions widget:
  • click Layout --> Page Elements in "Blog Posts" click on Edit

  • in Configure Blog Posts page check "Reactions" checkbox (with click on Edit you can enter your preferred blog reactions separated by coma, for example on picture blog reactions are : bad, good, excellent)

    Edit of blogger reactions

  • click save and now you have reactions widget on every post

My experience with reactions feature is positive. It works very good without problems, while blogger star rating feature have difficulties and is still in draft mode.


Sunday, August 2, 2009

jQuery image preview

Here you will learn how to dynamically preview image on your web page with help of jQuery. The image preview shows up when user put mouse pointer over the link. After mouse pointer lost focus on link, image preview disappear. Take a look at image preview demo to better understand what we call web image preview.



Demo of jQuery image preview



When visitors cursor hovering over "The sunset" link, an image preview shows up. After mouse pointer is moved off, image preview disappear. Now we will discuss how to install preview image on your page or blog (there are more javascript effect tutorials on my blog).


On this blog you can find how to alternate image after onclik event.


For those interested in changing image when onclick event occurs with jQuery I leave the link.

Guide to implement jQuery image preview on your page


  • Your page should point to external jquery library and to imgpreview plugin
    <script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>
    
    <script src="http://plugins.jquery.com/files/imgpreview.min.0.22.jquery.js.txt" type="text/javascript"></script>
  • We need some HTML code, one unordered list with one list item. This list item must have link to image
    <ul id="first">
    <li><a href='http://www.freefoto.com/images/15/10/15_10_70_thumb.jpg' rel="nofollow">The Sunset</a>
    </li>
    </ul>
  • Add jQuery code which instruct that when mouse pointer is over unordered list (ul) with id "first", method imgPreview is called. This method shows the image.
    <script type="text/javascript">
    $(document).ready(function(){
    $('ul#first a').imgPreview({
    imgCSS: { width: 100 }
    });
    });
    </script>


    • imgCSS: { width: 100 } - width is determined.

  • And that's it, demo works!!!

Sample code of HTML page for image preview

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Page</title>

<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>

<script src="http://plugins.jquery.com/files/imgpreview.min.0.22.jquery.js.txt" 

type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
$('ul#first a').imgPreview({
imgCSS: { width: 100 }
});
});
</script>
</head>

<body>
<ul id="first">
<li><a href='http://www.freefoto.com/images/15/10/15_10_70_thumb.jpg' rel="nofollow">The Sunset</a></li>
</ul>

</body>
</html>


To find more about imgPreview plugin visit page of it's creator James Padolsey.


Preview image for blogspot / blogger users


Blogger users should write all jscript code in one line or can call external javascript file .

For more information you can take a look at :


Sample of image preview working code in blogspot (in one line to avoid <br> tags):

<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script><script src="http://plugins.jquery.com/files/imgpreview.min.0.22.jquery.js.txt" type="text/javascript"></script><script type="text/javascript">$(document).ready(function(){$('ul#first a').imgPreview({imgCSS: { width: 100 }});});</script><ul id="first"><li><a href='http://www.freefoto.com/images/15/10/15_10_70_thumb.jpg' rel="nofollow">The Sunset</a></li></ul>