Griya Ilmu & Bisnis
 
Griya Ilmu & Bisnis
 
Tampilkan postingan dengan label komputer. Tampilkan semua postingan
Tampilkan postingan dengan label komputer. Tampilkan semua postingan
Sabtu, 04 Juni 2011

Cara Memasang Widget Related Post / Artikel Terkait

it's an information blog
Duh kemaleman euy postingnya, tapi cuek deh ...abiz ini mo bobo kok ... dah kecapean ...

Nah tips kali ini saya jelaskan tentang cara memasang widget Related Post / Artikel Terkait yang nantinya akan tampil seperti dibawah postingan ini... liat deh ke bawah ....eitttttttttt jangan terlalu bawah !!! He he... canda sob ...


Nah caranya :
Seperti biasa, login dulu ke akunmu...
lalu kamu masuk ke rancangan
klik edit HTML
jangan lupa download dulu tuh templatenya kalo belum profesional
lalu centang expand widgetnya
nah aktifkan mode pencarian dengan menekan CTRL+F
lalu ???
Ya temukan kode biru ini :

<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'/>
<div class='post-footer-line post-footer-line-2'/>
<div class='post-footer-line post-footer-line-3'/>

Jika sudah ditemukan lihat bagian bawah kode tersebut, lalu temukan kode penutup tag nya yaitu kode </div&gt;

dibawah kode </div&gt; ini yang paling akhirnya (jika ada lebih dari 1 kode) maka paste code merah berikut ini dibawahnya :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='similar'>
<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->
<!-- *****************Related Articles by Labels - Take Two****************** -->
<div class='widget-content related-by-cat'>
<h3>Related Posts / Artikel Terkait :</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro' style='display:none;'>
Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>
</div>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 50;
var maxNumberOfLabels = 40;

maxNumberOfPostsPerLabel = 40;
maxNumberOfLabels = 40;


function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;

for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {

var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;

var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>

Kemudian Save, dan temukan keindahannya ...
Eittttttttttttttttttttt mo kemana ??? Koment dulu ah !!! SUka kebiasaan gitu langsung pergi ....he he....
Rabu, 25 Mei 2011

Beberapa Tips dan trik Membedah Isi Template Blogger

it's an information blog
Blogger adalah layanan blog gratis yang memberikan keleluasaan bagi user untuk mengedit tampilan dan fungsi blognya. Secara mendasar, Blogger berplatform HTML dengan didukung pengaturan tampilan CSS dan fungsi-fungsi javascript. Kita mengenal adanya fitur edit template HTML dimana kita dapat dengan bebas melakukan modifikasi, desain ulang, hack, penambahan fitur dari pihak ketiga (third party) berupa widget, dan lain-lain.

Note: Fitur edit HTML Blogger diakses melalui dashboard > design/rancangan > edit HTML.
Beberapa kasus saya temui dari pengunjung dan beberapa teman blogger (khususnya newbie) yang mengeluh karena gagal memasukkan hack/script tambahan, tidak menemukan kode tertentu seperti yang ada di tutorial, bahkan ada pula yang templatenya "kacau" karena salah mengedit template HTMLnya.

Tips ini saya buat untuk memberi masukan dan ide dalam melakukan editing Template HTML agar hasilnya sesuai dengan yang diinginkan. Semoga bermanfaat.

1. Memahami elemen dasar dari template blogger/blogspot sangat penting, pada dasarnya ada 5 elemen penting pada template Blogger yang hampir sama dengan elemen dasar web HTML pada umumnya:
a. HTML tag, yang menandakan bagian dari keseluruhan halaman, diawali dengan <html> dan diakhiri dengan </html>.
b. Head tag, merupakan bagian dari keseluruhan head halaman, di dalamnya dimasukkan aturan-aturan yang mengatur banyak hal, termasuk tampilan (CSS), diawali dengan <head> dan diakhiri dengan </head>.
c. Body tag, merupakan isi dari halaman web/blog, di dalamnya terdapat konten/isi inti halaman, termasuk pula widget-widget yang menjadi bagian dari isi halaman, diawali dengan <body> dan diakhiri dengan </body>.
d. CSS, elemen pengatur tampilan halaman, baik dari segi warna, font, posisi, lebar luas, dan masih banyak lagi. Letaknya diantara <b:skin><![CDATA[ dan ]]></b:skin> dan berada pada bagian head. Pada beberapa kasus kode CSS juga dimasukkan tepat di atas head sebagai aturan tambahan.
e. Javascript, merupakan elemen yang sebenarnya mengandung software (web widget) yang berisi perintah-perintah tertentu. Biasanya digunakan untuk memasukkan elemen tambahan seperti popular post, auto readmore, dan sebagainya. Ada dua jenis javascript yang dapat digunakan: internal, yang diupload dan di-host langsung di Blogger, dan eksternal, yang diupload dan dihosting di server lain. Letaknya relatif, tergantung jenisnya. Untuk yang berjenis widget biasanya ada di dalam body.

2. Biasakan back up template terlebih dahulu sebelum editing, klik "Backup Full Template" di atas kotak "Edit HTML". Jika ada kesalahan dan anda tidak tahu script mana yang harus dibenahi, anda dapat dengan mudah mengupload file back-up template dan mengembalikan seperti semula.

3. Perhatikan benar-benar tutorial yang dibaca, jangan sampai ada yang terlewatkan. Sebagai contoh, jika harus mencentang/klik "expand widget templates", maka pastikan sudah melakukannya. Fungsi dari perintah tersebut adalah untuk membuka bagian-bagian body yang mengandung widget. Jika tidak dicentang, bagian-bagian tersebut akan "disembunyikan" oleh Blogger karena memang ditujukan untuk keamanan.

4. Ketika meng-copy script dari halaman tutorial yang anda baca, pastikan semua bagian script sudah tercopy atau jangan ada bagian selain dari script yang ikut ter-copy.

5. Jika harus mengubah isi script/kode, misalnya mengganti url blog/feed, value, dan lain-lain, salin/paste terlebih dahulu kode/script tersebut ke editor semacam notepad, wordpad, word. Setelah melakukan pengubahan script dan memastikan semuanya beres, baru masukkan script tersebut ke template HTML.

6. Agar lebih mudah dan cepat mencari kode tertentu seperti yang diminta di dalam tutorial, gunakan fitur pencarian browser, tekan Ctrl + F, setelah kotak pencarian muncul masukkan kode yang ingin dicari dan tekan next (enter).

7. Perhatikan benar-benar istilah di bawah/setelah serta di atas/sebelum, itu berarti letakkan kode benar-benar setelah atau sebelum kode yang dicari. Kode-kode dibaca oleh browser dari kiri ke kanan sebagai urutan. Atas bawah hanya digunakan untuk memberi kenyamanan dalam mengurutkan. Bagi browser, dia tetap dibaca dari kiri ke kanan. Contoh:

<b:include data='top' name='status-message'/><data:adStart/>
Kita lihat di situ ada 2 tag bersisian, jika harus memasukkan tag/kode baru <b:include data='posts' name='breadcrumb'/> di bawah/setelah <b:include data='top' name='status-message'/>, itu berarti anda harus meletakkan benar-benar setelahnya, sehingga <data:adStart/> harus digeser posisinya, atau kode/tag baru disisipkan di antara keduanya, jadinya:

<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>
<data:adStart/>
atau,
<b:include data='top' name='status-message'/><b:include data='posts' name='breadcrumb'/><data:adStart/>
8. Jika memang masih belum yakin dan terbiasa, buatlah blog baru yang fungsinya untuk eksperimen dan uji coba script (trial and error). Anda bisa dengan bebas melakukan uji coba tanpa ada ketakutan template blog anda rusak atau pembaca kabur. Agar hasilnya akurat, gunakan jenis template yang sama seperti blog anda. Saya memiliki 3 blog untuk eksperimen dan mencoba script baru sehingga bisa dengan bebas melakukan apapun tanpa rasa khawatir.

9. Khusus untuk hack/script tertentu di mana tampilannya bisa langsung dilihat di homepage/beranda (misalnya: memasang readmore atau background), setelah memasukkan script dan selesai meng-edit, jangan langsung di-save dulu. Gunakan/klik fitur preview/pratinjau untuk melihat hasilnya. Jika sudah beres dan sesuai yang diinginkan, baru lah di-save.

10. Pada beberapa template, ada yang bagian tertentunya di apit oleh tag paragraf: <p> dan </p>, sehingga ketika bagian tertentu tersebut dicari, seolah tidak ketemu. Jika template anda berjenis seperti ini, jangan menyerah terlebih dahulu.
Contoh:
Ketika harus mencari <data:post.body/>, dan tidak ketemu, maka ada kemungkinan tag paragraf mengapitnya, atau ada beberapa kondisi lain (misalnya, anda lupa mencentang "expand widget templates"). Agar lebih mudah lagi, jangan sertakan < dan /> ketika mencari (Ctrl + F), cukup gunakan data:post.body saja.

Tambahan :

Kode untuk merubah tulisan pada judul post artikel :
.post-title{color:#111728;margin:0 0 10px 0;padding:0;font-family:Arial,Helvetica,sans-serif;font-size:24px;line-height:24px;font-weight:bold

Kode merubah tulisan artikel :
.post-body{padding-top:0px;padding-bottom:0px;margin:0px;font-family:Arial, Helvetica, sans-serif;font-size:12px;line-height:20px;}

Keterangan :
border :
artinya garis pinggir  dan px adalah satuan tebal garisnya , artinya semakin besar angka yang diberikan semakin tebal garisnya

text-decoration : none :
Berarti text tersbut tidak digaris bawahi, jika ingin digarisbawahi silahkan ganti kata none dengan underline

Tips Meng-Edit Template HTML Blogger/Blogspot dengan Mudah dan Aman

Nah semoga bermanfaat ya 
Rabu, 04 Mei 2011

Cara Menghapus Iklan Google Adsense di Blogger

it's an information blog
Nah kali ini bukan cara memasang, tapi cara menghapus....


Jika Anda menggunakan blog yang mengaktifkan Tata Letak, klik taut edit untuk elemen laman AdSense, kemudian klik tombol Hapus Elemen Laman.
Jika Anda menggunakan kerangka klasik, ikuti langkah-langkah di bawah ini:
  1. Masuk ke akun Blogger di http://www.blogger.com?hl=id tab kerangka
  2. Klik Edit yang ada
  3. Cari kode iklan AdSense dalam kode kerangka. Kode tersebut akan sama dengan contoh kode di bawah ini:

    <script type="text/javascript"><!--
    google_ad_client = "pub-0000000000000";
    google_ad_width = 728;
    google_ad_height = 90;
    google_ad_format = "728x90_as";
    google_ad_type = "text_image";
    google_ad_channel ="";
    //--></script>
    <script type="text/javascript"
    src=" http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script>


  4. Pilih dan hapus kode iklan ini, kemudian simpan kerangka Anda
  5. Untuk melihat perubahan tersebut, tayangkan ulang blog Anda.
Selasa, 03 Mei 2011

Mengganti Background Halaman Posting

it's an information blog
Agar blog kita lebih dinamis, maka kita bisa mengganti - ganti gambar background pada posting artikel kita, misalnya apa yang anda lihat pada posting ini

Nah cara memasangnya mudah saja,

1. Ubah posting Anda pada mode Html
2. Kode yang perlu Anda tambahkan


<div style="background:#58FAF4; padding:5px 8px 5px 8px;">Tulis text Anda disini</div>

Keterangan:


* #58FAF4 : Ganti dengan warna background sesuai dengan keinginan Anda
* Tulis Text Anda disini : Adalah artikel yang ingin Anda tulis

untuk memudahkan anda memilih kode warna, klik disini untuk kode warna

Untuk mengganti background dengan gambar


1. Ubah posting Anda pada mode Html
2. Kode yang perlu Anda tambahkan


<div style="background:url(URL Gambar Yang Anda Inginkan) no-repeat right top;">
<span style="color: #000000;">Tulis Text Anda disini</span></div>


Keterangan:

* URL Gambar Yang Anda Inginkan: Adalah gambar background , ganti dengan url gambar yang Anda inginkan
* Untuk yang tulisan no-repeat right top;, bisa diganti dengan letak sesuai keinginan Anda, misal:
1. Untuk posisi gambar background di tengah: no-repeat center top;
2. Untuk posisi gambar background di kanan atas: no-repeat right top;
3. Untuk posisi gambar background di kiri atas: no-repeat left top;
* Tulis Text Anda disini : Adalah artikel yang ingin Anda tulis
* #ffffff : Adalah warna tulisan, ganti warna tersebut sesuai keinginan anda

coba deh, gampang ah ... 
Senin, 02 Mei 2011

Perubah HTML / HTML Encoder

it's an information blog
Posting kali ini bukan cara memasang, tapi Disini saya telah sediakan HTML Generator / HTML Encoder. Yaitu sebuah mesin untuk merubah kode HTML agar bisa kita tampilkan pada postingan kita, cara pakainya gampang, kamu tinggal copy saja / tulis pada mesin ini, lalu tekan encode nya, selanjutnya tinggal posting hasilnya, gampang deh ...



Kamis, 28 April 2011

Cara Membuat Huruf Besar Diawal Artikel Posting

it's an information blog
Nah seringkali kita lihat sebuah artikel huruf awalnya ditulis dengan huruf besar, Tahukah kita begitu gampang cara memasang nya? Ga sulit sama sekali kok.

Contohnya lihat disini

Oke deh kita mulai trik nya ya... :)

Pertama  : Masuklah ke akun blogger kamu
Kedua     : Masuk Ke Rancangan,
Ketiga     : Pilih Edit HTML, jangan lupa centang expand widgetnya.
Keempat : Cara memasangnya adalah sebagai berikut ;


Cari Kode ]]>< /b:skin>

Lalu copy kode yang dibawah ini; kemudian paste diatas kode tadi

.huruf_besar {
       float:left;
       color:#000000;
       line-height:60px;
       padding-right:5px;
       font-family:trebuchet ms,verdana;
       font-size:60px;






SAVE

Cara memasang nya agar berefek menjadi huruf besar nanti di awal posting artikel kita adalah, dengan menambahkan kode <span class="huruf besar"> huruf yang akan di buat besar</span>

Misalnya artikel tersebut berisi kalimat :

Seandainya hari ini tidaklah hujan, Insya Allah Aku akan kerumahmu

Nah cara memasangnya adalah <span class="huruf besar">S</span>eandainya hari ini tidaklah hujan, Insya Allah Aku akan kerumahmu

Gampangkan?? 
Rabu, 27 April 2011

Cara Memasang Add A Gadget Pada Template Blogger

it's an information blog
Sobat pembaca...

Pada posting kali ini saya akan coba bagi tips untuk cara memasang Add A Gadget Pada Template Blogger kita. Karena terkadang kita ingin menambahkan sesuatu misal pada Header Blog Kita, Tapi eh ternyata dalam Lay Out Template kita tak ada Gadgetnya. Nah daripada bikin kamu kesel dan Ngedumel, Baca aja trik berikut ini. ...


Loh Mana Caranya kok Blank??
Tenang Anda akan saya bawa terbang ke Ruangan Khusus, jangan bengong dan jangan tidur... Klik Aja Gambar dibawah ini... Anda duduk dan pegangan ya...

Selasa, 26 April 2011

Cara Memasang Dan Mengganti Link Older Post, Newer Post Dan Beranda

it's an information blog
Hmm... Alhamdulillah akhirnya tercapai juga ingin mengubah template blog ini sesuai apa yang ada sekarang, Alhamdulillah menurut aku sih mantap (entah menurut pembaca)
Soalnya selain tampilannya yang aku suka, menu page pull downnya juga terbilang lengkap deh isinya...Alhamdulillah ..

Nah kali ini saya akan berbagi dengan anda cara memasang dan mengganti tampilang Older Post , Beranda dan Newer Post yang lebih oke dari default biasanya ...

Secara default, setiap template blogger akan dilengkapi dengan link older post dan newer post yang masing-masing berfungsi untuk menampilkan postingan lama dan baru.

Nah agar tampilannya lebih menarik, anda bisa menggantinya dengan icon-icon mungil. Contohnya seperti gambar dibawah ini.


Menarik bukan? Klu anda tertarik silahkan ikuti langkah-langkah dibawah ini

1. Pada menu klik Design -> Edit HTML
2. Biar aman backup dulu template anda dengan klik Download Full Template
3. Beri tanda centang pada kotak "Expand Widget Template"
4. Lalu cari kode <data:olderPageTitle/>
5. Kalau sudah ketemu ganti kode tersebut dengan kode icon dibawah ini.


kode:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvu0YIfrjZKa5qVLZJP-xMNcXEM0BgdMreQI-bJXK9WrMECTtRfXmPMeqtigoPSsVL9KklOFTrIuNO_1-R-iM5DwJvQ5AvqYywPBrO2_9dBuYv_r4m9iwXpiQiJAcSYHfEWt-HnIf6wd4d/" border="0" >



kode:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOHysNchigjAYEDgcmQZB7OTsJpz1B7Yc-FAfHcH7RdTTeSvn1M8R1R4BuMJLKQYgwsuS1bIblV5cjLUzSuHQY3GBqFCLqdrRUjoVVUNj_NJby9FHf0fcN4kA54WCkGkwWK0JquLV4TGjY/" border="0" />


kode:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis7A2VOxS3TEsLmJJoylGhJDwHzXspGfaMmnDZfs02xrtoPZbsUZbDiYGEqhyj33IyHXqFfDXUuPC0u2GVyHcNDESGLfcE4j1Q0S5zzsLc5TLvDruL8IM3F_e-CX-4WHudhHcH80kX7Lla/" border="0" />


Kode:
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixzLJ6GXL3LmJmSMz5lkWTEew6nbRqwxuqsPZNPy3ledYSaxKjxGPhHCXIXS7_aTZkT33iwnln3LSWzhTeSTJpi3eWtkPpyg44iPqOkFE4yJdl1bwZa7sc8UEh_uKIkapc6YpNC0CchxP3/" border="0" />






Kode:
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh07N7wUkrDqxEuNgxIwHpbnVvqY2HokoUq4jOB_fXjxmbwTUVzUOzkNOTi_jBuyv85IepGGwOn8sBF4cQEdzNMMRbXP5wTWAAsPmOvo2Lu4sixXkO-nahJB8yQk7NfMe5tXzcrBWx7nIby/" border="0" />





 

kodenya :
<img src="http://i37.photobucket.com/albums/e74/mrphoto16/herman%20blog%20icon/bt-right.png" border="0" />

Untuk mengganti link newer post.
Cari kode <data:newerPageTitle/> lalu ganti dengan kode icon dibawah ini.


Kode:
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYI_9a5zK75hZ7tyCgApZ7Swfj7uX3byAPPiWCsO-KypliNoN_fPcM4rNbnfb0zYnAYkw0ErRKOWc0cIGzxEm5OsK0b55E8LWEd6A59itQeRJczLh9KJbNC8D3zX8XRJZBx0Z5FOLWTZzZ/" border="0" /></a>







Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZjr2_PQ2xUuC6R0Iu2DDeXFzBF3-eNrm2tMWTvFioXtiM2IDmbLpQ3UFEd593ZSe_h517BAR89cFL0UXyeBGmiduDw9JxlVnPNIHqN6bQC4QVeP0LEW9Y2ca4lUIQf2JM8hbvvQNJAbIp/" border="0" />



Kode:


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCYFcxCAma45mDgYMefOaLgOZCYIaqXAIjGMSqrrR4mOkzswNCFgdDSdV_BDKEb2p_PhZOPYQalmbcGTEmXRopUH_N56vxtPuK9DcoV0ci7Ns5syEl55AiyxdmCTtF1D2bPt8LsC99UeTK/" border="0" />




Kode:
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmRQUBfTONM2fEfzBzj0BpkjxcXIaMZ7WKkYczNEkKKxkF8K_bVHAlBMX52NKUZTfeZAdpGoDOzCv_QAVrksUEB3MKMlg-H8pZ8mrosqXtptg-t6BlXHdWZ0GAZGu_EQILvznc5vYDfR4-/" border="0" />

Nah biar mantap, ganti link home-nya., untuk mengganti link home cari kode   <data:homeMsg/> Biasanya ada 2 kode yang sama. Ganti kode yang pertama dengan kode icon dibawah ini.


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9C4xhyAX3pTOz8TWLUyM9EcVE9PPUXrHkFJc-ytZu02l5TxRq3hElMNFPhieJPx1DzVvvjo1eHeRHFZnyIBnFFB1STtMuEsF0kakodWRQmYrWgiM9nd_ycS-GSoQSHOlaDQ2AOAGgOt1g/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja9zASLcy8-UxsBbNyc_xrJrsYXzAm9KpH34QOr7VA1WqFo1gPBfFAe5E6A_OilwpP7cfAFoYNv_grcw88GuJoQLks53KmiEUwGBU38CgTi_DOHkguzATpstskaYgO2wPyMmIrGBOvOi9y/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMi3QrDe8Anq2TSgUdI51k0ZBr6yaoytKP3udVUAqRRZzgq0z2L0SUB1EZ2DFGYwjv_l8mC5_zcXcrYcrSjQX-ZxObc1eGwhHXDuAqFrms9SbMamwGcGBtP5NiR207S3ndHd-3A8okZ_rR/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja6Nfwi9bEasNMvwdA8k27z0gruT92ZbC1ARpjzSAAiXxfkrHnlWODAQrMKIspo0MinCqVvR8F2MoBSNZhBFCGT9g2PDpmN1y8i0Hkv1wPaM5DfMPTmK4F5Zj0CQahNqXP2XNwToEZj0sj/" border="0" />
Setelah itu, klik Save Template.
Selesai. Silahkan klik View Blog untuk melihat hasilnya.

Untuk mendapatkan icon-icon cantik lainnya. Coba kunjungi http://www.iconarchive.com. Disana tersedia ribuan icon yang bisa anda download secara gratis.

Selamat mencoba..
Minggu, 24 April 2011

Membuat Menu Page Pull Down

it's an information blog
Alhamdulillah setelah lelah puter - puter sana sini mencari catatan yang hilang... ternyata ga ketemu juga!! Akhirnya nyoba - nyoba download CSS Generator eh Koneksi Ga mendukung...

Nasib ... daripada kesel - kesel muter - muter deh cari refernsi untuk bikin menu page pull down ... hasilnya cuma bisa pengen tanpa bisa bikin ...

Tapi Alhamdulillah ... namanya sebuah usaha jika dilakukan secara bersungguh - sungguh Insya Alloh kadang berhasil kadang engga, nah saat engga jua bertemu yang namanya keberhasilan, maka saya akhirnya memilih jurus maut saat dibangku sekolah dulu, yaitu NYONTEK atau jelasnya MINTA CONTEKAN deh...!!!!


Nah posting kali ini pun tiada lain adalah membudayakan hasil contekan saya dari salah seorang sahabat saya di Komunitas Blogger Salafy Indonesia yaitu yang sangaaaaattttt baik hati yang dengan sukarela mau bersusah payah memberi contekan pada saya yang sudah mumet 18 keliling, pemberi contekan yang baik hati itu adalah Ukhti Arty Khansa  ... Makasih Ukhty ...

Nah hasil dari contekan diatas adalah pada bagian atas di blog ini yang ada tulisan BERANDAKU... nah itu namanya Menu Page Pull Down ... baru tahu ya?? kasian deh ...

dah biar cepet dicontek lagi, yang minat silahkan buru contek deh ... cara buatnya adalah :

Masuk ke Akunmu, lalu ke Rancangan Pilih Edit HTML, jangan lupa centang Expand widgetnya, kalau takut eror / salah download dulu deh templatenya ...

Setelah itu, dirimu cari deh kode </head>
biasa...supaya mudah nyarinya ya pinter dikitlah dengan mengaktivkan CTRL + F

lalu kamu copy deh code dibawah ini :



Lalu kamu taruh diatas kode head diatas tadi

Nah Save lalu masuk ke rancangan, selanjutnya kamu pilih tambah gadget dan pilih HTML

Lalu copy paste code dibawah ini sebagai pemanggilnya



Selanjutnya kamu atur deh Url nya sekehendak hatimu, bebas pokoknya...kan contekan.. ya .. ya ..ya??!!! silahkan lakuin deh gimana maunya...yang jelas jangan lupa terus di Save, lalu seret ke bagian atas tempat Widget laman mu biasa nongkrong, nah setelah beres jadi, jangan lupa supaya indah ya kamu hapus aja nanti widget Laman nya, warnanya bisa kamu modifikasi, mau Merah, Kuning, Hijau Dan Biru juga boleh kok  ... Bebas Euy ...

Buat Ukhti Arty Khansa ...sekali lagi Makasih Buat Contekannya ya....
Sabtu, 16 April 2011

Cara Memasang Scroll elemen

it's an information blog
Sekedar mengisi waktu saja ...
Nah kali ini yang ingin saya bagikan adalah cara memasang scroll elemen seperti yang anda lihat pada Tutorial Bagi Pemula di Blog saya ini ...

Cara memasangnya tidak memerlukan banyak trik dan cara, hanya sekedar masuk ke akun blogger kamu, lalu masuk ke rancangan, tambah gadget HTML ... itu saja, lalu copas code dibawah ini :

<div style="overflow:auto;width:350px;height:100px;padding:5px;border:4px solid #eee">
<ol>
<div style="text-align: left;">
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-daftar-isi-unik.html"> Cara Membuat Daftar Isi Unik</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-tombol-suka-di-wordpress.html"> Cara Memasang Tombol Suka Di Wordpress</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/mau-animasi-kursor-di-ikuti-tulisan.html"> Cara Membuat Animasi Kursor Diikuti Tulisan</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-next-page-halaman.html"> Cara Memasang Next Page </a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-menampilkan-gambar-pada-judul.html"> Cara Menampilkan Gambar Dijudul Posting</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-read-more.html"> Cara Memasang Read More</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/membuat-teks-berjalan-di-nav-bar-atas.html"> Cara Membuat Teks Berjalan Di Nav Bar atas</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-histats-di-web-blog-anda.html"> Trik Memasang Histats</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-mengganti-logo-blogger-di-addres.html"> Cara Mengganti Logo Favicon Blogger di Adress Bar</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/kode-untuk-menampilkan-hit-view.html"> Menampilkan Banyak Pembaca Artikel Di Blog Kita</a></li>
<li><a href="http://abuiram.blogspot.com/2011/04/cara-memasang-tombol-suka-facebook-like.html"> Memasang Tombol Suka Facebook </a></li>
<li><a href="http://abuiram.blogspot.com/2011/03/kumpulan-widget-status-yahoo-messenger.html"> Kumpulan Widget Status YM</a></li>
<li><a href="http://abuiram.blogspot.com/2011/03/membuat-efek-tulisan-berkedap-kedip.html"> Membuat Efek Tulisan Berkedip <blink>(Blinking)</blink></a></li>
<li><a href="http://abuiram.blogspot.com/2011/03/cara-mengganti-warna-font-pada-header.html"> Mengganti Warna Font Pada Header</a></li>
</div></ol>
</div>
Nah kamu tinggal ganti kode dibawah ini dengan link yang mau kamu tampilkan :

<li><a href="http://abuiram.blogspot.com/2011/03/cara-mengganti-warna-font-pada-header.html"> Mengganti Warna Font Pada Header</a></li>
Gampang buangettttttt bukaaaaaaaannnn???? Sayangnya kalo abiz baca suka langsung ghoib menghilang tanpa komentar ... hiks hiks hiks... banyak pembaca ghoib tanpa jejak juga ya... Hummpt...


 
Jumat, 15 April 2011

Cara Memasang Daftar Isi Unik

it's an information blog
Wah beneran trik cara memasang daftar isi kali ini unik, hasilnya bener2 menarik, ringan, tampilannya mantap, sebelumnya lihat dulu hasilnya disini

Nah kalo kamu berminat, nih abang kasih deh trik cara memasangnya ...

  1. Login blogger
  2. Rancangan, edit html, cari kode ]]></b:skin> 
  3. Simpan kode berikut tepat diatas kode tadi : 


/*  jToCTree  */
#judafistre {
    background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpr0xodeO8mhhj_kpLT34Rnb4Nv7QcfbcbJgvs9KsfKzKsguZ8_eqUDNtJMkCx4eEHeQC1YFI5B8vAsTcgR9BMADPSJQFgiA3ezvtXd9ch0-WzjmAwIIl0xat_X1DxSn-QK7xGx8S2WNU/d/bg5.gif)
    repeat-y scroll left center #E7F7FB;
    padding:5px;
    border:1px solid #339DC6;
     }
.branda {
    background: url(http://lh6.ggpht.com/_xcD4JK_dIjU/TUBMbWj8ZzI/AAAAAAAAEr4/iqyIQmaeqTc/d/blogger.png)
    0px 4px no-repeat !important;
     }
.judafis {
     padding:0 0 0 4px;
     font-weight:bold;
     }
.treeview, .treeview ul {
     padding: 0;
     margin: 0;
     list-style: none;
     }
.treeview ul {
    background-color:
    transparent;
    margin-top: 4px;
    }
.treeview .hitarea {
    background: url(http://lh6.ggpht.com/_xcD4JK_dIjU/TUBMyDGBM0I/AAAAAAAAEsQ/b__wKvGpCLo/d/treeview-default.gif) -64px -25px no-repeat;
    height: 16px;
    width: 16px;
    margin-left: -16px;
    float: left;
    cursor: pointer;
    }
* html .hitarea {
    display: inline;
    float:none;
    }
.treeview li {
    margin: 0;
    padding: 3px 0pt 3px 16px;
    }
.treeview a.selected {
    background-color: #eee;
    }
#treecontrol {
     margin: 2px 0;
     display: none;
      }
.treeview .hover {
    color: red; cursor: pointer;
    }
.treeview li {
    background: url(http://lh3.ggpht.com/_xcD4JK_dIjU/TUBMyE2GQFI/AAAAAAAAEsU/8rb8Y7zjLQw/d/treeview-default-line.png)
    0 0 no-repeat;
     }
.treeview li.collapsable, .treeview li.expandable {
     background-position: 0 -176px;
     }
.treeview .expandable-hitarea {
    background-position: -80px -3px;
     }
.treeview li.last {
    background-position: 0 -1766px ;
    }
.treeview li.lastCollapsable {
     background-position: 0 -111px
     }
.treeview li.lastExpandable {
     background-position: -32px -67px
     }
.treeview div.lastCollapsable-hitarea, .treeview div.lastExpandable-hitarea {
    background-position: 0;
    }
.treeview-black li {
    background-image: url(http://lh4.ggpht.com/_xcD4JK_dIjU/TUBMxfHyt7I/AAAAAAAAEsM/OQ8KPEkd4iI/d/treeview-black-line.png);
    }
.treeview-black .hitarea, .treeview-black li.lastCollapsable, .treeview-black li.lastExpandable {
    background-image: url(http://lh5.ggpht.com/_xcD4JK_dIjU/TUBMblX2uHI/AAAAAAAAEsI/qilKwCGDUas/d/treeview-black.gif);
     }
.filetree li {
     padding: 3px 0 2px 16px;
     }
.filetree span.folder, .filetree span.file {
    padding: 1px 0 1px 18px; display: block;
    }
.filetree span.folder {
    background: url(http://lh3.ggpht.com/_xcD4JK_dIjU/TUBMbqeQA4I/AAAAAAAAEsA/MxndTFShj-4/d/folder.gif)
    0 0 no-repeat;
    }
.filetree li.expandable span.folder {
     background: url(http://lh4.ggpht.com/_xcD4JK_dIjU/TUBMbhMdwlI/AAAAAAAAEsE/9pe2zTo3i1U/d/folder-closed.gif)
      0 0 no-repeat;
      }
.filetree span.file {
     background: url(http://lh4.ggpht.com/_xcD4JK_dIjU/TUBMbVyeYzI/AAAAAAAAEr8/pGIGq0amWFE/d/file.gif)
     0 0 no-repeat;
     }
.filetree span.file a {
     text-decoration:none;
     }

selanjutnya cari kode </head>  dan letakkan kode berikut tepat diatas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/>
<script src='https://github.com/jzaefferer/jquery-treeview/raw/master/jquery.treeview.js' type='text/javascript'/>
<script src='http://kangdadang.googlecode.com/files/jtoctree-1.0.js' type='text/javascript'/>
<script language='javascript'>//<![CDATA[
var judul = 'Daftar Isi'
function dafisjtoctree() {
 $('#hitam').treeview({
  animated: 'fast',
  collapsed: true,
  control: '#treecontrol'
  });
 }
$(document).ready(function() {
 dafisjtoctree();
});
//]]></script>:


Daftar Isi  bisa diganti dengan nama yang kawan inginkan, Fast dapat diubah dengan kata Normal untuk kecepatan lebih lambat.

selanjutnya untuk cara pemanggilannya pada edit html Posting atau pada Gadget HTML/JAVA SCRIPT :



<div id="judafistre">
<div id="treecontrol">
<a title="Tutup semua folder" href="#"> Tutup</a> | <a title="Buka semua folder" href="#"> Buka</a> | <a title="Tombol buka tutup semua folder" href="#">Buka Tutup</a>
</div>
<script src="http://abuiram.blogspot.com/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=jtoctree">

</script>
</div>


yang berwarna biru ganti dengan alamat blog sobat yang dipakai

selesai.........
Selasa, 12 April 2011

Tips Mendownload Template Yang Aman

it's an information blog
Saat beraktifitas Nge Blog, tentu kita kadang ga puas dengan apa yang kita sudah instal di blog kita, diantaranya kadang bosen dengan template itu-itu saja.

Banyak fasilitas gratis yang disediakan oleh banyak pembuat Template. Nah yang jadi masalah bukan templatenya, tapi cara kita memasangnya ...


Jika kita saat mengunggah template baru, jika kita kurang teliti, maka hampir seluruh widget kita akan menghilang, nah untuk mengatasinya bacalah beberapa tisp berikut ini :

1. Sebelum kita mengunggah template baru, sebaiknya dwonload / amankan dulu template lama..simpan di komputer mu.

2. jangan mengcopas kode template ke edit HTML kita, karena itu sama saja dengan menghapus seluruh isi kode lama.

3. Lakukan unggah dengan dengan prosedur bawaan yaitu klik browse, lalu cari template kita yang baru, lalu klik unggah.

4. Nah saat template diunggah akan muncul Warning warna merah diantaranya ada tulisan ...

Template Baru Anda Tidak Memiliki Gadget :
1.
2.
3. Dan seterusnya ...

Dibawahnya ada keterangan :
PERTAHANKAN WIDGET - HAPUS WIDGET

Nah pilih yang Pertahankan widget, karena jika anda memilih Hapus Widget Ya SELAMAT anda akan kehilangan semua Widget lama anda ...

Lalu Save Template baru anda... Selamat anda kini punya template baru tanpa harus kehilangan widget lama... Tinggal atur deh posisi pasukan barunya, telitilah, biasanya banyak widget baru yang kembar, maka siap-siaplah untuk melaksanakan Operasi Kembar Siam di Blog anda yang baru ...
Wokeh !!! Gitu aja deh ....
Senin, 11 April 2011

Ketika Anda Lupa Password Blogger

it's an information blog
Blog bisa jadi akan menjadi sangat erat dengan Anda. Seakan satu hari ini janggal jika Anda tak menengok blog kesayangan Anda. Dan yang menarik di sisi lain Anda pasti memiliki sifat pelupa, baik itu sedikit atau banyak. Nah, apa yang teerjadi jika Anda lupa password untuk blog Anda? Anda tidak bisa akses dan Anda tidak bisa update, apakah Anda hanya akan memandangnya tanpa bisa melakukan perkembangan lagi untuk blog kesayangan Anda? Tuntaskan tutorial ini untuk mendapat solusinya.


Anda Bisa Menggunakan Alamat Blog Anda
Ada dua pilihan untuk membenahi masalah ini. Pertama Anda bisa memasukkan url blog Anda saja.
1. Klik untuk menuju ke http://www.blogger.com/forgot.g
2. Masukkan alamat blog Anda

3. Klik tombol Cari
4. Muncul pesan untuk segera periksa Email Anda. Sekarang periksalah email yang Anda gunakan untuk login blog tersebut. Cek Inbox. Jika tidak ditemukan cobalah cek ke Spam.
5. Buka pesan dari Blogger Support. Anda akan mendapatkan link yang bisa Anda gunakan untuk reset password. klik link tersebut.
6. Anda akan kembali ke jendela blogger. Anda diminta untuk memasukkan kode konfirmasi. Isikan kode konfirmasi.
7. Anda akan mendapatkan pesan dari blogger untuk kembali cek email Anda.
8. Buka email Anda. Cek inbox. Jika tidak ada cobalah cari di spam. Kali ini pesan dari accounts-noreply@google.com. Buka pesan dan Anda kembali akan mendapatkan link untuk reset password.
9. Klik link pada surat tersebut.
10. Anda masuk pada halaman google Reset Password. Masukkan password baru Anda. Ulangi lagi pada Masukkan sandi sekali lagi. Jika sudah klik Buat Ulang Sandi
11. Jika sukses akan muncul jendela baru dengan pesan bahwa Password Anda Telah di Reset. Close jendela tersebut dan cobalah login.



Nah proses selesai dan kini Anda siap login dengan password baru.

Anda Bisa Menggunakan Alamat Email Anda
Perhatikan langkah pertama. Ketika Anda berada pada alamat http://www.blogger.com/forgot.g, anda juga bisa reset password dengan memasukkan alamat email Anda. Dengan cara ini lebih cepat, karena setelah Anda klik cari Anda akan langsung pada step nomer 6 pada cara pertama. Cara kedua ini bisa digunakan juga bagi Anda yang blognya sudah Anda host sendiri dan bukan di blogspot lagi.

Semoga bermanfaat dan mengembalikan semangat Anda untuk memebenahi blog Anda.

Mau Animasi Kursor di ikuti Tulisan?

it's an information blog
Caranya :
1. Login ke akunmu.
2. pilih Tata letak / rancangan .
3. tambah gadget HTML
4. lalu copas kode berikut ini tanpa harus memberi judul., letakkan dimana saja.



<script>
//mouse
//Circling text trail- Tim Tilton
//Website: http://www.tempermedia.com/
//Visit http://www.dynamicdrive.com for this script and more
function cursor_text_circle(){
// your message here
var msg='tulis teks disini'.split('').reverse().join('');


var font='Verdana,Arial';
var size=3; // up to seven
var color='#ff0000';


// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 for just plain rotation w/out drag
var speed=.3;


// This is the rotation speed, set it negative if you want
// it to spin clockwise
var rotation=-.2;


// Alter no variables past here!, unless you are good
//---------------------------------------------------




var ns=(document.layers);
var ie=(document.all);
var dom=document.getElementById;
msg=msg.split('');
var n=msg.length;
var a=size*13;
var currStep=0;
var ymouse=0;
var xmouse=0;
var props="<font face="+font+" size="+size+" color="+color+">";


if (ie)
window.pageYOffset=0


// writes the message
if (ns){
for (i=0; i < n; i++)
document.write('<layer name="nsmsg'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
}
else if (ie||dom){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;


function Mouse(evnt){
ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
}


if (ns||ie||dom)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
var y=new Array();
var x=new Array();
var Y=new Array();
var X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}


var iecompattest=function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}


var makecircle=function(){ // rotation properties
if (ie) outer.style.top=iecompattest().scrollTop+'px';
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
}
}


var drag=function(){ // makes the resistance
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);


}
makecircle();
// not rotation speed, leave at zero
setTimeout(function(){drag();},10);
}
if (ns||ie||dom)
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", drag, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", drag );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
drag();
};
}
else
window.onload = drag;
}


}
cursor_text_circle();


</script>

Ganti tulisan warna merah dengan teks anda, ingat jangan terlalu panjang...

Lalu Save ...

contoh hasilnya bisa dilihat disini

Cara Memasang Next Page / Halaman Berikutnya di bawah postingan

it's an information blog
Saya bingung menyebut ini apa namanya...makanya saya sebut saja widget Next Page / Halaman Berikutnya saja ya ...

Nah Cara memasangnya adalah sebagai berikut :
1. Masuk ke Dashbor,
2. klik rancangan.
3. Tambah Gadget
4. Pilih HTML
5. Lalu Masukkan kode :


<style>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#000000;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #ccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#000000;
}

</style>




<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=5;
var displayPageNum=6;
var firstPageWord = 'First';
var endPageWord = 'last';
var upPageWord ='Sebelumnya';
var downPageWord ='Berikutnya';


var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span class="showpage"> Jumlah Halaman '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;

}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

selanjutnya Save, dan simpan dibawah posting

Lihat hasilnya ....

Dah ah gitu aja, cape ngetiknya ...
Hasilnya lihat dibawah kolom posting artikel saya ....
Minggu, 10 April 2011

Cara Menampilkan Gambar Pada Judul Posting Artikel

it's an information blog
Ini sekedar trik untuk mempercantik tampilan blog kita saja ...

Caranya sih ga sulit - sulit amat.
Langkah-langkah seribunya :
1. Upload photo yang di inginkan di foto bucket, lalu ambil Url link gambarnya.
2. Masuk ke dashbor, lalu klik rancangan, klik Edit HTML, lalu klik Expand widget.
3. Aktifkan mode pencarian dengan CTRL + F
4. Lalu cari kode di bawah ini :


<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>

Lalu Copas kode berikut ini :

<img src="Url Gambar Anda" width="Lebar yang anda inginkan" hight="Tinggi yang anda inginkan" border="0"></img>

Kemudian masukkan kode ini di area Sisipkan kode Disini
<a expr:href='data:post.url'>Sisipkan Kode Disini<data:post.title/></a>
<b:else/>

Nah Lalu SAVE deh ... The End...

Nah hasilnya akan seperti yang ada di blog ini ... cantikkan ??

Itulah Kopi Jahe Merah Karomah Yang nikmat Kopinya, Terasa Jahenya, Pas Susunya ... sehat khasiatnya...jangan lupa pesan ya ... he he...

Ini gambar Produknya  :
Sabtu, 09 April 2011

Cara Memasang Read More

it's an information blog
Ini adalah cara membuat Read More (Baca Selengkapnya)...
Sebetulnya cara mudah adalah bertanya pada ahli IT terdekat disekitar rumah anda, lalu minta tolong kepadanya untuk membuatkannya (he he he....- cara jadul yang paling gampang)...
Tapi barangkali males keluar rumah karena hujan, cuaca panas, atau takut ketemu yang nagih, maka ga pa pa ta bagi deh caranya .... 


(Yang Ini Tolong Jangan di Klik)

 Nah caranya adalah :
1. Login pada blogger
2. Klik Layout pada Dashboard
3. Pada menu Layout, klik Edit HTML.Jangan lupa centang pada kolom Expand Widget Template.

4. Carilah kode }]]></b:skin>,dan letakkan kode dibawah ini tepat dibawah kode tersebut. Atau lebih mudahnya tekan saja ctrl + F kemudan ketikkan kode tersebut pada kolom pencariannya.

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



Cari kode dibawah ini :

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

Lalu Masukkan kode berikut tepat dibawahnya :

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>

Kalimat Read More dapat anda ganti dengan Baca Selengkapny
a
atau Selengkapnya atau Selanjutnya.
6. Kemudian klik Save
Jumat, 08 April 2011

Membuat Teks Berjalan Di Nav Bar Atas

it's an information blog
Caranya cukup mudah, pertama-tama sobat Login ke Account Blogger Sobat. Klik TATA LETAK – EDIT HTML.



Kemudian Copy Paste kode dibawah ini, letakkan tepat diatas
Rabu, 06 April 2011

Instal Cepat Kode HTML Ke Blogger anda

it's an information blog
Instalasi ini hanya untuk ke side bar anda saja, fungsinya hanya untuk mempermudah instalasi widget secara cepat ke blog anda...


Hanya sekedar sofware pembantu saja ...


Cara Memasang Histats di Web / Blog Anda

it's an information blog
Kali ini saya membahas tentang gimana cara memasang Histats.
Apa si kegunaan histats bagi blog??? ya tentu ada gunanya..mengetahui perkembangan blog atau website yang kita miliki.


Sekarang tidak perlu susah-susah karena telah banyak layanan gratis yang free. Salah satumya Hitstats.com. Situs ini memungkinkan anggotanya untuk mengetahui statistic dari blog atau websitenya perhari, bulan dan tahun. Online visitor juga dapat diketahui dan masih banyak fitur-fitur lain yang disediakan.

Bagi anda yang ingin mengetahui perkembangan statistic dari blog atau website yang anda miliki tidak ada salahnya mencoba situs ini. Atau apabila anda ingin orang yang mengunjungi blog atu website anda mengetahui statistic dari blog anda bisa di coba cara berikut.

Cara memasang histats di blog anda sangatlah mudah, masuklah dulu ke histats disini :
Untuk memudahkan anda memahami perintah disana sebaiknya pilih ke bahasa indonesia..
lalu :
  1. Lakukan register
  2. Masukkan Account Info seperti : alamat email dan Pasword.
  3. Isi Site info seperti : Site url, Title, Description.
  4. Setelah beres, buka email anda yang didaftarkan, lalu klik tautan yang diberikan histats.
  5. Lalu login dengan email anda dan passwordnya.
  6. Setelah itu klik add website, isi form, 
  7. Setelah selesai anda klik data web yang telah anda daftarkan
  8. Di histats.com ini kita bisa melihat berbagai status url blog kita, lalu klik add counternya, (anda  bisa mengisi Page views start value dan Visitors start value dengan angka yang kita inginkan.)
  9. Sekarang tinggal pilih model tampilan yang diinginkan klik continue.
  10. Pilih informasi yang akan ditampilkan. Ada Total Page views,Total Visitors, User online, Page views today, Visitor today. Klik Continue. Lalu setelah fix klik counter.jpg yang kita inginkan, ambil kode HTML nya.
  11. Setelah itu masuk ke akun blogger mu, buka rancangan pilih tambah gadget, lalu pilih HTM, dan copy disana, jadi deh...Copy kode tersebut ke blog anda... selesai deh

Selamat mencoba jangan lupa comment nya ya.

Updates Via E-Mail