Home Design and Ideas

Belajar AlQuran Online atau AlQuran Digital sekarang sudah bukan jadi bahan langka lagi bukan cuma lewat komputer bahkan dengan media HandPhone juga sudah tersedia, berikut ini saya menampilkan contoh widget AlQuran Online yang sudah saya pasang seperti dibawah ini. Anda tinggal memilih surat dan menulis kata kunci untuk terjemahan yang hendak dibaca : Bagi yang ingin menampilkan widget AlQuran Online silakan copy script dibawah ini : <iframe frameborder="0" src="http://quran.bacalah.net/content/home/index.php" style="border: 4px inset green; height: 600px; padding: 4px 4px 4px 4px; width: 100%;"></iframe> Ganti kode border: 4px inset green ; height: 600px ; width: 100% secara berurutan 4px = lebar border ; green = kode warna ; 600px = tinggi widget ; 100% = lebar widget, silakan diganti sesuai kebutuhan. Semoga Bermanfaat...!

Menampilkan menu tambahan pada side bar bisa merupakan alternatif bagi blogger agar pembaca bisa melihat/membaca artikel yang ada secara mudah, Pada umumnya penempatan artikel yang terkait diletakkan  dibawah posting/artikel, dengan berbagai modifikasi, ada yang menambahkan icon disamping judul artikel, ada yang membuat related post dengan fungsi scroll dan ada yang membuat related post tampil dengan image, kali ini saya ingin berbagi mengenai cara membuat related post tampil di sidebar seperti di blog ini. caranya tidak sulit dan bahkan mudah untuk dilakukan. Ikuti langkah Berikut : Login ke account blogger anda, klik rancangan/layout lalu klik edit HTML Jangan lupa centang expand widget templates untuk mengedit template secara keseluruhan masukan kode dibawah ini sebelum tag </head>     <script type="text/javascript">     //<![CDATA[     var relatedTitles = new Array();     var relatedTitlesNum = 0;     var relatedUrls = new Array();     function re

Untuk mempermudah dan memberikan akses yang nyaman pada pengunjung adalah dengan memanfaatkan widget label yang merupakan standart blogger, mungkin ini sudah tidak asing lagi bagi rekan blogger. Tapi standart blogger yang ada bila kita klik label yang muncul adalah posting pada label beserta dengan image dan uraian singkat dari isi posting. Sekarang kita akan membuat tampilan yang muncul saat klik label hanya judul posting saja sehingga bisa tampak lebih menarik dan sederhana. Kita langsung ke TKP saja biar jelas Langkah Pertama Login ke akun Blogger kamu. Dari halaman dashboard, pilih Edit HTML. Pada halaman Edit HTML, centang "Expand Template Widget", cari kode berikut <!-- posts --> <div class='blog-posts hfeed'> <b:include data='top' name='status-message'/> <data:adStart/> <b:loop values='data:posts' var='post'> <b:if cond='data:post.dateHeader'> <h2 class='date-heade

Mempublikasikan blog bukan sekedar blogwalking, follow blog lain dan kasih komentar pada blog / website lain tapi yang perlu adalah identitas yang kita tinggalkan pada media tersebut. Pada beberapa kasus ada beberapa teman blogger yang mungkin lupa, disengaja atau tidak tahu banyak yang tidak melakukan setting yang komunikatif pada profil blogger mereka, sehingga waktu melakukan follow pada blog lain dan pada saat dilihat profil-nya tidak nampak identitas blog mereka, tentu ini akan sangat merugikan karena dengan kita menampilkan identitas blog kita akan bisa menambah traffick apabila ada yang melihat profil kita lewat follower widget. untuk melakukan setting profil blogger ikuti cara2 berikut : Login blogger.com Masuk ke menu edit Profil   Lihat tampilan berikut ; masuk ke item " select blogs to display ", ini adalah item untuk memilih blog mana yang akan kita tampilkan pada profil kita. Simpan setting dan kembali ke dasboard -----> lihat tampilan profil kamu untu

Mempercantik tulisan pada posting merupakan cara yang paling baik untuk menambah traffick, karena pada prinsipnya sebagus apapun blog yang kita design yang menjadi penentu adakah ISI POSTING Mempergunakan fasilitas blockquote adalah salah satu alternatif yang bisa dipakai untuk melakukan penekanan atau menunjukan kutipan pada artikel yang kita tulis. Blockquote sebenarnnya sudah ada pada blogger ( lihat tanda kutip " pada menu posting baru ) sesuai dengan standart template masing masing blog. Untuk melakukan perubahan pada blockquote standart bisa dilakukan dengan cara : Modifikasi blockquote standart template yang ada Untuk lebih jelasnya silakan lihat uraian berikut ini : CARA PERTAMA, Modifikasi blockquote standart template yang ada Login Blogger.com Masuk ke Setting - Design - Edit HTML Cari kode   .post blockquote  .........  dst   } .post blockquote:hover .........  dst  } .post blockquote p .........  dst  } ( ini adalah kode standart blockquote bis

Membuat variasi dalam blogger memang menyenangkan, salah satunya adalah membuat  Float Image ( gambar melayang ) dan teks pada Blogger. Sebenarnya caranya mudah dan sederhana, trik ini sudah banyak dimuat dalam banyak blog tapi tidak ada salahnya aku coba posting kembali agar blog ini infonya jadi lebih lengkap. Keuntungan dari trik ini kamu bisa pakai selain sebagai variasi juga sebagai media promosi karena bisa kamu isi dengan berbagai kode script advertise selain image dan teks. Langkah selanjutnya Klik Page Element Klik Add Gadget   Klik plus button (+) for HTML/JavaScript. (img) Copy and paste kode dibawah ini <style type="text/css"> #gb{ position:fixed; _position:absolute; top:0px; right:0px; clip:inherit; z-index:+1000;} } * html #gb{position:relative;} .gbcontent{ float:right; border:0px solid red; background:transparent url(http://i864.photobucket.com/albums/ab206/kibagus/animation/indonesIAFLAG.gif) no-repeat ; p

Script effek Neon Boks ( menyala ) pada teks merupakan kode HTML yang berfungsi untuk membuat teks menyala secara bertahap dengan warna tertentu, penggunaan cara ini cukup mudah dan sederhana. Langkah pertama Klik Page Element Klik Add Gadget   Klik plus button (+) for HTML/JavaScript. (img) Copy and paste kode dibawah ini <h3> <script language="JavaScript1.2"> var message=" Selamat Datang " var neonbasecolor=" black " var neontextcolor=" yellow " var flashspeed= 50 //in milliseconds ///No need to edit below this line///// var n=0 if (document.all||document.getElementById){ document.write('<font color="'+neonbasecolor+'">') for (m=0;m<message.length;m++) document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>') document.write('</font>') } else document.write(

Menu horizontal/vertikal memang dibutuhkan karena bisa membuat blog kamu menjadi tampak lebih proffesional dan salah satu alternatif dimana kamu bisa menghemat tempat dengan menampilkan label atau link URL kamu sesuai dengan tema / label blog kamu. Disini kamu bisa membuat menu dengan langkah sederhana dan sudah tentu hasilnya juga sederhana, tapi dengan sedikit kreativitas kamu bisa membuat menu ini jadi tampil lebih bagus. Nah..! kalau kamu pingin ikuti langkah2 berikut : Langkah Pertama Login ke akun Blogger kamu. Dari halaman dashboard , pilih Edit HTML . Pada halaman Edit HTML , cari kode ]]></b:skin> pada script template blog kamu. Tekan Control F atau F3 untuk mencarinya. Copykan script berikut dan letakkan di atas kode ]]></b:skin> tersebut.. /* Menu Horizontal ----------------------------------------------- */ .menuhorisontal{width:100%; overflow:hidden; border-bottom:0px solid #000000;} .menuhorisontal ul{margin:0; padding:0; padding