Search This Blog

Showing posts with label blogger tutorial. Show all posts
Showing posts with label blogger tutorial. Show all posts

Friday, October 22, 2010

Blogger Tutorial : How to put RTRW TV on your Blog/Web

in the previous post I've explained a little about "RTRW TV" and "Watch Online TV".
but how to put the TV on your TV on your Blog or Web..?
Just easy tutorial.

Copy and Paste code below to your blog/web

<iframe src="http://bumimasg10.webs.com/tv-/bumimas.html" frameborder="0" height="450" scrolling="no" width="600"></iframe>


and watch now. good luct.
[...]

Wednesday, October 13, 2010

Blogger Template : Top 10 Blogger Template Providers

[...]

Sunday, October 10, 2010

Blogger Tutorial : Facebook Widget/Plugins

More facebook widget for Blogger :

Facebook Bedge :

  1. Profile badges
  2. Like badges
  3. Photo badges
  4. Page badges

Facebook Social Plugins :

The Like button lets a user share your content with friends on Facebook. When the user clicks the Like button on your site, a story appears in the user's friends' News Feed with a link back to your website.

When your Web page represents a real-world entity, things like movies, sports teams, celebrities, and restaurants, use the Open Graph protocol to specify information about the entity. If you include Open Graph tags on your Web page, your page becomes equivalent to a Facebook page. This means when a user clicks a Like button on your page, a connection is made between your page and the user. Your page will appear in the "Likes and Interests" section of the user's profile, and you have the ability to publish updates to the user. Your page will show up in same places that Facebook pages show up around the site (e.g. search), and you can target ads to people who like your content.

There are two Like button implementations: XFBML and Iframe. The XFBML version is more versatile, but requires use of the JavaScript SDK. The XFBML dynamically re-sizes its height according to whether there are profile pictures to display, gives you the ability (through the Javascript library) to listen for like events so that you know in real time when a user clicks the Like button, and it always gives the user the ability to add an optional comment to the like. If users do add a comment, the story published back to Facebook is given more prominence.

To get started, just use the configurator below to get code to add to your site.

The Activity Feed plugin displays the most interesting recent activity taking place on your site. Since the content is hosted by Facebook, the plugin can display personalized content whether or not the user has logged into your site. The activity feed displays stories both when users like content on your site and when users share content from your site back to Facebook. If a user is logged into Facebook, the plugin will be personalized to highlight content from their friends. If the user is logged out, the activity feed will show recommendations from your site, and give the user the option to log in to Facebook.

The plugin is filled with activity from the user's friends. If there isn't enough friend activity to fill the plugin, it is backfilled with recommendations. If you set the recommendations param to true, the plugin is split in half, showing friends activity in the top half, and recommendations in the bottom half. If there is not enough friends activity to fill half of the plugin, it will include more recommendations.

You specify a domain to show activity for. The domain is matched exactly, so a plugin with site=facebook.com would not include activity from developers.facebook.com. You cannot currently aggregate across multiple domains.

The plugin is available either via a simple iframe you can drop into your page, or if you are using the new JavaScript SDK, you can use the XFBML tag.

The Comments Box easily enables your users to comment on your site's content — whether it's for a web page, article, photo, or other piece of content. Then the user can share the comment on Facebook on their Wall and in their friends' streams.

To administer your comments box, you need to be listed as a developer on the application used to initialize the JavaScript SDK. An 'Administer Comments' link will appear below the 'Post' button for developers of the application.

The Facepile plugin shows the Facebook profile pictures of the user's friends who have already signed up for your site.

You can specify the maximum number of rows of profile pictures to display. The plugin dynamically sizes its height; for example, if you specify a maximum of four rows, and there are only enough friends to fill two rows, the height of the plugin will be only what is needed for two rows of profile pictures. The plugin doesn't render if the user is logged out of Facebook or doesn't have friends who have signed up for your site using Facebook.

Using the new JavaScript SDK, the plugin is available via the XFBML tag.

The Like Box is a social plugin that enables Facebook Page owners to attract and gain Likes from their own website. The Like Box enables users to:

- See how many users already like this page, and which of their friends like it too
- Read recent posts from the page
- Like the page with one click, without needing to visit the page

The Live Stream plugin lets users visiting your site or application share activity and comments in real time. Live Stream works best when you are running a real-time event, like live streaming video for concerts, speeches, or webcasts, live Web chats, webinars, massively multiplayer games.

The Login Button shows profile pictures of the user's friends who have already signed up for your site in addition to a login button.

You can specify the maximum number of rows of faces to display. The plugin dynamically sizes its height; for example, if you specify a maximum of four rows of faces, and there are only enough friends to fill two rows, the height of the plugin will be only what is needed for two rows of faces.

Using the new JavaScript SDK, the plugin is available via the XFBML tag.

Recommendations
The Recommendations plugin shows personalized recommendations to your users. Since the content is hosted by Facebook, the plugin can display personalized recommendations whether or not the user has logged into your site. To generate the recommendations, the plugin considers all the social interactions with URLs from your site. For a logged in Facebook user, the plugin will give preference to and highlight objects her friends have interacted with.

You specify a site for which to show recommendations for. The domain is matched exactly, so a plugin with site=facebook.com would not include URLs from developers.facebook.com. You cannot currently aggregate across multiple domains.

The plugin is available either via a simple iframe you can drop into your page, or if you are using the new JavaScript SDK, you can use the XFBML tag.


For more, visit Facebook Developers.
[...]

Friday, June 25, 2010

11 Ways to Enhance a User Interface with MooTools

11 Ways to Enhance a User Interface with MooTools. Articles on this one contains a collection of 11 tutorials MooTools to improve the interface of a site. Click here if you're interested in learning tutorial-tutorial.

Hopefully useful.
[...]

Wednesday, June 16, 2010

Add Beautiful Fonts in Blogger/Blogspot Blogs Using Google Fonts

You're probably already bored with the look of a simple font. change the font you want your blog / web you using a font that is more beautiful. way quite easily. you simply change the fonts contained in blog / your website with google fonts. for example, you can view "Cinta Sendal Jepit" blog.

How to Add Google Fonts in Blogger Blogs.
the way is very easy now.

  • You just choose the font you like here or go directly to Google Font Directory.
  • Select a font from the list there.
  • On the next page, click Get the code link.
  • You'll see some code which looks something like this:

<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

This is the code we need but when I copied and used this code in Blogger, an error occurred. To deal with the error, you have to close the link tag by adding /(slash) right before > in the above code and it would look something like this:

<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>

So, whichever font you use, just add a / before > in the code of that font. For now, copy the above code and go to your Blogger account.

  • Go to Layout then Edit HTML tab and find . After that, paste the step 4 code right before tag. The result would look something like this:

<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>
</head>

After adding the code, save your template.

  • Now, we can use this font in headings and text. For example, if you want to use the web font in posts then use some code like this:

<span style="font-family: Lobster;">Any text here will be displayed by a web font like Lobster in this tutorial.</span>

quite easy. good luck.
[...]

Sunday, June 13, 2010

Website/Blog Speed Test

How to use this tool

1. Enter the address of the page you want to check the speed for into the text box. (eg. www.iwebtool.com/tools)

You can enter up to 10 different websites to check the speed for. After entering the first address, press Enter and enter a new address on the new line.

2. Click the "Check!" button.

The results will provide a rough estimation of the speed however at some point the server may lag which will cause the results to vary

If the results are highlighted red, this means the website is either slow or offline. If the results are highlighted in blue, this means the website is extra fast comparing to the average loading time.

































Your domain(s): Enter each address on a new line (Maximum 10)


 


(eg. iwebtool.com)

 
 




 



Powered by iWEBTOOL


[...]

Meta tags Extractor




How to use this tool :
  1. Enter URL to extract meta-tags from.
  2. Click "Extract!" button.


























Extract meta-tags from:

http://

 (eg. iwebtool.com)






Powered by iWEBTOOL


The meta-tags information will be displayed below.
You can also simply copy and paste the tags onto your website.
[...]

Monday, March 29, 2010

Express yourself with the Blogger Template Designer

We’re thrilled to announce that the Blogger Template Designer has launched to Blogger in Draft, our experimental playground where users can try out Blogger’s latest features. The Template Designer brings a new level of customization to your blog. Take a look:




In the Template Designer, you’ll find:
  • 15 new professional templates to start from (and more on their way)
  • Custom blog layouts with one, two and three columns
  • Hundreds of professional background images from iStockphoto
  • Customizable colors, fonts, and more!
We have more details and tips in our Blogger Template Designer post on the Blogger in Draft blog.




We worked with iStockphoto, the leading microstock image marketplace, to put together a great collection of beautiful images and patterns to use as backgrounds on your blogs. The photos are stunning, and are free to use on your Blogger blog.

That being said, today’s launch is just the beginning. We’ll add more of our own designs over the coming weeks and months and, through the new Template Design Group, we’ll be working with members of the Blogger design community to bring their templates into the new Template Designer.


Help test drive the Blogger Template Designer by logging into Blogger In Draft, and learn more about the new features in more detail on the Blogger In Draft blog.

By : Blogger Buzz


[...]

Monday, March 1, 2010

Create archive blog / web with flash

So many tutorials on blogs or websites, which teaches how to make a recent post, blog archives, or tutorials on how to make a list of the contents of a blog or website. and maybe now it is not unusual among bloggers. but I admit that widgets are very useful and helpful. as an example, I still use it on my blog.

I have just read the articles from the blogger buzz. and I read a long article. I tried a tutorial that provided by the blogger buzz. the result is a posting I made this. that is about to make a list of the contents of / archive blog or website with flash format. and of course this widget provided by Widgetbox. and we can make it according to your own creations. you just register it at Widgetbox.



In this post I will only give a little information about the widget / application of this flash. so if you want to try it you can immediately try it at Widgetbox.

Hopefully useful. and do not forget to give me a response about this arikel comment below this article.


Thanks for Blogger Buzz


[...]

Monday, September 14, 2009

How to make the under nafbar like " Andrastorm Global Site"




Did you ever think to make the blog nafbar as " Andrastorm Global Site Navbar". As shown below:


  • Very easy way. you just follow the steps below:
  • - Login to your blogger account
  • - click layout - edit html
  • - go to your template code and find the code ]]></b:skin>
  • - then copy the code below and paste it directly above the code ]]></b:skin>

code :

/* code for under navbar
--------------------------------------- */

#under-navbar img {
/* margin: 0px 0px -8px 0px; */
vertical-align: middle;
}

#under-navbar p.info {
float: right;
padding-right:40px;
line-height: 1.5;
height: 100%;
vertical-align: bottom;
}

#under-navbar p {
float: left;
margin: 0px;
padding-top:4px;
padding-left:40px;
line-height: 1.2;
vertical-align: bottom;
}

#under-navbar a {
color:#00CCFF;
text-decoration:none;
}
#under-navbar a:hover{
color: #00FFFF;
}
#under-navbar {
align: center;
position: fixed;
border-top: 1px solid #ddd;
border-bottom: 5px solid #003366;
background: #58595B url(http://www.promoruparupa.com/wpprr/wp-content/themes/inanis-glass/images/wind/menu-bg.png);
width: 100%;
left: 0px;
text-align: left;
color: #ffffff;
font-family: verdana;
font-size: 12px;
z-index:10000;
bottom:0;
}

  • - After that, copy the code below, and paste the below code just above </body>

Code :

<div id='under-navbar'>
<p><img src='http://winksite.mobi/xhtml/images/logos/27614-20090412071612.png' style='width: 28px; height: 28px;'/>&#160;&#160;&#160;
<a href='http://andrastorm-global-site.blogspot.com/'><b>Andrastorm Site</b>
</a>&#160;&#160;&#169;&#160;2009&#160;|
Design by <a href='http://andrastorm-global-site.blogspot.com/' target='_blank'>Andra Pratama</a>
&#160;&#160;&#160;<img border='0' src=''/></p>
<p class='info'>Powered by <a href='http://www.blogger.com'>Blogger</a> |
Subcribe <a href='http://www.feedburner.com' target='_blank'><a href='http://feeds.feedburner.com/AndrastormGlobalSite'><img alt='' height='26' src='http://feeds.feedburner.com/~fc/AndrastormGlobalSite?bg=000000&amp;fg=FFFFFF&amp;anim=1&amp;label=listeners' style='border:0' width='88'/></a></a></p>
</div>

  • - And last, click save.
See your blog nafbar now


Hopefully useful



[...]

Hosting Indonesia
Site Meter PageRank Checking Icon