Cara Membuat Tampilan Home Page Tersendiri

Seperti janji saya sebelumnya tentang Cara Menyembunyikan Tampilan di Home Page :q; atau dengan kata lain Cara Membuat Tampilan Home Page Tersendiri :z; yang mana triks ini hanyalah rekayasa saja karena elemen yang ada di Home Page kita sembunyikan :y;

Hal ini pernah saya posting di Blog yang lain, kalau kawan ingin membacanya silahkan disini dan Demonya disini cuma semenjak bergulirnya GPlus dan setelah saya coba menemui Kegagalan pada beberapa Template kalau kawan ingin mencobanya saya persilahkan seandainya gagal jangan berkecil hati alias ngambek, karena disini saya akan berbagi dengan kawan yang caranya lebih simpel sekali setelah saya mengadakan percobaan :r;

Tapi sebelumnya kita buat kesepakatan dulu tentang Struktur Template secara umum dari atas sampai kebawah yaitu - [Header - Menu Navigasi] -[Postingan - Sidebar] - [Footer - Credit] atau apalah namanya, silahkan kawan melihatnya pada Template masing-masing - OK langsung ke :

Cara Membuatnya :

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML 
• Cari ]]></b:skin>
• Copas kode berikut dibawahnya 

<style type='text/css'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
#main-wrapper, #sidebar-wrapper, #sidebarkanan-wrapper, #sidebartengah-wrapper, #footer-wrapper, #credit-wrapper  {display:none}
  </b:if></style>

itu hanyalah contoh saja, silahkan kawan menyesuaikan dengan keadaan Template kawan
Kalau melihat kode diatas berarti yang ada pada Home Page hanya Header dan Menu Navigasi

• Sampai disini simpan Template kawan dulu 
• Selanjutnya cari <div id='main-wrapper'> untuk gampangnya pilih Lompat ke Widget - Blog1

• Tambahkan script berikut tepat diatasnya 

<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <div class='container' style='text-align:center;width:100%;'>
<b:section class='container' id='container' showaddelement='yes'>
</b:section>
  </div></b:if>

• Simpan kembali Template kawan 
• Selanjutnya pilih Tata Letak dan lihat perubahan yang ada 

screenshot setelah ditambah gadget

Perhatikan yang saya kurung dengan warna merah

• Tambahkan Gadget - pilih tanda [+] pada HTML / JavaScript
• Simpan Script berikut kedalamnya

<center><a href="http://blogbego-creation.blogspot.com/search?max-results=10"><img border="0" height="270"  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha9XWzV0SvE6jQtCx4O58fJbXvfCWbyFc3nS8KxyDPwIDwfvadEqqOxEKuolN6adyiOx4x30P7znYoOn-CDd_K-_ASPDad3m7EsXNBAb32LR5HtSdmjUTc1AFbfLs6YvcaNZorkSwsfUo/s1600/BOMO-.gif" width="500"/></a></center>

Hasilnya seperti berikut


Silahkan kawan ganti :
- Teks yang berwarna merah adalah URL Blog saya silahkan ganti dengan URL Blog kawan
- Angka 10 adalah jumlah postingan terakhir yang akan ditampilan [sesuaikan]
- Teks yang berwarna biru silahkan diganti dengan image kesukaan kawan atau dengan kata
Contohnya seperti berikut
<center><a href="http://NAMA BLOG KAWAN.blogspot.com/search?max-results=10"><button> Masuk </button></a></center>

• Terakhir simpan Blog kawan dan lihat hasilnya 

Seandainya kawan mempunyai masukkan atau cara yang lain bisa disampaikan lewat Komentar, semoga ada manfaatnya dan sukses selalu 

Read more ...

Cara Yang Benar Tambahkan kode JavaScript di Blogger

Sambil menambahkan kode javascripts dalam template editor Blogger, kita sering menghadapi beberapa Kesalahan XML aneh seperti Kesalahan parsing XML, baris 768, Kolom 20: Isi elemen harus terdiri dari data karakter well-formed atau markup. Ini macam kesalahan terjadi ketika kode JavaScript tidak terbentuk dengan baik, atau kode tersebut tidak ditulis dengan benar oleh pengembang. Baru-baru ini, salah satu pengguna kami meminta kami Cara Yang Benar Tambahkan kode JavaScript di Blogger? Tutorial ini akan berubah menjadi berguna bagi mereka yang baru mulai belajar template Blogger dan pengembangan plugin. Pada artikel ini, kami akan menunjukkan Cara Yang Benar Tambahkan kode JavaScript di Blogger?

Kecerobohan:

Sebelum menginstal kode baru dalam template nya seseorang harus memastikan bahwa tag script atau gaya ditutup dengan benar. Sebagian besar waktu Anda lupa untuk menyalin tag script berakhir, dan pada akhirnya pada akhirnya itu menunjukkan kesalahan. Bagi mereka yang tidak tahu banyak, mereka menggunakan kode seperti ini:

<script>
jQuery(document).ready(function($) {
---------------------------
---------------------------
---------------------------
});

Di sini, jelas dapat dilihat bahwa tag <script> tidak dilanjutkan dengan penutup yang tepat    </script> tag yang salah. Teknik yang benar adalah dengan menutup tag dengan benar, seperti yang kita lakukan dalam HTML sederhana. Mari kita pergi ke depan dan melihat cara yang tepat untuk melakukannya.

Cara Benar Tambahkan kode JavaScript di Blogger?

Menambahkan Script di Blogger sangat mudah. Yang perlu Anda lakukan adalah pergi ke Blogger.com >> situs Anda >> Template >> Edit HTML. Sekarang tergantung pada Anda di mana Anda ingin menyisipkan coding JavaScript Anda. Namun, kami lebih suka Anda untuk menambahkannya di atas </head> tag karena ini adalah tempat di mana semua hal-hal teknis yang hadir. Berikut adalah cara kode akan terlihat seperti:

<script type="text/javascript">
//<![CDATA[
Your JavaScript coding here
//]]>
</script>

Setelah script yang benar ditambahkan dalam template Anda tekan tombol "Simpan Template", dan Anda tidak akan menghadapi kesalahan. Yang berarti bahwa JavaScript secara benar ditambahkan dalam template blogger Anda.

Kami harap tutorial ini telah membantu Anda untuk belajar Cara Yang Benar Tambahkan kode JavaScript di Blogger. Marilah kita tahu tentang pengalaman Anda? Dalam kasus Anda menghadapi kesalahan seperti ini juga. Jangan ragu untuk meninggalkan kesalahan di bawah ini yang anda hadapi sambil menambahkan kode baru untuk template Anda.

Read more ...

Zikazev Simple Gray - Free Responsive Blogger Template

Zikazev Simple Gray - Kali ini saya akan berbagi template buatan kang Ismet, template ini dibagikan oleh saya dengan gratis. Klo masalah SEO Friendly atau tidaknya saya kurang tau, yang saya tau SEO Friendly itu artikel baru cepat terindex oleh Google.

Fitur-fitur template :

• Simple
• Auto Read More
• Menarik
• Enak Dipandang
• Footer 3 kolom
• Contact di header
• Search keren di Header
• Loading Cepat
• Pokonya Sipp deh

Demo Download

Read more ...

Sembunyikan Postingan pada Home Page

Pada Blog yang lain saya pernah membahas tentang Tampilan Home Page tanpa Postingan :z; dan Tampilan Home Page Full Hidden yang juga dibahas oleh :y; Master DTE dengan judul Tips membuat halaman muka Blog tersendiri dan setelah saya coba sedikit mengalami masalah pada Template saya khususnya pada Tata Letak yang tak bisa menyimpan seandainya mengadakan perubahan letak Gadget, begitu juga saat akan berpindah ke Template maupun menutup atau keluar dari Blog, perhatikan gambar berikut 

Tampilan pada Tata Letak

Tampilan saat berpindah ke Template

Untuk mengatasi masalah tersebut saya bereksprimen menggabungkan dan menemukan hasil yang caranya sangat simpel sekali, [perhatikan gambar pertama saya] kalau kawan ingin mencoba saya persilahkan dan ikuti caranya

• Seperti biasa masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Setelah - Pos dan Komentar 
• Lihat paling atas Pos - Tampilkan sebanyak mungkin ? rubah menjadi 0 posting terus simpan setelan

• Selanjutkan pilih Template - Edit HTML 
• Cari kode yang kurang lebih seperti berikut 

<b:section class='main' id='main' showaddelement='no'> 

<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/> 

</b:section>

Tepat diatasnya tambahkan kode berikut :

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:section class='container' id='container' showaddelement='yes'>

</b:section>

</b:if>

Hasil jadinya sebagai berikut :

• Simpan Template kawan
• Selanjutnya pilih Tata Letak, seandainya tidak ada kesalahan Hasilnya sebagai berikut 

• Silahkan Tambahkan Gadget - HTML / JavaScript, soal isi [Gambar, atau Ucapan Selamat Datang] terserah kawan 

Kalau ada kawan bertanya - bagaimana cara membuat Tampilan di Home Page Full Hidden, tunggu postingan saya berikut :q; 

Read more ...

Cara Membuat Kolom Komentar Offline

Membuat Kolom Komentar Offline - Setelah lama saya tidak update karna saya lagi sibuk di dalam bualan puasa ini, kali ini saya akan update Membuat Kolom Komentar Offline Tutorial ini saya dapat dari Blog Kesukaan saya yaitu Kang Ismet yang baru saja kemarin update tutorial ini, dan langsung saya Post ulang.
Fiture ini berfungsi untuk mematikan Form Komentar agar pengunjung Blog Anda tidak bisa berkomentar disaat kesibukan anda memaksa anda untuk mematikan komentar dalam Blogger Anda.

Ok, mari kita bahas cara Pemasangan Fiture Kolom Komentar Offline ini.

Langkah 1 : Simpan Kode CSS

Simpan kode CSS ini di atas </b:skin>

/* Offline Mode
----------------------------------------------- */
#offline-mode{
background:#dfdede url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkWsobRneRnh3gNYGyreeZxE78XLtlFcMuy2pueDME38wz8Yzl4Nf66sfsAA8HBOiNQAKfz_H-hgAmSD6LN6pMtvGf16XuNc6suzI1tOVL96psQofJw7q0m3RoiJwOJXS8L4Za6XkVXK0/s1600/offline-mode.png)no-repeat 3% 50%;padding:20px 20px 20px 175px;border:1px solid #c9c9c9;margin-bottom:10px}
#offline-mode h2{
font-size:220%;
text-transform:uppercase;
color:#fff;
text-shadow: -1px -1px  3px rgba(0,0,0,0.3);
}
#offline-mode p{
font-size: 12px;
color:#888;
line-height:1.8em;
margin-top:-15px;

Silakan Edit Sendiri Jika ingin memodifikasi

Langkah 2 : Simpan Kode HTML

Untuk menyimpan kode HTML, sobat cari kode <b:includable id='threaded-comment-form' var='post'> kemudian expand (klik panah sebelahnya) maka akan muncul kode seperti ini :

<div class='comment-form'>
...kode panjang....
</div>

tambahkan kode ini sesudahnya atau sebelum </b:includable>

<div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>

setelah itu, nonaktifkan sementara kolom komentar dengan menambahkan kode <!-- dan --> pada kode sebelumnya. Maka hasil keseluruhan menjadi seperti ini :

<!-- <div class='comment-form'>
..............
  </div>-->
 <div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>

Simpan Template.

Apabila ingin mengaktifkan kembali kolom komentar, pindahkan tanda <!-- dan --> pada HTML Offline-Mode, menjadi seperti ini :

<!--<div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>-->

Simpan kembali Template....

Itulah Membuat Kolom Komentar Offline semoga bermanfaat.

Source http://blog.kangismet.net/2013/08/membuat-kolom-komentar-offline.html

Read more ...

Cara Lain Mengganti Header dengan Animasi

Kawan masih ingat dengan Artikel saya Cara Mengganti Header dengan Animasi :z; yang sedikit agak ribet apalagi berisi mengganti dan merubah beberapa Script, tapi yang sekarang sangat gampang sekali, kawan cukup melihat lebar Header untuk membuat lebar maksimal Animasi :q;

oke langsung saja ke Cara membuatnya :

• Buat Animasi Header Blog kawan
• Simpan Animasi tersebut pada Hosting kawan dan ambil Link-nya
• Selanjutnya masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Tata Letak
• Lihat kiri atas atau pada bagian Header - Edit 

• Masukkan Link Animasi kawan tadi pada Kotak - Dari web Tempelkan URL gambar dibawah 
• Pada Penempatan silahkan pilih [asal jangan Dibalik judul dan keterangan

              > Selain judul dan keterangan artinya hanya Animasi saja yang tampil

              > Tempatkan keterangan setelah gambar artinya dibawah Animasi ada Discreption Blog

• Simpan Blog kawan 

Read more ...

Membuat website full background

Saat ini teknik mendesain website sangat beragam, salah satu yang digemari para desainer yaitu membuat sebuah gambar menjadi background yang full satu halaman. Gambar full background akan menciptakan efek elegan pada website, tentunya harus didukung dengan pemilihan gambar yang bagus, jenis dan warna font yang dipakai juga menentukan.

Bagaimana cara membuat halaman website full background tersebut,  tidak terlalu sulit, pada tulisan ini wakaka design akan memberikan potongan kode yang berguna untuk membuat sebuah gambar menjadi full background.

Kita akan memanfaatkan fungsi css bernama Background-size.

Inti dari membuat website full background adalah menggunakan potongan kode seperti ini, bisa diterapkan di tag html, atau body.

html{
	background: url(img/bromo.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

Mulai dengan memilih gambar

Oke mari kita mulai dengan memilih gambar yang tepat, pada tulisan ini kami menggunakan gambar dari Daniele Parisi

Membuat Struktur HTML

Pada tulisan ini kita akan menggunakan 2 buah Font yang akan kita embed dari Google Web Fonts, yaitu

Oleh Script dan Open Sand

Rancangan struktur yang akan kita buat terdiri dari
header, untuk menempatkan judul website.
content, untuk menuliskan isi dari website.
footer, untuk menuliskan hak cipta dan sumber.

berikut ini kode selengkapnya

<div class="container">

	<div class="header">
		<h1 class="brand">Mount Bromo</h1>
		<span class="red">East Java,</span> <span class="white">Indonesia</span>
	</div>

	<div class="content">
		<p>Mount Bromo (Indonesian: Gunung Bromo), is an active volcano and part of the Tengger massif, in East Java, Indonesia. At 2,329 metres (7,641 ft) it is not the highest peak of the massif, but is the most well known. The massif area is one of the most visited tourist attractions in East Java, Indonesia. The volcano belongs to the Bromo Tengger Semeru National Park. The name of Bromo derived from Javanese pronunciation of Brahma, the Hindu creator god.</p>
		<p>Mount Bromo sits in the middle of a vast plain called the "Sea of Sand" (Javanese: Segara Wedi or Indonesian: Lautan Pasir), a protected nature reserve since 1919. The typical way to visit Mount Bromo is from the nearby mountain village of Cemoro Lawang. From there it is possible to walk to the volcano in about 45 minutes, but it is also possible to take an organised jeep tour, which includes a stop at the viewpoint on Mount Penanjakan (2,770 m or 9,088 ft) (Indonesian: Gunung Penanjakan). The best views from Mount Bromo to the Sand Sea below and the surrounding volcanoes are at sunrise. The viewpoint on Mount Penanjakan can also be reached on foot in about two hours. From inside the caldera, sulfur is collected by workers <a href="http://en.wikipedia.org/wiki/Mount_Bromo">Read More</a></p>
	</div>

	<div class="footer">
		<div class="footer-left">Designed by <a href="http://tutorial-webdesign.com">Wakaka Design</a> | back to <a href="#">tutorial</a></div>
		<div class="footer-right">Image By <a href="http://www.flickr.com/photos/daniele_parisi/2825831148/sizes/o/in/photostream/">Daniele Parisi</a></div>
	</div>

</div>

Code CSS

*{padding:0;margin:0}
html{
	background: url(img/bromo.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	font-family: 'Open Sans', sans-serif;
	font-size:13px;
	text-shadow: 0px 1px 2px #000;
}
a{color:#999;text-decoration:none}
a:hover{border-bottom:1px solid #999}
.header{
	padding:8% 2%;
	font-size:24px;
	text-shadow: 0px 1px 0px #333;
}
	h1.brand{
		font-size:50px;
		font-family: 'Oleo Script', cursive;
		text-shadow: 0px 2px 3px #f4f4f4;
	}
	.header span.red{color:#f20000;}
	.header span.white{color:#fff;}

.content{padding:2%;color:#f4f4f4;}
.content p{margin:10px 0}
.footer{
	padding:5% 2%;
	width:95%;
	position:absolute;
	overflow:hidden;
	color:#f4f4f4;
}
	.footer-left{
		position:relative;
		width:45%;
		float:left;
	}
	.footer-right{
		text-align:right;
		position:relative;
		width:45%;
		float:right;
	}

Sekian tutorial kali ini, silahkan tuliskan jika ada masukan atau pertanyaan. Tentang Membuat website full background
Terima kasih, salam Tempat Blogging indonesia :D

Read more ...

CSS Thread Comments Timeline Ala De5ain

CSS Thread Comments Timeline Ala De5ain ini adalah Style Thread Comments yang saya gunakan sebelumnya.ada beberapa fitur yang keren yaitu desain thread yang seperti timeline dan style komentar khusus author. CSS Thread Comments ini saya dapatkan dari Blog De5ain saya liat-liat sangan bagus, lau saya Post ulang deh ke Tampat Blogging. ok, langsung saja kita mulai memasang CSS Thread Comments Timeline Ala De5ain.

silahkan cari kode ]]></b:skin> atau </style> dan pastekan kode berikut diatasnya

/* Kotak Komentar */
#threaded-comment-form p{letter-spacing:0.8px;position:relative;border:1px solid #999;background-color:#E5E5E5;background:-webkit-gradient( linear,left top,left bottom,color-stop(.2,white),color-stop(1,#EDEDED) );background:-moz-linear-gradient( center top,white 20%,#EDEDED 100% );padding:16px;font-size:12px;line-height:1.4em;color:#000;margin:0 0 12px 5px;font-family:coda;border-radius:4px 4px 4px 4px}
#threaded-comment-form p::before{top:100%;border:solid transparent;content:"";height:0;width:0;position:absolute}
#threaded-comment-form p::before{border-top-color:#fff;border-width:12px;left:6%;margin-left:-28px}
.comments .comment-thread.inline-thread .comment .comment-block:target{border:1px dashed yellow}
.comments{background:#DDD;margin:0;padding:0;border-left:1px solid #ccc;border-right:1px solid #ccc;}
#comments h4{background:#f8f8f8;border-top:1px solid #CCC;border-bottom:1px solid #CCC;color:#000;display:block;font-size:14px;font-weight:bold;padding:10px;position:relative;text-align:center}
.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative}
.comment-thread ol{margin:0 0 18px}
.comments-content{padding:10px}
.comments .comments-content .comment-thread ol{list-style-type:none}
.comments .comments-content .user{font-style:normal;font-weight:bold}
.comments .avatar-image-container{float:left;max-height:50px;overflow:hidden;width:50px;background:#f5f5f5;border-radius:100%;margin:5px;}
.comments .avatar-image-container img{max-width:45px;height:45px;padding:4px;border-radius:100%;}
.avatar-image-container{border:1px solid #ccc;float:left;max-height:45px;overflow:hidden;padding:5px;width:45px}
.comments .comments-content .comment-header,.comments .comments-content .comment-content{border-bottom:1px solid #999;box-shadow:0 1px 0 #fff;display:block;margin-bottom:-1px!important;padding:6px}
.comments .comments-content .comment-content,.spammer-detected{font:13px/140% 'Coda',Calibri,'Myriad Pro',Myriad,'Trebuchet MS',Helvetica,Arial,sans-serif;color:#000;margin-bottom:0;padding:10px;text-align:justify}
.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:72px}
.comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #999;background-color:#E5E5E5;background:-webkit-gradient( linear,left top,left bottom,color-stop(.2,white),color-stop(1,#EDEDED) );background:-moz-linear-gradient( center top,white 20%,#EDEDED 100% );padding:10px;position:relative;border-radius:4px 4px 4px 4px}
.comments .comments-content .datetime a:link,.comments .comments-content .datetime a:visited{float:right!important;font-family:cambria,georgia,serif;color:#888!important;font-size:10px;padding:2px 10px}
.comment-replies .comment-block{box-shadow:none}
.comments .comments-content .comment{margin:2px 0 0;padding:0;width:100%}
.comments .comments-content .inline-thread{padding:0;margin-bottom:-16px}
.comments .comments-content .comment-replies{position:relative}
.comments .comment-thread.inline-thread{border-left:5px solid #f5f5f5;background:transparent;margin:2% 10% 2% 15%;padding:10px;}
.comments .comment-thread.inline-thread .comment{width:auto;padding:0;background:transparent;border:none;box-shadow:none}
.comments .comment-thread.inline-thread .comment .comment-block{border:1px solid #999;background-color:#E5E5E5;background:-webkit-gradient( linear,left top,left bottom,color-stop(.2,white),color-stop(1,#EDEDED) );background:-moz-linear-gradient( center top,white 20%,#EDEDED 100% );border-radius:4px 4px 4px 4px;padding:10px}
.comments .continue{border-top:0;width:auto}
.comments .continue a{background:#fff;color:#000;font-family:coda;text-align:center;float:right;font-weight:normal;padding:0 6px}
.comments .continue a:before,.comments .comment .comment-actions a:before{color:#000;font:normal normal 100%/normal "FontAwesome";content:"\f055";margin-right:.2em}
#comment-editor{width:103%!important}
.comment-form{width:100%;max-width:100%}
.comments .comments-content .loadmore{cursor:pointer;margin-top:3em;max-height:3em}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed,.comment .continue{margin:0;bottom:0;padding:0.6px 0;position:absolute}
.comments .comment .comment-actions a{padding:0 0 1px;display:block;position:absolute;top:65px;left:-60px;width:52px;text-align:center;border:1px solid #ccc;background-color:#EDEDED;background:-webkit-gradient( linear,left top,left bottom,color-stop(.2,white),color-stop(1,#E5E5E5) );background:-moz-linear-gradient( center top,white 20%,#E5E5E5 100% );font:11px/18px sans-serif;color:#333;font-size:12px}
.comments .comment .comment-actions a:hover,.comments .continue a:hover{text-decoration:none!important;color:#0070b0;background-color:#eee}
.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#346FC9!important}
.comments .thread-toggle{display:none}
.comments .comments-content .icon.blog-author{content:"";display:block;width:100%;height:4px;background-color:#4b8db5;background-image:-webkit-linear-gradient(left,#f3a01e,#D05D2A,#9dc425,#4b8db5,#7c48b5);background-image:-moz-linear-gradient(left,#f3a01e,#D05D2A,#9dc425,#4b8db5,#7c48b5);background-image:-ms-linear-gradient(left,#f3a01e,#D05D2A,#9dc425,#4b8db5,#7c48b5);background-image:-o-linear-gradient(left,#f3a01e,#D05D2A,#9dc425,#4b8db5,#7c48b5);background-image:linear-gradient(left,#f3a01e,#D05D2A,#9dc425,#4b8db5,#7c48b5);position:absolute;bottom:0;left:0}
.comment-footer{display:none;color:white;font-weight:bold;padding:0 0 10px;text-shadow:1px 1px #000000}
.comments .comment-block:before{border-color:transparent #f5f5f5 transparent transparent;border-style:solid;border-width:12px;bottom:0;content:"";display:block;height:0;left:-25px;position:absolute;top:14px;width:0}
.comments .comment-block:after{border-color:transparent #f5f5f5 transparent transparent;border-style:solid;border-width:13px;bottom:0;content:"";display:block;height:0;left:-25px;position:absolute;top:13.2px;width:0}
#comment-editor{background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjC020LpogqarG1aUrjDxQHMjHIi2bMf7oe83Gzj3T3eEzJxbdk5_Eu2QTKjFyYTROQKu6WeO73g4E65Nulj_-1T8kE5P0zM1kc2bGtysQGgsuKEHesV-tJ5LVmb9AQcdKvVPA1NkVIWhKX/s1600/ajax-loader+(2).gif') no-repeat 50% 30%}
.comments .comments-content .datetime:before{color:#888;content:"Berkomentar...";margin-left:.4em}
.comments .comment-thread.inline-thread .datetime:before{color:#888;content:"Membalas...";margin-left:.4em}
/* Efek thread-comment bertingkat hanya dengan CSS */
.comments .comment-thread.inline-thread .comment{margin:2px 0 0 -50px}

 jika sudah ada kode komentar seperti diatas , silahkan diganti.

source : http://de5ain.blogspot.com/2013/07/css-thread-comments-timeline-ala-de5ain.html

Read more ...

Tool untuk mengetahui Kawan Blogger

Kawan Blogger setelah sekian lama Ngeblog kemungkinan ada yang berkeinginan mengetahui para Blogger se-Wilayah [satu Kecamatan, satu Kabupaten / Kota, maupun satu Propinsi dan se-Negara] itulah yang akan saya bahas dan bagikan dengan kawan sekarang  :z;

Pada Google dulu pernah ada Tool untuk mengetahui kawan Blogger se-Wilayah, tapi karena sekarang sudah banyak perubahan terjadi yang menyebabkan banyak yang tidak berfungsi dengan baik dan sempurna :y; sama sekali

Tapi kawan jangan berkecil hati karena Master Beben Koben sudah berbaik hati membuatkan Tool tersebut dan kawan bisa mencobanya kira-kira siapa saja Blogger terdekat kita
Silahkan dicoba

Untuk mengetahui Blogger se-Wilayah

Kec.-Kota contoh: Mengwi-Badung

Propinsi contoh: Bali

Negara contoh: ID
AEAFAGAIALAMAOAQARASATAUAWAXAXAZBABBBDBEBFBGBHBIBJBLBMBNBOBQBRBSBTBVBWBYBZCACCCDCFCGCHCICKCLCMCNCOCRCUCVCWCXCYCZDEDJDKDMDODZECEEEGEHERESETFIFJFKFMFOFRGAGBGDGEGFGGGHGIGLGMGNGPGQGRGSGTGUGWGYHKHMHNHRHTHUIDIEILIMINIOIQIRISITJEJMJOJPKEKGKHKIKMKNKPKRKWKYKZLALBLCLILKLRLSLTLULVLYMAMCMDMEMFMGMHMKMLMMMNMOMPMQMRMSMTMUMVMWMXMYMZNANCNENFNGNINLNONPNRNUNZOMPAPEPFPGPHPKPLPMPNPRPSPTPWPYQARERORSRURWSASBSCSDSESGSHSISJSKSLSMSNSOSRSSSTSVSXSYSZTCTDTFTGTHTJTKTLTMTNTOTRTTTVTWTZUAUGUMUSUYUZVAVCVEVGVIVNVUWFWSYEYTZAZMZW

Design: Beben Koben - Modif :BlogBego 

Kalau kawan ingin memasang di Blog 

Caranya :

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Tata Letak - Tambah Gadget 
• Pilih tanda + pada HTML / JavaScript
• Copas Kode berikut kedalamnya 

<center><div style='font-size:16px;color:blue;'> Untuk mengetahui Blogger se-Wilayah </div></center>
<div style='overflow: hidden;width:270px;padding:5px 5px 0; display:block;text-align:center;margin: 5px auto 0; height:180px; background: rgb(255,255,255);border-top: 1px solid #333;border-left: 5px solid #000;border-right: 1px solid #333;border-bottom: 5px solid #000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius-bottomleft: 0px 0px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 0px 0px; -border-top-left-radius: 10px 10px;-border-bottom-left-radius: 0px 0px; -moz-border-radius-topright: 0px 0px;-moz-border-radius-bottomright: 20px 20px; -webkit-border-top-right-radius: 0px 0px;-webkit-border-bottom-right-radius: 20px 20px; border-top-right-radius: 0px 0px;border-bottom-right-radius: 20px 20px;'>
  <br/>
<form action="http://www.blogger.com/profile-find.g" method="get" target="top"><input size="1" name="t" type="text" value="l" style="display:none" /><label>Kec.-Kota contoh: <b>Mengwi-Badung</b></label><br /><input size="25" name="loc2" type="text" /><br/><label>Propinsi contoh: <b>Bali</b></label><br /><input size="25" name="loc1" type="text" /><br/><label>Negara contoh: <b>ID</b></label><br /><select name="loc0"><option value="AE" />AE<option value="AF" />AF<option value="AG" />AG<option value="AI" />AI<option value="AL" />AL<option value="AM" />AM<option value="AO" />AO<option value="AQ" />AQ<option value="AR" />AR<option value="AS" />AS<option value="AT" />AT<option value="AU" />AU<option value="AW" />AW<option value="AX" />AX<option value="AX" />AX<option value="AZ" />AZ<option value="BA" />BA<option value="BB" />BB<option value="BD" />BD<option value="BE" />BE<option value="BF" />BF<option value="BG" />BG<option value="BH" />BH<option value="BI" />BI<option value="BJ" />BJ<option value="BL" />BL<option value="BM" />BM<option value="BN" />BN<option value="BO" />BO<option value="BQ" />BQ<option value="BR" />BR<option value="BS" />BS<option value="BT" />BT<option value="BV" />BV<option value="BW" />BW<option value="BY" />BY<option value="BZ" />BZ<option value="CA" />CA<option value="CC" />CC<option value="CD" />CD<option value="CF" />CF<option value="CG" />CG<option value="CH" />CH<option value="CI" />CI<option value="CK" />CK<option value="CL" />CL<option value="CM" />CM<option value="CN" />CN<option value="CO" />CO<option value="CR" />CR<option value="CU" />CU<option value="CV" />CV<option value="CW" />CW<option value="CX" />CX<option value="CY" />CY<option value="CZ" />CZ<option value="DE" />DE<option value="DJ" />DJ<option value="DK" />DK<option value="DM" />DM<option value="DO" />DO<option value="DZ" />DZ<option value="EC" />EC<option value="EE" />EE<option value="EG" />EG<option value="EH" />EH<option value="ER" />ER<option value="ES" />ES<option value="ET" />ET<option value="FI" />FI<option value="FJ" />FJ<option value="FK" />FK<option value="FM" />FM<option value="FO" />FO<option value="FR" />FR<option value="GA" />GA<option value="GB" />GB<option value="GD" />GD<option value="GE" />GE<option value="GF" />GF<option value="GG" />GG<option value="GH" />GH<option value="GI" />GI<option value="GL" />GL<option value="GM" />GM<option value="GN" />GN<option value="GP" />GP<option value="GQ" />GQ<option value="GR" />GR<option value="GS" />GS<option value="GT" />GT<option value="GU" />GU<option value="GW" />GW<option value="GY" />GY<option value="HK" />HK<option value="HM" />HM<option value="HN" />HN<option value="HR" />HR<option value="HT" />HT<option value="HU" />HU<option value="ID" selected />ID<option value="IE" />IE<option value="IL" />IL<option value="IM" />IM<option value="IN" />IN<option value="IO" />IO<option value="IQ" />IQ<option value="IR" />IR<option value="IS" />IS<option value="IT" />IT<option value="JE" />JE<option value="JM" />JM<option value="JO" />JO<option value="JP" />JP<option value="KE" />KE<option value="KG" />KG<option value="KH" />KH<option value="KI" />KI<option value="KM" />KM<option value="KN" />KN<option value="KP" />KP<option value="KR" />KR<option value="KW" />KW<option value="KY" />KY<option value="KZ" />KZ<option value="LA" />LA<option value="LB" />LB<option value="LC" />LC<option value="LI" />LI<option value="LK" />LK<option value="LR" />LR<option value="LS" />LS<option value="LT" />LT<option value="LU" />LU<option value="LV" />LV<option value="LY" />LY<option value="MA" />MA<option value="MC" />MC<option value="MD" />MD<option value="ME" />ME<option value="MF" />MF<option value="MG" />MG<option value="MH" />MH<option value="MK" />MK<option value="ML" />ML<option value="MM" />MM<option value="MN" />MN<option value="MO" />MO<option value="MP" />MP<option value="MQ" />MQ<option value="MR" />MR<option value="MS" />MS<option value="MT" />MT<option value="MU" />MU<option value="MV" />MV<option value="MW" />MW<option value="MX" />MX<option value="MY" />MY<option value="MZ" />MZ<option value="NA" />NA<option value="NC" />NC<option value="NE" />NE<option value="NF" />NF<option value="NG" />NG<option value="NI" />NI<option value="NL" />NL<option value="NO" />NO<option value="NP" />NP<option value="NR" />NR<option value="NU" />NU<option value="NZ" />NZ<option value="OM" />OM<option value="PA" />PA<option value="PE" />PE<option value="PF" />PF<option value="PG" />PG<option value="PH" />PH<option value="PK" />PK<option value="PL" />PL<option value="PM" />PM<option value="PN" />PN<option value="PR" />PR<option value="PS" />PS<option value="PT" />PT<option value="PW" />PW<option value="PY" />PY<option value="QA" />QA<option value="RE" />RE<option value="RO" />RO<option value="RS" />RS<option value="RU" />RU<option value="RW" />RW<option value="SA" />SA<option value="SB" />SB<option value="SC" />SC<option value="SD" />SD<option value="SE" />SE<option value="SG" />SG<option value="SH" />SH<option value="SI" />SI<option value="SJ" />SJ<option value="SK" />SK<option value="SL" />SL<option value="SM" />SM<option value="SN" />SN<option value="SO" />SO<option value="SR" />SR<option value="SS" />SS<option value="ST" />ST<option value="SV" />SV<option value="SX" />SX<option value="SY" />SY<option value="SZ" />SZ<option value="TC" />TC<option value="TD" />TD<option value="TF" />TF<option value="TG" />TG<option value="TH" />TH<option value="TJ" />TJ<option value="TK" />TK<option value="TL" />TL<option value="TM" />TM<option value="TN" />TN<option value="TO" />TO<option value="TR" />TR<option value="TT" />TT<option value="TV" />TV<option value="TW" />TW<option value="TZ" />TZ<option value="UA" />UA<option value="UG" />UG<option value="UM" />UM<option value="US" />US<option value="UY" />UY<option value="UZ" />UZ<option value="VA" />VA<option value="VC" />VC<option value="VE" />VE<option value="VG" />VG<option value="VI" />VI<option value="VN" />VN<option value="VU" />VU<option value="WF" />WF<option value="WS" />WS<option value="YE" />YE<option value="YT" />YT<option value="ZA" />ZA<option value="ZM" />ZM<option value="ZW" />ZW</select>
<input value="Lihat Blogger's" type="submit" /> <input value="Clear" type="reset" />
</form> </div>
  <center><div style='font-size:10px;'>Design: <a href='http://beben-koben.blogspot.com'>Beben Koben</a>   -    Modif :<a href='http://blogbego-creation.blogspot.com'>BlogBego</a></div></center>

Silahkan kawan ganti Teks yang berwarna biru sesuai selera kawan

Simpan Blog kawan

Read more ...

CSS Efek Kertas Menumpuk

Ini Script CSS

<style>
  body {
  background: #666;  
}
  .papers {
  background-color: white;
  height: 350px;
  padding: 20px;
  width: 260px;
  -webkit-box-shadow:
        1px 1px   0 rgba(0,   0,   0,   0.100),
        3px 3px   0 rgba(255, 255, 255, 1.0),
        4px 4px   0 rgba(0,   0,   0,   0.125),
        6px 6px   0 rgba(255, 255, 255, 1.0),
        7px 7px   0 rgba(0,   0,   0,   0.150),
        9px 9px   0 rgba(255, 255, 255, 1.0),
        10px 10px 0 rgba(0,   0,   0,   0.175);
  -moz-box-shadow:
        1px 1px   0 rgba(0,   0,   0,   0.100),
        3px 3px   0 rgba(255, 255, 255, 1.0),
        4px 4px   0 rgba(0,   0,   0,   0.125),
        6px 6px   0 rgba(255, 255, 255, 1.0),
        7px 7px   0 rgba(0,   0,   0,   0.150),
        9px 9px   0 rgba(255, 255, 255, 1.0),
        10px 10px 0 rgba(0,   0,   0,   0.175);
  box-shadow:
        1px 1px   0 rgba(0,   0,   0,   0.100),
        3px 3px   0 rgba(255, 255, 255, 1.0),
        4px 4px   0 rgba(0,   0,   0,   0.125),
        6px 6px   0 rgba(255, 255, 255, 1.0),
        7px 7px   0 rgba(0,   0,   0,   0.150),
        9px 9px   0 rgba(255, 255, 255, 1.0),
        10px 10px 0 rgba(0,   0,   0,   0.175);
 
}
</style>

 Script HTML
<div class="papers"> Content </div>

Demo

Read more ...

Membuat CSS Top Shadow

Kali ini saya akan memberikan Tutorial yang sangat sederhana yaitu Membuat CSS Top Shadow.
CSS Top Shadow Adalah Efek shadow yang berada di bawah Addres Bar atau di atas Heder suatu Website/Blog, Efek ini Keren jika di pasang di pasang di Web/Blog Anda. Langsung saja kita Mulai Cara Membuat CSS Top Shadow.

Cara Memasang CSS Top Shadow

Copy saja Kode CSS dibawah ini ke tempat kode css Web/Blog Anda

body:before {
    content:"";
    position: fixed;
    top: -10px;
    left: 0;
    width: 100%;
    height: 10px;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .8);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .8);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, .8);
    z-index: 100;
}

 Itu saja yang bisa saya sampaikan selamat mencoba CSS Top Shadow di Web/Blog Anda

Read more ...

Komentar GPlus untuk Template yang Gagal

Sebelumnya saya sudah berbagi dengan kawan cara meng-Aktifkan Komentar GPlus :q; tentunya bagi kawan yang sudah mempunyai Account G+ ditambah Template yang support dengan Blogspot, begitu juga dengan janji saya bagi kawan yang memakai Template Designer :r; atau yang gagal meng-Aktifkan Komentar GPlus.

Triks ini saya dapatkan pada master kita setelah sebelumnya saya mencari kesana kemari tidak ketemu yang akhirnya menemukan pada dte :z; yang caranya hampir sama dengan meng-Aktifkan Thread Comment sebelumnya 

Oke langsung saja ke cara meng-Aktifkan Komentar GPlus di Blog 

• Masuk Account Blogger dengan ID kawan
• Sebaiknya simpan Template kawan dulu 
• Pada Dasbor pilih Template - Edit HTML
• Untuk cepatnya, langsung saja menuju Widget - Blog1 lanjut jabarkan

• Cari  <b:includable id='comments' var='post'> 
• Copas Script berikut tepat diatasnya 

<b:includable id='g-comments' var='post'>
<div id='g-comments-outer'>
<div class='g-comments' expr:data-href='data:blog.canonicalUrl' data-width='600' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD'> <a href='#g-comments-outer' id='g-comments-loader'>Berikan Komentar</a>
</div> </div>
<!-- For slow connection -->
<script type='text/javascript'>
//<![CDATA[
(function() {
var btn = document.getElementById('g-comments-loader'), showGC = function() {
var script = document.createElement('script'),
head = document.getElementsByTagName('head')[0], old;
script.type = "text/javascript";
script.id = "g-comments-script";
script.src = "//apis.google.com/js/plusone.js"; if (document.getElementById('g-comments-script')) {
old = document.getElementById('g-comments-script'); old.parentNode.removeChild(old); } head.appendChild(script); };
btn.onclick = function() {
this.innerHTML = "Memuat...";
showGC(); return false; };
})();
//]]>
</script>
</b:includable>

Teks yang saya beri warna merah silahkan disesuaikan dengan Blog kawan 
Teks yang saya beri warna biru bisa kawan ganti dengan Page-Loading atau dihilangkan

• Selanjutnya cari  <b:includable id='main' var='top'> yang kodenya kurang lebih seperti berikut 

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:include data='post' name='comment_picker'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comment_picker'/>
</b:if>

Hapus atau Ganti dengan Kode berikut :

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<!-- b:include data='post' name='comment_picker'/ -->
<b:include data='post' name='g-comments'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- b:include data='post' name='comment_picker'/ -->
<b:include data='post' name='g-comments'/>
</b:if>

Atau seperti kode berikut

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>

Hapus atau Ganti dengan Kode berikut

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<!-- b:include data='post' name='comments'/ -->
<b:include data='post' name='g-comments'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- b:include data='post' name='comments'/ -->
<b:include data='post' name='g-comments'/>
</b:if>

• Simpan Template kawan

Read more ...

Ramadhan Blogger Template

Demo Download

Bulan Ramadhan di sini?  mengapa tidak? mempublikasikan khusus tema 'Ramadhan Blogger Template' untuk setiap orang yang berpikir / blog-nya dia memiliki sesuatu yang sangat istimewa yang berisi materi dan hal-hal seperti yang benar-benar menginspirasi kehidupan seseorang untuk sebagian besar. Menjaga ini dalam pikiran kami membuat tema yang sama sekali baru dan dinamis yang halus Anda, memberikan pembaca kenyamanan sempurna memiliki font yang indah dengan gambar memesona. Saya harap kalian seperti ini Ramadhan template blogger yang cukup berbeda dari semua sebelumnya blogger template 'kami telah dipublikasikan pada Bloggertheme9. Agama Ramadhan blogger theme akan menarik pengguna dengan kombinasi warna terang dan footer area elegan.

http://www.bloggertheme9.com/2013/07/ramadan-blogger-template.html

Read more ...

Kontes Referral Berhadiah SAMSUNG Galaxy S3 Mini

Kontes Referral Berhadiah SAMSUNG Galaxy S3 Mini - Pada kesempatan kali ini saya akan berbagi informasi tentang sebuah kontes berhadiah gadget keren buatan dari samsul. Eh maksudnya samsung. Kontes yang diadakan oleh Giladiskon Indonesia (Komunitas Pecinta Diskon Indonesia) ini menghadiahkan sebuah ponsel pintar android bernama SAMSUNG Galaxy S3 Mini. Buat yang mau ikutan silahkan simak caranya berikut ini.

CARA :

1. Silahkan masuk ke www.giladiskon.com
2. Silahkan daftarkan data diri anda melalui form yang sudah tersedia
3. Aktifkan akun anda dengan membuka email yang sudah didaftarkan tadi sesuai petunjuk, jangan lupa passwordnya diganti.
4. Setelah itu baca syarat dan ketentuan kontesnya disini
5. Gimana mudahkan? buruan ikutan sobat, keburu ketinggalan. Kontes ini akan berlangsung selama satu setengah bulan yaitu dimulai dari tanggal 15 Juli sampai 31 Agustus 2013. Selamat mengikuti.

Read more ...

5 CDN Terbaik dan Gratis untuk Website Anda

5 CDN Terbaik dan Gratis untuk Website Anda - Sebuah Content Delivery Network (CDN) yang terdiri dari sejumlah server yang terhubung dan ditempatkan di pusat-pusat data yang berbeda. Itu membuat konten online lebih mudah diakses dan kinerja tinggi. Ini adalah sedikit seperti gerobak dorong yang membawa apel ke pasar, di mana CDN bisa digambarkan sebagai sejumlah gerobak sarat dengan apel.

Tujuan dari CDN adalah untuk meningkatkan aksesibilitas situs Web Anda. Hal ini dilakukan dengan caching data, melalui penurunan latency akses dan meningkatkan bandwidth akses. Jadi mungkin cache data seperti css, file teks, mp3, gambar, dll CDN A yang baik untuk orang yang memiliki banyak pengunjung setiap bulan. Daripada kehilangan pengunjung karena situs / server yang turun atau karena website ini tidak dapat diakses, CDN memungkinkan orang untuk terus mengunjungi.

Sebuah CDN gratis dapat meningkatkan kecepatan pemuatan dan pengiriman dengan memiliki beban server terdekat konten pengguna website. Hal ini akan mengurangi waktu loading dan waktu pengiriman, dan itu artinya website Anda tiba-tiba memiliki selimut kali populer di seluruh negara Anda, bahwa website Anda tidak akan menjadi tidak dapat diakses pada waktu tersebut. Kadang-kadang, menggunakan CDN gratis adalah cara yang baik untuk memeriksa untuk melihat apakah Anda akan mendapat manfaat dari berlangganan penuh waktu CDN.

1 - CoBlitz

Layanan ini akan skala file yang lebih besar dari server dan melakukannya melalui jaringan pengiriman konten. Ini adalah jaringan pengiriman konten HTTP yang tidak akan meminta apapun modifikasi ke salah server atau klien. Hal ini karena semua dukungan yang diperlukan akan berada di jaringan pengiriman konten. Anda harus menambahkan hal-hal tertentu ke akhir URL Anda agar dapat menggunakan CDN. Anda harus memeriksa situs web mereka untuk mendapatkan rincian lengkap tentang apa yang harus dilakukan dan bagaimana melakukannya.

2 - Incapsula

Layanan ini menawarkan keamanan dan kinerja dan semuanya gratis. Mereka juga menyediakan layanan situs dari berbagai ukuran. Anda perlu membuat perubahan DNS, dan lalu lintas web Anda akan disalurkan melalui jaringan distribusi global incapsula. Jaringan dikatakan diisi dengan sejumlah server yang sangat bertenaga tinggi.

Hal ini juga telah membayar fungsi seperti protokol keamanan yang akan melindungi Anda terhadap ancaman online. Ancaman seperti serangan multi-Gigabit. Jika Anda memeriksa situs web, mereka mengklaim bahwa proses ini sangat mudah untuk membuat dan hanya akan memakan waktu lima menit untuk menambahkan website Anda ke jaringan pengiriman konten.

3 - CloudFlare

Mereka mengiklankan diri mereka sebagai mampu menghemat sekitar enam puluh persen bandwidth server Anda, yang paling mungkin perkiraan rata-rata didasarkan pada gagasan bahwa lebih dari 50% dari konten Anda akan menjadi konten statis. Layanan ini tidak membuat biaya bandwidth Anda baik, di bawah etos bahwa setiap website harus cepat satu.

Ini CDN bebas memiliki dua puluh server dan mereka ditempatkan di seluruh dunia. Ia bekerja untuk cache file statis sehingga file yang disimpan lebih dekat ke pengguna potensial. Layanan ini menggunakan teknologi yang akan rute pengguna untuk data center terdekat / server untuk meningkatkan waktu buka website Anda. Hal ini akan menjadi lebih nyaman bagi pengguna.

4 - JsDelivr

Ini adalah kedua CDN dan layanan hosting gratis. Hal ini memungkinkan pengguna untuk menjadi tuan rumah JavaScript tanpa harus membayar. Ada lokasi server yang tiga belas (meskipun tidak menyebutkan apakah itu berarti tiga belas server), dan akan mendukung JavaScript untuk hal-hal seperti konten website sistem manajemen berbasis. Hal ini memungkinkan Anda untuk mempercepat website Anda dengan meningkatkan kecepatan loading elemen JavaScript berpotensi berat.

5 - Coral Konten Jaringan Distribusi

Ini adalah CDN gratis yang juga merupakan sistem pengiriman konten terbuka. Mereka juga menyebut diri mereka jaringan distribusi. Ini memiliki fungsi peer-to-peer. Ini menggunakan jaringan di seluruh dunia web proxy dan server nama. Konten tersebut kemudian terpental sekitar orang-orang yang berbeda dengan tujuan membuat pengiriman konten yang lebih cepat. Pada dasarnya ini menurunkan efek memiliki banyak orang sedang melihat situs web Anda pada satu waktu.

Hal ini memungkinkan Anda untuk mempublikasikan konten melalui sistem mereka jika Anda menambahkan ". Nyud.net" ke akhir URLS halaman Anda. Anda juga dapat membuat dan mempublikasikan sebuah situs web dan menambahkan. Nyud.net ke nama host dalam rangka memperoleh manfaat dari layanan CDN mereka. Periksa website CoralCDN untuk mengetahui lebih lanjut tentang bagaimana untuk mengambil keuntungan dari CDN mereka.

Read more ...