Tampilkan postingan dengan label Trik Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Trik Blog. Tampilkan semua postingan

Sabtu, 07 Juli 2012

Cara Memasukan Musik Di Blog Dengan Auto Play


Cara Memasukan Musik Di Blog Dengan Auto Play. Sekarang Hujangede Online akan memberikan artikel totorial mengenai musik pada blog. Trik ini akan membuat blogspot semakin keren dengan musik. Penasaran?. . . .
Cara Memasukan Musik Di Blog Dengan Auto Play
Pada dasarnya Cara Memasukan Musik Di Blog Dengan Auto Play Ini supaya pengunjung blogspot tidak sepi. jika anda tertarik ikuti langkah - langkah dibawah ini :
1. Masuk Ke link ini divine music
2. Pilih Kategori 6 diantaranya > Klik Kategori
3. Setelah pilih kategori > cari nama band yang kamu mau disimpan di blogspot mu > dan pilih juga judul musik nya
4. setelah ketemu judul musik nya copy code HTML.
setelah di copy HTML nya tinggal paste di Blogspot mu :
1. login ke blogger
2. Langsung ke tata letak > Tambah gadget > Pilih HTML/JavaScript
3. pastekan code HTML yang tadi kamu copy di kolom HTML/JavaScript.
4. Klik Simpan. Dan liat hasilnya


! Sekarang sudah mengerti Cara Memasukan Musik Di Blog Dengan Auto Play. dengan ini blogspot kapten sudah ada musik nya dan sudah menjadi lebih bagus. Selamat mencoba dan semoga bermanfaat.



Jumat, 22 Juni 2012

Pasang Facebook Comment dengan Reply Untuk Setiap Postingan Blogspot

Pasang Facebook Comment di Postingan Blogspot .Pasang Facebook Comment dengan Reply Untuk Setiap Postingan Blogspot . Sekarang facebook comment makin bagus lagii, facebook menambah sistem baru plugin facebook comments yang di pasang untuk blogger/blogspot. facebook comment ini seperti yang dahulu di posting (artikel : Pasang Kotak Komentar Facebook di blogger anda ) hanya saja facebook comment yang saya share sekarang lebih canggih . Berbeda dengan plugin comment facebook sebelumnya yang tidak ada reply . plugin facebook comments sekarang pengunjung bisa saling reply dan akan ada pemberitahuan tiap ada yang reply di komentar anda langsung ke facebook anda seperti gambar di bawah ini :
Pasang Facebook Comment dengan Reply Untuk Setiap Postingan Blogspot
Langsung saja bila anda ingin memasang facebook comment dengan refly ikuti saja cara - caranya :

Instalasi
1. Silakan buat  aplikasi disini : Facebook developer page
Pasang Facebook Comment dengan Reply Untuk Setiap Postingan Blogspot
  • NAMA SITUS : Masukan Nama Situs Blog Anda (Contoh: Hujangede Online)
  • URL SITUS : Masukan Url situs/blog anda dengan beri backslash "/" (Contoh : http://hujangede.blogspot.com/ )
  • Lokale : Pilih Bahasa Indonesia Saja
  • Clik Create App
2. Ambil ID Aplikasi Copy - Paste dulu ke Notepad
3. Sekarang LoginLah ke Account Blogger sobat
Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates. Cari code berikut : <data:post.body/> jika anda menggunakan read more akan ada dua kode bahkan ada yang tiga, letakan setelah/sesudah kode <data:post.body/> yang kedua.

<b:if cond='data:blog.pageType == &quot;item&quot;'>  <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=xxxxxxxxxxxx&amp;xfbml=1"></script><fb:comments expr:href='data:post.url' numposts='5' width='600'/>  </b:if><div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'><b> by <a href='http://hujangede.blogspot.com/2011/04/pasang-facebook-comment-dengan-reply.html' target='_blank' title='Facebook Comment'>Facebook Comment seperti ini , Mau ?</a></b></div>

  • Warna Merah ke 1 (xxxxxxxxxxxx) ganti dengan ID Aplikasi Anda yang tadi dicopy di Notepad
  • Warna Merah ke 2 (5) Adalah jumlah posting yang akan ditampilkan
  • Warna Merah ke 3 (600) Adalah lebar Gadget Komentar anda
  • Silakan Simpan Template anda
Menghubungkan Facebook Plugin dengan Profil Facebook 
Anda
Plugin ini berfungsi untuk orang yang membalas komentar Anda akan ada pemberitahuan ke Facebook Anda
4. Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates. Cari code berikut : <b:skin><![CDATA[/ 
5. Silahkan pasang meta berikut ini di atas kode yang no 4
<meta content='profilID' property='fb:admins'/><meta content='aplikasiID' property='fb:app_id'/>
  • Warna Merah ke 1 (profilID) silahkan masuk ke tab Profil di facebook, perhatikan URL yang tertera di Address bar semisa : http://www.facebook.com/profile.php?id=100000404573101 yaang berwarna merah adalah id profil Anda, bila id profil anda sudah anda ganti dengan nama seperti http://www.facebook.com/lintinkperozbarzes ,anda bisa menemukan id dengan nomor seperti yang diatas melalui foto profil Anda. silahkan anda masuk ke profil facebook Anda, kemudian klik kanan di foto profil Anda dan pilih copy link location / salin alamat tautam.                                                         paste link tersebut ke Notepad dan Anda akan mendapatkan url semacan berikut ini : 
http://www.facebook.com/media/set/fbx/?set=a.148878355135649.30297.100000404573101
           yang berwarna merah adalah ID facebook profil Anda , dan pastekan di profilID

  • Warna Merah ke 2 (aplikasiID) id aplikasi sudah anda ketahui yang di atas yang no 2
Nah.sekarang anda sudah tau profil ID dan Aplikasi ID.

Admin Setting

Dengan sistem baru ini,anda dapat menyesuaikan pengaturan untuk komentar facebook anda.
setelah plugin facebook comment,widget fecbook comment terpasang silahkan untuk mengecek facebook comment dengan melihat salah satu artikel anda dan scrool ke bawah sampai anda melihat facebook comment yang anda pasang tadi, silahkan anda klik link Settings di bagian kanan atas gadget tersebut. 
ada beberapa settings sebagai berikut :
Moderators : anda bisa menambahkan beberapa orang untuk memoderasi komentar yang masuk ke blog Anda.
Moderation Mode : secara default komentar akan langsung muncul dan bisa dilihat setiap orang. Jika ingin komentar muncul hanya setelah moderasi silahkan pilih opsi kedua: Let me approve each comment before it is shown to everyone.
Blacklisted Words Anda bisa filter kata-kata yang tidak ingin masuk ke komentar Anda. Secara default ini akan mengikuti aturan penulisan kata di facebook, tapi Anda bisa menambahkan kata-kata yang akan diblokir dengan memilih Create Custom List
Other Login providers, silahkan centang agar pengunjung mempunyai pilihan untuk comment dengan berbagai pilihan login.
Grammar Filter, pembetulan ejaan otomatis.
Comments Composer, adalah pilihan untuk menampilkan form pengisian komentar.



Moderator View dan Comment Moderation Tool
Silahkan klik tombol Moderator View di bagian kiri atas gadget facebook comments Anda. Otomatis tampilan gadget akan berubah menjadi halaman untuk moderasi komentar. Di halaman ini Anda bisa sembunyikan komentar yang tidak Anda inginkan atau ban alias menolak pengunjung yang tidak Anda sukai agar tidak bisa komentar di blog Anda.

Yah.selesai membuat Pasang Facebook Comment dengan Reply Untuk Setiap Postingan Blogspot postingan  lumayan panjang postingannya Semoga Bermanfaat.

Senin, 23 Mei 2011

Cara Pasang Widget Melayang Di Pojok Blog

Cara Pasang Widget Melayang Di Pojok Blog - ini melainkan untuk membuat Widget - widget selalu di lihat oleh pengunjung dan tidak perlu memakai scrool ke bawah atau ke atas dan widget ini secara otomatis akan selalu berada di Pojok bawah kanan atau kiri, dan juga bisa di atas kanan atau kiri, lihatlah di blog KomMukti juga ada Widget Melayang Di Pojok Blog yaitu Widget facebook fans, coba anda scrool ke atas atau kebawah,, akan terus menempelkan.
Manusia, Melayang, Terbang, Cara, Pasang, Widget, Blog
Artikel ini juga berhubungan dengan artikel Trik Blog sebelumnya yaitu :
jangan lupa di baca juga ya. Cara Pasang Widget Melayang Di Pojok Blog tidak rebet kok untuk cara pemasangannya yang blog - blog lain pernah posting, dan membuat widget melayang dalam artikel ini tidak memakai css , dan hanya memakai code simple saja,,..
untuk demo nya ada di blog ini yang Fans facebook melayang...
oke bila anda ingin membuat widget malayang juga silahkan ikuti step2 di bawah ini.

  1. Login Ke blog > pada dasboard blog kamu pilih Design > Page Element > Add Gadget dan pilih JavaScript/HTML.dan masukan kode di bawah ini
<div style="position: fixed; bottom: 0px; right: 10px;width:150px;height:130px;">Masukan kode Widget anda disini</div>

  • Silahkan warna yang berwarna biru bisa di ganti dengan Left, Buttom, Top Dll.
  • Untuk yang berwarna merah silahkan ganti dengan Widget yang kamu mau buat melayang
  2. Jika sudah selesai simpan lah dan lihat hasilnya

sangat mudah kan, trik blog ini dalam judul (Artikel : Cara Pasang Widget Melayang Di Pojok Blog selesai semoga bermanfaat.

Sabtu, 14 Mei 2011

Yahoo Messenger (YM)

Status Yahoo Messenger Di Blog - Hujangede Online posting lagii nih, sudah lama gak posting karna beberapa hari kemarin blogger maintence (perbaikan), dan sekarang bisa posting lagii deh , karna , blogger sudah maintence nya, hhe , dan sekarang Hujangede akan posting artikel Status Yahoo Messenger Di Blog ,

Apa sih Yahoo Messenger itu?
Yahoo Messenger (sering disingkat “Y!M” atau “YM”) merupakan program pengirim pesan instan populer yang disediakan oleh Yahoo.

Yahoo Messenger tersedia secara gratis dan dapat diunduh serta diakses menggunakan Yahoo! ID yang biasa digunakan untuk mengakses layanan Yahoo yang lainnya, seperti Yahoo! Mail. Penggunaan ID ini juga mengakibatkan pengguna dapat langsung diberitahu bila mendapat sebuah e-mail.

Yahoo telah mengumumkan kerjasama dengan Microsoft untuk bergabung dalam jaringan instant messenger. Hal ini mengakibatkan Yahoo! Messenger dapat berhubungan dengan layanan .NET Messenger milik Microsoft. Layanan ini mulai berfungsi sejak 13 Juli 2006.

Dan sekarang Yahoo Messengger sudah meliris Yahoo Messengger 11 Beta . Bagi yang mau Download Clik Link Di Bawah Ini.
Yahoo Messengger 11 Beta : Download



Yahoo Messenger Di Blog
Apa Sih Pentingnya Status Yahoo Messengger Di Blog?
Apa Sih Gunanya?
Yahoo Messengger Di blog berguna untuk pengunjung bila ingin ngobrol dengan admin tentang pembelian,Bisnis Blog, DLL. dan mempermudah bertanya ke pada pemilik blog mengenai hal yang kurang paham atau ada hal-hal yang kurang jelas karena data tidak lengkap.

Bagi pemilik blog ,status yahoo mesengger tentu berguna untuk mengakrabkan dengan pengunjung blog tersebut dan juga menunjukkan bahwa blog tersebut dirawat,atau ada yang mau ditanyakan tentang posting .
Dan bila anda ingin memasang Yahoo Messenger Di Blog Silahkan Masuk Artikel :

Artikel : Cara Membuat Status YM di Blog



Cara Memasang Widget YM Di Profil
Apa Sih Pentingnya Cara Memasang Widget YM Di Profil ?
Widget YM Di Profil ini penting nya supaya pengunjung bisa tau siapa Pemilik Status YM Di blog itu, dengan menambahkan Widget YM Di Profil pengunjung bisa tau , bahwa pemilik Status YM Di Blog Itu Adalah yang tertera Di Profil. dan dengan cara memasang widget ym di profil anda tidak akan boros widget , jadi anda hanya pasang widget YM ditempatkan Di Profil.
Bagi Yang Mau pasang widget YM Di Profil Masuk Link Di Bawah Ini.

Artikel : Cara Memasang Widget YM Di Profil

Akhirnya Postingan Yahoo Messenger (YM) Selesai Dan Semoga Bermanfaat

Sabtu, 07 Mei 2011

Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger

Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger - Hujangede Online memberikan trik blog lagii ni, yang sebelumnya telah posting juga artikel tentang trik blog (Artikel : Cara Membuat Menu Navigasi Inverted Down Di blogspot ) yang berhubungan dengan navigasi Blogspot/blogger, dan saya juga telah posting juga (baru kemaren) artikel tentang widget blog (Artikel : Kumpulan Widget Blogger Indonesia ) dan ini adalah widget - widget blogger indonesia , apakah kamu blogger indonesia pakailah widget Kumpulan Widget Blogger Indonesia ini supaya pengunjung dari luar indonesia bisa mengetahui blog anda berasal dari indonesia, pasang ya. oke lanjutkan lagii ke artikel Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger , Popular Posts Dengan Gambar ini bukan gambar tampilan seperti biasa , tapi ini dengan tambahan Script yang di simpan sebelum kode ]]></b:skin> . penasaran??. bila penasaran liat lah demo gambar dan demo web dibawah ini .
Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger

Bila kurang jelas ada demonya , tapi tidak saya pasang di blog ni , clik link dibawah ini:
(Silahkan Clik Iklan yang lewat)

Ingin juga membuat nya silahkan ikuti cara - caranya di bawah ini :
Cara pembuatan : Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger
Step - Step :
 1. Log In ke Blogger
 2. Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates

 3. Cari Kode ]]></b:skin> Dan simpan kode CSS dibawah ini tepat diatas Kode tadi .

/*-----------------------------------------
  {Hujangede}  Popular Post  {Online}
-------------------------------------------*/
.item-thumbnail img {
margin: 2px 20px 0 0;
padding: 4px;
float: left;
       -moz-border-radius: 4px;
       -webkit-border-radius: 4px;
background-color: #24282a;
border: 1px solid #383c3e;
text-align: left;
        width:105px;
        height:105px;
        opacity:0.6;filter:alpha(opacity=40)
}
.item-thumbnail img:hover{-moz-opacity:100; filter:alpha(opacity=100); opacity:100;}
.item-snippet {
        display:none;
}
.item-title{display:none;}
.popular-posts {
width: 290px;
float: left;
margin:0 0 10px 0;
}
.popular-posts ul {
width: 290px;
margin: 0px 0 0 0;
padding: 0;
float: left;
list-style: none;
}
.popular-posts ul li {
width: 105px;
height: auto;
margin:0 10px;
float: left;
display: block;
font: normal 13px Arial, Helvetica, sans-serif;
color: #000;
line-height: 22px;
background: none;
}
 4.  dan clik simpan template
 5.  silahkan menuju Layout ( Rancangan ) dan tambah Gadget Populer Posts
 6. Dan simpan, liat hasilnya .

!Hore Postingan Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger beres juga , semoga bermanfaat.

Jumat, 29 April 2011

Cara Membuat Menu Navigasi Inverted Down Di blogspot

Cara Membuat Menu Navigasi invertedshiftdown Di blogspot - Dengan membuat Menu Navigasi Ini blog Anda akan terlihat lebih menarik, keren dan akan terlihat unik di para mata pengunjung dengan Menu Navigasi Invertedshiftdown , dan ini adalah artikel pertama Hujangede Online tentang Membuat Navigasi Di Blogspot/Diblogger, dan Menu Navigasi Inverted Down ini saya pasang di blogger q yang 1 lagii, dan menu ini saya tidak pasang di blog ini, sebelumnya juga Hujangede Online telah memposting artikel tentang Tutorial blog yang sebelumnya (Artikel : 20 Blockquote Keren Untuk Blogspot ) Dan (Artikel : Cara Pasang Blockquote Di Blogger ) dan sekarang kita lanjutkan lagii ke Cara Membuat Menu Navigasi Invertedshiftdown Di blogspot , dan ini lah contoh menu nya liat dibawah bro.
Cara Membuat Menu Navigasi Inverted Down Di blogspot

Gimana Bro setelah melihat gambar contoh menu di atas keren kan, dan saya juga memberi demo bagi yang kurang jelas dengan gambar di atas , Dan ini Blog DEMO adalah blog saya juga , clik demo dibawah ini :
Sudah liat kan , gimana menurut anda Menu Navigasi Inverted Down Ini ?
Oke bila anda ingin membuat Menu Navigasi Inverted Down ikuti cara- cara dibawah ini :

Cara pembuatan (Cara Membuat Menu Navigasi Inverted Down Di blogspot) :
  1. Log In ke Blogger
  2. Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates. Sebelumnya Download Template Lengkap untuk jaga - jaga
  3. Cari Kode ]]></b:skin> Dan simpan kode CSS dibawah ini tepat diatas Kode tadi . 
.invertedshiftdown{
padding: 0;
width: 100%;
border-top: 5px solid #7ECF01; /*Green color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

.invertedshiftdown ul{
margin:0;
margin-left: 40px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}

.invertedshiftdown li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

.invertedshiftdown a{
float: left;
display: block;
font: bold 12px Arial;
color: black;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px 9px 10px; /*Padding within each menu item*/
background-color: white; /*Default menu color*/

/*BELOW 4 LINES add rounded bottom corners to each menu item.
ONLY WORKS IN FIREFOX AND FUTURE CSS3 CAPABLE BROWSERS
REMOVE IF DESIRED*/
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
border-bottom-right-radius: 5px;
}

.invertedshiftdown a:hover{
background-color: #7ECF01; /*Green color theme*/
padding-top: 9px; /*Flip default padding-top value with padding-bottom */
padding-bottom: 5px; /*Flip default padding-bottom value with padding-top*/
color: white;
}

.invertedshiftdown .current a{ /** currently selected menu item **/
background-color: #7ECF01; /*Green color theme*/
padding-top: 9px; /*Flip default padding-top value with padding-bottom */
padding-bottom: 5px; /*Flip default padding-bottom value with padding-top*/
color: white;
}

  • Silahkan anda Edit warna - Warna nya.

     4.  Jika sudah cari kode berikut

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1'
showaddelement='no'>
<b:widget id='Header1' locked='true' title='test
(Header)' type='Header'/>
... dan seterusnya ...
</b:section></div>

  • Bila tidak ada, cari yang sama persis dengan kode diatas 
   5.  Jika sudah ketemu Copas kode berikut tepat dibawah kode yang berwarna hijau atau berwarna merah (sesuaikan dengan template blog kamu)
<div class='invertedshiftdown'>
<ul>
<li><a href='#' title='home'>Home</a></li>
<li><a href='http://hujangede.blogspot.com/2011/04/contact-hujangede-online.html' title='contact us'>Contact Us</a></li>
<li class='current'><a expr:href='data:blog.homepageurl' title='revised'>Revised</a></li>
<li><a href='#' title='facebook'>Facebook</a></li>
<li><a href='http://hujangede.blogspot.com' title='css'>CSS</a></li>
<li><a expr:href='data:blog.homepageurl + &quot;feeds/posts/default&quot;' title='rss feed'>Rss Feed</a></li>
</ul></div>

  • Note : Silahkan tulisan warna biru ganti dengan halaman Web/Blog kamu
  • Sedangkan yang berwarna merah ganti dengan kata2 kenginan kamu
dan kode dengan No.5 Juga bisa di pasang di HTML/JavaStript dengan cara tambah gadget >HTML/JavaScript dan pastekan kode yang No 5 tadi.

Akhirnya Postingan Cara Membuat Menu Navigasi Inverted Down Di blogspot Sudah selesai. Semoga Bermanfaat.

Jumat, 22 April 2011

20 Blockquote Keren Untuk Blogspot

20 Blockquote Keren Untuk Blogspot20 Blockquote Keren Untuk Blogspot Sebenarnya ini terusan dari artikel Cara Pasang Blockquote Di Blogger dan ini adalah terusannya, kalo di satuin akan panjang banget.. 20 Blockquote ini supaya lebih keren dalam artikel dalam kode hack/css . yasudah ini dia 20 Blockquote Keren Untuk Blogger. semoga bermanfaat. Cekidot



20 Blockquote Keren
Gaya 1
20 Blockquote Keren Untuk Blogspot
Blockquote Code :
.post blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }

 Gaya 2
20 Blockquote Keren Untuk Blogspot
Blockquote Code :
.post blockquote { margin: 1em 2em; border-left: 1px dashed #999; padding-left: 1em; } blockquote p:first-letter { float: left; margin: .2em .3em .1em 0; font-family: "Monotype Corsiva", "Apple Chancery", fantasy; font-size: 220%; font-weight: bold; } blockquote p:first-line { font-variant: small-caps; }

 Gaya 3
Blockquote Code:
.post blockquote { background-color: #666; color: #fff; font-weight: bold; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

Gaya 4
Blockquote Code

.post blockquote { background-color: #666; color:#fff; padding: 15px; margin: 1em 40px; -moz-border-radius-topleft: 15px; -webkit-border-top-left-radius: 15px; -moz-border-radius-topright: 15px; -webkit-border-top-right-radius: 8px; -moz-border-radius-bottomleft: 15px; -webkit-border-bottom-left-radius: 15px; }

Gaya 5
Blockquote Code :
.post blockquote { margin : 0 20px; padding: 60px 30px 40px 20px; background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu-gGB_j47TJXssKeFN5z6xwSbfUxuisPdldjRbPdZsFP6_zA0saJWvJ1gUYpFYgWUNAMwfWgh6CzMyboCTJL2wkC_Fls8zqMx61slbEwqdluYEfau0B0CswyZ1n6J6eZoCQKiTp1tZrs/s400/owl.png) no-repeat 350px 5px; font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif; color : #000; border-left: 8px dotted #DAB547; } blockquote p { margin: 0; padding-top:10px; }
Gaya 6 
Blockquote Code:
.post blockquote { margin : 0 20px; padding: 70px 20px 20px 40px; background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2w2kuRpDpkZjELtAfhEyQfkScxFzfSccFGUsbM734-eFwUOZB1FarDNTrm7S9Hr4rxIElQpGqii93gORxyQpgyEW3Wv26ViQJyAZzGTPU9Px1DfrVSKBTFwO2tQLzp3mUX1B9mLYDmJQ/s400/angular-purple.gif) no-repeat top left; font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif; color : #000; border-bottom : 5px solid #435388; } .post blockquote p { margin: 0; padding-top:10px; }

 Gaya 7

Blockquote Code:
.post blockquote { margin : 0 20px; padding: 10px 20px 25px 20px; background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg90te18OercZkTs1shtRB9bo9E5xGhINp2PYjMOUhhF0k0xpoUChyphenhyphenPVf7fANvNJbv2RQUCdoci53x-ppRtrWYtEnqp8E6_xNNaChUatPq0XLlfOpi1H2nHamQccOF_MrmBxuoRNamz9ag/s1600/block22.gif) no-repeat right bottom; font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia; color : #484848; border: 5px dashed #fff; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 8 
Blockquote Code:
.post blockquote { background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnQTvdpSO80Jq5PQtlb7A-x7wvLTlHGU9XyHKnEXHzqjugjy0sWE9d7LiYGHp-c5eL6bM_sekCCm8dBtrgSQZD21SlsFUUzn8piWIC5TBDjeYGftVRiaudD1xbnBLs7WmK0NBSbYDK0IU/s1600/comma-side-orange1.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 10px 45px; font-size: 0.9em; font: italic 1.2em Georgia, "Times New Roman", Times, serif; } .post blockquote p { margin: 0; padding-top: 10px; }

Gaya 9
Blockquote Code:
.post blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJSgQhHt5dLjwW1mPEADtOJhc3U7hh7jiNutyCkJ4ZIfeC_p-9lh8GIuBXnrk34tIYKOsjTLSD-7J4hflB79SCAkjRqqxZ1M64Al89ZJVLKKDVg3pJa3swik5Aq9oY26lhiuDG-Wtaiy0/s1600/green-black-side.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 20px 50px; color:#C7CACF; font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman"; } .post blockquote p { margin: 0; padding-top: 10px; }

Gaya 10 
Blockquote Code:
.post blockquote { margin : 0 20px; padding: 20px 60px 80px 20px; background : #FEE4E3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9EnjN-G_eaHg-bu0K2tT9OIDPpl1dwdaCTl9dRbGbWGPfCHoqnUWf1bFXrTiwHdEELrvnGMMUhP-cBytUnAXYMXOhcM99EyX1IsYhCXDMt8S8-QmnVQk_jKAqCnM4-d0QTJCCErFETlU/s400/angular-right.gif) no-repeat bottom right; font: bold italic 1em Georgia, verdana, Helvetica, "Times New Roman", Times, serif; color : #000; border: 1px solid #DDD; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 11 
Akan ada akhiran seperti ini

 Blockquote Code:
.post blockquote { font: 18px normal Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGA6kTg_s4fbb-Az8qFgpMwVZK1I2SNcSJfvXX0XR7MIma-DzsSgpltO1tt-vMsg_sgs9ouxTIp9e54g1gq-4SEY7lT4YvKQtMQu5jsPp_fu2NSAcMNuhSYjgs_Ro9dFbZq4-zZFG2Bf4/s400/comma-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzo2FwAe8y2LcetW0FjUHt-pDhuLBmGQ8g89PaWYxUjwGWxlmxvKAgCcxkNogrjB9S-YQork3F-z6mjmzQ15xMsNfQcE7H9GSLYVETJIAyNFEmraiXD86UqGGB6UGyh_KoEo5bBgh67vM/s400/comma-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 12 
Akan ada akhiran seperti ini

Blockquote Code:
.post blockquote { font: 18px normal Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh86G0wxa86KYPNsed7gZUfvYFbwxIMBO42uWnFASaqBxadKR9j_zkax5GUx51oKJYVOSX__lO8l_elV1q4YnoRzJob_XNmSkn-rWnOgEcavjWvvoCV9-t0mEVkl8UipuzJr-0ICIi5x54/s400/comma1-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj0DN2NI_NP7aQe5MVBGbQPquba7j8_RqCFXivfI5QgmJkPFsfTGbHYS6m21G3YM6KeBwSlia31j4y9aXEYOBjIJ-MH5dSshebnoIH7Vmuitn9iiJxNRLI81HK4elvj9VYL8fJekgktqA/s400/comma1-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 13
Akan ada akhiran seperti ini

Blockquote Code:
.post blockquote { font:bold italic .9em "comic sans ms", Tahoma, sans-serif; padding-top: 25px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRJyW-tdiE2eL2WXWgX-uw3KziSlh9ifxSL0v2m5KX0lk5E7hI3iwLdNABa5IUv_9-XneYDvGp4Ax571aicFXd2d0Q1KMhK3jfibxXt4J9UzQU20AZW022t_OtgFPRxr0T5Tbcj7FXJTI/s400/left.gif) no-repeat top left; text-indent: 65px; color:#6299E4; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit1tKRvAm0sZhBtMglbhrH2JZaE6lHR3kc3odoWPrxbQqyLmUToNkwtCYx_XNNJ6-yUdqpTcRw2XHKQ5gQ6uh9tC7r9_VTGfLIi9D6kODhG-bHlJHW7hbkijxrbFR30b7OcI0fEeBCiDk/s400/right.gif) no-repeat bottom right; padding-bottom:30px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 14 
Akan ada akhiran seperti ini


Blockquote Code:
.post blockquote { font: italic 1em "comic sans ms", Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK8Pw-fqQOXdjvPZqQy57tiYo4kK4cPXhfPRbK6fkPtpFdrLZXt-GIzY3M6vFacbgA9dyX4ypqM2ElN00pnM1tHx95XeTBCFLfJYE9GmbZidvA5Npn9WxDb7rLJL1lxbdmkXFPs2WRfmo/s400/comma2-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo1VY2IXkzT-NKfoVvQwjS_q6nKHZksHLaVRZZUcBM3oFxQZHrCI5Qne1IVAhm6y1lX06Dv2AYBoViIZ2c9jE2e5SmWcxXRWX-F37h0qr_YdFQ20JG3pAllG1-PBtrZCgGWRyv7KVLH3Q/s400/comma2-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 15
Akan ada akhiran seperti ini

Blockquote Code:
.post blockquote{ margin : 0 20px; padding: 50px 30px 50px 30px; background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXZxQf_WYX8AuO1YGU4QEu0hC9AkjnAUsqYKxR8kwWHnMIIvf93lQRYlLiMxEp0Ufc58jy3y4St8ZZfCRo2nPkEMfPW1KEFbHU994qvuB8rMLFagiLr7dsHrI4kQvft-ASDRfm9Kb-rpU/s1600/BLOCK1-TOP.gif) no-repeat top; font: bold italic 1em Helvetica, verdana; color : #000; } .post blockquote div{ background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVNZcz5AuOQIKUY0i-BaiZ8HEbCRHs76zlrms_uDFkjE1dY_7fpRkRb9mFnb4_cYT1iTfXz8ayWaFIih8USeAi_Y9cdbCxCg9lVYZMskTFiHOy93_YQGj1IzyU-c790dsabj6OYlfSgYI/s1600/BLOCK1-BOTTOM.gif) no-repeat bottom; padding-bottom: 50px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 16
Blockquete Code
.post blockquote { margin : 0 20px; padding: 70px 20px 30px 20px; background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFopdD2QkUbQZh4sqrnrIKa3Pen-ESzHCN4oVy873a79n1KSaVeZErPrzsVArAHSPpku4CK6zW4mrqlRjs9lONZ2TZjJ8rvloeIxZKn0w6CMzj17G0AFvd4hvmAlbQneDp4PlsSJl877Q/s400/block3331.gif) no-repeat top; font: bold .9em Helvetica, "comic sans ms",Courier,"Times New Roman", Times, serif; color : #343434; border-left : 7px solid #FF7802; border-right : 7px solid #FF7802; border-bottom : 7px solid #FF7802; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 17
Akan ada akhiran seperti ini

Blockquote Code: 
.post blockquote{ margin : 0 35px; padding: 80px 0px 0px 0px; background : #E6F1FA url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUXi2zNiGpPQXpvjLY5nIRofKtmGz5mfJ1nYe6YPz1PS_jfdU0s3i-UYrmmCbQzZ48B8b7hjgQJqtFioUptFDimUDPQTMcfWZTdgZO4R6LbD2kWDgByNo7Fn91rTbWvJo_AlqrjAFSKyw/s400/head2.gif) no-repeat top; font: normal 1em "comic sans ms", Helvetica, verdana; color : #666; } .post blockquote div{ background : #E6F1FA url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw7RhhlgSHiHzX7H7p2bke37vWksFiW5xY941yzad8sS-g1bmbBqmked2SDYhkLZQnVx2cd7Jw2lcl1b3fr-k7i_wUOF3kmDJ_UR1xEoZWUPadKbTMzdvlCaGULwh1NR_8lI7EB8HaglI/s400/head-bottom3.gif) no-repeat bottom; padding-bottom: 50px; } .post blockquote p { margin: 0; padding: 20px; }
 Gaya 18
Blockquote Code :
.post blockquote { margin:1em 20px; } .post blockquote p { margin:.75em 0; } blockquote { background:#EFEFF7; }

Gaya 19
Blockquote Code:
.post blockquote { background-position:-10px -7px; border: 1px dashed #FFC600; margin: 20px 10; padding: 0 20px 0 50px; background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMU1suIP76QzE0-Njju84xMptE_x3X2Q0sTFuy6kXHDprRsmIr0dnOqODDcgjUlKDWbfJrJMOC304mm9URLaRe0jbfMKe3keCMI11wtaPZXu-He40-o_3a-kECvoDU8S6jXeArWlp3xoNH/s1600/quote.png") 5% no-repeat #FFF8DD; }



Gaya 20
Blockquote Code:
.post blockquote{ background-color: transparent; border-top: 3px double #DC143C; border-bottom: 3px double #DC143C; paddin
Dan untuk menyimpan Code - Code diatas ini masuk ke artikel ini:

Selesai Gimana blockquotenya keren - keren gak,,hhe lumayan panjang ni .
Postingan 20 Blockquote Keren Untuk Blogspot Sudah Selesai. Semoga Bermanfaat. Salam Mukti

Cara Pasang Blockquote Di Blogger

10 Blockquote Keren Untuk Di Pasang Di blog10 Blockquote Menakjubkan Untuk Di Pasang Di blog . Sebenarnya artikel ini ana penerusannya di artikel 20 Blockquote Keren Untuk Blogspot .Oke lanjutkan .Blockquote Ini berfungsi untuk code - code seperti css yang ada di postingan,seperti blog yang memposting artikel - artikel trik - trik blog dan pasti artikel - artikelnya ada css,kode,html . Blockquote ini keren - keren, setiap anda meletakan kode hack/css  untuk para Blogger yang menggunakan fungsi Blockquote adalah tanda kutip yang muncul ketika anda posting sesuatu yang anda ingin meningkatkan Post . pengunjung Anda bila ingin mencari kode hack/css supaya tidak sama kalo menggunakan blockquote, jadi saya memutuskan untuk membedakan kode hack/css menggunakan fitur yang sederhana yang dapat tertanam dalam posting anda selama penciptaan artikel. pertama kita pelajari sedikit tentang Blockquote.

Bagaimana membuat Blockquete dalam posting.
10 Blockquote Keren Untuk Di Pasang Di blog
Ketika membuat sebuah posting dengan blockquote, maka teks kutipan akan indentasi di sebelah kanan dan kiri untuk menonaktifkannya dari teks lain. Namun, jika Anda ingin menambahkan gaya yang lebih ke kutipan Anda, Anda dapat menggunakan tab Edit HTML untuk membuat perubahan untuk mengedit inline blockquote dengan menggunakan CSS. Sebagai contoh, setelah memasukkan blockquote dalam Rich Text Editor, Anda dapat klik pada tab Edit HTML dan mencari teks seperti ini: 
<blockquote> Ini adalah beberapa teks kutipan. </ blockquote>
dan mengeditnya sehingga seperti ini:
<blockquote style="border: solid 2px #666; padding: 8px; background-color: #ccc;"> Ini adalah beberapa teks kutipan. </ blockquote> 
Menjadi tampilan akan seperti ini :
Ini adalah beberapa teks kutipan.
Bila Anda ingin lebih mudah untuk menampilkan Kutipan yang anda suka/keren/menakjubkan anda tinggal menambahkan Css pada blog anda dengan cara:

#1. Sekarang LoginLah ke Account Blogger sobat
Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates.

#2.  Sekarang cari (CTRL + F / F3) Kode ini di template anda. Cari code berikut : .post blockquote atau .post-body blockquote  dan menghapus semua yang terlibat dengan kode di atas . pada sebagian kode terlihat seperti:

.post-body blockquote {line-height: 1.3em;}
Atau
.post blockquote. {bla bla bla}
Jika anda tidak dapat menemukan kode terbebut ,adalah sudah beres .


#3.  Sekarang cari kode ]]></b:skin> 
- Pastekan kode dibawah ini di atas kode tadi

#.4. jika sudah selesai simpan template. semoga berhasil.
blockquote {border: 2px solid # 666; padding: 10px; background-color: # ccc;}

Kustomisasi: -
daerah penting untuk bisa disesuaikan dengan yang tebal. Dimana,
   # Padding: Ini merujuk pada jarak teks dari perbatasan blockquote. Yang berjalan dalam rangka ini -> Atas Kanan Bawah Waktu
   # latar belakang : - Ini termasuk Blockquote warna latar belakang dan gambar yang digunakan di dalamnya. Angka nilai enam adalah warna latar belakang dan image link dimasukkan ke dalam tempat teks tebal pada this-> url bagian ( Tempel Gambar Link di sini )
   # font : - Ini mencakup font style , ukuran dan tipe masing-masing. Sesuaikan warna dengan kode di atas untuk referensi.
   # warna : - ini mengacu pada warna teks. Anda dapat menggunakan warna font yang berbeda menggunakan kami bagan warna 
   # perbatasan : - ini mengacu pada perbatasan lebar , gaya dan warna masing-masing. # Semua blockquotes lain dapat dikustomisasi dalam cara yang sama.



Jika Anda ingin yang lebih keren Blockquote

Postingan Cara Pasang Blockquote Di Blogger sudah selesai. semoga bermanfaat. salam Mukti

Kamis, 17 Maret 2011

Fitur Baru Blogger : Follow via Email

F
itur Baru Blogger : Follow via Email .   Benar - benar sekarang blogger semakin lama semakin mantap .
Sebenarnya saya belum terlalu mendalami tentang fitur baru ini tapi sekalian saja kita cari tahu bareng - bareng
.Nama fitur tersebuat apa sih? apa sih manfaatnya ? Gimana sih bentuknya?
. Penasaran dengan kelanjutan artikelnya?. . . .


Baca Selengkapnya

Kamis, 24 Februari 2011

Cara Menambahkan background Di Widget


H
ujangedeTrikBlog -Cara Menambahkan background Di Widget  Sekarang Hujangede.blogspot.com akan memberikan artikel tutorial mengenai  Cara Menambahkan Background Di Widget  Dengan trik ini, maka background  widget akan menjadi berwarna. Penasaran? . . .
Baca Selengkapnya