Showing posts with label Pernak-pernik Blog. Show all posts
Showing posts with label Pernak-pernik Blog. Show all posts

Saturday, December 3, 2011

Blog sahabat

Inilah blog para sahabat ku .,.,!!!!
semoga menambah referensi kalian dalam mencari sesuatu.,.,!!
semoga bermanfaat.,.,!!!
INGIN PASANG LINK ANDA JUGA  chat aj di my soutmix.,.,!!!













·         blog kita











·         MIX Blog




























Friday, December 2, 2011

PEMBUATAN BLOG BARU

Karena banyak yg bertanya tentang apa itu blog, maka agar lebih praktis saya tuliskan saja di sini info dasar blog bagi pemula. Tulisan ini berdasarkan cara pandang saya melihat teknologi blog yg sekarang lagi tumbuh pesat diminati tidak hanya kalangan awam, tapi juga mulai merambah ke kalangan intelektual dan akademisi serta selebritis Indonesia. Di luar negeri, blog sudah berkembang sejak lama. Kita saja yg memang suka ketinggalan.


1. Apa itu blog?

Blog adalah situs pribadi. Berbeda dg website yg setiap memposting harus susah payah memakai kode ekstensi .html .php, .asp, dll, blog merupakan otomatisasi dari semua ekstensi tsb. Sehingga karena sudah diotomatisasi, maka kita-kita semua yg lugu teknologi menjadi ostosmastis dapat memposting apa yg kita inginkan persis seperti kita memposting email ke teman atau ke milis.

Dan karena kemudahan inilah, maka semua orang yg tahu internet dapat membuat blog atau situs pribadi; sama halnya dg memiliki email. Tak heran apabila pemilik blog bervariasi: mulai dari pembantu rumah tangga, ibu rumah tangga, tukang jualan sayur di pasar klewer, cewek-cewek "ramah" di pasar senggol, sampai profesor dan menteri-menteri.

2. Bagaimana cara membuat blog?

Seperti halnya email, buat account dulu di free blog provider (pemberi hosting/domain blog gratis). Yg paling populer adalah http://www.blogger.com. Bagi Anda yg sudah agak melek-huruf teknologi bisa juga buat account di http://www.wordpress.com dan http://blogsome.com. Selain yg dua ini masih banyak penyedia blog gratis yg bisa Anda ketahui kemudian. Ikuti pentunjuk step-by-step ketika mendaftar.

3. Setelah selesai register/sign-up di http://blogger.com, anda dapat mulai memposting/mempublish apapun yg Anda inginkan di blog: mulai dari curhat, puisi, cerpen, tulisan serius sampai yg canda.


CARA MEMBUAT BLOG DI BLOGGER

Membuat blog di blogger.com sangatlah mudah.
Sekarang saya akan tunjukan cara untuk membuat sebuah account baru di blogger.com, yang 100% gratis. Saya merekomendasikan anda untuk membuat blog di blogger.com karena program ini sangat didukung penuh oleh google, sehingga apabila kita membuat blog disini maka google akan cepat mengindeks blog kita. Alhasil blog kita akan muncul dihalaman pencari google.

  • LANGKAH KE-1 (GETTING STARTED)

Silahkan anda kunjungi website www2.blogger.com

  • LANGKAH KE-2 (CREATE AN ACCOUNT)

Setelah page terbuka, silahkan anda klik CREATE AN ACCOUNT setelah anda klik, maka akan muncul form untuk mengisikan nama dan password. Silahkan isi dan anda harus selalu ingat username dan password yang anda isikan.
Jangan lupa untuk menceklist Term of service agreement.
Kemudian klik tombol panah "Continue" untuk melanjutkan ke langkah ke-3

  • LANGKAH KE-3 (NAME YOUR BLOG)

Bagian ini sangat penting, karena nama dari blog anda nantinya akan menjadi sebuah keyword.
TIPS: agar blog anda mudah terindex oleh search engine(mesin pencari), maka alangkah lebih bagusnya jika anda membuat sebuah kesamaan antara addres dan name dari blog anda!
Sekarang klik tombol panah ORANGE"Continue" untuk melanjutkan ke langkah ke-4

  • LANGKAH KE-4 (CHOOSE YOUR BLOG TEMLATE)

Sekarang anda haya tinggal selangkah lagi untuk mempunyai webblog buatan sendiri!!!
Disini anda ditujukan untuk memilih warna dan bentuk dari web anda. Silahkan pilih sesuai dengan topic dan selera anda.
OK jika anda sudah selesai memilih template, sekarang kita akan lanjut ke langkah berikutnya.
Sekarang klik tombol panah ORANGE"Continue" untuk melanjutkan ke langkah ke-5

  • LANGKAH KE-5 (GENERATE YOUR BLOG)

Sekarang blogger akan menciptakan blog anda. Setelah blog selesai dibuat, maka di browser anda akan ada tulisan "Your Blog Has Beeb Created" Klik start Posting untuk untuk membuat artikel/tulisan pertamamu.
Sekarang Isikan Judul artikel kamu pada kolom tile, dan tulis isi dari artikelmu di bawahnya!

SELAMAT!! sekarang anda sudah mempunyai blog sendiri dan sudah bisa dilihat dari penjuru dunia manapun :)

Thursday, November 10, 2011

cara membuat toolbar wibiya dengan mudah

Wibiya Toolbar sebenarnya sudah lama beredar di dunia maya tetapi kok sampai sekarang masih banyak yang belum tau yach... Kemarin ada teman saya yang menanyakan bagaimana caranya membuat Toolbar Wibiya... Terus saya jawab membuat Toolbar Wibiya itu sangat mudah sekali... Nah kali ini saya membuat postingan gunanya untuk mengajarkan kalian semuanya cara membuat Toolbar Wibiya... Yang pertama harus kita lakukan ada 4 cara... Cara tersebut adalah sebagai berikut :
  1. Kita harus mempunyai niat...
  2. Kita harus mempunyai akun blog...
  3. Kita harus banyak-banyak berdoa kepada Allah SWT...
  4. Dan yang terakhir adalah harus... Aduh saya lupa... ^_^
Hehehe kebanyakan bercanda... Tapi syarat yang paling utama itu adalah 4 cara tadi... Khan kalau kita mempunyai 4 cara tadi kita tidak akan bisa berhasil yaaaa ngak??? Oke dech langsung aja yach kita kembali ke materi...
Toolbar Wibiya siapa yang belum mengenal niechhh Toolbar... Kalau kamu belum tau niech Toolbar, nanti akan saya jelaskan...
Toolbar wibiya adalah salah satu toolbar yang mempunyai banyak fasilitas misalnya :
  1. Mempunyai fasilitas kotak pencarian... Sehingga kamu tidak perlu menambah gadget pencarian...
  2. Mempunyai fasilitas radar bawa'an dari Whos.amung
  3. Mempunyai fasilitas tombol back to top (kembali ke atas)
  4. De el el...
Nach jadi semua sudah tau khan fasilitas dari Toolbar Wibiya... Nach karena anda sudah tau jadi izinkanlah saya untuk memberi tahu anda cara memasang Toolbar Wibiya... Oke...
Langsung aja kita kembali ke materi... Yang harus kita lakukan untuk memasang Toolbar Wibiya ke dalam Blog kita adalah sebagai berikut :
  1. Buka dulu link   ini
  2. Kalau sudah kamu klik Get It Now
  3. Nah disitu isikan Nama, e-mail, password, nama blog kamu, alamat blog kamu, bahasa blog kamu...
  4. Kalau suda di isi semua... Klik Next
  5. Pilih tema yang mau kamu pilih... Kalau sudah kamu pilih klik Next
  6. Pilih aplikasi yang mau kamu pasang... Kalau sudah isi dulu kotak isian yang ingin kamu pasang misalnya Feed RSS klik Next... Lihat Gambar
 
     8. Kalau sudah kamu pilih ikon Blogger
 
     9.  Kalau sudah klik Next
 
    10.  Dan lihat apa yang terjadi... Coba lihat blog kamu...
Sebagai contoh coba kamu lihat blog saya ini dibagian bawah... Itu adalah Wibiya toolbar yang sudah saya edit sedemikian rupa sehinga menjadi lebih baik dan rapi...
Dan yang terakhir... Selamat bagi anda yang berhasil... Dan bagi anda yang belum berhasil mungkin Allah sedang menguji kesabaran anda... Jangan Menyerah himbauan dari D'Masiv...

Selamat Mencoba


Sumber : http://sutry95.blogspot.com/2011/08/cara-membuat-toolbar-wibiya-di-blog.html#ixzz1dNHmztKZ
^^Jangan Lupa Mencantumkan Link Ini. Jadilah Blogger Yang Beretika^^

Wednesday, November 9, 2011

Membuat read more di blog

cara membuat read more merupakan  artikel tutorial yg paling diminati oleh blogger pemula yang baru membuat blog di blogspot, karena  Sebuah artikel yang panjang akan banyak memakan tempat di halaman utama sebuah blog, sehingga artikel lain yg ditulis sebelumnya akan jarang dibaca pengunjung karena mereka harus menscroll halaman kebawah terlebih dahulu. Nah, pada Blog kita kali ini saya akan ikut2an membuat tutorial bagaimana cara memotong artikel panjang tersebut dengan membuat read more .. atau baca selanjutnya ..


Membuat read more di blog
  • 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 berikut sebelum tag </head> atau tepat sesudah kode } ]]></b:skin>seperti dibawah ini :
  • <style>
    <b:if cond='data:blog.pageType == "item"'>
    span.fullpost {display:inline;}
    <b:else/>
    span.fullpost {display:none;}
    </b:if>
    </style>

  • Selanjutnya mengatur supaya postingan terpotong, cari kode <p><data:post.body/></p> dalam template anda dan tambahkan kode berikut tepat dibawahnya:
  • <b:if cond='data:blog.pageType != "item"'>
    <a expr:href='data:post.url'> Read More..</a>
    </b:if>

  • Nah supaya terpotong, setiap kali anda menulis artikel posting, klik pada bagian artikel dimana anda  pengen tulisan Read More.. muncul, lalu  ketik <span class=”fullpost”> kemudian lanjutkan sisa artikel  sampai selesai, akhiri dengan mengetik  </span>.  Untuk menmbahkan kode ini, ketika menulis artikel, anda harus dalam mode Edit HTML bukan Compose
  • Tulisan Read More.. seperti yang berwarna merah pada kode diatas, bisa anda ganti dengan tulisan lain seperti Baca Selengkapnya.. atau Lanjut Baca..

Friday, November 4, 2011

Cara Membuat Tulisan Address Bar Berjalan

Selama ini kita hanya bisa membuat tulisan berjalan dengan merquee di area blog,seperti di postingan,sinebar,footer,header,dll. Tapi,untuk kali ini sobat bisa menerapkannya di address bar Blog sobat. Tulisan ini berjalan tanpa hentinya di address blog sobat sehingga tidak terkesan monoton dan pengunjung pun tidak akan kabur.


Sobat bisa mengganti tulisan yang berjalan sesuai dengan keinginan sobat.
sulitkah untuk membuat nya ???? Untuk sobat,ini tidak terlalu sulit kita hanya menambahkan sedikit kode CSS di template kita. Dari pada penasan langsung aja ya di praktekkan.
 Langkah Membuat Address bar  berjalan :
1. Sopasti sobat harus LOg In dulu di Blogger.com.
2. Masuk ke menu Tata Letak >Edit Html
3. Cari Kode </head> dan Copy script di bawah ini kemudian pastekan tepat di atas kode </head>

<script type='text/javascript'>
//<![CDATA[
msg = " --- welcome to my blog--- ";
msg = " --matur nuwun sanget--" + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",100);
}
scrollMSG();
//]]>
</script>

Ket :

  • Lihat Tulisan yang berwarna biru,sobat bisa menggantinya sesuai keinginan sobat dan itulah tulisan yang akan muncul di Address bar sobat.

4. Simpan Template.

Gampang kan.,..,,Sekarang sobat bisa melihat hasilnya di Blog Sobat.

Wednesday, November 2, 2011

Cara Bikin Gambar Bergerak (Marquee Image)

Dulu kursus blog pernah posting mengenai text bergerak (marquee). Eh...ternyata kurang lengkap tuh postingan sampai ada yg nanya "gimana kalo bikin gambar bergerak...??". Yawda...buat temen2 sekalian apa sih yang ngga. Berikut contoh untuk gambar bergerak : seperti luffy yang lagi lari tuch Nah....buat yang pengen bikin gambar bergerak seperti dibawah, ikuti langkah - langkahnya sebagai berikut :

  • Seperti biasa login di blogger, lalu masuk ke layout kemudian page element.
  • Klik add new page element --> HTML/JavaScript. Untuk letaknya terserah anda, mau diletakkan di sidebar, footer, atau dimana saja juga bisa.
  • Copy Paste kode dibawah ini :
    <marquee onmouseout="this.start()" direction="up" align="center" scrollamount="2" onmouseover="this.stop()" width="100%" height="100"><img src="http://mizwar.blog.googlepages.com/logo.gif" alt=""/><img src="http://static.technorati.com/pix/fave/btn-fave2.png" alt="" /></marquee>
    Text yg berwarna merah adalah kode HTML untuk gambar. Untuk mengganti gambarnya, silahkan ganti text yg berwarna merah tebal dengan url gambar anda. Text yg berwarna hijau tebal, adalah arah bergerak gambar. Untuk mengganti arahnya, silahkan ganti kata "up" dengan "down", "left" atau "right".
  • Save dan Selesai..
Perhatian :
  1. Gambar bergerak tersebut bisa juga disimpan di postingan. Caranya, ketika memposting klik edit html lalu masukan kode seperti diatas.

Mengetahui Seberapa Berat Blog Mu

Ternyata menambah terlalu banyak aksesories bisa menambah berat blog kamu loh, jadi lama bgt dibuka nya. Banyak cara buat ngecek seberapa berat blog kamu, nih ada salah satunya klik aja This klo hasilnya lebih dari 150 kb, buru2 deh apus aksesoris yang gak perlu kayak jam, kalender dan sebagainya.

Pasang Gambar Animasi Bergerak

 Assalamu'alaikum wr. wb
Gambar animasi mampu menarik perhatian bagi pengunjung blog. Bagi panjenengan (bhs Jawa yang artinya anda) yang ingin pasang gambar animasi pada blog, silahkan ikuti langkah-langkah berikut ini
.
  1. Kunjungi situs gambar di sini dan cari gambar yang disukai.
  2. Gambar sudah didapatkan, silahkan di copy alamat URL nya.
  3. Masuk ke Blog dengan ID panjenengan.
  4. Klik Tata Letak.
  5. Klik Edit HTML.
  6. Klik kotak kecil Expand Template Widget.
  7. Carilah kode ]]></b:skin>
  8. Sebelum kode tersebut di atas, tambahkan script berikut ini :
#gambar-animasi {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight);
_left:expression(document.documentElement.scrollLeft+
document.documentElement.clientWidth - offsetWidth); }

9. Text yang berwarna merah adalah menunjukkan posisi gambar .
10. Silahkan ganti sesuai keinginan , (kiri=left, kanan=right, atas=top, bawah=bottom)
11. Cari lagi kode </body>
12. Sebelum kode tersebut di atas, tambahkan script berikut ini:

<div id="gambar-animasi">
<a href="http://rozytop.blogspot.com">
<img src="http://www. gifs.net/Animation11/Animals/Penguins/funky_penguin.gif" border="0" /></a>
</div>

13. Ganti http://rozytop.blogspot.com dengan alamat blog panjenengan
14. Ganti juga http://www.gifs.net/Animation11/Animals/Penguins/funky_penguin.gif dengan alamat URL gambar pilihan.
15. Klik Pratinjau untuk melihat hasil kerja panjenengan
16. Bila sesuai keinginan, klik Simpan Template
17. Selesai


Tips cara mendapatkan alamat URL, silahkan anda klik kanan pada gambar yang anda inginkan, kemudian klik Properties, kemudian copy alamat URL, yang ditampilkan pada Address/Location




Selamat mencoba, semoga bermanfaat
Wassalamu'alaikum wr. wb

Membuat Buku Tamu Bersembunyi

Buku tamu yang biasa kita ambil dan langsung kita aplikasikan ke dalam blog bisanya masih berupa tampilan yang biasa saja, artinya ketika blog terbuka maka buku tamu akan langsung terlihat di halaman utama. Ada modifikasi yang lain yaitu buku tamu bersembunyi disamping tampilan blog halaman utama. Baru muncul ketika menu buku tamu di-klik. Cara buatnya bagi pemula sebagai berikut:

masuk ke blogger
  • pilih Rancangan (design)
  • pilih tambah Gadget(Add a Gadget)
  • pilih HTML/JavaScript, ada tampilan seperti ini:





  • Kopi kode di bawah ini dan letakkan pada konten ( Kotak yang besar sperti pada gambar di atas)

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i627.photobucket.com/albums/tt356/hanjoyo/BUKUTAMU.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #0000ff;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<!-- Ganti ini dengan kode buku tamu kamu -->

<br/>
Mau punya buku tamu seperti ini ?<br/>
Klik di >>
<a href="http://

"> Rhozy Tutorial Blogger untuk bersama

</a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>



Simpan dan semoga berhasil

pasang background pada posting

Sebuah gambar atau image anda dapat pasang pada background masing-masing posting.Dengan demikian akan menambah keindahan blog anda.Misalnya, pada posting dengan kategori Tutorial Blog anda pasang gambar kartun.
Sedangkan pada posting dengan kategori Islam anda pasang gambar berupa tulisan arab.Terserah anda gambar apa saja yang ingin ditampilkan sebagai background postingan blog anda.Contoh gambar background posting seperti pada postingan ini.Untuk memasangnya ikuti langkah-langkah berikut ini.
1.Login pada blogger.
2.Klik Setting pada Dashboard anda.
3.Pada Setting klik Formating.
4.Pada bagian kolom Post Template, masukkan kode berikut ini



<div style="background:url(URL Image) no-repeat;">

Letak Postingan

</div>

5.Setelah itu Save Setting.
Selanjutnya setiap anda akan membuat postingan, gantilah kalimat URL Image dengan alamat URL image anda.Gantilah kalimat letak postingan yang berwarna biru dengan isi dari postingan anda, kemudian Publish.

Tips:
  • Gunakan warna huruf yang lebih terang dari gambar backgroundnya agar mudah dibaca.
  • Kalau bisa gunakan gambar yang lebih transparan.

Tuesday, November 1, 2011

Mengubah gambar background blog dengan gambar sendiri

Buat teman-teman yang masih pemula, mungkin ada yang belum tahu cara mengganti background blog. Sebenarnya anda bisa mengubah background blog dengan menambah sedikit script CSS ke template blog.


Sebagai Catatan:
Saya menguji coba template ini pada template bawaan blogger yaitu: "Denim"
Mungkin jika menggunakan template lain tidak berfungsi optimal, karena setiap template mempunyai struktur dan syntax script yang berbeda.

Jika tertarik mengganti background blog dengan gambar sendiri , bisa ikuti prosedur berikut:
1. Anda harus mengupload gambar yang akan digunakan menjadi background blog, bisa upload di situs hosting file image gratis seperti photobucket. Jika belum punya account disana bisa mendaftar di photobucket.com atau tinypic
Setelah mengupload gambar anda akan mendapakan url gambar tersebut.
(Catatan: gambar yang diupload sebaiknya ukuran filenya kecil, usahakan tidak melebihi dari 10 kbyte) agar saat membuka blog dapat cepat loadingnya, saya sarankan anda upload gambar ke tinypic)

2. Atau jika ingin mencoba gambar background yang saya punya bisa pakai url berikut:
http://i725.photobucket.com/albums/ww252/papao74/bg_blogku.gif
http://i37.tinypic.com/apb69k.jpg
http://i36.tinypic.com/n1bdcz.jpg
(pilih salahsatu untuk ujicoba)

3. Selanjutnya masuk ke account blogger:
Pilih dasboard -> Rancangan -> Edit Html



4. cari kode berikut:

body {
background: $bgColor;

5. Masukkan kode berikut di bawahnya:

background: #642D8B url('url gambar anda' ) fixed repeat top left;

Hasilnya seperti di bawah ini

body {
background: $bgColor;
background: #642D8B url('url gambar anda') fixed repeat top left;

6. Agar background di samping header berubah, maka anda harus mengubah kode berikut:

#header-wrapper {
margin:0;
padding: 0;
background-color: $headerCornersColor;
text-align: $startSide;

Ubah menjadi:

#header-wrapper {
margin:0;
padding: 0;
background: #642D8B url('url gambar anda') fixed repeat top left;
background-color: $headerCornersColor;
text-align: $startSide;

catatan;
url gambar anda diganti dengan url gambar yang telah anda upload, atau diganti dengan url gambar yang saya pakai:
http://i725.photobucket.com/albums/ww252/papao74/bg_blogku.gif

6. Simpan template