Tampilkan postingan dengan label Tips Dan Tutorial Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tips Dan Tutorial Blog. Tampilkan semua postingan

Kamis, 13 Januari 2011

Membuat Tombol Jika Di Klik Muncul Teks/Gambar

Duh bingun juga mau dikasih judul apa. Namanya saja saya tidak tahu, jadi pakai judul ala kadarnya deh. Cara ini bukan seperti pada artikel membuat tombol submit beserta link, namun ada baiknya anda membacanya, sekalian juga membaca artikel cara mengambil image location dengan browser HP dan cara pasang gambar di postingan lewat HP karena akan membantu anda jika anda seorang mobile blogger :D.
Lalu seperti apa tombol yang dimaksud pada judul di atas? Yang pasti dengan tombol ini anda bisa menghemat tempat pada halaman posting.

Daripada ngalor-ngidul nggak jelas, langsung ke cara dan contoh saja.

Gunakan kode ini untuk membuatnya:

<div><div style="margin: 5px;"><div class="smallfont" style="margin-bottom: 2px;"><input value="Tampilkan" style="margin: 0px; padding: 0px; width: auto; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: 1px dotted #006400; text-align: justify;">isi teks atau kode gambar yang disembunyikan dibalik tombol</div></div></div></div></div>

Nah, hasilnya akan menjadi seperti tombol di bawah ini (silahkan di klik)

isi teks atau kode gambar yang disembunyikan dibalik tombol

Perhatikan pada kode yang saya beri warna biru dan kuning, tulisan-tulisan tersebut dapat anda ganti sesuai keinginan. Dan pada teks yang berwarna hijau, anda isi dengan tulisan atau gambar yang ingin anda sembunyikan dan akan tampil setelah tombol di-klik. O iya, anda juga dapat bereksperimen dengan mengutak-atik tag style-nya.

Maaf, bagi para pengguna ponsel anda bisa baca cara copy-paste artikel blog dengan HP DISINI untuk meng-copy script di atas.

Sekian, moga berguna.
Sumber : http://www.bi2t.com/
Diposting oleh di 18.48 0 komentar
Label: , ,

Cara Menyimpan Gadget Blog tanpa Nama/Judul

Sebel! Ungkapan yang saya katakan dalam hati ketika tadi saya ingin menambah Gadget baru di halaman blog bi2t.com tanpa nama tapi tidak bisa. Awalnya saya pikir hanya kesalahan saja, karena sebelumnya saya bisa membuat gadget tanpa mengisi judul gadgetnya. Tapi setelah mencoba berulang kali ternyata gagal, akhirnya saya mulai bingung sendiri bagaimana cara menyimpan gadget blogspot tanpa judul. Setelah merenung sejenak, akhirnya saya temukan sedikit trik menyiasati hal ini.

cara menyimpan gadget blog tanpa judul

Kita biasanya membuat gadget tanpa memberi judul adalah untuk menampilkan iklan di blog. Nah, biar kelihatan rapi, biasanya iklan yang ditampilkan tidak mempunyai judul gadget di atasnya, misalnya saat ditempatkan di atas dan di bawah posting, dan juga pada bagian header blog. Oleh karena itu, jika anda ingin membuat atau menyimpan gadget tanpa judul / nama, silakan isi saja judulnya dengan kode <!--judul-->, silakan lihat contoh berikut:

solusi simpan gadget blogspot tanpa judul kosong html/javascript

Kemudian coba simpan gadget anda. Insya Alloh bisa tersimpan dan muncul pada halaman Edit Tata Letak.

simpan gadget blog tanpa mengisi judul

Semoga trik ini bermanfaat.

Sumber :  http://www.bi2t.com/
Diposting oleh di 18.42 0 komentar
Label: ,

Selasa, 04 Januari 2011

Tips - Membuat Menu Navigasi dengan Sub Menu

Hari ini saya akan membahas bagaimana membuat menu navigasi dengan sub-menu seperti contoh di bawah ini. Silakan anda gerakkan mouse anda pada contoh menu navigasi di bawah ini. Pada menu Kategori terdapat 3 sub-menu yaitu Tips, Tutorial, dan Info.


Dengan menu navigasi seperti di atas blog anda akan terlihat lebih menarik bukan? Selain itu tentunya bagi si pemilik blog juga lebih mudah meng-organisir konten dari blognya. Begitupun sebaliknya buat pengunjung blog anda, menu seperti ini mempermudah pengunjung dalam meng-eksplor isi blog anda. Anda bisa juga melihat live demo di sini.
Pada saat saya surfing, saya menemukan beberapa menu navigasi dengan sub-menu. Ada yang menggunakan javascript dengan tampilan dan efek yang sangat menarik, namun saya tidak akan membahasnya kali ini, mungkin di lain waktu saya akan posting tentang hal ini. Yang sekarang akan saya bahas adalah cara yang paling mudah dan tidak menggunakan javascript.
Nah, langsung aja ya masuk ke penjelasan bagaimana caranya memasang menu ini di blog anda. Seperti biasa anda perlu login ke www.blogger.com dan langsung menuju ke Edit HTML. Jangan lupa back-up dulu template anda. Setelah itu ikutilah langkah-langkah di bawah ini:
  1. Carilah kode ]]></b:skin>
  2. Setelah menemukan kode di atas, letakkan kode di bawah ini di atas kode tersebut. Kode berwarna merah adalah lebar dari menu navigasi, rubahlah nilai px agar sesuai dengan lebar blog anda.
    #NavbarMenu { background: #000; width: 874px; height: 35px; font-size: 13px; font-family: Arial, Tahoma, Verdana; color: #fff; font-weight: bold; margin: 0px; padding: 0px; } #NavbarMenuleft { width: 874px; float: left; margin: 0; padding: 0; } #nav { margin: 0; padding: 0; } #nav ul { float: left; list-style: none; margin: 0; padding: 0; } #nav li { list-style: none; margin: 0; padding: 0; } #nav li a, #nav li a:link, #nav li a:visited { background: #808080; height: 24px; color: #fff; display: block; font-size: 14px; font-family: trebuchet ms, Times New Roman; font-weight: bold; text-transform: none; text-decoration: none; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; border-right: 1px solid #000; } #nav li a:hover, #nav li a:active {background: #c0c0c0; color: #000; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; text-decoration: none; } #nav li li a, #nav li li a:link, #nav li li a:visited { background: #c0c0c0; width: 150px; color: #000; font-size: 14px; font-family: trebuchet ms, Times New Roman; font-weight: normal; text-transform: none; float: none; margin: 0; padding: 7px 10px; border: 1px solid #000; } #nav li li a:hover, #nav li li a:active { background: #000; color: #fff; padding: 7px 10px; } #nav li { float: left; padding: 0; } #nav li ul { z-index: 9999; position: absolute; left: -999em; height: auto; width: 170px; margin: 0; padding: 0; } #nav li ul a { width: 140px; } #nav li ul ul { margin: -32px 0 0 171px; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -999em; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: auto; } #nav li:hover, #nav li.sfhover { position: static; }
  3. Sebelum melanjutkan ke langkah berikutnya, anda perlu menentukan posisi menu navigasi yang diinginkan. Biasanya menu navigasi diletakkan di atas header atau di bawah header. Misalkan anda ingin memasangnya di atas header, maka anda harus mencari kode <div id='header-wrapper'>
  4. Lalu letakkan kode di bawah ini persis di atas kode tadi
    <div id='NavbarMenu'>

    <div id='NavbarMenuleft'>

    <ul id='nav'>

    <li><a href='http://syamsuqamaridji.blogspot.com'>Home</a> </li>

    <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips Dan Tutorial'>Tips Dan Tutorial</a>

    <ul>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips Dan Tutorial Blog'>Tips Dan Tutorial Blog</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips Hidup Sehat'>Tips Hidup Sehat</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips Dan Tutorial Software'>Software</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips HP'>Tips HP</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips HTML'>Tips HTML</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tips Otomotif'>Tips Otomotif</a> </li>

            <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Tutorial Photoshop'>Tutorial Photoshop</a> </li> </ul> </li>

    <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Agama'>Agama</a> </li>

    <li><a href='http://syamsuqamaridji.blogspot.com/search/label/Informasi Lain'>Informasi Lain</a>

    <ul>

           <li><a href='syamsuqamaridji.blogspot.com/search/label/Olahraga'>Olahraga</a> </li>

           <li><a href='syamsuqamaridji.blogspot.com/search/label/Informatika'>Informatika</a> </li>

    </ul> </li> </ul>

    </div> </div>
  5. Sekarang anda perlu mengganti beberapa kode di atas agar sesuai dengan keinginan anda. Kode warna biru adalah url-link dan kode warna kuning adalah anchor-text atau titel menu yang terkait dengan url-link tadi. Sebagai contoh menu Home. Anda menginginkan apabila menu ini diklik maka akan membawa anda kepada halaman utama dari blog anda, maka dari itu rubahlah url-linknya dengan url blog anda. Berikutnya, menu Blogger Template. Anda ingin apabila menu ini diklik maka akan membawa atau menampilkan posting-posting yang mempunyai label blogger template. Maka, rubahlah linknya menjadi http://namabloganda.blogspot.com/search/label/blogger template.
  6. Anda bisa menambah menu maupun sub-menu dengan menambahkan kode seperti di atas. Sebaliknya anda pun bisa menghilangkan menu dan sub-menu yang tidak anda inginkan dengan menghapus kode di atas yang tidak diinginkan.
  7. Setelah itu jangan lupa untuk menyimpan pekerjaan anda dan lihatlah hasilnya di blog anda.
  8. Jika anda berhasil, tentunya blog anda akan terlihat lebih menarik. 
Sumber : http://allfreetips4u.blogspot.com/2009/12/membuat-menu-navigasi-dengan-sub-menu.html
Diposting oleh di 02.04 0 komentar
Label: ,

Senin, 03 Januari 2011

Tips - Mengetahui Jejak Pengunjung Blog Dengan Google Analytics

Cukup lama juga aku mencari cara untuk mengetahui jejak pengunjung yang pernah berkunjung ke blog aku ni.... Memang ada beberapa tools yang bisa kita gunakan seperti Sitemeter, Google Analytics, Statcounter, Motigo Webstat, Easy Counter, dan Go Stats. Klw menurut aku sih baiknya pakai Google Analytics dan Sitemeter yang lebih bagus...Soalnya yang lainnya blum pernah aku coba....hehehehe....

Google Analytics dan Sitemeter sama menampilkan report/laporan jumlah pengunjung blog yang lengkap. Saat ini tools yang aku gunakan adalah Google Analytics. Aku pengen mencoba menggunakan Sitemeter, sayangnya sampai dgn saat ini Sitemeter gak bisa buka website-nya...Gak tahu knapa....Ada yang tahu gak...???

Pengantarnya terlalu panjang ya...??? Maklum, pas lagi nulis artikel ni hatiku lagi senang alias lagi happy...wkwkwkwk....

Langsung aja nih...Kebetulan aku pernah membuka sabuah website, tutorialnya bagus banget. Lengkap ama gambarnya. Akhirnya aku copas aja artikelnya ke blog ini dengan sedikit aku modifikasi kalimatnya. Kalau agan pengen melihat website-nya, klik aja disini.

Pertama-tamu aku pengen mengenalkan pengertian dan beberapa fitur dari Google Analytics. Google Analytics adalah sabuah tools yang disediakan oleh Google yang berguna mendeteksi segala aktivitas yang terjadi di dalam blog/website kita. Aktivitas yang dimaksud bisa berupa jumlah pengunjung, jumlah page yang dibuka, lokasi pengunjung, waktu kunjungan dan lain sebagainya. Lebih lengkap lagi akan aku perkenalkna sedikit fitur dalam Google Analytics.
Di dalam Dashboard Google Analytics terdaftar beberapa fitur sebagai berikut :
  1. Site Usage : terdiri atas Visits (Jumlah pengunjung), Page Views (Jumlah halaman yang dibuka), Page/Visits (Perbandingan antara jumlah pengunjung blog dengan jumlah halaman yang dibuka), Bounce rate (sorry nih, aku sendiri belum paha apa maksud fitur ini), Avg. Time on site (Rata-rata waktu pengunjung blog selama dalam blog kita), dan terakhir New Visits (Kunjungan terbaru).
  2. Visitor Overview : menampilkan jumlah pengunjung dalam kurun waktu tertentu. Disini juga kita bisa melihat jumlah pengunjung blog dalam beberapa waktu terakhir.
  3. Map Overlay : menampilkan secara detail tempat/lokasi dimana pengunjung blog. Gambarnya berupa peta dunia, yang jika kita klik gambarnya akan muncul lokasi dari pengunjung blog.
  4. Traffic Sources Overview : menampilkan diagram blog. Berupa pencarian artikel berdasarkan kata kunci di Google dan lain sebagainya.
  5. Content Overview : menampilkan page atau halaman apa saja yang dibuka oleh pengunjung blog dan jumlah berapa kali page atau halaman tersebut dibuka.
Mengenai cara masangnya gimana..??? Yang di atas kan cuma membahas tentang pengertian dan fiturnya. Sabar gan, sengaja aku mulai dengan pengertian dan fitur-fiturnya biar gan bisa lebih paham jika pengen menggunakan tools ini. Syarat utama untuk menggunakan tools ini anda harus memiliki akun google. Jika belum punya, agan harus daftar dulu di Gmail.com.

1. Jika udah punya akun google, masuk aja ke http://www.google.com/analytics
2. klik akses analytics
Cara Mengetahui Jejak Pengunjung Blog Dengan Memasang Google Analytics


3. Kemudian masukan alamat email google anda
4. Klik sign up. Setelah itu isi semua form yang ada harus sesuai

Cara Mengetahui Jejak Pengunjung Blog Dengan Memasang Google Analytics


5. Pada kolom Accept User Agreement beri tanda centang kotak “yes, I agree”
6. Setelah itu anda masuk ke kolom dimana ada script yang harus di tanam di blog anda

Cara Mengetahui Jejak Pengunjung Blog Dengan Memasang Google Analytics

Silahkan simpan script tersebut tepat sebelum kode </body>
Caranya login ke blogger>tata letak>edit html

7. Setelah menyimpan Script tersebut diblog anda kemudian klik Continue.
8. Informasi mengenai lalu lintas blog anda akan ada setelah 1 hari.

Untuk melihat laporan, anda tinggal akses lagi ke google analytics dan klik akses analytics, masukan account anda. Klik “View Report”

Contoh gambar laporan/lalu lintas blog dengan menggunakan google analytics seperti di bawah ini. Anda bisa melihat setiap detil laporan dengan mengklik detil laporan tersebut. Selamat Menganalisa blog anda

Cara Mengetahui Jejak Pengunjung Blog Dengan Memasang Google Analytics



Nah, gimana??? Tertarik nggak...?? kalu iya, buruan daftar....!!!!
Diposting oleh di 20.50 0 komentar
Label: ,

Kamis, 30 Desember 2010

Etika Copy Paste Artikel/Posting Dari Blog Lain

Tips ini saya berikan bukan untuk disalah gunakan. Ini bertujuan sebagai bahan pembelajaran buat kita semua. Ingat...!!!! Copy Paste (copas) artikel dari blog/web orang lain harus juga ada etikanya, misalnya dengan meminta izin terlebih dahulu dari penulis artikel tsb, atau pula dengan menuliskan sumber dari artikel tsb pada akhirr atau awal posting/artikel. Contoh : ...... Sumber : http://syamsuqamaridji.blogspot.com/ artinya artikel yang telah kita buat bersumber atau berasal dari situs tersebut.
Seringkali kita menemukan beberapa situs blog/web yang artikelnya tidak bisa kita copas karena sang penulis artikel/pembuat blog/web tersebut telah memodifikasi blog/web-nya untuk menghindari copas artikel dari pengunjung yang kurang bertanggung jawab. Namun cara tsb masih dapat kita pecahkan, saya punya sedikit tipsnya....
Ok, langsung aja ya....
Pertama, kamu buka situs tersebut.
Kedua, klik File pada menu Tab di browser anda.
Ketiga, pilih Save Page As.
Muncul jendela Save Page As. Pada Save as type, pilih Web Page, complete (jika kita ingin mengcopy artikel tsb beserta gambanya) pilih Web Page HTML only (jika kita hanya ingin mengcopy kode HTML yang ada), atau pilih Text Files (jika kita hanya ingin mengcopy tulisannya doank). Aku sarankan pilih Web Page, Complete.
Keempat, simpan halaman web tersebut dengan nama yang kamu suka dan tentukan di drive mana kita akan menyimpan halaman web tsb. Klik Save.
Terakhir, buka kembali halaman web yang telah kita simpan tadi di browser. Nah, disini artikel tersebut bisa kita copy dan kemudian paste di blog kita.

Selesai....
Eeeeeeeit,,,,ingat ya!!!! Jangan Copas artikel sembarangan, harus tetap pakai etika....
Minta izin dulu dari penulisnya atau bisa juga menuliskan nama sumber dari artikel tersebut pada akhir atau awal artikel yang telah kita copas tadi....
Ok, sekian dulu tips dari aku, semoga bermanfaat (jika digunakan untuk hal yang baik tentunya)...:D
Diposting oleh di 19.35 0 komentar
Label: ,

Membuat Related Post Widget Blog

Cukup lama aku mencari cara gimana membuat Related Post atau Artikel Terkait di blog. Namun dari kebanyakan tutorial yang aku baca, nggak ada yang sesuai dengan template yang aku gunakan. Akhirnya aku menemukan sebuah artikel Membuat Related Post Di Widget Blog di situs Belajar Ngeblog, cara ini pas banget ama template aku. Akhirnya aku copy dan aku paste ke blog aku ini dengan sedikit modifikasi.
Hal ini aku lakukan bukan dengan tujuan mencontek karya orang lain, namun juga semata-mata untuk menjadi bahan belajar buat aku dan bagi teman-teman yang sempat bertandang ke blog aku, atau pula bagi yang kesulitan menemukan cara membuat related post.
Ok, langsung aja kita mulai tutorialnya.

  • Login ke akun blogger anda, pilih blog yang ingin anda edit, klik link Layout kemudian masuk ke Edit HTML
  • Jangan lupa centang/tandai/aktifkan Expand Widget Templates Untuk bisa mengedit template secara keseluruhan.
  • Masukkan kode script berikut sesudah tag <head> dan sebelum tag </head> seperti dibawah ini:
    • <script type="text/javascript">
    //<![CDATA[
    var relatedTitles = new Array();
    var relatedTitlesNum = 0;
    var relatedUrls = new Array();
    function related_results_labels(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    relatedTitles[relatedTitlesNum] = entry.title.$t;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    relatedUrls[relatedTitlesNum] = entry.link[k].href;
    relatedTitlesNum++;
    break;
    }
    }
    }
    }
    function removeRelatedDuplicates() {
    var tmp = new Array(0);
    var tmp2 = new Array(0);
    for(var i = 0; i < relatedUrls.length; i++) {
    if(!contains(tmp, relatedUrls[i])) {
    tmp.length += 1;
    tmp[tmp.length - 1] = relatedUrls[i];
    tmp2.length += 1;
    tmp2[tmp2.length - 1] = relatedTitles[i];
    }
    }
    relatedTitles = tmp2;
    relatedUrls = tmp;
    }
    function contains(a, e) {
    for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
    return false;
    }
    function printRelatedLabels() {
    var r = Math.floor((relatedTitles.length - 1) * Math.random());
    var i = 0;
    document.write('<ul>');
    while (i < relatedTitles.length && i < 20) {
    document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
    if (r < relatedTitles.length - 1) {
    r++;
    } else {
    r = 0;
    }
    i++;
    }
    document.write('</ul>');
    }
    //]]>
    </script>
  • Kemudian cari kode widget seperti dibawah ini
    • <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    </b:loop>
    </b:if>
  • Pada Script diatas, tambahkan script yang dicetak tebal berwarna biru seperti dibawah ini
    • <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    <b:if cond='data:blog.pageType == "item"'>
    <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;
    max-results=10"' type='text/javascript'/>
    </b:if>
    </b:loop>
    </b:if>
  • Save template
  • kemudian buka Layout -> Page Elements dan add a new HTML/Javascript widget. beri judul atau title Title Related Post. kemudian copy paste script di bawah ini pada kotak yg disediakan :
    • <script type="text/javascript">
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>
  • Sekarang kembali lagi ke Layout -> Edit HTML, centang/tandai/aktifkan Expand Widget Templates Untuk bisa mengedit template secara keseluruhan, kemudian  cari HTML/Javascript widget Related Post yang kita add. Tambahkan baris yang berwarna biru seperti dibawah ini :

    <b:widget id='HTML13' locked='false' title='Related Post' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.pageType == "item"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <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>
  • Klik Save.
  • Terakhir, kembali lagi ke menu Layout, Drag (klik dan geser) widget related post yang kita buat tadi tepat di bawah widget posting. Hal ini kamu lakukan bila kamu menginginkan related post tersebut muncul di bagian bawah setiap posting/artikel yang kamu buat. Namun jika kamu lebih senang menampilkannya pada sidebar, kamu tidak perlu melakukan langkah terakhir ini.

     
Diposting oleh di 05.26 0 komentar
Label: ,

Rabu, 29 Desember 2010

Cara Backup Blog Di Blogspot

Mungkin posting ini terlalu sederhana atau terlalu mudah, namun bagi sebagian blogger pemula mungkin ini perlu untuk dipelajari. Cara backup blog di Blogspot sangatlah mudah dan nggak ribet, karena Blogspot sendiri udah nyediain fasilitasnya. Backup blog ini bertujuan untuk menjaga kemungkinan akun google kita terhapus atau dihapus oleh google. Bayangin aja gimana kalau akun kita dihapus oleh google. Udah susah payah bikin blog kita jadi bagus, eh tiba-tiba blog kita udah nggak bisa buka.

Nih saya punya sedikit tips bagi para pemula blogger.

  1. Kamu masuk ke dasbor blogger.
  2. Terus kamu pilih tab Setting (Pengaturan).
  3. Pada Setting, pilih sub tab Basic (Dasar).
  4. Di baris Blog Tools, pilih link Export Blog (Ekspor Blog).
  5. Pada window yang muncul, klik aja DOWNLOAD BLOG (UNDUH BLOG).
  6. Tinggal nunggu aja proses Download, selesai. Setelah itu kita bisa menyimpannya di drive mana di komputer kita atau media penyimpanan lain seperti Flasdisc atau Harddisc External.

Nah sampai disitu aja tipsnya. Mudah kan? Silahkan dicoba.

Ingin mempublikasikan posting ini di blog anda? Copy paste aja script di bawah ini :
Diposting oleh di 18.12 0 komentar
Label: ,

Rabu, 08 Desember 2010

Buat CBox Unik Di Blogspot

Ingin buat Cbox seperti ini?





Dan ketika kamu klik hasilnya akan seperti ini :


















Mau tahu...???? Gampang koq caranya....

Nih aku tunjukin caranya ya.....


  1. Pertama-tama kamu buka situs cbox.ws.
  2. Trus kamu daftar di sana.
  3. Isi Cbox name dengan nama kamu. Ingat..!! Hanya huruf dan angka saja yang diperbolehkan, karakter lain seperti - _ + . , % * & dan sejenisnya tidak diizinkan.
  4. Trus isi Email adress dengan email kamu.
  5. Selanjutnya ketik Password dan konfirmasi password tersebut pada Confirm Password.
  6. Isi nama Website dengan nama blog kamu. Mis : syamsuqamaridji.blogspot.com.
  7. Lalu pilih bahasa (language) dan style yang kamu suka.
  8. Beri tanda centang pada I have read and do agree to the Cbox terms and conditions of service.
  9. Terakhir klik Create my Cbox.
  10. Selanjutnya kamu akan diminta untuk konfirmasi akun kamu di email yang kamu daftarkan tadi.
  11. Setelah kamu buka email kamu, klik aja lingk yang seperti ini : http://www.cbox.ws/admin.php?snippet
  12. Setelah kamu klik link tersebut, kamu akan diarahkan pada situs tersebut di tab baru.
  13. Setelah kebuka situs tersebut, kamu login dengan nama dan pasword kamu tadi.
  14. Sekarang kita akan mengatur tampilannya. Di posting ini aku hanya sekedar memberikan contohnya aja....ketika kamu praktekin bisa kamu sesuaikan dengan selera kamu.....
  15. Lanjut nih......kamu klik Menu Look & Feel. Pilih Layout Option. Disini kamu akan diminta untuk mengatur lebar (Width) tinggi (Height) dan tinggi form (Form Height) kamu. Kalo aku sih biarin aja begitu ukurannya....tapi sesuaikan aja dengan selera kamu...ok gan.
  16. Pada Form Layout, kamu ketik berapa jumlah baris tempat untuk mengetik pesan baru. Kalo punyaku, aku pilih 3 baris.
  17. Trus kamu klik Save.
  18. Klik kembali Menu Look & Feel. Pilih Style Presets....silahkan pilih aja mana style yang kamu suka...aku sih gak akan intervensi kamu...hehehe. Caranya klik aja pada gambarnya, lalu klik Confirm yang muncul pada gambar tersebut.
  19. Klik lagi Menu Look & Feel. kali ini kamu pilih Colours & Fonts. Atur aja gimana warna dan huruf yang kamu suka. Preview-nya ada di samping kiri. Setelah selesai memilih warna dan huruf yang kamu suka, klik Apply.
  20. Selanjutnya kamu klik Menu Options. Pilih Posting options, beri tanda centang pada Allow avatars dan Require CAPTCHA. jangan lupa klik Save.
  21. Buka kembali menu Options dan pilih Date Option. Nah disini kamu akan mengatur waktu tampilan. Tujuannya adalah menampilkan tanggal dan waktu dari setiap tulisan yang ditulis. Pada Format, kamu pilih format tanggal yang kamu suka atau bisa juga kamu abaikan karena format standarnya adalah format standar Indonesia. Untuk Time kamu pilih 24 hour. Lalu atur Zone. Lihat pada Example apakah waktu yang ditunjukkan sudah sesuai dengan waktu yang ada sekarang. Jika tidak, silahkan kamu pilih entah itu mau kamu tambah atau mau kamu kurangi, yang penting bisa sesuai dengan waktu kamu sekarang. Setiap kali kamu pilih zona waktu, maka dengan otomatis Example akan berubah. Trus kamu Save.
  22. Nah sekarang kamu pilih Menu Publish.
  23. Pada Step 2, kamu pilih variasinya menjadi Floating.
  24. Trus kamu copy code yang ada di bawahnya dan paste pada Teks HTML di Blog kamu.
  25. Eit..jangan langsung simpan ya, ini belum berakhir gan....karena kode HTML tersebut akan kita modifikasi sedikit.
  26. Setelah kamu paste pada HTML/Javascript, kamu cari kode seperti ini : cbbut.innerHTML = "Close Cbox";. "Close Cbox", bisa kamu ganti dengan kalimat lain sesuka kamu. Contoh : "Tutup" (tanpa tanda petik). Ingat !! Tulisan berwarna merah jangan dirubah, hanya tulisan berwarna biru saja.
  27. Trus cari kode : cbbut.innerHTML = "Open Cbox";, "Open Cbox" kamu ganti dengan kalimat yang kamu suka. Misalnya : "Klik disini untuk chatting denganku" (tanpa tanda petik). Atau bisa juga kamu ganti dengan nama "Buku Tamu" (tanpa tanda petik). Atau sesuka kamu lah.....
  28. Nah, ini langkah yang terakhir....udah bosan ya??? Sabar gan, ini udah langkah terakhir...hehehe.... Silahkan kamu cari kode background-color: #EDF3F7; border: #C3D7E5 dan kode background: #EDF3F7 serta kode border: #C3D7E5. Kamu ganti aja kode warnanya (tulisan berwarna biru) dengan kode warna yang kamu suka. Untuk kode warna bisa kamu lihat di posting aku yang berjudul Tips - Buat Tabel Dengan kode HTML.
  29. Klik simpan.....Selesai....mudah kan...???

Selamat mencoba.... Jangan lupa tinggalkan pesan atau komentarnya ya....!!!
Diposting oleh di 01.50 0 komentar
Label: ,
Langganan: Postingan (Atom)