Widget Animasi Garuda ndonesia

Widget Animasi Garuda Indonesia

Nama : Garuda ndonesia

Ukuran : 84 KB 140X207

Caranya mudah. Login ke blog seperti biasa, Pilih Tata Letak, Pilih Tambah Gadget, Pilih Tambah HTML/Javascript. Copy dan Paste code berikut :

POSISI BAWAH KIRI

 <script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-2.swf','bottom','-2px','left','0px','112213','140','207','transparent','ffffff');
</script>

POSISI BAWAH KANAN

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-2.swf','bottom','-2px','right','0px','113213','140','207','transparent','ffffff');
</script>

POSISI ATAS KIRI

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-2.swf','top','-13px','left','0px','113211','140','207','transparent','ffffff');
</script>

POSISI ATAS KANAN

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-2.swf','top','-13px','right','0px','113212','140','207','transparent','ffffff');
</script>

POSISI SIDEBAR

<div style="text-align: center;">
<embed height="207" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-2.swf" type="application/x-shockwave-flash" width="140" wmode="transparent"></embed></div>

Cara Membuat Permalink Di Blog

Cara Membuat Permalink Di Blog

Sobat sedang membaca artikel tentang Cara Membuat Permalink Di Blog Yang SEO, berikut adalah Cara Membuat Permalink Di Blog Yang SEO Friendly.

Jika sobat tertarik, ikuti langkah2nya dengan benar.
1. Login ke akun blogspot sobat, Pilih Template, pilih Edit Html, Centang Expand Widget
2. Cari kode ]]></b:skin>
Letakan kode berikut diatasnya.

.admin-tulisan{
width:auto;
background:#f2f2f2;
border:2px solid #000000;
margin:30px 0 10px 0;
display:block;
font-family:"julee";
color:#000;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#FF0000;
border:none;
border-bottom:1px solid #000000;
color:#fff;
font-family:"julee";
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{
background:#000000;
width:90px;
height:100px;
border:1px solid #000000;
margin:3px 10px 0 0;
float:left;
padding:2px;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}

3. Cari lagi kode <data:post.body/> Gunakan Ctrl+F untuk memudahkan pencarian. Letakan kode berikut tepat di bawahnya.

<!-- Permalink aLZhiPPo -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ~ Bloger</h4>
<div class='kontainer'>
<img alt='aLZhiPPo' src='URL GAMBAR SOBAT'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>.  Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea>
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>
<a href='http://alzhippo.blogspot.com/2013/06/cara-membuat-permalink-di-blog.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Permalink aLZhiPPo -->

Catatan :
Ganti URL GAMBAR SOBAT sesuai dengan foto yang akan muncul di permalink.
SAVE DAN SELESAI.
Nah itu tadi sedikit share tentang Cara Membuat Permalink Di Blog , semoga bermanfaat ya sob.

Widget Animasi Garuda Muda Indonesia

Widget Animasi Garuda Muda Indonesia

Nama : Garuda Muda Indonesia
Ukuran : 86 KB 138X204
Caranya mudah. Login ke blog seperti biasa, Pilih Tata Letak, Pilih Tambah Gadget, Pilih Tambah HTML/Javascript. Copy dan Paste code berikut :

POSISI BAWAH KIRI 

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-Garuda-Muda-Indonesia.swf','bottom','-2px','left','0px','112213','138','204','transparent','ffffff');
</script>

  
POSISI BAWAH KANAN

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-Garuda-Muda-Indonesia.swf','bottom','-2px','right','0px','113213','138','204','transparent','ffffff');
</script>

POSISI ATAS KIRI

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-Garuda-Muda-Indonesia.swf','top','-13px','left','0px','113211','138','204','transparent','ffffff');
</script>

 POSISI ATAS KANAN

<script language="JavaScript" src="https://sites.google.com/site/zonasampit/Remajasampit.js" type="text/javascript">
</script><script language="JavaScript" type="text/javascript">
eXl1lXc('https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-Garuda-Muda-Indonesia.swf','top','-13px','right','0px','113212','138','204','transparent','ffffff');
</script>

POSISI SIDEBAR
 

<div style="text-align: center;">
<embed height="204" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="https://b5f38f52-a-62cb3a1a-s-sites.googlegroups.com/site/vinievidievicie/We-Love-Indonesia-Garuda-Muda-Indonesia.swf" type="application/x-shockwave-flash" width="138" wmode="transparent"></embed></div>

Membuat Menu Dropdown JQuery

Membuat Menu Dropdown JQuery

Jika anda tertarik untuk membuatnya, silahkan ikuti langkah berikut ini :
1. Login ke akun Blogger anda
2. Pilih Tata Letak >> Tambah Gadget >> HTML/JavaScript
3. Masukkan script dibawah ini
4. Klik simpan

<style>
/*------ CSS3 Drop Down Menu By (alzhippo.blogspot.com)---------*/
#rl-menu, #rl-menu ul {
margin: 5;
padding: 5;
list-style: none;
}
#rl-menu {
width: 533px;
margin: 5px auto;
border: 1px solid #3b5998;
background-color: #4b67a1;
background-image: -moz-linear-gradient(#3b5998, #3b5998);
background-image: -webkit-gradient(linear, left top, left bottom, from(#3b5998), to(#3b5998));
background-image: -webkit-linear-gradient(#3b5998, #3b5998);
background-image: -o-linear-gradient(#3b5998, #3b5998);
background-image: -ms-linear-gradient(#3b5998, #3b5998);
background-image: linear-gradient(#3b5998, #3b5998);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 1px 1px #777;
-webkit-box-shadow: 0 1px 1px #777;
box-shadow: 0 1px 1px #777;
}
#rl-menu:before,
#rl-menu:after {
content: "";
display: table;
}
#rl-menu:after {
clear: both;
}
#rl-menu {
zoom:1;
}
#rl-menu li {
float: left;
border-right: 1px solid #3b5998;
-moz-box-shadow: 1px 0 0 #444;
-webkit-box-shadow: 1px 0 0 #444;
box-shadow: 1px 0 0 #444;
position: relative;
}
#rl-menu a {
float: left;
padding: 5px 5px;
color: white;
text-transform: uppercase;
font: normal 11px Verdana, Helvetica;
text-decoration: none;
text-shadow: 0 1px 0 #000;
}
#rl-menu li:hover > a {
color: white;
}
*html #rl-menu li a:hover { /* IE6 only */
color: #3b5998;
}
#rl-menu ul {
margin: 5px 0 0 0;
_margin: 0; /*IE6 only*/
opacity: 0;
visibility: hidden;
position: absolute;
top: 38px;
left: 0;
z-index: 9999;
background: #444;
background: -moz-linear-gradient(#444, #111);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
background: -webkit-linear-gradient(#444, #111);
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
-moz-box-shadow: 0 -1px rgba(255,255,255,.3);
-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
#rl-menu li:hover > ul {
opacity: 1;
visibility: visible;
margin: 0;
}
#rl-menu ul ul {
top: 0;
left: 150px;
margin: 0 0 0 5px;
_margin: 0; /*IE6 only*/
-moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);
-webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);
box-shadow: -1px 0 0 rgba(255,255,255,.3);
}
#rl-menu ul li {
float: none;
display: block;
border: 0;
_line-height: 0; /*IE6 only*/
-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
}
#rl-menu ul li:last-child {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#rl-menu ul a {
padding: 5px;
width: 400px;
_height: 10px; /*IE6 only*/
display: block;
white-space: nowrap;
float: none;
text-transform: none;
}
#rl-menu ul a:hover {
background-color: #0186ba;
background-image: -moz-linear-gradient(#3b5998, #0186ba);
background-image: -webkit-gradient(linear, left top, left bottom, from(#3b5998), to(#0186ba));
background-image: -webkit-linear-gradient(#3b5998, #0186ba);
background-image: -o-linear-gradient(#3b5998, #0186ba);
background-image: -ms-linear-gradient(#3b5998, #0186ba);
background-image: linear-gradient(#3b5998, #0186ba);
}
#rl-menu ul li:first-child > a {
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
border-radius: 5px 5px 0 0;
}
#rl-menu ul li:first-child > a:after {
content: '';
position: absolute;
left: 40px;
top: -5px;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #444;
}
#rl-menu ul ul li:first-child a:after {
left: -5px;
top: 0%;
margin-top: -5px;
border-left: 0;
border-bottom: 5px solid transparent;
border-top: 5px solid transparent;
border-right: 5px solid #3b3b3b;
}
#rl-menu ul li:first-child a:hover:after {
border-bottom-color: #3b5998;
}
#rl-menu ul ul li:first-child a:hover:after {
border-right-color: #0299d3;
border-bottom-color: transparent;
}
#rl-menu ul li:last-child > a {
-moz-border-radius: 0 0 5px 5px;
-webkit-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
}
</style>
<br />
<ul id="rl-menu">
<li><a href="#">Menu 1 ▼</a>
<ul>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
</ul></li>
<li><a href="#">Menu 2 ▼</a>
<ul>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
</ul>
</li>
<li><a href="#">Menu 3 ▼</a>
<ul>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
</ul></li>
<li><a href="#">Menu 4 ▼</a>
<ul>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
<li><a href="http://alamatlinkanda">► Teks anda</a></li>
</ul></li></ul>
<div style="text-align: right;">
<a href="http://alzhippo.blogspot.com/2013/05/membuat-menu-dropdown-jquery.html" target="_blank"><span style="font-size: normal;">[ Widget by Friend of the Night Blog ]</span></a></div>

Keterangan :
Ganti tulisan warna merah, biru, Hijau dengan teks sesuai keinginan anda.



Semoga bermanfaat...!!!

Cara Membuat Tampilan Blog Lebih Menarik dan Cantik

Cara Membuat Tampilan Blog Lebih Menarik dan Cantik

Cara membuat tampilan blog lebih menarik dan cantik adalah sebuah cara yang sudah tidak asing lagi sob dilakukan oleh para blogger mania dengan tujuan agar blog yang mereka sayangi enak dan nyaman untuk di pandang oleh banyak pengunjung. Banyak cara yang bisa dilakukan untuk membuat tampilan blog lebih menarik dan cantik salah satunya dengan menggunakan penerapan widget keren yang tentunya ada yang berbayar dan juga gratis.

Pada pembahasan kali ini tentang Cara membuat tampilan blog lebih menarik dan cantik adalah sebuah pembahasan yang melanjutkan sharing sebelumnya tentang cara membuat link otomatis di blogger, silahkan kunjungi link tersebut jika ada yang penasaran ingin mengetahuinya. Untuk cara membuat tampilan blog lebih menarik dan cantik disini ane akan memberikan deretan daftar widget keren yang sering kali di gunakan oleh kebanyakan kaum blogger.


Cara membuat tampilan blog lebih menarik dan cantik dengan widget
Berikut ini adalah daftar widget membuat tampilan blog lebih menarik dan cantik yang sempat saya koleksi.

1. Google gadgetsGoogle gadgets adalah sebuah layanan gratis dari google yang mana terdapat banyak pilihan hanya dengan mengetikan nama widget dan menyalin kode script untuk disimpan di sebuah blog.

2. Yahoo ! widgetsYahoo ! widgets sama halnya dengan Google gadgets yang membedakan mereka adalah Yahoo ! widgets persembahan dari Yahoo sedangkan Google gadgets dari Google.

3. AlexaSebuah widget yang akan menampilakn nominal dari nilai Alexa rank yang menandakan tingkat popularitas sebuah blog.

4. MypagerankSama halnya dengan Alexa, tetapi Mypagerank adalah nominal dari page rank sebuah blog.

5. Rankwidget Lebih komplit widget yang akan menampilkan trafic rank dari google page rank, alexa traffic rank, technorati blog rank serta yahoo.

6. SoftcircuitsSebuah widget gratis persembahan dari google page rank.

7. WidgetboxWidget gratis dari blogger.

8. ClocklinkWidget gratis untuk menampilkan jam pada sebuah blog.

9. LocaltimesTidak ada bedanya dengan Clocklink kebunaannya untuk menampilkan jam.

10. ClockwidgetsWidget jam yang mempunyai tampilan lebih lengkap dari fitur diatas.

11. HistatsWidget gratis untuk menampilkan jumlah pengunjung pada sebuah blog.

12. FeedjitSebuah widget yang akan menampilkan negara pengunjung.

13. Whos.amung. usSama dengan Histats untuk mengetahui jumlah pengunjung yang online pada blog kita.
14. FlagcounterPengunjung yang ditandai oleh bendera negara masing-masing.

15. Shoutbox part 1 & Shoutbox part 2 Widget yang akan menampilkan kotak pesan terletak pada halaman blog.

16. Widget animasiBeragam animasi berbasis flash swf yang bisa agan ambil kode-nya dan di dimpan di halaman blog agan.

17. Widget costum twitter generatorWidget twitter yang bisa di tampilkan di halaman blog sebagai sarana media sosial.

18. Widget zooshiaWidget yang lebih canggih sebagai sarana media sosial seperti halnya witter, facebook dan youtube.


Mungkin cukup itu saja yang saya punya untuk Cara membuat tampilan blog lebih menarik dan cantik dengan widget selebihnya silahkan agan browsing saja sendiri di Mbah Google sedikit saran dari saya agar blog tidak terasa lebih berat maka pemakaiannya harap diatur jangan berlebihan. Terima kasih
Terima kasih atas kunjungan para sobat dan kesediaan sobat untuk membaca artikel tentang Cara membuat tampilan blog lebih menarik dan cantik. Jika sobat menyukai artikel blog ini, silahkan sobat klik tombol like & share ke sobat lainnya..semoga bermanfaat

Cara Membuat Space Iklan di Blog

Cara Membuat Space Iklan di Blog

 

Cara membuat space iklan di blog - Hari ini saya mau share tentang tutorial cara membuat space iklan di blog yang mana tutorial ini saya anggap lumayan penting karena dengan salah satu cara ini kita bisa dapetin tambahan penghasilan dari Bisnis Online yang saat ini kita jalani. Dengan kita membuat space iklan di blog hal ini akan memancing para advertiser/pemasang iklan untuk memasang iklan dengan tujuan mempromosikan blognya terebih lagi kalau blog kita rame pengunjung pastinya ini akan mejadi ladang $ yang sangat menguntungkan.

Tanpa basa-basi langsung aja ke TKP dibawah ini.
Langkah-langkahnya sob..


Berikut adalah cara membuat space iklan di blog

Silahkan masuk ke akun Blogger sobat
Klik "Tata Letak"
Terus klik "Tambah Gadget" => "HTML/Javascript"
Simpan kode dibawah ini ke dalam "HTML/Javascript"

<div align="center">
<table border="0" cellpadding="2" cellspacing="6" width="auto" bgcolor="#ffffff">
<tbody><tr>
<td><center><a href="URL/Alamat IKLAN" rel="nofollow"><img title="Deskripsi Iklan" width="125" src="URL/Alamat Gambar Iklan"
border="0" height="125" width="125" /></a></center></td>
<td><center><a href="URL/Alamat IKLAN" rel="nofollow"><img title="Deskripsi Iklan" width="125" src="URL/Alamat Gambar Iklan"
border="0" height="125" width="125" /></a></center></td></tr>
</tr><td><center><a href="URL/Alamat IKLAN" rel="nofollow"><img title="Deskripsi Iklan" width="125" src="URL/Alamat Gambar Iklan"
border="0" height="125" width="125" /></a></center></td>
<td><center><a href="URL/Alamat IKLAN" rel="nofollow"><img title="Deskripsi Iklan" width="125" src="URL/Alamat Gambar Iklan"
border="0" height="125" width="125" /></a></center></td></tr>
</tbody></table>
</div>

Note:
URL/Alamat IKLAN : Silahkan sobat ganti dengan alamat URL Blog pemasang iklan.
URL/Alamat Gambar Iklan : Silahkan sobat isi dengan alamat URL gambar.
Deskripsi Iklan : Sobat isi dengan informasi tentang iklan yang dipasang yang nantinya deskripsi tersebut akan muncul disaat kursor mouse di dekatkan pada iklan tersebut.


Mungkin itulah sedikit tutorial dari saya tentang cara membuat space iklan di blog, semoga dengan sobat membuat space iklan di blog maka akan menambah penghasilan sobat di dalam mencari rizki di dunia maya ini. Amin . . .

Terima kasih atas kunjungan para sobat dan kesediaan sobat untuk membaca artikel tentang Cara membuat space iklan di blog. Jika sobat menyukai artikel blog ini, silahkan klik tombol like dan share ke yang lainnya...

Cara Membuat Berbagai Macam Variasi Blockquote di Blog

Cara Membuat Berbagai Macam Variasi Blockquote di Blog

Sebagaimana kita ketahui bahwasanya Blockquote adalah tanda yang digunakan untuk menandai suatu tulisan yang penting, sehingga tampak berbeda dari tulisan yang lainnya. Oke, kali ini saya akan share dan posting ke anda tentang Cara membuat berbagai macam variasi blockquote di blog.

Di bawah ini ada beberapa macam variasi blockquote berikut kode-kodenya :



Blockquote Dengan Border dan Gambar burung hantu

Kode blockquote:

blockquote {
margin : 0 20px;
padding: 60px 30px 40px 20px;
background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBFBQ2uXfjyPqCEKO2d8BrrmGlOR-BqWlpdOmVdc2fKR34DSYFIg6V4MajGbQJ3HD0RMBw6wV_Z4Ilb02iVHu6YKx8w-qprUgAIcFEg2aEByUytaqvrbuv8poEYWw7w-OlLMp6k81yzSE/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;
} 

Blockquote dengan label di pojok kiri atas dan border di bawah dengan warna ungu

 Kode blockquote:

.post blockquote {
margin : 0 20px;
padding: 70px 20px 20px 40px;
background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEAxSApKRkzlOn8x-svD_9j1gJzLL1bMjTYWbyNS-0TUvpHs_GuvWFq1hGWxHFSBl2jinssfHCwRNAgZRdTKx4miUWAdbcOAf0_Pv_bcp9FBDdoF1FPwbRDbEs6GMSi5RvwZ0YFptYXXc/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;
}

Jigsaw (seperti gergaji ukir) Blockquote Dengan tulisan copyrighted coding Pada Pojok Kanan bawah

  
Kode blockquote:

.post blockquote {
margin : 0 20px;
padding: 10px 20px 25px 20px;
background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiSzwxUjITIL_q4XPzSO7TwPInmONJcDMUmjFidjEjrYLSlDXS8WAFPboES7i-1RC2FfbAKishPdFoCZbaUR5DVnXG0u8nCMBVs0xueM21K2PX0DzcBwPnDQYyFXiiYPXeDtaWKk5_CH0/s400/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;
}

Blockquote dengan border klasik border di samping kiri 

Kode blockquote:

.post blockquote {
background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggs0xvAzU_wypa3eAdBedP9KRFPlhTmi4b1eXE4_SXYjQsxmHsJTZO_3kyvWWWiyVNLMhcLytdJRZwB2BtcGigstwr8Ls80QOir0XExeFwYMzSIwI_RI4RoGkxTaQ_6BwCbjeM1NLNM1s/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;
} 

Atau blockquote klasik lainnya

kode blockquote:

blockquote {
background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNmiKGsVjLchaEqe-vz0hjTeVuc2OZjtI_FvJ9lHw6oSo95Q2grIqoBJQXxcFZIyVCc12e6F_8yL5nsXYNd-9FRmPRt6UFZ5yjAGt0g0atTDNc7X8q4X2CkqttJN6EIp_NAm08YBwG41A/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;
} 

Blockquote dengan dengan Label warna di pojok kanan bawah 

 kode blockquote:

.post blockquote {
margin : 0 20px;
padding: 20px 60px 80px 20px;
background : #FEE4E3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL3jG9T0gkFTJpGgktJdJq5T60EIitat9QaBp6HOFJUc54VM0h-r8MEbhk5s48OGpauFhEXCKr09kFt9EBbtLM8HyYIdFbPYIFNLCzHcDmwBSJqonzEEXa1yf9ahiEkHpI08aEi0_V1pM/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;
} 

Blockquotes dengan tanda koma terbalik 

 kode blockquote: 

.post blockquote {
  font: 18px normal Tahoma, sans-serif;
  padding-top: 10px;
  margin: 5px;
  background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGMMCZtND7H5ckXC-PznC_9NJodItoutiWthhuvnPWUh4NRhL1rN7gDpAWfqm8pKifrJTlsFtMdXRiGNCTMkBk88Yqq2_DRj1aYWxqOwZjPdNQGSPE2LBnCc33EQwbvBn9RhTcOn6OBqI/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/AVvXsEg2WeYTz56rA4Uz6A03la62M2GcvbLUMwvUFKld0wdL0Sg4z2PPirXRj4G-GrIzcU6JqnpbmVISG4KI93eK4aInbo1Z6dH4gsIhshWpN9qMcUR2r1p4I-Dsdx8LxJPWyDimUELPaymIE_8/s400/comma-right.gif) no-repeat bottom right;
padding-bottom:10px;
}
.post blockquote p {
margin: 0;
padding-top:10px;
} 

Atau tanda koma yang berwarna orange 

kode blockquote: 

.post blockquote {
  font: 18px normal Tahoma, sans-serif;
  padding-top: 10px;
  margin: 5px;
  background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsXiyb9tlP1Nogt7r_Tg68TtWONKoFLEnznylrDq8uuL1_PX2lah8oAYrVtGvjXvROtXjMIDCgQJ6AdKbmF8jamazZcKgVskKREETZdFMdwCZWrcC46gb387JQ22CkbzWWzE5U5U2VHX8/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/AVvXsEhCz07Wi9l3e4Hu1Ib9bAcGU8n_jhk4mdIqxovepw8yd_Ca3yxgWN2tdp4ADo0S7NmmXrq8F3v0xnHdtgsNiWp4rJ80XeZiXJj0jh36O3TdfGb7xL6b5rCCZND3ux9-uRg-V45KZR0GKHU/s400/comma1-right.gif) no-repeat bottom right;
padding-bottom:10px;
}
.post blockquote p {
margin: 0;
padding-top:10px;
} 

Atau variasi dengan tanda lima jari tangan 

kode blockquote:

.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/AVvXsEhTR_az7nGVqkaFjeQ5b_wRuURQcn93KsDVo3Q4GCeb83LyGeJS2ZZDvAcRQG3tIg8Vta51r28PfUE12vCIdYniQvG64puE0AEh5uKeyHzjgDFnYYP7-Mreai1PjC_VQTytEsdp0Rcu5QQ/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/AVvXsEjrQ0JDZ6b-saM6b7gDygQbL5-UdGOLNEXEl5p4S8yLqYgf2-GCR2sIV3u3Go8LVMqcnJfHl23lQwMdu3xnWi8Ez0owmzbp0007GMv96DgHgK1kRq1BSt6U1XEIyaYiJgJFtP_3QU9ZFYM/s400/right.gif) no-repeat bottom right;
padding-bottom:30px;
}
.post blockquote p {
margin: 0;
padding-top:10px;
}  

Blockquote dengan gambar copyrighted coding diatas  

kode blockquote: 

.post blockquote {
margin : 0 20px;
padding: 70px 20px 20px 20px;
background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWtDX6HympXPlkmrit-SaNtcdbQRwKQ6g0GAafNDISKvlgg7CrZmsLnGPDlZ5rZa9CQEQYK_-M-2FoOCqZ775RaVm3BgfFHA2Vm4oZggSkOsfraLuNIpUzpnON4x0ue1j95oSKBaRnv4I/s1600/block333.gif) no-repeat top;
font: normal 1em "comic sans ms",Helvetica, Courier,"Times New Roman", Times, serif;
color : #000000;
border-bottom : 7px solid #FF0000;
}
.post blockquote p {
margin: 0;
padding-top:10px;
} 

Blockquote dengan gambar Tirai di atas dan bawah 

kode blockquote:

.post blockquote{
margin : 0 20px;
padding: 50px 30px 50px 30px;
background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4AfgPuMj4R_5pxE7qb95C5XYu6c1JwEw5Fdv5z_FpV4QTYjybadvzQVh-0I2FX09BCKVQ8cYy9cX_0EegjyULsBlUTHr7PQPZVmAikd9j3mRFx18bV_KEKic9GkXSFjkIUbQI33HBCs0/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/AVvXsEiq84bLivIxDogVHgE3CTRGBlpEwlYklNfDPbcp87VwFo2uV7Nsj69QifIgGU63531YwMse2r4s2EeeTTe76BAMFfK_5ryhoP7ZvQxAXzNZhr2uSxoOGUTBuYvn_INyNSLfbf672_GsSzc/s1600/BLOCK1-BOTTOM.gif) no-repeat bottom;
padding-bottom: 50px;
}
.post blockquote p {
margin: 0;
padding-top:10px;
} 

 

Gaya blockquote kotak dikelilingi oleh borders :

kode blockquote: 

.post blockquote {
margin : 0 20px;
padding: 70px 20px 30px 20px;
background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiavvS2HjWfERj60hSgqFPuvMKu8krNNdh_D1ZdJ1SMwwHNKPgTL0fQeg-_oLhOnzVNYGilqYuUl3TMy30TPjIvgopPajqPUYiCFX7t_kCx6OgdwVRWJxJEFpwOdVbP-HxQa3vy2LQ6Sb4/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;
}

The Monkey Man Blockquote 

kode blockquote:

.post blockquote{
margin : 0 35px;
padding: 80px 0px 0px 0px;
background : #E6F1FA url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGWsbdcIaY4E-6owZYYOlpKjBaIIPSeB_6aaTCcB5LicV7YXlusInMEoQ6HOx6IWSxntf13wRqz69iw4S8dvfsy44v4wvDSJLwX5mtAWFUWZ9AXeUesBZYE-ecvURnw8yPGNZuFp1Z6g8/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/AVvXsEhXm2U7TDpp6kK3gn6-z4sFQjTV1nZWXFOyoY70bb3S3ARuXjOB2jMdlpafEERKxSgp4MnGEvydm64lLY6zpthyR-sIr2vmm0zljLjE0Jbfmx5W3cwtsyXoWb5lCjiNHDQR0lcgCFV9suQ/s400/head-bottom3.gif) no-repeat bottom;
padding-bottom: 50px;
}
.post blockquote p {
margin: 0;
padding: 20px;
} 

Penerapan dan penyesuiannya di blog :
Sekarang Untuk menambahkan Salah satu blockquotes keren dan unik untuk blog Anda, lakukan hal berikut:

• Pertama masuk ke akun blogger kita.
• Klik fitur rancangan.
• Klik edit HTML.
• Cari kode blockquote misalnya .post-body blockquote { line-height:1.3em; }atau .post blockquote{...........}dalam kode HTML template blog kita tersebut.
• Hapus kode blockquote tersebut, kemudian ganti dengan memasukan kode HTML blockquote yang kita inginkan.
• Klik simpan template.

Keterangan :

• Untuk mempermudah pencarian kode HTML yang dimaksud, klik tombol Ctrl + F pada keyboard kita.
• Selalu biasakan untuk download template blog kita terlebih dahulu sebelum melakukan edit, untuk back up sebagai antisipasi saat kita mengalami kegagalan sewaktu proses editing berlangsung.

 Semoga bermanfa'at...

Mematikan Tombol Ctrl U, Ctrl A, Ctrl C, dan Disable Klik Kanan di Blog

Mematikan Tombol Ctrl U, Ctrl A, Ctrl C, 

dan Disable Klik Kanan di Blog

Selamat pagi sobat semua. pagi ini saya mau bagi article cara disable Tombol Ctrl U, Ctrl A, Ctrl C, dan Disable Klik Kanan di Blog. Ini merupakan cara yang sangat jitu untuk menjaga posting blog dari Orang yang suka Copy-Paste Artikel lalu memposting kembali di blog yang mereka miliki.

Cara Penggunaanya di blog :
1. Login ke blog [ Klik ] Dasbor
2. Pergi ke Template - Edit HTML
3. Cari code <body> ( tekan Ctrl + F untuk mempermudah pencarian )
4. Ganti code tadi dengan :

<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>

5. Save Template.

Penjelasan :

• Onkeydown='return false;' [ Fungsi : untuk mematikan fungsi CTRL+A dan CTRL+U pada keyboard ]
• Oncontextmenu='return false;' [ Fungsi : untuk mematikan fungsi klik kanan pada mous ]
• Onmousedown='return false;' [ Fungsi : untuk mematikan block select pada text ]
• 'return false;' [ Fungsi : untuk mengaktifkan script yang digunakan)

Contoh :

Jika hanya ingin mematikan fungsi klik kanan pada blog, script yang dimasukan hanya :

<body oncontextmenu='return false;'&gt

Dan Jika ingin mematikan fungsi Ctrl + A dan Ctrl + U, script yang dimasukan hanya :

<body onkeydown='return false;'>

Mudah toh sobat :)

Cara Membuat Related Post Dengan Thumbnail

Cara Membuat Related Post Dengan Thumbnail

Menampilkan related post dengan gambar dan cuplikan terbukti ampuh untuk meningkatkan ratio pageviews
pada blog sobat dan yang pasti membuat pengunjung betah, fungsi dari widget linkwithin ini adalah menampilka post-post sebelumnya dibagian bawah posting seperti gambar diatas. pada kali ini saya akan membagikan widget related posts yang berasal dari linkwithin beserta tutorialnya dengan beberapa tweaks untuk mempercepat loading related posts dan tanpa perlu mengisntal kode-kode script dari server linkwithin. berikut tutorialnnya..

• Buka linkwithin
• Isi informasi yang diperlukan di formulir linkwithin, 

Note: sesuaikan stories yang tampil dengan lebar blog sobat,

• Kemudian klik GET WIDGET!
• Klik Instal Widget
• Ubah judul Related Post dengan judul yang sobat inginkan, seperti gambar dibawah ini

• Klik edit template kemudian ganti semua scriptnya dengan script dibawah ini

<b:includable id='main'><b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:content/></b:if></b:includable>

Script diatas berfungsi untuk mencegah widget tampil di homepage.

• Kemudian klik edit content

• Tambahkan script dibawah ini tepat diatas kode <script>

<script>linkwithin_text='Related Posts:'</script>

      
 Note: Ganti related posts dengan judul yang sobat inginkan

• Klik Menambah Widget 

          Untuk menampilkan related post dibawah posting.

• Pindahkan widget kebagian bawah post, seperti gambar berikut

• Klik Simpan

Membuat Auto Read More dengan Gambar Thumbnail

Membuat Auto Read More dengan Gambar Thumbnail

Versi ini adalah hack script dari Rilwis yang telah di update dan dimodifikasi untuk membuatnya lebih usefull/multi guna. Lebih banyak fitur-fitur yang dapat Sobat manfaatkan untuk membuat auto readmore yang user friendly, seperti : thumbnails floating,post skipping, ringkasan dengan dan tanpa thumbnails dan beberapa fitur utama new update, yaitu :

1.Terdapat Automatic default thumbnail image ketika postingan tidak mempunyai atau disertakan gambar/ image di dalamnya.

2.Dapat dengan mudah untuk membuat turn off/disable auto read more untuk beberapa posting pertama.

3.Opsi turn on/off auto readmore pada homepage and label page.

Sebelum mulai membuat Auto Read More, check jika Anda telah memasang Read More Link atau Auto Read More link di template, maka hapus kodenya dahulu semuanya. Caranya ikuti petunjuk Cara Menghapus Read More/Auto Read More Link di Blogger

Langkah Pemasangan Kode Script Auto Read More

1. Masuk ke Blogger Dashboard > Template

2. Backup template Anda

3. Click Edit HTML

4. Lanjutkan

5. Check Expand Widget Template checkbox

6. Cari code tag  </head> 

    Untuk memudahkan pencarian gunakan Control + F

7. Tambahkan / letakkan kode berikut tepat diatas tag  </head>

    Kode nya :

<script type='text/javascript'>
var summaryConf = {
    showImage: true,
    imgFloat: 'left',
    imgWidth: 120,
    imgHeight: 90,
    defaultThumb: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQrNenZWXmWnew75exxvJ_xJ0OMV9_XFc1rn1TDqY1aXx8JOwDIITZFZa9VhrTi8kFA8gs1HJxkxKbC1VHfD0vdnfOaV-O7ImXYDkWQAFMxKY4B2z2Td23SQmxDwvMdeay1NXHuSoZZ1k/s1600/no-thumb.jpg',
    words: 65,
    wordsNoImg: 80,
    skip: 0,
    showHome: true,
    showLabel: true
};
</script>
<script src='http://problogizjs.googlecode.com/files/autoreadmore.js' type='text/javascript'/>

8. Cari tag line  <div class='post-body entry-content'>

9.  Letakkan kode berikut tepat dibawah tag <div class='post-body entry-content'>

     Kode nya :

<span expr:id='data:post.id'><data:post.body/></span> <b:if cond='data:blog.pageType == &quot;index&quot;'> <script type='text/javascript'>summary(&quot;<data:post.id/>&quot;)</script> <span style='float:right;padding-top:12px;'><a expr:href='data:post.url'>Read More</a></span> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <script type='text/javascript'>summary(&quot;<data:post.id/>&quot;)</script> </b:if> </b:if>

10. Klik Pratinjau / Preview, setelah semua OK
      Save / Simpan Template

Kostumisasi Fitur

Anda dapat merubah code control fitur yang telah diberi warna-warna pada script auto read more diatas, antara lain :

showImage: true, Jika Sobat tidak ingin menampilkan gambar thumbnail ganti "true" menjadi "false"

imgFloat: 'left', Jika ingin posisi gambar di sebelah kanan ganti menjadi 'right'

imgWidth: 120, Ukuran lebar gambar

imgHeight: 90, Ukuran tinggi gambar

defaultThumb:'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQrNenZWXmWnew75exxvJ_xJ0OMV9_XFc1rn1TDqY1aXx8JOwDIITZFZa9VhrTi8kFA8gs1HJxkxKbC1VHfD0vdnfOaV-O7ImXYDkWQAFMxKY4B2z2Td23SQmxDwvMdeay1NXHuSoZZ1k/s1600/no-thumb.jpg', Gambar default ini muncul jika postingan tidak ada gambarnya. Sobat juga bisa menggantinya dengan url gambar pilihan sendiri.

words: 65, Jumlah kata jika ringkasan dengan thumbnail

wordsNoImg: 80, Jumlah kata jika ringkasan tanpa thumbnail

skip: 0, untuk buat on/off fungsi auto readmore pada beberapa postingan. Jika di set angka "0" maka berarti all post/semua postingan diterapkan fungsi auto readmore 

showHome and showLabel: fungsi auto readmore pada halaman page dan label page. Jika di set "true" maka fungsi auto readmore enable/on dan "false" berarti off/disable

Itulah Sobat, cara membuat Auto Read More, semoga bisa membantu para Sobat bloger.

Cara Menghapus Read More/Auto Read More Link di Blogger

Cara Menghapus Read More/Auto Read More Link di Blogger

Sobat bloger..kali ini saya mau share tentang Cara Menghapus Read More/Auto Read More Link di Blogger, yang terdiri dari 2 bagian yaitu : Menghapus Read More Link Bawaan Blogger (fungsi Jump Break) dan Auto Read More Link. Dengan menghapus atau menghilangkan kode Read More link tersebut pada template blogger, akan membuat posting di homepage blog ditampilkan seluruhnya / seutuhnya tanpa ada ringkasan / summary.

Tentu maksudnya bisa berbeda-beda tiap individu, ada yang menghapusnya karena ingin memasang Auto Read More yang baru dan lebih baik mungkin, atau ada juga yang malah lebih suka postingan / artikel di homepage ditampilkan secara utuh tanpa ada pemotongan.

Oleh karena itu, jika Sobat ingin menghapus fungsi Read More link, baik yang bawaan/default blogger maupun yang Auto Read More feature link. Ikuti saja tutorial dan panduannya dibawah ini.

1. Menghapus / Remove Read More Link Bawaan Blogger ( Fungsi Jump Break Link )
 

Masuk Blogger > Template > Edit HTML

Backup your template

Click the "Expand widget Templates" Box

Tekan Control + F

Cari tag line  

<data:post.body/>

Dibawahnya hapus kode berikut ini :

<b:if cond='data:post.hasJumpLink'> 
<div class='jump-link'> 
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a> 
</div> 
</b:if >

Kemudian Save Template
Selesai!!. Sobat sudah menghapus fungsi Jump Break link Blogger pada blog Anda.

2. Menghapus Auto Read More Link di Blogger 

Untuk yang ini tidak semudah atau se-sederhana menghapus Jump Break Link diatas, karena type template dan jenis kode Auto Read More bisa berbeda-beda. Untuk itu saya akan berikan 2 contoh dibawah dengan cara yang berbeda.

Cara Pertama

Remove Blogger Auto Read More Option

Masuk Blogger > Template > Edit HTML

Backup your template

Click the "Expand widget Templates" Box

Tekan Control + F

Cari tag line

<div class='post-body entry-content'>

Dibawahnya cari semua kode seperti berikut ini :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<div class='readmorecontent'><a class='readmore' expr:href='data:post.url'><b>Read more &#187;</b></a></div>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if> <b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

note : beberapa code mungkin bisa berbeda tergantung jenis template, tapi secara keseluruhan hampir sama.

Gantilah semua kode diatas dengan kode berikut :

<data:post.body/>

Kemudian Save Template

Refresh Homepage blog Sobat dan check fungsi Auto Read More telah hilang dari blog Sobat.

Namun ada kasus yang masih melihat tombol Read more link, setelah melalui semua proses diatas, maka ini bisa diatasi dengan kembali cari kode mirip berikut dibawah :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div class='readmore-wrap'>
<a class='readmore' expr:href='data:post.url'>Read More</a>
</div>
</b:if>
</b:if>

Save Template Sobat sekali lagi,
Dan Selesai!!

Cara Kedua

Remove Auto Read More Feature with Thumbnail

Masuk Blogger > Template > Edit HTML

Backup your template

Click the "Expand widget Templates" Box

Tekan Control + F

Cari semua kode yang mirip seperti berikut :

<p><script type='text/javascript'> summary_noimg = 800; summary_img = 650; img_thumb_height = 150; img_thumb_width = 200; </script> <script type='text/javascript'> //<![CDATA[ function removeHtmlTag(strx,chop){ if(strx.indexOf("<")!=-1) { var s = strx.split("<"); for(var i=0;i<s.length;i++){ if(s[i].indexOf(">")!=-1){ s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); } } strx = s.join(""); } chop = (chop < strx.length-1) ? chop : strx.length-2; while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++; strx = strx.substring(0,chop-1); return strx+'...'; } function createSummaryAndThumb(pID){ var div = document.getElementById(pID); var imgtag = ""; var img = div.getElementsByTagName("img"); var summ = summary_noimg; if(img.length>=1) { imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>'; summ = summary_img; } var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; div.innerHTML = summary; } //]]> </script> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script> <div><a expr:href='data:post.url'>Read more &#187;</a></div> </b:if> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if> <b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if></p>

Gantikan semua dengan kode dibawah ini :

<p><data:post.body/></p>

Kemudian Save Template

Selesai!!

Semoga metode-metode Cara Menghapus Read More Link di Blogger diatas bisa membantu Sobat semua. Mungkin Sobat bisa menambahkan metode lain dengan senang hati saya menerimanya sebagai saling tukar informasi atau sharing bersama.

Cara Membuat Blockquote/Kotak Khusus Kode Di Postingan

Cara Membuat Blockquote/Kotak Khusus Kode Di Postingan

Met pagi Sobat semua seperti yang sudah diketahui betapa pentingnya untuk kita jika mengetahui 

Cara Membuat Blockquote Di Postingan atau Artikel, terutama yang diblognya berkonsep 

tentang tutorial tips n trik blog. Membuat blockquote bertujuan agar pengunjung tidak bingung dan bisa membedakan mana yang kode Html atau bukan.

Dari pada panjang lebar, karena yang lebar itu mulutnya tukul simak tutorial dibawah ini

Cara Membuat Blockquote atau Kotak Khusus Untuk Kode HTML/JavaScript Di Posting/Artikel

1.Log in ke blog

2.Buat Entri Baru

3.Pilih HTML

4.Copy kode dibawah ini

<blockquote style="background-color: #f6ebc1; border-left: 5px solid #fce27c; margin: 0; margin: 1em 3em; padding: .5em 1em;">
Masukkan kode atau kata disini </blockquote>

Catatan: ganti yang berwarna merah dengan "terserah anda"

sedangkan yang berwarna biru adalah warna latar belakang atau background !!
bingung mencari kode warna html? klik aja disini


5.Selesai

Cara Membuat Gambar Membesar DiSentuh Mouse

Cara Membuat Gambar Membesar Disentuh Mouse - Banyak sekali cara untuk mempercantik tampilan sebuah Blog yang kita miliki salah satunya dengan Cara Memperbesar Gambar Saat Disorot Mouse, Dimana Tampilan sebuah Gambar atau Foto akan Membesar Saat Disorot Oleh Pointer Mouse.

Baiklah untuk lebih jelasnya Cara Memperbesar Gambar Saat Disorot Mouse berikut contohnya, silahkan arahkan pointer mouse pada Gambar dibawah ini :

 
Nah seperti itulah Cara Memperbesar Gambar Saat Disorot Mouse yang akan saya share pada kesempatan kali ini. Apabila sahabat tertarik untuk membuatnya silahkan sahabat copy paste kode dibawah ini dan letakan pada halaman posting atau sidebar milik sahabat :

<style type="text/css"> border: none; vertical-align: top; </style> <script src="http://sundaboy.googlecode.com/files/sundaboyzoom.txt" type="text/javascript"></script><img border="0" class="expando" height="100" src="URL GAMBAR" width="100" />

Keterangan :

• Ganti URL GAMBAR dengan url gambar yang akan diperbesar
• Ukuran Tinggi dan Lebar harus lebih rendah dibanding ukuran aslinya, karena kode ini akan memperbesar sesuai dengan ukuran gambar yang sahabat masukan. misalnya ukuran gambar asli adalah tinggi : 200px dan lebar 300px. Maka sahabat harus merubah kodenya menjadi lebih kecil dari ukuran aslinya, misalnya tinggi 100px dan lebar 200px. Nanti saat disorot oleh mouse maka Gambar akan di zoom menjadi ukuran aslinya yaitu 200px dan 300px..

Bagaimana?! mudah bukan  Cara Memperbesar Gambar Saat Disorot Mouse,

 semoga bermanfaat untuk sahabat. kalau ada kekurangan mohon untuk dimaklumi