Selasa, 20 Maret 2018

Kursus Instal Ulang Windows 7, 8 dan 10 Gratis di Jepara

Bagaimana kabarnya Blogger Jepara? semoga semuanya diberikan kelancaran, sehat jasmani dan rohani juga dilancarkan rizkinya. Dan selalu diberikan semangat belajar untuk menghadapi tantangan dunia yang penuh dengan lika-liku.

Pada kesempatan kali ini saya ingin menawarkan sebuah kursus instal ulang windows 7, 8 dan 10 secara gratis tanpa dipungut biaya sedikitpun. Juga mendapatkan bonus software-software penting secara gratis.

Jika dibaca dari judulnya artikel ini terasa konyol, karena instal ulang windows biayanya cukup mahal antara Rp50.000 - Rp80.000. Namun perlu diketahui untuk sobat Blogger Jepara, bahwa sejak dulu saya sudah memberikan jasa gratis untuk kursus internet, kursus komputer, kursus desain juga kursus instal ulang windows.


Alasan saya memberikan layanan gratis adalah sebagai ucapan terima kasih atas ilmu yang diberikan kepada saya dengan segala kenikmatannya. Dulu waktu belajar saya sangat haus akan ilmu komputer dan pada akhirnya diberikan kemudahan dalam belajar, mulai dari kursus bersama teman-teman waktu dikampus juga belajar tutorial melalui internet. 

Berikut layanan kursus gratis yang dapat anda ikuti: 

Materi Kursus Instal Ulang Windows Gratis

  1. Perkenalan windows (windows 7, 8 dan 10)
  2. Perkenalan software (gratis dan premium)
  3. Cara instal ulang windows yang baik.
  4. Cara install software
  5. Cara Uninstall software
  6. Cara merawat software dan windows
  7. Cara mendapatkan software (download software)
  8. Dll.

Bonus 

  1.  Windows 7,8 dan 10 versi terbaru.
  2.  Software Ms. Office (versi 2007, 2010, 2013 dan 2016)
  3. Software CorelDraw (versi X4, X5,X6 dan X7)
  4. Driver Pack (support windows 7, 8 dan 10)
  5. Software photoshop semua versi.
  6. Dan software standar instal ulang lainnya.

Tempat Kursus

Office: Dk. Putat Rt 09/03 Desa Sumanding, Kembang, Jepara
Contact:
  1. FB: zain.elhasany 
  2. Fanspage: @komunitasbloggerjepara
  3. WA: 082 243 548 215
  4. Email: zainelhasany@gmail.com

Apakah bisa instal ulang gratis?

Saya juga memberikan jasa instal ulang windows GRATIS. Namun sebelum kerumah diharapkan konsultasi dulu dan berikan informasi mengenai spesifikasi laptop anda. Ini juga berlaku yang mau instal ulang komputer (cukup bawa CPU).

Jika anda tertarik silahkan tanya-tanya dulu lebih lanjut melalui halaman KONTAK.

Demikian informasi kursus gratis, semoga dapat bermanfaat. Selamat bergabung.

Kamis, 22 Februari 2018

Cara Kompres Gambar Tanpa Mengurangi Kualitas (100% Gratis)

Cara Kompres Gambar Tanpa Mengurangi Kualitas - Kompres (compress) gambar adalah suatu proses untuk mengecilkan ukuran file gambar. Sebagai contoh Anda memiliki gambar dengan size 200 KB dan ingin dikecilkan ukurannya menjadi dibawah 100 KB, maka caranya adalah dengan kompres gambar agar ukurannya menjadi kecil.

Kompres gambar ternyata sekarang ini banyak dibutuhkan, sebagai contoh siswa yang ingin mengikuti program bidikmisi maka disyaratkan dengan mengirim beberapa file gambar dan setiap gambar ukuran filenya harus dibawah 300 KB. Maka jika gambar yang didapatkan diatas 300 KB harus dikompres terlebih dahulu agar sesuai dengan aturan yang ditentukan.

Hal ini juga berguna untuk para blogger yang ingin mempercepat loading blog yaitu dengan compress gambar agar ukuran file lebih kecil sehingga blog menjadi fast loading. Jika blog fast loading maka pengunjung akan senang membuka blog kita.

cara kompres gambar


Cara Kompres Ukuran Size Gambar Tanpa Mengurangi Kualitas

Tutorial kompres gambar kali ini adalah menggunakan cara online sehingga pengguna tidak lagi membutuhkan software atau aplikasi tambahan. Dan yang paling menarik Anda dapat kompres gambar setiap hari tanpa dipungut biaya alias GRATIS.

Dengan cara online ini dapat mengecilkan ukuran size gambar sampai dengan 80% dan hasilnya tidak jauh beda dengan yang aslinya (tanpa mengurangi kualitas gambar).

1. Cara Compress Gambar dengan Tiny PNG

Tiny PNG merupakan salah satu situs favorit saya untuk kompres gambar yang lebih maksimal dengan hasil kompres sampai 80% bahkan hampir 90%. Jika anda tertarik yuk ikuti tutorialnya dibawah ini.
  • Buka dulu situsnya http://tinypng.com/
  • Lalu upload gambar yang ingin dikompres dengan cara klik tombol "Drop your .png and .jpg file here!" kamu bisa upload maksimal 20 gambar dengan maksimal ukuran pergambar 5 MB.
    Cara Kompres Gambar Tanpa Mengurangi Kualitas Gratis
  • Tunggu proses Uploading dan Copressing sampai muncul tombol download.
  • Untuk mendapatkan hasil kompres silahkan tekan tombol download untuk unduh gambar hasil kompres.
    Cara Kompres Gambar Tanpa Mengurangi Kualitas
  • Selesai dan lihat hasilnya.

2. Compress Ukuran Gambar dengan iloveIMG 

  • Buka situsnya https://www.iloveimg.com/
  • Jika sudah terbuka, silahkan pilih menu Compress Image
  • Lalu pilih gambar yang ingin di kompres dengan klik tombol "Select image" atau dengan cara "drop image"
  • Setelah teruploud, lalu klik tombol "Compress Images"
    cara compress gambar tanpa mengurangi kualitas
  • Kemudian tunggu proses upload dan compress, jika sudah selesai maka akan secara otomatis muncul halaman download. 
    cara compress gambar secara online
  • Atau dengan cara tekan tombol "Download Compressed Images"

3. Mengurangi Ukuran Gambar Secara Online dengan Optimizilla

  • Silahkan buka situsnya http://optimizilla.com/
  • Upload gambar dengan cara klik tombol "Upload Files" atau drop gambar pada kolom "Drop Your Files Here"
  • Silahkan tunggu proses uploading dan compressing sampai selesai.
  • Jika sudah selesai maka akan muncul tombol download yang siap untuk mengunduh gambar hasil kompres.
    cara compress gambar tanpa mengurangi kualitas
  • Selesai dan lihat hasilnya.
Sekian tutorial kali ini semoga dapat bermanfaat. 3 cara kompres gambar diatas memiliki kualitas terbaik dengan hasil yang maksimal. Silahkan coba semuanya untuk mengetahui perbandingan hasilnya. 

Semoga bermanfaat dan salam Blogger Jepara.

Cara Memasang Iklan Adsense di Postingan Blogger

Cara Memasang Iklan Adsense di Postingan Blogger - Salah satu penghasilan blogger adalah iklan Google Adsense yang sudah terbukti membayar mahal kepada publishernya. Banyak para blogger yang berlomba untuk mendapatkan puluhan juta rupiah dari iklan Google Adsense. 

Salah satu faktor penting untuk meningkatkan penghasilan Google Adsense adalah masalah penempatan iklan. Letak iklan sangat menentukan penghasilan Anda, jadi penempatan iklan harus diperhatikan betul untuk mendapatkan hasil yang lebih maksimal.

cara memasang iklan adsense di blog

Nah, kali ini saya akan berbagi informasi tentang penempatan iklan terbaik untuk publisher Google Adsense yang sudah saya buktikan sendiri mampu mendapatkan puluhan dollar setiap harinya. Berikut letak iklan atau penempatan iklan terbaik yang perlu anda coba:

Cara Memasang Iklan Adsense di Dalam Postingan Blogger 

Berikut 3 cara memasang iklan Google Adsense di dalam postingan yang banyak digunakan oleh para blogger. Adapun penempatan iklan terdapat pada bagian atas, tengah dan akhir artikel postingan. Cara ini terbukti dapat menyumbang banyak pendapatan dari Google Adsense.

Untuk mempercepat loading iklan Google Adsense caranya cukup mudah yaitu memasang kode asinkron hanya satu saja. Jika masih bingung silahkan (Baca: Cara Agar Iklan Google Adsense Fast Loading di Blogger )

1. Memasang Iklan Adsense di Bawah Judul Postingan

Cara yang pertama ini sangat efektif dilakukan, karena pengunjung akan langsung melihat iklan anda setelah membaca judul postingan, maka kemungkinan untuk klik iklan sangat besar. Untuk cara memasangnya silahkan Baca: Cara Memasang Iklan Adsense di Bawah Judul Postingan

2. Memasang Iklan di Tengah Postingan Blog 

Cara yang kedua ini juga wajib anda coba, karena iklan akan secara otomatis tampil di tengah postingan blog, pengunjung akan dengan mudah melihat iklan disaat membaca artikel. Cara pemasangannya juga cukup mudah, silahkan simak: Cara Memasang Iklan Adsense di Tengah Postingan

3. Memasang Iklan di Akhir Postingan Blog

Cara yang terakhir yaitu meletakkan iklan diakhir postingan, cara ini juga dibilang ampuh karena setelah pengunjung membaca artikel, iklan akan langsung terlihat dan jika konten iklan cukup menarik bagi pengunjung tentu ini akan mengundang banyak klik. Cara memasangnya silahkan baca: Cara Memasang Iklan Adsense di Akhir Postingan Blog

Selain penempatan iklan diatas, saya rasa kurang begitu efektif, misalnya memasang iklan pada sidebar, header dan footer. Maka saran saya lebih baik memasang iklan pada halaman postingan saya agar loading blog juga tidak terlalu berat (Baca: Cara Mengetahui Kecepatan Loading Pada Blog Anda ).

Sekian informasi tentang penempatan iklan google adsense terbaik untuk menambah penghasilan, semoga dapat bermanfaat dan selalu update artikel blog untuk tetap menjaga traffic agar tetap naik. Salam sukses

Rabu, 21 Februari 2018

Cara Agar Iklan Google Adsense Fast Loading di Blogger

Cara Agar Iklan Google Adsense Fast Loading di Blogger - Memasang banyak iklan google adsense di blog tentu akan mendapatkan peluang penghasilan yang lebih baik, namun jika salah dalam memasang adsense maka akan berdampak buruk pada blog karena sudah pasti loading blog semakin berat.

Setiap slot iklan google adsense terdapat satu kode javascript, jika anda memasang 3 iklan adsense maka secara otomatis memasang 3 javascript, maka ini tanpa kita sadari akan membuat loading blog tambah berat dan semakin lambat.

(Baca: Alasan Penting Blog atau Website Harus Fast Loading )

Lalu bagaimana solusinya? solusinya adalah memasang javascript async iklan google adsense hanya 1 saja dalam blog. Lalu muncul pertanyaan lagi, apakah iklan bisa berjalan normal walaupun hanya memasang 1 javascript? jawabannya bisa, karena pada dasarnya sama dengan satu panggilan javascript tetapi dengan catatan pemasangan kode javascript dilakukan dengan benar.

Cara Agar Iklan Google Adsense Fast Loading di Blogger

Cara Agar Iklan Google Adsense Fast Loading di Blogger

Berikut cara memasang kode javascrip async yang benar agar iklan Google Adsense fast loading dan blog cepat diakses agar pengunjung tidak meninggalkan blog.
  1. Perhatikan kode iklan Google Adsense berikut ini.
    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <!-- Responsive -->
    <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-482765480447704"
         data-ad-slot="4102343276"
         data-ad-format="auto"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
  2. Kemudian ambil code javascript Google Adsense seperti pada kode yang berwarna merah diatas.
    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  3. Kemudian parse terlebih dahulu kode tersebut DISINI, setelah diparse maka menjadi seperti ini:
    &lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
  4. Setelah diparse, selanjutnya masuk halaman edit HTML, kemudian cari kode </b:skin> kemudian letakkan javascript Google Adsense tepat dibawah kode </b:skin>
    mempercepat loading iklan google adsense
  5. Untuk memasang iklan Google Adsense tidak lagi menambahkan kode javascript, namun cukup kode iklannya saja. Seperti dibawah ini:
    <!-- Responsive -->
    <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-482765480447704"
         data-ad-slot="4102343276"
         data-ad-format="auto"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

Untuk mendapatkan hasil pendapatan adsense yang maksimal adalah dengan memasang iklan pada tempat yang terbaik yaitu didalam postingan. Silahkan ikuti tutorial yang sudah pernah saya buat (Baca: Cara Memasang Iklan Adsense Pada Postingan Blog)

Bagaimana mudah bukan?walaupun memasang banyak slot iklan Google Adsense namun masih tetap fast loading. Dan semoga penghasilannya pun tambah banyak dan menjadi blogger sukses.

Untuk cek loading blog silahkan simak (Baca: Cara Mengetahui Kecepatan Loading Pada Blog )

Demikian tutorial cara mempercepat loading iklan google adsense. Semoga dapat bermanfaat dan selamat mencoba.

Salam Blogger Jepara.

    Membuat Halaman About, Contact, Disclaimer, Privacy dan Sitemap di Blogger

    Membuat Halaman About, Contact, Disclaimer, Privacy dan Sitemap di Blogger merupakan hal yang wajib jika anda ingin mendaftar periklanan Google Adsense. Jika belum memasang di blog maka ikuti tutorial ini sampai selesai.

    Halaman About, Contact, Disclaimer, Privacy dan Sitemap disebut juga dengan halaman statatis blog, halaman ini tidak menyatu dengan postingan blog namun memiliki tempat tersendiri. Pengunjung tidak akan mengetahui halaman statis jika tidak memasang link di blog.

    Halaman statis ini biasa dipasang pada bagian menu header paling atas, menu footer blog juga terkadang pada bagian sidebar blog. Sebenarnya ini tergantung selera saja, karena Google sendiri tidak memberi peraturan untuk memasang halaman statis dibagian tertentu jadi bebas mau dipasang dibagian mana, yang penting pengunjung bisa membukanya dengan mudah.

    Membuat Halaman About, Contact, Disclaimer, Privacy dan Sitemap di Blogger
    Contoh Halaman Statis Sitemap di bloggerjepara.net

    Cara Membuat dan Cara Memasang Halaman Statis di Blog

    Adanya membuat halaman statis tentu bukan sembarangan membuat, karena halaman statis memang memiliki peran penting untuk kemajuan blog juga dapat mendekatkan admin dengan pengunjung blog.

    Cara membuatnya juga cukup mudah, bisa dilakukan oleh blogger pemula sekalipun. Dan memasangnya di blog setelah terdapat beberapa artikel untuk dipasang iklan.

     Cara Membuat Halaman Statis di Blog

    Berikut tutorial untuk membuat halaman statis blog (Halaman About, Contact, Disclaimer, Privacy dan Sitemap) dengan penjelasan manfaat dari halaman tersebut:

    Cara Membuat Halaman About

    Halaman about juga dikenal dengan halaman "Tentang Kami", halaman ini memberikan informasi tentang blog yang kamu bangun. Halaman ini menjelaskan tentang nama blog, deskripsi blog dan apa saja yang dibahas dalam blog atau website tersebut. 

    Contoh halaman about bisa dilihat disini About

    Cara membuatnya:
    1. Masuk menu halaman >> pilih halaman baru
      Cara Membuat Halaman About di blogger
    2. Setelah terbuka, silahkan ini judul dengan About atau Tentang Kami, isi konten dengan penjelasan tentang blog seperti yang sudah saya jelaskan diatas, terakhir klik publikasikan.
      Cara Membuat Halaman About di blog
    3. Selesai
     

    Cara Membuat Halaman Kontak atau Contact Us

    Halaman contact adalah halaman yang dapat menguhungkan pengunjung dengan admin secara langsung, di halaman ini memuat informasi kontak mulai dari email, no handphone, FB, WA, dll. Juga terdapat form untuk mengirim pesan secara langsung.

    Biasanya halaman kontak ini digunakan untuk bertanya tentang seputar blog yang dikelola (tutorial, dll) atau ingin bekerjasama untuk memasang iklan atau review produk. 

    Menurut saya pribadi halaman ini sangat wajib untuk dipasang di blog. Untuk mendapatkan peluang-peluang menarik dari pengunjung dan membuat blog semakin berkembang.

    Cara Membuatnya:
    Untuk membuatnya sangat mudah kurang lebih seperti halaman about, untuk melihat contohnya silahkan kunjungi halaman ini Contact, adapun tutorial untuk membuat halaman kontak beserta form menarik silahkan buka tutorialnya disini (Baca: Cara Membuat Halaman Contact Us (Kontak) Keren di Blog )

    Cara Membuat Halaman Disclaimer

    Halaman ini memberi informasi tentang isi konten yang ada di blog merupakan karya sendiri atau data dari beberapa sumber. Jika di blog tersebut memberikan tutorial atau informasi tentang kesehatan dll, admin tidak bertanggung jawab atas akibat dari tutorial tersebut karena admin hanya memberikan informasi saja. 

    Cara membuatnya silahkan ikuti tutorialnya berikut (Baca: Cara Membuat Disclaimer Untuk Blog Adsense

    Cara Membuat Halaman Privacy Policy

    Privacy Policy adalah semuah halaman atau dokument yang bertujuan agar blog memiliki kekuatan hukum seputar pengelolaan blog. Di halaman ini terdapat beberapa catatan tentang pengelolaan blog yang perlu diketahui oleh pembaca.

    Untuk membuat halaman privacy policy silahkan simak tutorial berikut: (Baca: Cara Membuat Privacy Policy untuk Google Adsense  )

    Cara Membuat Halaman Sitemap di Blogger

    Halaman sitemap adalah halaman peta situs yang mencantumkan semua daftar postingan yang sudah dipublikasikan. Di halaman ini pengunjung dapat memilih artikel yang di inginkan, karena semua postingan ditampilkan pada halaman ini.

    Dengan memasang sitemap di blog maka pengunjung bisa memilih artikel dengan leluasa, dan ini tentu dapat menambah page view halaman blog kita.

    Saya sudah membuatkan tutorial tentang membuat sitemap otomatis di blog dengan tampilan keren dan menarik, sitemap ini akan secara otomatis bertambah jika ada artikel baru yang dipublikasikan.


    Cara Memasang Halaman Statis di Blog

    Setelah membuat halaman statis mulai dari about, contact, disclaimer, privacy dan sitemap. Sekarang saatnya memasang di blog agar dapat diketahi oleh pengunjung.  Pada tutorial ini, halaman statis akan ditampilkan pada sidebar blog.

    Ikuti langkah-langkah berikut sampai selesai:
    1. Masuk menu Tata Letak, kemudian pilih Tambahkan Gadget
      menambahkan gadget pada sidebar blog
    2. Lalu pilih Gadget Halaman
      menambah halaman di blog
    3. Setelah terbuka, untuk menambahkan halaman yang ingin ditampilkan cukup dengan ceklist atau memberi centang pada halaman tersebut. Setelah selesai klik Simpan. Kurang lebihnya seperti gambar dibaawah ini.
      cara memasang halaman statis di blogger blogspot
    4. Jika sudah selesai menambahkan Gadget diatas jangan lupa Simpan Setelan agar bisa terlihat ditampilan blog.
    5. Tampilan pada sidebar blog kurang lebihnya seperti gambar berikut:
      memasang halaman statis di blogspot blogger
    Demikian tutorial lengkap cara membuat dan memasang halaman statis blog, semoga dapat bermanfaat dan blognya semakin berkembang sehingga bisa menjadi blogger sukses. Selamat mencoba.

    Jika masih ada kendala jangan segan untuk bertanya melalui kolom komentar yang sudah disediakan.

    Senin, 22 Januari 2018

    Cara Membuat Contact Us (Kontak) Keren di Blog

    Cara Membuat Contact Us di Blog - Halaman kontak biasa dikenal dengan sebutan Contact Us atau Kontak Kami merupakan halaman wajib yang harus dipasang pada blog atau website. Adanya halaman kontak bertujuan untuk lebih dekat dengan pengunjung atau visitor agar lebih mudah untuk berkomunikasi.

    Halaman Contact Us biasanya dipasang pada halaman statis blog, dengan menampilkan form pesan atau hanya menampilkan info kontak saja seperti email, FB, WA, atau dengan kontak yang lainnya. 

    Pada tutorial kali ini saya akan berbagi cara membuat halaman contact us dengan form yang sangat keren dan membuatnya cukup mudah walaupun untuk pemula sekalipun. Selain kontak biasanya blog memuat halaman privacy policy dan halaman disclaimer yang merupakan halaman wajib untuk mendaftar adsense.

    Cara Membuat Contact Us (Kontak) Keren di Blog
    Contact Form Blogger

    Cara Membuat Contact Us di Halaman Statis Blogger

    1. Memasang widget formulir di sidebar, caranya login akun Blogger >> pilih  Tata Letak >> Tambahkan Gadget >> Gadget lainnya >> Formulir Kontak seperti gambar berikut:
      cara membuat halaman contact us di blog
    2. Setelah pasang wideget kontak, selanjutnya masuk menu Tema >> Edit HTML. Letakkan kode berikut tepat diatas kode </head>.
      <style type='text/css'>
      #ContactForm1{display:none}
      </style>
      <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
      <style type='text/css'>
      /* Contact form */
      #ContactForm1_contact-form-email,#ContactForm1_contact-form-name{width:70%;height:50px;margin:0;padding:10px;background:#fbfbfb;border:1px solid #ccc;color:#777;border-radius:3px;}
      #ContactForm1_contact-form-email-message:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-name:focus{background:#fff;outline:0}
      #ContactForm1_contact-form-email-message{width:95%;height:170px;margin:0;padding:10px;background:#fbfbfb;border:1px solid #ccc;color:#777;border-radius:3px;}
      #ContactForm1_contact-form-submit{display:block;height:35px;float:left;color:#FFF;padding:10px;margin:0;cursor:pointer;background-color:#6e9ee6;border:1px solid #6e9ee6;border-radius:3px;}
      #ContactForm1_contact-form-submit:hover{background-color:#3c3c3c}
      #ContactForm1_contact-form-submit:active{position:relative;top:2px;}
      #ContactForm1_contact-form-submit:focus{outline:0}
      #ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:15px;text-align:left}
      @media screen and (max-width:768px){#ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message,#ContactForm1_contact-form-name{width:96%}}
      @media screen and (max-width:480px){#ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message,#ContactForm1_contact-form-name{width:94%}.post-body{margin:0 15px}}
      </style>
      </b:if>
    3. Jika sudah memasang kode diatas, selanjutnya buka menu Halaman >> Halaman Baru >> Beri judul halaman statis dengan Contact Us, Kontak atau Kontak Kami.
      cara memasang halaman kontak keren di blogger
      Kemudian Masukkan kode berikut pada mode HTML.
      <div dir="ltr" style="text-align: justify;" >
      Silahkan isi pesan melalui form di bawah ini untuk menghubungi kami. Jika tidak ada halangan dan kesibukan lainnya, kami akan langsung merespon dengan cepat pesan yang Anda kirimkan. Terima kasih
      <br />
      <form name="contact-form">
      <input id="ContactForm1_contact-form-name" name="name" placeholder="Name" size="30" type="text" value="" /><br />
      <input id="ContactForm1_contact-form-email" name="email" placeholder="Email" size="30" type="text" value="" /><br />
      <textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message" rows="5"></textarea><br />
      <input id="ContactForm1_contact-form-submit" type="button" value="Kirim Pesan" /><br />
      <div class="clear">
      </div>
      <div style="max-width: 222px; text-align: center; width: 100%;">
      <div id="ContactForm1_contact-form-error-message">
      </div>
      <div id="ContactForm1_contact-form-success-message">
      </div>
      </div>
      </form>
      </div>
    PERHATIAN:
    Jika kontak form tidak berfungsi, maka langkah selanjutnya adalah masuk menu Tema >> Edit HTML kemudian memasang kode berikut ini tepat diatas kode </body>.
    <script type='text/javascript'>
    //<![CDATA[
    document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://www.blogger.com/static/v1/widgets/2759014865-widgets.js\"></scr" + "ipt>");
    //]]>
    </script>
    <script type='text/javascript'>
    if (typeof(BLOG_attachCsiOnload) != &quot;undefined&quot; &amp;&amp; BLOG_attachCsiOnload != null) { window[&quot;blogger_templates_experiment_id&quot;] = &quot;templatesV1&quot;;window[&quot;blogger_blog_id&quot;] = &quot;<data:blog.blogId/>&quot;;BLOG_attachCsiOnload(&quot;&quot;); }_WidgetManager._Init(&quot;//www.blogger.com/rearrange?blogID\x3d<data:blog.blogId/>&quot;,&quot;<data:blog.url/>&quot;,&quot;<data:blog.blogId/>&quot;);
    _WidgetManager._RegisterWidget(&quot;_ContactFormView&quot;, new _WidgetInfo(&quot;ContactForm1&quot;, &quot;footer1&quot;, null, document.getElementById(&quot;ContactForm1&quot;), {&quot;contactFormMessageSendingMsg&quot;: &quot;Sending...&quot;, &quot;contactFormMessageSentMsg&quot;: &quot;Your message has been sent.&quot;, &quot;contactFormMessageNotSentMsg&quot;: &quot;Message could not be sent. Please try again later.&quot;, &quot;contactFormInvalidEmailMsg&quot;: &quot;A valid email address is required.&quot;, &quot;contactFormEmptyMessageMsg&quot;: &quot;Message field cannot be empty.&quot;, &quot;title&quot;: &quot;Contact Form&quot;, &quot;blogId&quot;: &quot;<data:blog.blogId/>&quot;, &quot;contactFormNameMsg&quot;: &quot;Name&quot;, &quot;contactFormEmailMsg&quot;: &quot;Email&quot;, &quot;contactFormMessageMsg&quot;: &quot;Message&quot;, &quot;contactFormSendMsg&quot;: &quot;Send&quot;, &quot;submitUrl&quot;: &quot;https://www.blogger.com/contact-form.do&quot;}, &quot;displayModeFull&quot;));
    </script>
    Sumber: Bungfangki.com

    Demikian cara membuat halaman kontak pada statis blogger, jika masih kesulitan jangan segan untuk bertanya melalui kontak komentar yang sudah tersedia. Salam Blogger Jepara.

    Sabtu, 20 Januari 2018

    Cara Membuat Sitemap Blogspot Keren dan Responsive

    Cara Membuat Sitemap Blogspot - Sitemap atau daftar isi blog adalah halaman yang berisi seluruh postingan blog yang biasanya dikemas dengan perlabel. Dengan memiliki sitemap blog maka pengunjung bisa dengan mudah mencari artikel yang diinginkan.

    Sitemap yang akan saya bagikan kali ini memiliki fitur yang sangat komplit dan merupakan update terbaru support fitur HTTPS Blogger custom domain (Baca: Cara Memasang HTTPS (SSL) di Blogger Custom Domain ). Fitur sitemap blogspot ini sebagai berikut:
    1. Responsive : Sitemap ini sudah didesain responsive sehingga tetap bisa diakses melalui perangkat mobile dengan tampilan yang keren.
    2. Sederhana dan Keren: Memiliki tampilan yang sedap dipandang mata dengan warna yang segar namun tetap elegan.
    3. Fast loading : server script js terbaik sehingga loading ringan.
    4. Otomatis : Sitemap ini akan update otomatis jika ada artikel atau postingan baru yang dipublikasikan dengan tanda New!!! artinya artikel baru.
    Screenshot:
    Tampilan Desktop (Komputer atau Laptop)
    cara membuat sitemap blogspot blogger

    Tampilan Mobile (Responsive) 
    Cara Membuat Sitemap Blogspot Responsive

    Bagaimana lengkap dan keren bukan? dengan sitemap ini tentu blog akan terlihat sangat keren, untuk demo dan tampilan nanti saya jelaskan dibawah. Saya selaku admin mengucapkan banyak terima kasih kepada Mas Taufik Nurrohman admin Dte.web.id yang sudah membuat sitemap keren ini.

    Sitemap ini menampilkan sebuah susunan label blog, jika nanti di klik pada label maka akan muncul semua artikel yang ada pada label tersebut. Berikut langkah-langkah untuk memasang sitemap di blogspot.

    Cara Membuat Sitemap SEO Otomatis di Blogspot

    1. Buka akun Blogger > Pilih Blog yang ingin dipasang sitemap> Masuk Menu Halaman > Halaman Baru
      memasang sitemap otomatis blogspot
    2. Buat Judul dengan "Sitemap" atau "Daftar Isi" lalu masukkan kode berikut pada mode HTML, Jangan lupa ganti URL https://www.bloggerjepara.net/ dengan URL blog kamu.
      <link href="https://cdn.rawgit.com/penaindigo/project/d4a73206/penaindigocom.css" rel="stylesheet"></link>
      <div class="tabbed-toc" id="tabbed-toc">
      <span class="loading">Memuat…</span></div>
      <script>
      var tabbedTOC = {
      blogUrl: "https://www.bloggerjepara.net/", // Blog URL
      containerId: "tabbed-toc", // Container ID
      activeTab: 1, // The default active tab index (default: the first tab)
      showDates: false, // `true` to show the post date
      showSummaries: false, // `true` to show the posts summaries
      numChars: 200, // Number of summary chars
      showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
      thumbSize: 40, // Thumbnail size
      noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
      monthNames: [ // Array of month names
      "Januari",
      "Februari",
      "Maret",
      "April",
      "Mei",
      "Juni",
      "Juli",
      "Agustus",
      "September",
      "Oktober",
      "November",
      "Desember"
      ],
      newTabLink: true, // Open link in new window?
      maxResults: 99999, // Maximum post results
      preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
      sortAlphabetically: true, // `false` to sort posts by published date
      showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
      newText: ' &ndash; <em style="color:red;">New!</em>' // HTML for the "New!" text
      };
      </script>
      <script src="//cdn.rawgit.com/tovic/dte-project/2fd2d2971c3398029ea5e149696447243e7f4d94/tabbed-toc.min.js"></script>
    3. Kurang lebihnya seperti gambar berikut:
      memasang sitemap keren di blogspot
    4. Publikasikan dan lihat hasilnya.
    Sampai disini kamu sudah berhasil memasang sitemap blogspot keren, responsive dan otomatis. Jika ada kendala silahkan tanyakan melalui kotak komentar atau langsung menghubungi admin melalui kontak yang sudah tersedia.


    Semoga bermanfaat dan selamat mencoba. Salam Blogger Jepara

    Jumat, 19 Januari 2018

    Cara Setting Robots.txt di Blogger agar Postingan Cepat Terindex

    Cara Agar Postingan Cepat Terindex - Banyak cara yang dapat dilakukan untuk optimasi SEO onpage agar postingan lebih ramah dengan mesin pencari salah satunya adalah dengan setting robot.txt dengan benar.

    Dengan menerapkan trik ini maka blog akan lebih SEO friendly, postingan akan mudah terindex oleh serp Google. Melakukan setting robot.txt yang benar maka akan terhindar bahaya tidak terindek untuk perkembangan blog kedepannya.

    Baca Juga: Cara Meningkatkan Pengunjung Blog dengan Deskripsi Penelusuran

    Cara Setting Robots.txt di Blogger

    Berikut langkah-langkah yang dapat dilakukan untuk memasang robot.txt di blogspot blogger. Silahkan buka menu Setelan > Preferensi penelusuran > Perayap dan Pengindekan lalu masukkan kode berikut: 


    User-agent: Mediapartners-Google
    Disallow:

    User-agent: *
    Allow: /

    Sitemap: https://www.bloggerjepara.net/feeds/posts/default?orderby=UPDATED

    Keterangan:
    Ganti URL yang berwarna merah dengan URL blog Kamu.
    Kurang lebihnya seperti gambar dibawah ini:
    Cara Setting Robots.txt di Blogger

    Cara Setting Tag Tajuk Robot di Blogspot

    Caranya sama seperti yang diatas yaitu melalui menu Setelan > Preferensi penelusuran > Perayap dan Pengindekan tepat dibawah robot.txt. Silahkan melakukan setting seperti gambar berikut:
    Cara Setting Tag Tajuk Robot di Blogspot


    Dengan melakukan setiing robot diatas, maka postingan blog akan semakin mudah terindek. Dan jangan lupa selalu membuat konten yang berkualitas dan bermanfaat untuk para pembaca setia.
    Baca Juga: Cara Membuat Gambar Postingan di Blog Menjadi SEO Friendly 
    Semoga bermanfaat dan selamat mencoba. Salam blogger Jepara.

    Kamis, 18 Januari 2018

    Cara Membuat Gambar Postingan di Blog Menjadi SEO Friendly

    Cara Membuat Gambar di Blog Lebih SEO Friendly - Gambar merupakan salah satu komponen penting sebagai pelengkap artikel postingan agar lebih SEO. Terlebih sebuah blog atau website tutorial, gambar akan menjadi pilihan terbaik untuk menjelaskan tutorial tersebut agar mudah untuk dipahami.

    Dalam pencarian Google, gambar juga harus di optimasi agar mampu bersaing dengan kata kunci yang dibidik. Dengan optimasi gambar postingan maka akan banyak mendatangkan visitor dari Google image.

    Cara Membuat Gambar Postingan di Blog Menjadi SEO Friendly

    Selain gambar yang dioptimasi, kamu juga harus melakukan optimasi pencarian dengan membuat deskripsi penelusuran pada blog dan postingan agar lebih mudah dikenal search engine. Tutorialnya sudah saya buat, silahkan baca: Cara Meningkatkan Pengunjung Blog dengan Deskripsi Penelusuran

    Cara Membuat Gambar Artikel Menjadi SEO

    1. Masuk postingan dan silahkan tambahkan gambar.
    2. Kemudian klik pada gambar lalu pilih "Properties"
      Cara Membuat Gambar Postingan di Blog Menjadi SEO Friendly
    3. Setelah itu masukkan title text dan alt text (title: sesuaikan dengan keyword artikel, alt text: isi dengan deskripsi gambar) Kalau saya pribadi antara title dan alt saya samakan.
      optimasi gambar postingan agar lebih seo friendly
    4. Selesai.
    Sekian tutorial optimasi gambar postingan agar lebih seo friendly, gunakan cara diatas untuk semua gambar yang dimasukkan pada postingan. 

    Selamat mencoba dan semoga pengunjung blog semakin banyak. Salam Blogger Jepara

    Cara Meningkatkan Pengunjung Blog dengan Deskripsi Penelusuran

    Cara Meningkatkan Pengunjung Blog - Halo sahabat Blogger Jepara, trik seo kali ini seputar optimasi onpage agar blog lebih seo friendly. Salah satu rahasia untuk menaikkan trafik atau pengunjung blog adalah menggunakan deskripsi penelusuran pencarian search engine Google. Dengan memasang deskripsi maka Google akan lebih mudah mengenal blog atau postingan sehingga dapat meningkatkan serp Google untuk dapat bertengger dihalaman utama pencarian.

    Singkat cerita, dulu waktu saya baru terjun didunia blogger sungguh sangat membosankan karena blog yang saya bangun tidak kunjung mendapatkan traffic, dan ternyata salah satu penyebabnya adalah blog atau postingan tidak memiliki deskripsi penelusuran. Setelah memasangnya ternyata ada perbedaan jauh, blog semakin mudah dikenal oleh mesin pencari Google.


    Untuk dapat menjadikan postingan muncul dihalaman pertama Google maka diperlukan SEO onpage yang cukup, diantaranya dengan memasang keyword pada judul posting, deskripsi dan isi postingan. Dengan melakukan ritual tersebut maka postingan akan lebih mudah untuk kompetisi dengan blog atau website lainnya.

    Cara Memasang Deskripsi Penelusuran untuk Menaikkan Trafik Blog

    Seperti yang saya katakan diatas, pemasangan deskripsi ada dua macam yaitu deskripsi untuk blog dan deskripsi untuk postingan. Pada tutorial kali ini saya akan jelaskan semuanya. Ikuti langkah-langkah dibawah ini sampai selesai.  

    Cara Memasang Deskripsi Blog

    1. Silahkan masuk akun blogger Anda
    2. Buka menu "Setelan" pilih "Preferensi penelusuran" lalu pada tag meta deskripsi silahkan klik "edit
      Cara Memasang Deskripsi Penelusuran untuk Menaikkan Trafik Blog
    3. Jika sudah terbuka, pada Aktifkan deskripsi penelusuran? silahkan pilih YA dan masukkan deskripsi blog pada kolom yang tersedia. Jika sudah jangan lupa klik tombol "Simpan perubahan"
      cara memasang deskripsi penelusuran di blog
    4. Selesai, sekarang blog Anda suda memiliki deskripsi penelusuran. Sebagai contoh untuk blog BloggerJepara.Net seperti gambar dibawah ini:
      cara mengaktifkan deskripsi penelusuran blog

    Cara Memasang Deskripsi Penelusuran Postingan

    1. Silahkan buat postingan lengkap dengan judul dan isi konten yang berkualitas.
    2. Tambahkan deskripsi penelusuran pada kolom yang tersedia disebelah kanan halaman posting, jika sudah masukkan deskripsi penelusuran jangan lupa klik tombol selesai.
      Cara Memasang Deskripsi Penelusuran Postingan blog
    3. Sekarang postingan anda sudah memiliki deskripsi penelusuran (jangan lupa masukkan keyword didalamnya)
    4. Ingan!!! lakukan cara ini setiap membuat postingan.
    Demikian 2 tutorial cara memasang deskripsi penelusuran pada blog untuk meningkatkan pengunjung dan lebih SEO friendly. Dengan memiliki blog yang SEO friendly tentu akan membuat blog semakin populer dan tentunya akan banyak mendapatkan penghasilan dari blog.

    Jika ada pertanyaan silahkan kirim melalui halaman komentar atau kontak yang sudah tersedia. Selamat mencoba dan salam dari Blogger Jepara.

    Cara Memasang HTTPS (SSL) di Blogger Custom Domain

    Cara Memasang HTTPS (SSL) di Blogger Custom Domain - Platform Blogger (blogspot) kini kembali lagi berinovasi di awal tahun 2018 dengan memunculkan fitur HTTPS untuk blogger custom domain. Seperti yang diketahui sebelumnya, custom domain di blogger tidak bisa dipasang dan aktifkan fitur SSL tapi sekarang sudah bisa dilakukan.

    Apa itu Blogger Custom Domain?

    Blogger custom domain adalah blog dari platform blogger yang sudah dipasang domain TLD (seperti domain .com, .net, .org dll) lebih jelasnya seperti dibawah:

    https://www.bloggerjepara.net/ (domain TLD menggunakan .net)
    https://bloggerjepara.blogspot.co.id/ (default domain blogger yaitu blogspot.co.id)

    Saya sediri lebih suka dengan SSL (Secure Socket Layer) karena sesuai yang direkomendasikan google untuk membuat sambungan aman dengan browser web pengguna. Dengan memasang SSL (HTTPS) kita bisa mendapatkan banyak manfaat diantaranya yang paling penting adalah sangat disukai oleh mesin pencari google (diprioritaskan dalam pencarian).

    Untuk website saya yang sudah hosting sendiri di wordpress self hosting, semuanya sudah saya pasang SSL dan memiliki kemajuan yang sangat pesat dan untuk iklan adsense juga memiliki perkembangan yang baik. Jadi intinya memasang HTTPS di blog sangat diperlukan untuk perkembangan blog atau website.
    cara memasang https di blogger

    Cara Memasang HTTPS (SSL) di Blogger Custom Domain dengan Mudah

    Berikut langkah-langkah yang harus dilakukan untuk mendapatkan SSL gratis dari blogger dan memasangnya di blogspot custom domain.
    1. Silahkan masuk terlebih dahulu di link berikut draft.blogger.com
    2. Setelah itu silahkan pilih menu "Setelan" lalu pilih "General" silahkan pilih "YA" pada pilihan ketersedian HTTPS (silahkan tunggu proses pengalihan ke https dengan waktu kurang lebih 1 menit, untuk cek reload aja browsernya, kalau sudah tidak ada peringatan berarti sudah berhasil)
      Cara Memasang HTTPS (SSL) di Blogger Custom Domain
    3. Selanjutnya jangan lupa untuk melakukan pengalihan HTTPS (redirect) dengan redirect ini akan mengarahkan otomatis dari http ke https. Caranya seperti diatas pada pengalihan HTTPS pilih "YA"
      redirect http ke https di blogger
    4. Selesai dan lihat hasilnya, contohnya seperti blog Komunitas Blogger Jepara ini.
      cara memasang https di blogger

    Demikian cara cepat dan mudah untuk memasang SSL gratis dari blogger agar muncul HTTPS di blogger custom domain. 

    Semoga dapat bermanfaat dan memberikan perkembangan positif dalam pencarian Google dan perkembangan iklan Google Adsense yang lebih baik. Selam Blogger Jepara.

    Kamis, 11 Januari 2018

    Cara Mengubah Warna Link di Blog dengan Mudah

    Cara Mengubah Warna Link di Blog dengan Mudah - Sebuah blog atau website tidak akan pernah meninggalkan link (link internal maupun eksternal). Hal ini bertujuan untuk memberikan informasi yang lebih lengkap. 

    Warna link pada blogspot atau blogger bisa diganti dengan warna yang diinginkan, karena terkadang warna link pada template yang kita gunakan tidak sesuai yang kita inginkan. 

    Yang perlu diperhatikan adalah warna link yang ingin kita ganti jangan sampai tidak sesuai dengan warna dasar template sehingga dapat mengganggu tampilan blog. untuk mengetahui kode warna HTML silahkan baca: Kode Warna HTML Lengkap untuk Blog dan Website

    Cara Mengubah Warna Link di Blog

    Berikut cara mengubah warna link pada blog yang harus diikuti langkah-langkahnya sampai selesai.
    1. Masuk akun blogger terlebih dahulu
    2. Kemudian pilih menu "Tema" lalu pilih "Edit HTML"
      Cara Mengubah Warna Link di Blog dengan Mudah
    3. Cari kode a:link untuk lebih cepatnya silahkan menggunakan tombol kombinasi Ctrl+F lalu masukkan code a:link kemudian tekan enter.
      Cara Mengubah Warna Link di Blog
    4.  Maka akan muncul kode HTML warna link seperti berikut, silahkan ganti warna sesuai yang diinginkan: 
    a:link{color:#859ce6;text-decoration:none}
    a:visited{color:#859ce6;text-decoration:none}
    a:hover{color:#333;text-decoration:none}


    Keterangan:
    a:link : Warna link pada blog
    a:visited : Warna link yang sudah diklik atau dikunjungi
    a:hover : Warna link ketika kursor diarahkan pada link.

    Jika sudah diganti warna linknya, jangan lupa simpan template dan lihat hasilnya.

    Sekian tutorial cara mengganti warna link pada blog, semoga tampilan blog atau websitenya semakin menarik dan sedap dipandang mata. Jika Sahabat Blogger Jepara masih kesulitan, silahkan tinggalkan pesan melalui kolom komentar atau melalui halaman kontak yang sudah tersedia. Salam Sukses dari Komunitas Blogger Jepara.

    Rabu, 10 Januari 2018

    Cara Mudah Mendapatkan Kode Warna HTML

    Cara Mudah Mendapatkan Kode Warna HTML - Kode Warna HTML adalah kode yang dapat digunakan untuk menampilkan warna, kode html sangat diperlukan untuk Anda yang ingin mempercantik tampilan blog dengan warna-warna pilihan.

    Untuk mendapatkan kode warna bukanlah hal yang sulit karena sudah tersedia tool untuk mendapatkan kode warna, kali ini Blogger Jepara akan share tool warna yaitu "Color Code Generator" cara paling mudah dan cepat untuk mendapatkan kode warna HTML untuk keperluan desain tampilan atau template blog.

    Cara Mudah Mendapatkan Kode Warna HTML
    Kode Warna

    Cara Mendapatkan Kode Warna HTML 

    Berikut adalah color code generator untuk mendapatkan kode warna sesuai yang diinginkan. Caranya cukup mudah, silahkan klik pada warna yang dipilih lalu copy kode warna:
    • Kode Warna #5C97BF
    • Kode Warna #4B77BE
    • Kode Warna #1F3A93
    • Kode Warna #2574A9
    • Kode Warna #67809F
    • Kode Warna #34495E
    • Kode Warna #3A539B
    • Kode Warna #1E8BC3
    • Kode Warna #6BB9F0
    • Kode Warna #22313F
    • Kode Warna #336E7B
    • Kode Warna #19B5FE
    • Kode Warna #89C4F4
    • Kode Warna #2C3E50
    • Kode Warna #3498DB
    • Kode Warna #22A7F0
    • Kode Warna #94E0EE
    • Kode Warna #52B3D9
    • Kode Warna #59ABE3
    • Kode Warna #26A65B
    • Kode Warna #1E824C
    • Kode Warna #00B16A
    • Kode Warna #2ABB9B
    • Kode Warna #4DAF7C
    • Kode Warna #03A678
    • Kode Warna #26C281
    • Kode Warna #019875
    • Kode Warna #3FC380
    • Kode Warna #16A085
    • Kode Warna #2ECC71
    • Kode Warna #C5EFF7
    • Kode Warna #C8F7C5
    • Kode Warna #049372
    • Kode Warna #36D7B7
    • Kode Warna #66CC99
    • Kode Warna #1BA39C
    • Kode Warna #1BBC9B
    • Kode Warna #65C6BB
    • Kode Warna #BFBFBF
    • Kode Warna #ABB7B7
    • Kode Warna #DADFE1
    • Kode Warna #95A5A6
    • Kode Warna #C5DCE2
    • Kode Warna #BDC3C7
    • Kode Warna #EEEEEE
    • Kode Warna #D2D7D3
    • Kode Warna #F0E2C5
    • Kode Warna #EB9532
    • Kode Warna #E67E22
    • Kode Warna #F27935
    • Kode Warna #F9BF3B
    • Kode Warna #F7CA18
    • Kode Warna #F9690E
    • Kode Warna #F39C12
    • Kode Warna #D35400
    • Kode Warna #F4D03F
    • Kode Warna #F5AB35
    • Kode Warna #EB974E
    • Kode Warna #F2784B
    • Kode Warna #F4B350
    • Kode Warna #E87E04
    • Kode Warna #E74C3C
    • Kode Warna #CF000F
    • Kode Warna #C0392B
    • Kode Warna #D64541
    • Kode Warna #EF4836
    • Kode Warna #96281B
    • Kode Warna #D91E18
    • Kode Warna #E26A6A
    • Kode Warna #FF0000
    • Kode Warna #F22613
    • Kode Warna #E08283
    • Kode Warna #9B59B6
    • Kode Warna #8E44AD
    • Kode Warna #BE90D4
    • Kode Warna #BF55EC
    • Kode Warna #9A12B3
    • Kode Warna #913D88
    • Kode Warna #722D6A
    • Kode Warna #740A4E

    Atau jika ingin menggunakan kode warna lengkap beserta gambarnya silahkan simak tutorial yang sudah pernah saya buat disini : Kode Warna HTML Lengkap

    Demikian informasi singkat untuk mendapatkan kode warna HTML dengan cepat dan mudah. Semoga dapat bermanfaat.

    Kode Warna HTML Lengkap untuk Blog dan Website

    Kode Warna HTML - Kode warna merupakan elemen penting dalam pembuatan template blog atau website untuk memberikan warna yang menarik untuk setiap tampilan template.

    Dengan warna yang singkron tentu akan menghasilkan paduan warna yang elegan dan sedap dipandang mata, seperti warna background, warna link, warna text, warna pada widget seperti popular post, recent post atau membuat sitemap yang keren dengan warna-warni.

    Berikut kode warna lengkap untuk HTML, Anda tinggal memilih warna yang disukai lalu copy codenya untuk dipasang di susunan HTML.

    Kode Warna HTML Lengkap untuk Blog dan Website
    Contoh Kode Warna

    Kode Warna HTML Lengkap untuk Template


    Kode warna dasar:
    1. Putih: #FFFFFF
    2. Hitam: #000000
    3. Merah: #FF0000
    4. Kuning: #FFFF00
    5. Biru: #0000FF
    6. Coklat : #D2691E
    7. Hijau: #008000
    Kode Warna Lengkap dengan Gambar:
    Kode Warna: #FFFAFA Nama Warna: Snow
    Kode Warna: #00FF7F Nama Warna: Springgreen
    Kode Warna: #4682B4 Nama Warna: Steelblue
    Kode Warna: #D2B48C Nama Warna: Tan
    Kode Warna: #008080 Nama Warna: Teal
    Kode Warna: #D8BFD8 Nama Warna: Thistle
    Kode Warna: #FF6347 Nama Warna: Tomato
    Kode Warna: #F0F8FF Nama Warna: Aliceblue
    Kode Warna: #FAEBD7 Nama Warna: Antiquewhite
    Kode Warna: #00FFFF Nama Warna: Aqua
    Kode Warna: #7FFFD4 Nama Warna: Aquamarine
    Kode Warna: #F0FFFF Nama Warna: Azure
    Kode Warna: #F5F5DC Nama Warna: Beige
    Kode Warna: #FFE4C4 Nama Warna: Bisque
    Kode Warna: #000000 Nama Warna: Black
    Kode Warna: #FFEBCD Nama Warna: Blanchedalmond
    Kode Warna: #0000FF Nama Warna: Blue
    Kode Warna: #8A2BE2 Nama Warna: Blueviolet
    Kode Warna: #A52A2A Nama Warna: Brown
    Kode Warna: #DEB887 Nama Warna: Burlywood
    Kode Warna: #5F9EAD Nama Warna: Cadetblue
    Kode Warna: #7FFF00 Nama Warna: Chartreuse
    Kode Warna: #D2691E Nama Warna: Chocolate
    Kode Warna: #FF7F50 Nama Warna: Coral
    Kode Warna: #64950 Nama Warna: Cornflowerblue
    Kode Warna: #FFF8DC Nama Warna: Cornsilk
    Kode Warna: #DC143C Nama Warna: Crimson
    Kode Warna: #00FFFF Nama Warna: Cyan
    Kode Warna: #00008B Nama Warna: Darkblue
    Kode Warna: #008B8B Nama Warna: Darkcyan
    Kode Warna: #B8860B Nama Warna: Darkgoldenrod
    Kode Warna: #A9A9A9 Nama Warna: Darkgray
    Kode Warna: #006400 Nama Warna: Darkgreen
    Kode Warna: #8B008B Nama Warna: Darkmagenta
    Kode Warna: #BDB76B Nama Warna: Darkkhaki
    Kode Warna: #556B2F Nama Warna: Darkolivegreen
    Kode Warna: #FF8C00 Nama Warna: Darkorange
    Kode Warna: #9932CC Nama Warna: Darkorchid
    Kode Warna: #8B0000 Nama Warna: Darkred
    Kode Warna: #E9967A Nama Warna: Darksalmon
    Kode Warna: #8FBC8B Nama Warna: Darkseagreen
    Kode Warna: #483D8B Nama Warna: Darkslateblue
    Kode Warna: #2F4F4F Nama Warna: Darkslategray
    Kode Warna: #00CED1 Nama Warna: Darkturquoise
    Kode Warna: #9400D3 Nama Warna: Darkviolet
    Kode Warna: #FF1493 Nama Warna: Deeppink
    Kode Warna: #00BFFF Nama Warna: Deepskyblue
    Kode Warna: #696969 Nama Warna: Dimgray
    Kode Warna: #1E90FF Nama Warna: Dodgerblue
    Kode Warna: #B22222 Nama Warna: Firebrick
    Kode Warna: #FFFAF0 Nama Warna: Floralwhite
    Kode Warna: #228B22 Nama Warna: Forestgreen
    Kode Warna: #FF00FF Nama Warna: Fuchsia
    Kode Warna: #DCDCDC Nama Warna: Gainsboro
    Kode Warna: #F8F8FF Nama Warna: Ghostwhite
    ode Warna: #FFD700 Nama Warna: Gold
    Kode Warna: #DAA520 Nama Warna: Goldenrod
    Kode Warna: #808080 Nama Warna: Gray
    Kode Warna: #008000 Nama Warna: Green
    Kode Warna: #ADFF2F Nama Warna: Greenyellow
    Kode Warna: #F0FFF0 Nama Warna: Honeydew
    Kode Warna: #FF69B4 Nama Warna: Hotpink
    Kode Warna: #CD5C5C Nama Warna: Indianred
    Kode Warna: #4B0082 Nama Warna: Indigo
    Kode Warna: #FFFFF0 Nama Warna: Ivory
    Kode Warna: #F0E68C Nama Warna: Khaki
    Kode Warna: #E6E6FA Nama Warna: Lavender
    Kode Warna: #FFF0F5 Nama Warna: Lavenderblush
    Kode Warna: #7CFC00 Nama Warna: Lawngreen
    Kode Warna: #FFFACD Nama Warna: Lemonchiffon
    Kode Warna: #ADE8E6 Nama Warna: Lightblue
    Kode Warna: #F08080 Nama Warna: Lightcoral
    Kode Warna: #E0FFFF Nama Warna: Lightcyan
    Kode Warna: #FAFAD2 Nama Warna: Lightgoldenrodyellow
    Kode Warna: #90EE90 Nama Warna: Lightgreen
    Kode Warna: #D3D3D3 Nama Warna: Lightgray
    Kode Warna: #FFB6C1 Nama Warna: Lightpink
    Kode Warna: #FFA072 Nama Warna: Lightsalmon
    Kode Warna: #20B2AA Nama Warna: Lightseagreen
    Kode Warna: #87CEFA Nama Warna: Lightskyblue
    Kode Warna: #778899 Nama Warna: Lightslategray
    Kode Warna: #B0C4DE Nama Warna: Lightsteelblue
    Kode Warna: #FFFFE0 Nama Warna: Lightyellow
    Kode Warna: #00FF00 Nama Warna:  Lime
    Kode Warna: #32CD32 Nama Warna: Limegreen
    Kode Warna: #FAF0E6 Nama Warna: Linen
    Kode Warna: #FF00FF Nama Warna: Magenta
    Kode Warna: #800000 Nama Warna: Maroon
    Kode Warna: #66CDAA Nama Warna: Mediumaquamarine
    Kode Warna: #0000CD Nama Warna: Mediumblue
    Kode Warna: #BA55D3 Nama Warna: Mediumorchid
    Kode Warna: #9370DB Nama Warna: Mediumpurple
    Kode Warna: #3CB371 Nama Warna: Mediumseagreen
    Kode Warna: #7B68EE Nama Warna: Mediumslateblue
    Kode Warna: #00FA9A Nama Warna: Mediumspringgreen
    Kode Warna: #48D1CC Nama Warna: Mediumturquoise
    Kode Warna: #C71585 Nama Warna: Mediumvioletred
    Kode Warna: #191970 Nama Warna: Midnightblue
    Kode Warna: #F5FFFA Nama Warna: Mintcream
    Kode Warna: #FFE4E1 Nama Warna: Mistyrose
    Kode Warna: #FFE4E1 Nama Warna: Moccasin
    Kode Warna: #FFDEAD Nama Warna: Navajowhite
    Kode Warna: #000080 Nama Warna: Navy
    Kode Warna: #FDF5E6 Nama Warna: Oldlace
    Kode Warna: #808000 Nama Warna: Olive
    Kode Warna: #6B8E23 Nama Warna: Olivedrab
    Kode Warna: #FFA500 Nama Warna: Orange
    Kode Warna: #FF1000 Nama Warna: Orangered
    Kode Warna: #DA70D6 Nama Warna: Orchid
    Kode Warna: #EEE8AA Nama Warna: Palegoldenrod
    Kode Warna: #98FB98 Nama Warna: Palgreen
    Kode Warna: #AFEEEE Nama Warna: Paleturquoise
    Kode Warna: #DB7093 Nama Warna: Palevioletred
    Kode Warna: #FFEFD5 Nama Warna: Papayawhip
    Kode Warna: #FFDAB9 Nama Warna: Peachpuff
    Kode Warna: #CD853F Nama Warna: Peru
    Kode Warna: #FFC0CB Nama Warna: Pink
    Kode Warna: #DDA0DD Nama Warna: Plum
    Kode Warna: #B0E0E6 Nama Warna: Powderblue
    Kode Warna: #800080 Nama Warna: Purple
    Kode Warna: #FF0000 Nama Warna: Red
    Kode Warna: #BC8F8F Nama Warna: Rosybrown
    Kode Warna: #4169E1 Nama Warna: Royalblue
    Kode Warna: #8B4513 Nama Warna: Saddlebrown
    Kode Warna: #FA8072 Nama Warna: Salmon
    Kode Warna: #F4A460 Nama Warna: Sandybrown
    Kode Warna: #2E8B57 Nama Warna: Seagreen
    Kode Warna: #FFF5EE Nama Warna: Seashell
    Kode Warna: #A0522D Nama Warna: Sienna
    Kode Warna: #C0C0C0 Nama Warna: Silver
    Kode Warna: #87CEEB Nama Warna: Skyblue
    Kode Warna: #708090 Nama Warna: Slategray
    Kode Warna: #40E0D0 Nama Warna: Turquoise
    Kode Warna: #EE82EE Nama Warna: Violet
    Kode Warna: #F5DEB3 Nama Warna: Wheat
    Kode Warna: #FFFFFF Nama Warna: White
    Kode Warna: #F5F5F5 Nama Warna: Whitesmoke
    Kode Warna: #FFFF00 Nama Warna: Yellow
    Kode Warna: #9ACD32 Nama Warna: Yellowgreen

    Demikian share sederhana tentang kode warna HTML lengkap untuk template blog atau website. Semoga bermanfaat. Salam Blogger Jepara