Showing posts with label blog. Show all posts
Showing posts with label blog. Show all posts

Saturday, December 7, 2013

Cara Menduplikasi Semua Hasil Postingan Pada Blog

Pada tulisan sebelumnya mengenai cara menduplikasi blog saya menjanjikan akan membuat tulisan lanjutan mengenai cara menduplikasi postingan. Mengapa hal ini penting? Paling tidak, ada dua hal yang dapat dijadikan alasan: Pertama, jika sewaktu-waktu blog kita diblokir, kita masih memiliki arsip semua artikel kita sehingga bisa di-upload kedalam blog baru kita tanpa harus melakukan pengetikan ulang. Dan kedua, arsip ini bisa kita masukkan kedalam blog duplikat kita sehingga dapat memudahkan kita dalam merancang dan menata layout blog duplikat sebelum dimasukkan kedalam blog yang asli.

Lantas bagaimana cara untuk menduplikasi postingan ini? Nah bagi kamu yang belum tahu caranya silahkan ikuti langkah-langkah berikut dengan penuh kesabaran, ketabahan, dan keikhlasan, hehehe... Ingat, ini bulan puasa lho!

Langkah pertama
  • Login ke akun blogger kamu.
  • Dari halaman Dasbor, pilih Pengaturan blog asli kamu, sehingga nampak seperti gambar berikut:
  • Selanjutnya klik pada bagian Ekspor blog, sehingga muncul seperti gambar berikut:
  • Klik Unduh blog, dan tekan Ok untuk melakukan downloading.

Nah selesai deh. Sekarang kamu sudah memiliki arsip semua postingan blog kamu dalam satu file yang berekstensi xml. Kamu dapat meng-upgrade file ini jika kamu menambahkan postingan-postingan baru.

Bagi kamu yang ingin memindahkan file tersebut kedalam blog duplikat (blog baru), kamu dapat mengikuti langkah kedua berikut:

Langkah kedua
  • Klik dasbor pada menu di sebelah kanan atas.
  • Dari halaman Dasbord, pilih Pengaturan blog duplikat (blog baru) kamu.
  • Selanjutnya klik pada bagian impor blog, sehingga muncul seperti gambar berikut:
  • Klik Browse, lalu masukkan alamat file yang sudah di-download tadi.
  • Isi verifikasi kata dan centrang pada bagian Terbitkan semua entri yang diimpor secara otomatis jika ingin menerbitkannya.
  • Klik Impor Blog, dan tunggu beberapa saat hingga proses pengimporan selesai.

Nah, selesai deh kerjaan kamu. Sekarang kamu tidak perlu khawatir jika blog kamu di-banned oleh mbah Google karena kamu sudah memiliki arsip dari semua hasil postingan kamu itu, termasuk komentar-komentar yang ada di dalamnya.
Ok coy, selamat mencobanya...
ReadFull Article ..

Thursday, October 24, 2013

Cara Mudah Memodifikasi Tampilan Komentar Blog

! -Cara Mudah Memodifikasi Tampilan Komentar Blog. Mungkin diantara para sahabat blogger,sudah bosan dengan model kotak komentar pada blog sobat atau berniat untuk memodifikasi kotak komentar blog anda. Nah pada tutorial kali ini kita akan belajar bagaimana memodifikasi tampilan kotak komentar blog sobat supaya lebih menarik dan pastinya lebih keren dukz hehehehe. Untuk demonya sobat silahkan sobat lihat pada gambar dibawah ini :



Bagaimana setelah sobat melihat gambar diatas apakah sobat tertarik untuk membuatnya???
Jika Tertarik Ikui Langkah Berikut.....

Untuk memodifikasi tampilan kotak komentar blog ikuti saja langkah langkah dibawah ini :
Pada dasbor pilih rancangan kemudian Edit HTML
Lalu centang Expand Template Widget
Jangan lupa Download Template Lengkap biar aman
Setelah itu cari kode berikut ini :

/* Comments
----------------------------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em; }

Nb : Mungkin setiap bagian code css komentar berbeda-beda pada setiap template.
Setelah itu ganti css komentar diatas dengan css komentar dibawah ini :

/* Comments
----------------------------------------------- */
.commentlistdiv {
margin-top: 10px;padding:10px;
background: #FFF;border:
1px dotted #ddd;font-size: 0.75em;color: #666;}

.commentlistdiv h1 {font-size: 1.3em;
color: #366799;border-bottom: 1px solid #eee;
line-height: 1.5em;}
.commentlist li {background: #fff;
border-bottom: 1px dotted #ddd;padding: 20px;}
.commentlist li.alt {background: #fff;}

.pane_l {float: left;display: inline;
width: 160px;min-width: 160px;max-width: 160px;
border-right: 1px dotted #ddd;padding-right: 20px;margin-right: 20px;}
.pane_r {display: block;line-height: 1.5em;margin-left: 201px;}

.c_author {font-size: 0.9em;font-weight: bold;margin: 0px 0px 7px 0px;}
.c_avatar {display: block;margin: 0px 0px 7px 0px;}
.c_date {color: #aaa;font-size: 0.9em;margin: 0px 0px 7px 0px;}
.c_approved {color: #aaa;font-size: 0.9em;}
.comment-form { background:#EFEFEF; border:5px solid #cccccc;
margin:0 10px 20px 10px; padding:10px 0 0 15px; }
.owner-Body {display: block;line-height: 1.5em;margin-left: 201px;}
.owner-Body p {
font-size:100%;
margin:0 0 .2em 0;
color:#FF0000;
text-decoration:bold;
}
Ganti warnanya dengan selera menggunakan tool warna ini
Setelah itu cari lagi kode dibawah ini :

<dl id=comments-block>
<b:loop values=data:post.comments var=comment>
<dt expr:class=&quot;comment-author &quot; + data:comment.authorClass expr:id=data:comment.anchorName>
<a expr:name=data:comment.anchorName/>
<b:if cond=data:comment.authorUrl>
<a expr:href=data:comment.authorUrl rel=nofollow><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class=comment-body>
<b:if cond=data:comment.isDeleted>
<span class=deleted-comment><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class=comment-footer>
<span class=comment-timestamp>
<a expr:href=data:comment.url title=comment permalink>
<data:comment.timestamp/>
</a>
<b:include data=comment name=commentDeleteIcon/>
</span>
</dd>
</b:loop>
</dl>
Setelah ketemu kemudian ganti semua kode diatas dengan kode dibawah ini :

<ul class=commentlist>
<b:loop values=data:post.comments var=comment><li>
<div class=pane_l>
<div class=c_author>
<b:if cond=data:comment.authorUrl>
<a expr:href=data:comment.authorUrl rel=nofollow><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</div>
<div class=c_avatar/>
<div class=c_date><data:comment.timestamp/></div>
<div class=c_approved/>
</div>
<b:if cond=data:comment.author == data:post.author>
<div class=owner-Body>
<p><data:comment.body/></p>
</div>
<b:else/>
<div class=pane_r>
<data:comment.body/>
</div>
</b:if>
<div class= clear/></li>
</b:loop>
</ul>

Langkah terakhir Simpan Template... Semoga Artikel Ini Bermanfaat,,,,,,,Mohon Tinggalkan Kritik dan Saran Karena Kritik Dan Saran Anda Sangat Berarti Buat Admin ! Mohon Perhatianya Terima Kasih ,,,,,,,,,,,
ReadFull Article ..

Daftar Isi Blog Dan Cara Mudah Membuat Daftar Isi Dengan Jquery Diblogspot



Cara Mudah Membuat Daftar Isi Dengan Jquery Diblogspot - Seperti yang anda ketahui, Daftar Isi sangat berperan penting dalam blog. Daftar isi bisa memudahkan pengunjung untuk menemukan artikel yang dicarinya pada suatu blog. Ok deh gan, Kali ini saya mau share lagi Tentang Daftar Isi Otomatis Dengan Efek Jquery. Daftar isi ini sangat menawan dan cantik sekali, mampu memikat hati para blogger. liat gan screenshootnya. Lumayan cantik bukan ? itulah efek efek yang mampu diciptakan Jquery,. jangan bengong aja gan, langsung aja dipraktekin mantranya berikut : Login ke Blogger Kemudian Cari Rancangan - Edit Html - expand widget template. Kemudian letakkan kode berikut diatas kode
 ]]></b:skin>

#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbMSoh9OBi7NsUdrcVeieb1ubGq301nPdf5wtDAw0BK5KeYag8xNwVBJ8PeqoE_sKbTe6oRsiMp8my0q4kOhK2zczuBXN3BSs6wUYBIwBg3xHrIFXeXVFyJcEaY5EnUaEwQDEysfTihis/s320/bg5.gif) repeat-y scroll left center #E7F7FB;
padding:2px 0;
border:1px solid #339DC6;
}
.dafis-label{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFSv0CZ7tpTlA_ETuXuVAzdOOCxXWy-qY7unW8ftbcql7w9iqseUTd-qNry-NUTogkZEETqT7ujfvEUtvbZ_HqWe-BsdY7gmAUMQ6DLSF61_6eMpmwmbIja5QIMY0nrwrBxBaRRhA8jNA/s1600/bg4.gif) repeat-x scroll 0 0 #E1F4FB;
font-weight:bold;
line-height:1.4em;
overflow:hidden;
white-space:nowrap;
vertical-align: baseline;
margin: 1px 3px;
outline: none;
cursor: pointer;
text-decoration: none;
padding: 2px 10px;
color: #fff;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
border:1px solid #2F94BA;
}
.dafis-label:hover{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUiTrEohm7B2P9fawI_CsO2GbuCpX3vywHbdc4oTpZB30mT9T-Z7fwOjo7TWvgOrpnA_VkCEfjdldZr_1FTyf4F9GvIUqO-q0Jm2RXT9RDIZSyDweqPaqpieb_JslG1RY2Wg6-aSoRk6w/s320/bg2.gif) repeat-x scroll 0 0 #E1F4FB;
color:#003366;
}
.dafis-daf ol{
margin:0 0 0 30px !important;
padding:0 !important;
}
.dafis-daf ol li{
background-color:#C9E9F4;
line-height:1.5em;
margin:1px 3px !important;
white-space:nowrap;
text-align:left;
border:1px solid #339DC6;
}
.dafis-daf ol li a{
text-decoration: none !important;
color:#333 !important;
display:block;
padding-left:10px;
}
.dafis-daf ol li a:hover{
background: #7BC4DF;
border-left: 5px #333 solid;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}

Jika sudah , tahap berikutnya adalah Meletakkan kode berikut diatas kode </head>
<script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js type=text/javascript/>

Kemudian Save Template.
Selanjutnya meletakkan Widgetnya di Sidebar :
Langsung klik Tata Letak - Add Widget - Html/Javascript
Kemudian Copy paste kode berikut :

<script type="text/javascript" src="http://cayun-code.googlecode.com/files/Acc1.js"></script>
<script src="http://
tanpa-isi.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>

Nb :
Ganti tulisan yang berwarna biru dengan alamat blog sobat.
Kemudian Save.
Artikel ini di ambil dari:http://tanpa-isi.blogspot.com/
ReadFull Article ..