Google Search in your blog

Step by step installing Google Search in your blog.

1. Go to Your "Dashboard"
2. Click "Design"
3. Make sure, you are in "Page Elements"
4. Click on Add a Gadget.
5. Window "Add a Gadget" will be shown.
6. Look for "Search Box" and Click it
7. You will be redirect to page "Configure Search Box"
8. If you have done configure it. click Save and view your blog
9. Look at your blog. Google search engine has been installed in your blog
   
   

Read More

Google Translate in your blog

Step by step installing Google Translate in your blog.

1. Go to Your "Dashboard"
2. Click "Design"
3. Make sure, you are in "Page Elements"
4. Click on Add a Gadget.
5. Window "Add a Gadget" will be shown.
6. Look for "HTML/Javascript" and Click it
7. You will be redirect to page "Configure HTML/Javascrip"
8. Type this on title "Translate this blog".
9. Copy code below and then paste in the content
   
   <div id="google_translate_element"></div><script>
   function googleTranslateElementInit() {
     new google.translate.TranslateElement({
       pageLanguage: 'en'
     }, 'google_translate_element');
   }
   </script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
   
   Your configuration should be like this:
   
   
10. And then "Save".
11. Google Translate has been installed on your blog. just look at your blogger
    
    

Read More

Parameters in Blogspot feed

 This post presented for me to understanding the "Query Parameters in Blogspot Feed". As we know, the URL to get feed items of our blog is http://yourblogname.blogspot.com/feeds/posts/default. You can review this feed after as my blog feed : http://isitdull.blogspot.com/feeds/posts/default or you can use your own blog to experiment.

There are two options how to using your blogger's feed

1. Using your blogger's address : http://yourblogname.blogspot.com/feed/post/default
2. Using your blogid : http://www.blogger.com/feeds/blogID/posts/default

The Blogger Data API supports the following query parameter:

alt

Meaning - Alternative representation type
We can use one of the folowing values :

• If wedon't specify an alt parameter, the service returns an Atom feed. This is equivalent to alt=atom
• alt=rss returns an RSS 2.0 result feed (for reads only)
• alt=json returns a JSON representation of the feed
• alt=json-in-script Requests a response that wraps JSON in a script tag
• alt=atom-in-script Requests an Atom response that wraps an XML string in a script tag.
• alt=rss-in-script Requests an RSS response that wraps an XML string in a script tag.
• alt=atom-service Requests an Atom service document that describes the feed.

For example :  
http://isitdull.blogspot.com/feeds/posts/default?alt=json or  
http://www.blogger.com/feeds/1862344473010958336/posts/default?alt=json
This will returns type of feed as a JSON.

/category

Meaning - Category query filter
Specifies categories (also known as labels) to filter the feed results.
For example,  
http://isitdull.blogspot.com/feeds/posts/default/-/blogging or  
http://www.blogger.com/feeds/1862344473010958336/posts/default/-/blogging
This will returns entries with the label or category of blogging.

max-results

Meaning - The Maximum number of results to be retrieved  
http://isitdull.blogspot.com/feeds/posts/default?max-results=2 or  
http://www.blogger.com/feeds/1862344473010958336/posts/default?max-results=2
This will returns entries with 2 results.

orderby

Meaning - The order in which to return entries, such as lastmodified (the default), starttime, or updated.  
http://isitdull.blogspot.com/feeds/posts/default?orderby=updated or  
http://www.blogger.com/feeds/1862344473010958336/posts/default?orderby=updated
I do not know how to using lastmodified and starttime!

published-min, published-max

Meaning  - The bounds on entry publication dates  
http://isitdull.blogspot.com/feeds/posts/default?published-min=2010-11-01T00:00:00&published-max=2011-11-30T23:59:59&orderby=updated or  
http://www.blogger.com/feeds/1862344473010958336/posts/default?published-min=2010-11-01T00:00:00&published-max=2011-11-30T23:59:59&orderby=updated

start-index

Meaning - The 1-based index of the first result to be retrieved
http://isitdull.blogspot.com/feeds/posts/default?start-index=1 or
http://www.blogger.com/feeds/1862344473010958336/posts/default?start-index=1
Test by yourself, you can change number on start-index=1

updated-min, updated-max

Meaning  - The bounds on entry update dates.
These query parameters are ignored unless the orderby parameter is set to updated  
http://isitdull.blogspot.com/feeds/posts/default?updated-min=2010-11-01T00:00:00&updated-max=2011-11-30T23:59:59&orderby=updated or  
http://www.blogger.com/feeds/1862344473010958336/posts/default?updated-min=2010-11-01T00:00:00&updated-max=2011-11-30T23:59:59&orderby=updated
Test by yourself again :D

Read More

Create a Mailing List for Your Blogspot

When you create "New Post" entry in blogspot, You may want to alert all your blog's friends. But blogspot only has the options send to list of up to 10 email addresses to have your blog mailed to whenever you publish. Using Google Groups we can forward this e-mail to a whole list of people in our group.

Step by step creating a Mailing List with google group

1. Create your Google Group, you must have GMail Account to do this, if you don't have, You can sign up for a GMail Account free.
2. Invite your blog's friends to join in new Google Group
3. Set your blog to send e-mail to your new Google Group, In your Blogger Dashboard, Select setting, Email & Mobile, and then In the BlogSend Address enter the e-mail address for your Google Group.
4. Create Promotion's Box. Back to your google group homepage, go to Group Settings, General, Public website, promotion box, and then copy HTML Code shown in there. That HTML Code should like this:
   HTML Code:
   

   <table border="0" cellspacing="0" style="background-color: white; padding: 5px;"><tbody>
   <tr><td>
   <img alt="Google Groups" height="30" src="http://groups.google.com/intl/en/images/logos/groups_logo_sm.gif" width="140" /></td></tr>
   <tr><td style="padding-left: 5px;">
   <b>Subscribe to Is it dull?</b></td></tr>
   <form action="http://groups.google.com/group/is-it-dull/boxsubscribe">
   
   <tr><td style="padding-left: 5px;">
   Email: <input name="email" type="text" />
   <input name="sub" type="submit" value="Subscribe" /></td></tr>
   </form>
   <tr><td align="right">
   <a href="http://groups.google.com/group/is-it-dull">Visit this group</a></td></tr>
   </tbody></table>
   

5. Put your code in your Blogspot. Back to your blogspot, in your Blogger Dashboard, and click on "Layout". Click on "Add a Page Element" (the sidebar one will be best). Select the "HTML/JavaScript" option. Now paste in the HTML code you copied earlier. Click "Save Changes" and take a look at your blog!
   You'll see like this :
   

   Subscribe to Is it dull?

   Email:

   Visit this group

Read More

How to Getting Started in blog?

I just getting started in blog, and I don't know what will I do in this blog.
Anybody want to help me How to blogging? or maybe anybody want to learn blog together with me?

I'm so sorry if I can't speak english very well. Because my native language is Bahasa Indonesia. I want to learn english too.

Give me your suggestion about

1. How to Customize my Blog?
2. What Are Pages?
3. Where can i learn about Language Structure used by Blog?
4. What are the best widgets for my Blog?
5. Can i create a Mailing List for my Blog?
6. How to Get my Blog to Appear at the Top of Searches?

I really need it. Would you like share with me?

Read More

Membuat Tepi Gambar Bershadow Dengan CSS 3

CSS 3 adalah generasi CSS (Cascading Style Sheet) yang ke 3, banyak keunggulan CSS 3 dibandingkan generasi yang sebelumnya, dan sudah mulai digunakan browser-browser, yaitu diantaranya adalah Mozilla Firefox v 3.6 dan Safari V 3, semoga saja browser-browser lainya menyusul untuk mendukung CSS 3.

Nah sebenarnya topik kita kali ini adalah "Membuat image post blogger berbayang/shadow" dengan menggunakan CSS 3, terlihat seperti gambar di samping kiri. Nah bagaimana caranya? silahkan ikuti langkah-langkah dibawah ini dan buktikan kecanggihan CSS 3.

Setelah Log In ke blogger pada dashboard masuk pada bagian "Design" lalu ke "Edit HTML"

lalu cari code CSS dibawah ini

.post img {
- - -
- - -
}

Note :

1. Perhatikan saja code yang berwarna merah diatas, karena garis ( - - - ) yang berwarna hijau adalah definisi CSS yang berbeda-beda setiap template
2. Dan kadang code yang berwarna merah ada tambahanya sehingga seperti ini : .post img, table.tr-caption-container {

Nah kalau sudah ganti code CSS tadi dengan definisi seperti dibawah ini

.post img {
background:#FFFFFF;
border:1px solid $bordercolor;
padding: 7px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
}

Nah yang diganti adalah code CSS yang berwarna hijau saja.

kalau sudah lalu SAVE deh, dan lihat hasilnya di browser Mozilla v 3.6, Safari V 3 dan Google Chrome.

Sekian semoga bermanfaat.

Read More

Menampilkan Widget Di Halaman Tertentu

Hai sobat blogger, bagaimanakah kabar Anda sekalian ? semoga dalam keadaan sehat dan selalu ceria. Pada tulisan kali ini, saya akan membagikan ilmu yang sudah saya pelajari kepada Anda yaitu masih tentang blogger dan topik yang saya bahas kali ini adalah seputar "Menampilkan widget pada halaman tertentu" yang sering digunakan pada template megazine, misalnya anda ingin menampilkan widget dihalaman post saja atau tidak ada hanya dihalaman post.

Nah langsung saja kita pelajari bersama-sama.

Langkah pertama yang harus Anda lakukan adalah masuk menu "Design" kemudian masuk ke bagian "Edit HTML" lalu centang kotak "Expand widget templates"

lalu cari code widgetnya seperti ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:includable>
</b:widget>

Untuk mempermudah pencarian silahkan masukkan judul widget seperti "Pesan" kedalam kotak pencarian browser (ctrl + F)

Kemudian tambah code

<b:if cond='data:blog.url == data:blog.homepageUrl'>

dan ditutup dengan code </b:if> untuk menempatkan di hanya halaman depan saja

dan ditempatkan seperti dibawah ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

Perhatikan penempatan code yang berwarna hijau !

kemudian save.

Dan dibawah ini adalah code yang bisa digunakan untuk penempatan lainya

Untuk menempatkan di halaman depan/index digunakan code

<b:if cond='data:blog.pageType == data:blog.homepageUrl'>

Untuk menempatkan di halaman Archive saja

<b:if cond='data:blog.pageType == "archive"'>

Untuk menempatkan dihalaman item/posting saja digunakan code

<b:if cond='data:blog.pageType == "item"'>

Dan untuk pada halaman pages atau static page blogger digunakan

<b:if cond='data:blog.pageType == "static_page"'>

Dan untuk tambahan, jika Anda ingin menempatkan di halaman tertentu dengan menggunakan URL gunakan code dibawah ini

<b:if cond='data:blog.url == "URL_HERE"'>

Ganti code URL_HERE dengan URL yang ingin anda tampilkan.

Dan untuk pengecualian, misalnya anda tidak menempatkan widget hanya di halaman depan saja dengan cara mengganti tanda = pertama dengan tanda !

Contoh

<b:if cond='data:blog.pageType != data:blog.homepageUrl'>

Nah tidak terlalu sulit kan? semoga bermanfaat bagi Anda.

Sekian silahkan berkomentar jika ada pertanyaa, :D

NB : Code diatas juga dapat di aplikasikan ke fungsi-fungsi blogger lainya yang akan saya bahas di waktu selanjutnya

Read More

A Blogger's secret tool

Do you write blogs? Then, if you haven’t already checked out Blog Copy, you definitely need to check it out. You might have taken hours to write an article on your blog, but there are people out there who just copy a part or the full article on to their blog just for traffic inflow. So, what blogcopy does is, it helps you to monitor and know what their visitors exactly copied from their blog.

I DISCLOSE

Read More

Create an app for the iphone now!

Most of you might have heard of the "iFart" app for the iPhone. It might sound like a stupid app at the sound of it, but did you know that it turned into a $54,657 profit in just 30 days. Come to think of it, it isn't really hard to make a fortune with iPhone apps, all you probably need to know is to turn on a computer!
You might be wondering how you can build an app without any programming experience? Well, you definitely need to check this out in order for you convert your ideas into reality -  Click Here!

Read More

Jquery Multi Level Menu Horizontal

Masih membahas tentang cara membuat menu horizontal atau menu navigasi di blog kita, dan dulu sudah pernah saya memposting tentang cara membuat menu horizontal dan menu vertical di blog ini, namun kali ini saya akan menulis tutorial bagaimana membuat menu horizontal yang lebih canggih dibandingkan yang kemaren yaitu membuat multi level menu atau menu bertingkat.

Okkey langsung saja ke cara pembuatanya ya


langkah pertama yaitu masuk pada bagian Design lalu Edit HTML

Masukkan code dibawah ini dibawah code <head>

<!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/>
<script src='http://sites.google.com/site/anasprod/jqueryslidemenu.js' type='text/javascript'/>

Lalu masukkan CSS dibawah ini diatas code ]]></b:skin>

.jqueryslidemenu{
font: bold 13px Verdana;
background: #800000;
width:100%;
float:left
}

.jqueryslidemenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.jqueryslidemenu ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.jqueryslidemenu ul li a{
display: block;
background: #800000; /*background of tabs (default state)*/
color: white;
padding: 8px 10px;
border-right: 1px solid #778;
text-decoration: none;
}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
color: white;
}

.jqueryslidemenu ul li a:hover{
background:#B30000; /*tab link background during hover state*/
color: white;
}

/*1st sub level menu*/
.jqueryslidemenu ul li ul{
position: absolute;
left: 0;
display: block;
visibility: hidden;
background:#B30000;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
font: normal 13px Verdana;
width: 160px; /*width of sub menus*/
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid gray;
}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
background: #eff9ff;
color: black;
}

/* ######### CSS classes applied to down and right arrow images ######### */

.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}

.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}
#footheader {
width: 100%;
float:left;
margin:0 0 0;
padding:0 0 0;
position:relative;
}

Code diatas adalah style dari menu Anda, silahkan edit sesuai kebutuhan Anda.

Nah kalau sudah kita menuju kebawah untuk mencari code seperti dibawah ini

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Bisnis Di Internet (Header)' type='Header'/>
</b:section>
</div>

Perhatikan saja code yang berwarna merah karena code yang berwarna hitam diatas berbeda-beda setiap template

lalu taruh code dibawah ini dibawah code yang diatas tadi

<div id='footheader'>
<b:section class='footheader' id='footheader' preferred='yes'>
</b:section>
</div>

Kalau sudah SAVE

Pekerjaan kita belum selesai, langkah selanjutnya yaitu menuju menu "Page Elements"



Terlihat pada "Page Elements" muncul tempat gadget baru, lalu klik aja "Add a gadget" dan pilih HTML/JavaScript dan masukkan code dibawah ini.

<div id="myslidemenu" class="jqueryslidemenu">
<ul>
<li><a href="/">Home</a></li>
<li><a href="http://sangmerak.blogspot.com">SangMerak</a></li>
<li><a href="#">Kategori</a>
<ul>
<li><a href="#">Sub Kategori 1</a></li>
<li><a href="#">Sub Kategori 2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://tutorial-jitu.blogspot.com">Tutorial Blog</a></li>
</ul>
<br style="clear: left" />
</div>

Nah code diatas adalah code dari widgetnya silahkan di edit sesuai kebutuhan Anda.

Kalau sudah silahkan di SAVE deh.

Nah semoga tutorial ini bisa bermanfaat bagi Anda dan silahkan tanyakan pada saya lewat komentar jika ada pertanyaan. Miss u all. bye²

Read More

Digital Waybill

Digital Waybill is a software company that makes software for courier services. The courier software  does GPS tracking, online ordering and integrates directly with Quickbooks. 

All it takes is about five minutes to set up our courier software. And about half hour to customize the delivery software to meet your unique business needs. The software is as simple as using you email and if you do not know to use the electronic mail services, nothing to worry, digital Waybill will help you in every step of the way. It can’t get easier than that!

Here are some of the things that Digital Waybill is proud of and is what most of their customers have to say about this product:

• Seamless Quickbooks integration. Usually, invoicing takes hours, but with this software it’s done in minutes!
• Monthly billing, no long term commitment or large amount of money up front!
• Free trial of the product allows everybody to really learn the product.
• Personal customer support, if they don't answer immediately which is rare, they always respond right back.
• The remote assistance makes any issues you have, a non-issue; they can see exactly what you are talking about.
• Within the first month of implementing Digital Waybill, their client received a new customer, just based on the fact that they can visually track their drivers and could show the prospect in the system, something they were promised by another courier that never happened.

Read More

USB eye Massager

Are you one of the million people who sit in front of the computer all day long at work, and then get home to watch tv and in the process straining your eyes to the core? Well, here is the USB eye massager is designed for you people. Once plugged into a USB port, the massager automatically turns on, and begins the massage. There are two different speeds, “high speed” and “low speed”. Apparently, the massage is pretty much the best thing ever invented which helps to "aid digestion, fight against infection" and that it "stimulates the lymphatic system." All that from two fingers being jammed into your eye socket.

Read More

Let the recruiters find you!!

Are you looking for jobs on Careerbuilder, Monster etc.? Well, these are sites that are best for people who are looking for jobs, like for me a month ago. But, perhaps there is something you didn't know - When you post your resume on a job board such as Monster or Hotjobs, your resume can only be viewed by employers who have a paid account. Well, it's true. So this means that if you only post to the job boards you are limiting yourself tremendously!

Now, resume bucket is one place where you can get your resume on the internet so that any recruiter can see it. Recruiters have become much savvier about how to search the internet for resumes, so as long as you have the appropriate key words, your resume will be available to them for free. Check out a sample resume.

Read More

USB Rechargeable Batteries

Here is a way you can preserve our environment and energy by using rechargeable batteries, rather than using plain disposable batteries that are harmful to our environment. So, by not using rechargeable batteries, not only do we end up spending more money but also end up polluting the environment.

Here is something that will surely catch your attention: You must have heard of rechargeable batteries which was released first in the 80’s and became a huge hit because it could be used over and over again. You must have heard of charging the batteries using electricity and power outlets and there are latest ones that use solar power for recharging. Well here is a USB AA rechargeable batteries. USBCELL AA batteries are standard rechargeable batteries but in order to recharge them you need to remove the top of the battery and plug them into the USB port. It takes about an hour to recharge it to 50%.

Read More

Cara Menghilangkan Widget Attribution Blogger

Pada episode yang lalu saya sudah menerangkan tentang kemunculan widget attribution blogger dan cara memindahkanya, pada episode kali ini pun masih membahas tentang widget attribution blogger namun yang saya bahas kali ini adalah cara menghilangkanya.

Caranya cukup simple dan mudah banget, ikuti Saja langkah dibawah ini.

pertama masuk pada "Design" Lalu "Edit HTML"

masukkan code css dibawah ini diatas code ]]></b:skin>

#Attribution1 {
height:0px;
visibility:hidden;
display:none
}

Tinggal SAVE deh.

Dan jika Anda menggunakan code CSS di postingan ini, tinggal ganti code yang berwarna biru dengan code diatas.

Sekian dan terima kasih

Read More