Pages

Google Search Engine

Wednesday, December 15, 2010

Wordpress

WordPress is web software or CMS (Content Management System) framework & simple web hosting you can use to create a beautiful website or blog. We like to say that WordPress is both free and priceless at the same time.
The core software is built by hundreds of community volunteers, and when you’re ready for more there are thousands of plugins and themes available to transform your site into almost anything you can imagine. Over 25 million people have chosen WordPress to power the place on the web they call “home” — we’d love you to join the family.

source :wordpress.org


keyword : wordpress, blog, blog guide, blog trik, blog info, wordpress, plugin, themes

Saturday, December 11, 2010

Blogger Keyboard Shortcut [ shortcut ]

Blogger has several keyboard shortcuts you can use while editing posts. They definitely work in Internet Explorer 5.5+/Windows and the Mozilla family (1.6+ and Firefox 0.9+), and might work in other browsers.

Notes :

Remember to use "Modern Editor" or something like : "Updated editor (Recommended) - Check out the latest features!" for your "Post Editor"

Steps :

Here they are:
  • control + b = Bold
  • control + i = Italic
  • control + l = Blockquote (when in HTML-mode only)
  • control + z = Undo
  • control + y = Redo
  • control + shift + a = Link
  • control + shift + p = Preview
  • control + d = Save as Draft
  • control + p = Publish Post
  • control + s = Autosave and keep editing
  • control + g = Indic transliteration
    blog trik, blog trik2, blog tips, blog tutorial, blog guide, blog information, blog info

    Thursday, September 16, 2010

    Tips & Trik Word Count Posting Blog

    If you post :
    • a tiny trick prefer has 50 words++
    • a very short trick or info or news, often blogger & reader prefer like 100 - 150 words ++.
    • a short trick, often blogger & reader prefer like 250 words ++.
    • a how to trick, often blogger & reader prefer like 450 - 500 words ++.

    keyword :
    blog trik, blog trik2, blog tips, blog tutorial, blog guide, blog information, blog info

    Saturday, June 26, 2010

    Text editor [ list ]

    You can use text editor to edit a simple modification of your blog posting or either edit any text document.


    Here are (Programmer's) text editor list :
    • Open source / Free
      • jEdit
      • Metapad
      • Notepad2

    XSLT -XML

    XSLT

    namespace has the URI http://www.w3.org/1999/XSL/Transform

    XSL -XML

    XSL

    What is XSL
    ?
    XSL is a family of recommendations for defining XML document transformation and presentation.

    It consists of three parts:

    1. XSL Transformations (XSLT)
      a language for transforming XML

    2. XML Path Language (XPath)an expression language used by XSLT to access or refer to parts of an XML document. (XPath is also used by the XML Linking specification)

    3. XSL Formatting Objects (XSL-FO)
      an XML vocabulary for specifying formatting semantics



    xsl:stylesheet element may contain the following types :

    • xsl:import

    • xsl:include

    • xsl:strip-space

    • xsl:preserve-space

    • xsl:output

    • xsl:key

    • xsl:decimal-format

    • xsl:namespace-alias

    • xsl:attribute-set

    • xsl:variable

    • xsl:param

    • xsl:template



    other alternative , CSS

    other post :

    Wednesday, March 3, 2010

    Modifying / Pimping Feed Burner

    Quick Guide to Make Recent Post & Recent Comment

    If you visit to many blog, You will usually see the writing would be "Recent Post" and "Recent Comment", in Bahasa Indonesia call "Artikel terbaru" and "Komentar terbaru".

    Now the tips and tricks on this blog I had been discussing how to create Recent Posts and Recent Comment using Feedburner. In this article, I wanted to share how to create Recent Posts and Recent Comment without using Feedburner, with a faster way.

    How to create Recent Posts and Recent Comment use feeds:

    1. Login your account Blogger

    2. Choose Layout

    3. Choose Feed

    4. Enter this web address :

    - For recent article / post : http://www..com/feeds/posts/default
    - For recent comment : http://www.domain_name.com/feeds/comments/default

    5. Finish

    In Feed menu tersebut, you can specify how many recent articles and recent comments to display.

    Make A FavIcon to your Site / Blog

    >link href="http://domain_fav_icon/Fav_icon_name.ico" rel="shortcut icon" type="image/x-icon"<>/link<
    >link href="http://domain_fav_icon/Fav_icon_name.png" rel="icon" type="image/png"<>/link<

    ]]>{/b:skin}

    {link rel="shortcut icon" href="http://domain_fav_icon/Fav_icon_name.ico" /}

    {/head}

    {body}


    NOTE :

    '{' equates to '<' '}' equates to '>'

    Graphics Banner Generator Online

    http://cooltext.com/


    http://www.bannerbreak.com/
    Glitter/Animation Graphics , Graffiti Creator, Free Banner Maker

    http://www.bannerfans.com/banner_maker.php
    Web 2.0 Graphics Banner Text Generator Online

    blog trik

    Trik : Read More (Very Simple)

    Blogger has introduced After the Jump a  new feature which lets you create expandable post summaries in your blog posts, so longer posts appear as an intro with a link to Read More at the bottom.

    Creating jump breaks in your blog posts can be easily done right from the post editor, without the need for any HTML changes.

    Two way  / alternative to make a Read More link

    1. Place mouse cursor at the jump point, simply click the Insert Jump Break toolbar icon:

    2. add this code into the post editor:

    >!-- more --<

    Related Post / Topic / Article :
    how to make read more hyperlink

    Wednesday, February 10, 2010

    Easy Guide : Make Thumbnail Similar Post

    4 Easy Step to Make Thumbnail Similar Post

    1. Login to your blogger/ blog site.
    2. go to Link Within 
    3. fill in Form
    4. Voila, Your Thumbnail Similar Post has been added to your blog site.

    Friday, January 29, 2010

    How to add Reactions to my blog? (blogger/blogspot)

    Adding Reactions is done through the settings page of the Blog Post widget.
    From the Layout > Page Elements tab, simply click the 'Edit' link under the Blog Post widget and a settings window will pop up.


    The Configure Blog Post window will display a handful of options, and the Reactions feature is near the bottom of the list:



    To turn on Reactions just select the checkbox, and then you will be able to customize the feature by adding words of your choosing. Finally, you can choose the exact location of Reactions by dragging the widget at the bottom of the Configure Blog Post page:

    Hack: Automatic Site Spoken Language(Google) Translate

    source : http://translate.google.com/translate_t
    If you want to automatically break out of the google frame

    Just under the opening <head> tag:

    <script language="JavaScript" type="text/javascript">
    <!--
    function framebreakout()
    {
    if (top.location != location) {
    top.location.href = document.location.href ;
    }
    }
    //-->
    </script>

    Make this language flag image :
    http://kalphiter.com/images/flags/


    and in the body tag:

    <body onload="framebreakout()">

    How To : Make a Read More hyperLink

    How To : Make a Read More hyperLink

    First Step :
    1. Login to Blogger





    2. Click Settings menu



    3. Click Formatting tab










    4. Go to the most-bottom page, at Post Template fill in the textarea :

      <div class="fullpost">

      </div>
    Second Step :

    Langkah selanjutnya yaitu menambahkan kode pada template.

    1. Click Dashboard hyperlink at top right corner
    2. Click Layout menu
    3. Click Edit HTML menu
    4. BACKUP your template. Save your Template with click Download Full Template, before upload template section. So anything accident can be save with restore another time.
    5. At Edit Template section, Check Expand Widget Template, wait a minute.
    6. Find this following code :

      <div class='post-body'>
    7. Copy the following code then Paste under code in step 6 :

      <b:if cond='data:blog.pageType == "item"'>
      <style>.fullpost{display:inline;}</style>
      <p><data:post.body/></p>
      <b:else/>
      <style>.fullpost{display:none;}</style>


    8. Then search this following code :

      <p><data:post.body/></p>

    9. Copy this HTML code & Paste below the HTML code in Step 8 :

      <a expr:href='data:post.url'>Read More......</a>
      </b:if>

    10. Click Save Template

    How to Post Article


    1. Click Edit HTML at Posting Editor, then tempate must appear like this :

      <div class="fullpost">

      </div>


    2. Write post when appear before reader/user click Read More... ,
      before this code :

      <div class="fullpost">


    3. Posting your content after the code in step and before this following code :

      </div>




    4. Publish your Post

    Hack : Translate your Site With Google Translate (Flag Image)

    Pimp : Translate your Site With Google Translate (Flag Image)

    One of the most reason visitor want to read your article blog is language that we use on our article posting and how to make our reader can understand the content. So if do you want to make our visitor understand with our article content, you can use Google translator to automatically translate your article language.

    This facility/widget make your reader easier to read the article content. So we wish this widget can increase our site page views . Then no more barrier from our reader to express with our site
    (example : read, comment/shouting a post, bookmark, etc).


    Step to implement :

    1. Login to your Blog
     

    2. Click Layout Tab

    3. Click Page Elements Tab

    4. Click Add Gadget

    5. Click Basics > HTML/JavaScript options


    6. Paste one of following script to Content box that you favor

    a. Script for 1 lines / set


    <div style="overflow:no; width:100%px; height:100%px; padding: 5px; background: #FFFFFF;">
    <center><a href="http://your_site_url.com/" target="_blank"><b>Google Translate</b></a></center>
    <style>
    .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }
    .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; }
    .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; }
    </style>
    <div style="overflow:no; width:100%px; height:100%px; padding: 5px 0px 0px 0px;">
    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" src="http://Arab_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" src="http://Korean_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" src="http://Japan_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" src="http://China_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" src="http://Rusian_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" src="http://Portuguese_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" src="http://United_kingdom_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" src="http://French_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" src="http://German_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" src="http://Spanish_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" src="http://Italia_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>


    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" src="http://Netherland_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>
    </div>

    Result (for 1 lines flag) :



    Google Translate





    ArabicKoreanJapaneseChinese SimplifiedRussianPortugueseEnglishFrenchGermanSpainItalianDutch

    8. Script for 2 lines
    <div style="overflow:no; width:100%px; height:100%px; padding: 5px; background: #FFFFFF;">
    <center><a href="http://your_site_url.com/" target=" blank"><b>Google Translate</b></a></center>
    <style>
    .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }
    .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; }
    .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; }
    </style>
    <div style="overflow:no; width:100%px; height:100%px; padding: 5px 0px 0px 0px;">
    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" src="http://Arab_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" src="http://Korean_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" src="http://Japan_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" src="http://China_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" src="http://Rusian_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" src="http://Portuguese_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" src="http://United_kingdom_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" src="http://French_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" src="http://German_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" src="http://Spanish_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" src="http://Italia_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" src="Netherland_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>
    </div>
    </div>
    Result (for 2 lines flag) :



    Google Translate





    ArabicKoreanJapaneseChinese SimplifiedRussianPortuguese
    EnglishFrenchGermanSpainItalianDutch

    9. Script for 3 lines

    <div style="overflow:no; width:100%px; height:100%px; padding: 5px; background: #FFFFFF;">
    <center><a href="
    http://your_url_site.com/" target=" blank"><b>Google Translate</b></a></center>
    <style>
    .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }
    .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; }
    .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; }
    </style>
    <div style="overflow:no; width:100%px; height:100%px; padding: 5px 0px 0px 0px;">
    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" src="http://Arab_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" src="http://Korean_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" src="http://Japan_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" src="http://China_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" src="http://Rusian_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" src="http://Portuguese_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" src="http://United_kingdom_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" src="http://French_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" src="http://German_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" src="http://Spanish_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" src="
    http://Italia_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" src="http://Netherland_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>
    </div>
    </div>
    Result (for 3 lines flag) :


    Google Translate




    ArabicKoreanJapaneseChinese Simplified
    RussianPortugueseEnglishFrench
    GermanSpainItalianDutch

    10. Script for 4 line


    <div style="overflow:no; width:100%px; height:100%px; padding: 5px; background: #FFFFFF;">
    <center><a href="
    http://your_url_site.com/" target=" blank"><b>Google Translate</b></a></center>
    <style>
    .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }
    .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; }
    .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; }
    </style>
    <div style="overflow:no; width:100%px; height:100%px; padding: 5px 0px 0px 0px;">
    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" src="http://Arab_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" src="http://Korean_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" src="http://Japan_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" src="http://China_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" src="http://Rusian_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" src="http://Portuguese_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" src="http://United_kingdom_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" src="http://French_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" src="
    http://German_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>

    <center>
    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" src="http://Spanish_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" src="http://Italia_flag_image.gif" style="cursor: pointer;margin-right:3px"/></a>

    <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" src="
    http://Netherland_flag_image.gif" style="cursor: pointer;margin-right:0px"/></a>
    </center>
    </div>
    </div>

    Result (for 4 lines flag) :


    Google Translate





    ArabicKoreanJapanese
    Chinese SimplifiedRussianPortuguese
    EnglishFrenchGerman
    SpainItalianDutch

    11. Customize code text with red color depends on your favor.
    For color list, visit : html-color-codes

    12. Click Save

    13. Finish