Menampilkan postingan yang diurutkan menurut relevansi untuk kueri membuat blog dengan html. Urutkan menurut tanggal Tampilkan semua postingan

Mengenal Lebih Dekat Google Webmaster

Google webmaster tool berfungsi untuk memantau lebih lanjut tentang bagaimana perkembangan blog Anda di mesin pencari Google, bagaimana kekuatan web/ blog anda di SERP Google (SERP adalah singkatan dari Search Engine Results Page istilah Indonesianya Halaman Hasil Pencarian Mesin Pencari) dan  juga yang tak kalah pentingnya dengan Google webmaster ini kita bisa mendiagnosa serangan malware di blog sebagaimana pernah saya tulis pada posting terdahulu: Cara Mengatasi Reported Attact di Page Blog, yang jelas informasi ditampilkan secara detail dan tentu bisa dinikmati secara gratis.

Sebagai contoh perhatikan gambar dibawah ini, ketika saya login di google webmaster dan membuka blog mr-mung.com, maka akan tampak laporan berikut;
Laporan periode 3 April - 3 Mei 2012

Dengan melihat informasi tersebut, kita bisa tahu ternyata jumlah tampilan pencarian terbanyak untuk blog ini pada periode 3 April - 3 Mei 2012 adalah dengan menggunakan kata kunci "murotal" dan kita bisa juga membaca informasi lain mengenai grafik pencarian, link yang masuk ke blog kita, dll.
Klik untuk melihat ukuran penuh


Sebagai prasyarat penggunaan tool ini, blog anda harus terverifikasi, salah satu caranya adalah dengan  menanamkan meta tag kedalam kode template blog anda (dibawah kode <head> ). Setelah blog anda terverifikasi google, anda baru bisa melihat informasi lengkap di google webmaster,
Verifikasi Blog Menggunakan MetaTag
Verifikasi Blog Menggunakan MetaTag

Berikut beberapa tool yang ada di google webmaster yang biasa saya gunakan dan tentunya yang sedikit saya ketahui, yang lainya belum saya gunakan:
=> Site Configuration

1. Sitemaps
Fungsi dasar dari sebuah sitemap adalah untuk mempermudah robotnya google dalam menelusuri situs atau blog anda. sebagai contoh untuk memasukan sitemap blogspot adalah: http://alamatblog.blogspot.com/atom.xml (perhatikan gambar dibawah ini:)



2. Crawler Access
Crawler access mempunyai fungsi sebagai robot penerima tamu (robot teks) yang mempersilahkan halaman yang mana yang boleh diakses dari mesin pencari dan halaman yang tidak tidak boleh diakses mesin pencari, Untuk akun blogspot sudah mempunyai robot teks bawaan, jadi tidak usah pusing memikirkan membuat robot teks sendiri.

=> Your Site On The Web
Pada fasilitas ini Google memberikan akses kepada anda untuk memantau perkembangan blog anda di SERP:
  1. Search Queries adalah gambaran tentang kueri-kueri yan mengarah ke situs atau halaman blog anda.
  2. Links To Your Site berisi informasi tentang semua link yang berasal dari luar yang mengarah ke blog anda.
  3. Keywords adalah gambaran atau informasi yang didapat oleh robot mesin pencari Google ketika merayapi seluruh halaman blog anda.
  4. Internal Links adalah daftar link dalam blog anda yang mengarah ke halaman lain.
  5. Subscriber Stats adalah statistik feed blog anda, yaitu seberapa banyak pelanggan blog anda.

=> Diagnostic
Pada fasilitas ini anda bisa memantau semua masalah yang terdapat pada blog anda:
  1. Malware adalah sebuah laporan robot kepada anda jika ada suatu hal di blog anda yang dicurigai sebagai malware.
  2. Crawl Errors, fasilitas ini memberikan informasi kepada anda tentang halaman error yang ditemui robot google, bisa berupa halaman yang tidak ditemukan (not found).
  3. Crawl Stats adalah statistik aktifitas robot dalam merayapi halaman situs anda, kalau grafiknya konstan atau naik berarti bagus tapi kalau sebaliknya maka ada sesuatu masalah dengan blog anda sampai-sampai robot google tidak mau lagi merayapi halaman blog anda.
  4. Fetch As a Googlebot, dengan alat yang satu ini anda bisa memanggil robot ketika ada pembaruan atau update dalam blog anda yang anda anggap penting, atau ketika si robot lagi lambat mengindex halaman dan artikel anda maka ini bisa jadi pilihan yang baik buat anda, tapi dengan catatan jangan terlalu sering karena ada batasnya.
  5. HTML Suggestion adalah saran dari Google jika ada elemen HTML dalam halaman anda dapat mempersulit robot, jika template, html, css dan meta tag anda baik-baik saja maka fitur ini tidak akan menampilan apa-apa.

Semoga Bermanfaat.

Membuat Kode Order via WhatsApp di Blog Bisnis

Saat ini pengguna android lebih khusus pengguna aplikasi perpesanan WhatsApp memang sangat luar biasa banyaknya, terbukti bahwa aplikasi whatsApp di playstore telah diunduh dan diinstall lebih dari 2 milyar pengguna di seluruh dunia, hampir segala umur yang menggunakan smartphone sebagian besar ada aplikasi whatsappnya, oleh karenanya ketika kita memiliki blog bisnis yang terhubung dengan whasapp dengan sekali klik, tentu akan sangat mempermudah para pengunjung blog bisnis kita saat berkeinginan untuk mengorder produk kita, sebagai contoh perhatikan gambar dibawah ini:
Tombol Order Via WhatsApp

Pesan otomatis siap diisi calon pembeli
Bagaimana menurut anda? cukup keren kan?

Dengan kode order via whatsApp yang terpasang di blog bisnis anda, tentu sangat membantu dan memberi pelayanan awal kepada pembeli yang mau melakukan order produk anda, pelayanan awal yang saya maksud adalah anda sudah menyediakan data-data diri yang anda butuhkan, yang harus dilengkapi pembeli produk anda, dan pembeli tidak harus bertanya format cara beli produknya seperti apa, dst.

Pada tutorial kali ini kita akan membahas cara membuat kode order via whatsapp yang bisa anda pasang di blog bisnis anda. Berikut kode order via whatsapp yang bisa anda pasang di blog anda:
<a href="https://api.whatsapp.com/send?phone=6285640335006&amp;text=Saya%20Mau%20Order"><img src="https://2.bp.blogspot.com/-_A6eHtF2uGQ/WY4wV1vOEVI/AAAAAAAARqY/Q_6BJbkmWYEtFHklydscYQXXscC2s5f-ACLcBGAs/s1600/order%2Blewat%2Bwhatsapp.png"/></a>

Kode diatas silahkan anda edit sesuai dengan kebutuhan, mulai dari mengganti nomor hp (warna merah), kemudian teks yang anda inginkan (warna biru). Khusus untuk membuat kode yang berisi teks order kita butuh alat bantu URL encoder untuk merubah, mulai dari spasi, ganti baris, titik dua.
Dalam hal ini Anda bisa menggunakan tool yang tersedia di situs ini: https://www.freeformatter.com/url-encoder.html

Sebagai contoh, saya akan membuat data order sebagai berikut:

Dengan menggunakan tool URL encoder anda tinggal klik tombol encode, maka akan muncul baris kode sebagai berikut:
Order+Produk%3A%0D%0ANama%3A%0D%0AAlamat%3A%0D%0ANo+Hp%3A%0D%0AJumlah+Produk%3A
Anda copy kode tersebut, kemudian pastekan pada baris kode yang saya beri warna biru diatas, untuk merubah tanda + menjadi spasi dari baris kode diatas, anda bisa ganti tanda + dengan kode: %20, untuk mempercepat proses ini, anda bisa gunakan fasilitas replace All di notepad.

Hasil tutorial ini, anda bisa mencoba klik tombol berikut (pastikan anda menggunakan android atau menggunakan komputer yang sudah terhubung dengan whatsApp versi web):



Demikian Cara Membuat Kode Order via WhatsApp di Blog Bisnis, Semoga bermanfaat.

Cara Membuat Menu Responsive Praktis di Blogger

Template Responsive untuk blogger saat ini banyak sekali tersedia di internet, anda bisa mendapatkanya secara cuma-cuma alias gratis, anda download, dan pasang di blog anda dengan mudah dan cepat. Beberapa template blog responsive yang tersedia di internet ada yang sudah menggunakan menu responsive lengkap dengan menu dropdown, namun banyak juga yang hanya menggunakan menu utama saja, tidak tersedia fitur menu drop down pada template responsive gratis tersebut.


Lain halnya dengan template responsive blogger yang versi premium, atau anda harus membeli kepada pembuat template blog responsive tersebut, menu-menu yang tersedia sudah support menu drop down, dan pengelolaan template responsive jenis premium ini tentunya semakin mudah, karena tiada lain ingin memanjakan anda sebagai pembeli template blog.

Pada kesempatan kali ini, akan saya bagikan tutorial Cara Membuat Menu Responsive Praktis di blogger, lengkap dengan menu dropdown, dengan tampilan seperti berikut:
Untuk tempilan menu saat blog dibuka menggunakan laptop seperti pada gambar berikut:


Sedangkan untuk tampilan menu saat blog dibuka menggunakan hp tampilan sebagai berikut:

Cara membuatnya, anda cukup menambahkan gadget HTML/ JavaScript dibawah header blog anda, kemudian copy paste kode berikut:

   <nav id='menu'>
    <input type='checkbox'/>
    <label>≡<span>MENU</span></label>
    <ul>
    <li><a href='/'>Home</a></li>
    <li><a href='#'>About</a></li>
    <li><a href='#'>Bisnis Online <font size='1'>▼</font></a>
    <ul class='menus'>
    <li><a href='http://www.mungbisnis.com'>Jasa Pembuatan Blog</a></li>
    <li><a href='http://www.mungbisnis.com'>Jasa Pembuatan Web</a></li>
    <li><a href='http://www.mungbisnis.com'>Jasa Pembuatan Toko Online</a></li>
    <li><a href='http://www.mungbisnis.com'>Jasa Pembuatan Blog Pribadi</a></li>
    <li><a href='http://www.mungbisnis.com'>Jasa Pembuatan Instansi</a></li>

    </ul>
    </li>
    <li><a href='#'>Contact</a></li>
    <li><a href='#'>Drop Down <font size='1'>▼</font></a>
    <ul class='menus'>
    <li><a href='#'>Tab 1</a></li>
    <li><a href='#'>Tab 2</a></li>
    <li><a href='#'>Tab 3</a></li>
    </ul>
    </li>
    <li><a href='#'>Advertise</a></li>
           </ul>
        </nav>

<style>
    /*-----Start Responsive Drop Down Menu by MBT redesign by MungBisnis.com ----*/
    body {
    margin: 0px;
    }
    #menu{
    background: #333333;
    color: #FFF;
    height: 40px;
    }
    #menu ul,#menu li{margin:0 auto;padding:0 0;list-style:none}
    #menu ul{height:45px;width:1024px}
    #menu li{float:left;display:inline;position:relative;font:bold 0.9em Arial;text-shadow: 1px 2px 4px #838383;}
    #menu a{display: block;
    line-height: 40px;
    padding: 0 14px;
    text-decoration: none;
    color: #FFF;
    }
    #menu li a:hover{
    color: #E4E4E4;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    background: #5c5b5b;
    }
    #menu input{display:none;margin:0 0;padding:0 0;width:80px;height:30px;opacity:0;cursor:pointer}
    #menu label{font:bold 30px Arial;display:none;width:35px;height:36px;line-height:36px;text-align:center}
    #menu label span{font-size:16px;position:absolute;left:35px}
    #menu ul.menus{
    height: auto;
    overflow: hidden;
    width: 170px;
    background: #333333;
    position: absolute;
    z-index: 99;
    display: none;
    }
    #menu ul.menus li{

    display: block;
    width: 100%;
    font:normal 0.8em Arial;
    text-transform: none;
    text-shadow: none;
    border-bottom: 1px dashed #333333;

    }
    #menu ul.menus a{
    color: #FFF;
    line-height: 35px;
    }
    #menu li:hover ul.menus{display:block}

    #menu ul.menus a:hover{
    background: #5c5b5b;
    color: #FFF;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    }

    @media screen and (max-width: 800px){

      #menu{position:relative}
      #menu ul{background:#111;position:absolute;top:100%;right:0;left:0;z-index:3;height:auto;display:none}
      #menu ul.menus{width:100%;position:static;padding-left:20px}
      #menu li{display:block;float:none;width:auto; font:normal 0.8em Arial;}
      #menu input,#menu label{position:absolute;top:0;left:0;display:block}
      #menu input{z-index:4}
      #menu input:checked + label{color:white}
      #menu input:checked ~ ul{display:block}

    }
    /*-----End Responsive Drop Down Menu by MBT redesign by MungBisnis.com ----*/
 </style>   
Perhatikan gambar berikut:

Kode diatas sudah berisi menu2 yang bisa anda edit langsung saat memasukan di gadget HTML/JavaScript, untuk mengatur warna agar sesuai dengan warna blog anda, silahkan anda ganti saja kode warna berikut:
  • Kode warna background menu utama: #333333 Klik DISINI untuk mencari kode warna yang lain.
  • Kode warna background sub menu: #5c5b5b
Untuk melihat demo menu responsive silahkan buka link DISINI.

Tutorial Cara Membuat Menu di Blog


Menu dan sub menu di blog berfungsi untuk memudahkan pengunjung blog untuk membuka berbagai informasi yang ada di web/ blog kita. Bagi website/ blog yang memiliki informasi sangat banyak dengan berbagai kategori informasi yang banyak pula, membuat sub menu tentunya pilihan yang tepat. Nah... pada kesempatan ini akan kita pelajari bersama bagimana cara membuat menu dan sub menu di blog dengan mudah dan cepat.

1.    Login Blogger.com
2.    Klik halaman "Template" backup template lengkap untuk berjaga-jaga terjadi hal-hal yang tidak di inginkan dengan mengklik Cadangkan/ Pulihkan.


3.    Kemudian klik Edit HTML;

4.    Cari kode ]]></b:skin>
dengan menggunakan Ctrl + F.

5.    Copy kode script di bawah ini dan letakkan tepat di atas kode  ]]></b:skin>
#menubar{
border-bottom:4px solid #ff0000;
width:1025px;
height:32px;
background:#000000;
float:center;
margin-bottom:3px;
}
#menubar ul{
float:left;
margin:0;
padding:0;
}
#menubar li{
float:left;
list-style:none;
margin:0;
padding:0;
}
#menubar li a, #menubar li a:link{
float:left;
padding:8px 12px;
color:#fff;
text-decoration:none;
font-size:13px;
font-weight:bold;
}
#menubar li a:hover, #menubar li a:active, #menubar .current_page_item a  {
background: #ff0000;
color: #fff;
text-decoration:none;
}
#menubar li li a, #menubar li li a:link, #menubar li li a:visited{
font-size: 12px;
background: #ff0000;
color: #fff;
text-decoration:none;
width: 150px;
padding: 0px 10px;
line-height:30px;
}
#menubar li li a:hover, #menubar li li a:active {
background: #000000;
color: #ffffff;
}
#menubar li ul{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:170px;
margin-top:32px;
border:1px solid ##ff0000;
}
#menubar li:hover ul, #menubar li li:hover ul, #menubar li li li:hover ul, #menubar li.sfhover ul, #menubar li li.sfhover ul, #menubar li li li.sfhover ul{
left:auto
}
#menubar li:hover, #menubar li.sfhover{
position:static
}
6.    Simpan Template.

7.    Copy script berikut dan pasang di widget HTML/JavaScript blog anda:
<div id='menubar'>
<ul>
<li><a href=””>Home</a></li>
<li><a href=”URL_TUJUAN”>About Me</a></li>
<li><a href=”URL_TUJUAN”>>Contact Me</a>
<ul>
<li><a href=”URL_TUJUAN”>>Google +</a></li>
<li><a href=”URL_TUJUAN”>>Facebook</a></li>
<li><a href=”URL_TUJUAN”>>Twitter</a></li>
</ul>
</li>
</ul>
</div>
8.    Letakan widget HTML/JavaScript yang berisi kode menu diatas di bawah header, perhatikan gambar berikut:




  • Download Lengkap tutorial : Cara Membuat Menu di Blog Drive
  • Cara Mendapat Hosting Gambar Gratis

    Mendapat tempat penyimpanan gambar gratis buat blog atau web kita tentu sangat kita inginkan, apalagi Unlimited Bandwidth. Dengan memiliki hosting unlimited bandwidht tentu saja kita tidak khawatir lagi dilain hari gambar di blog kita jadi lambat nge-load-nya atau bahkan malah gak tampil.

    Sering kali hal ini ditanyakan klien Mung Bisnis- Jasa Pembuatan Blog Elegant, Keren dan Murah, bagaimana sih memasang banner di blog, membuat kode pasang banner, atau kadang juga bagaimana upload gambar dan dimana tempat yang pas dan cocok untuk tempat gambar kita?
    Okey, sekarang langsung saja kita pelajari bersama:

    Changing the Read More in blogger - New Feature

    If you feel like changing the Read More text to your own custom phrase, you can easily do this from the Layout | Page Elements tab. Click Edit on the Blog Post widget, and then change the Post page link text to whatever you'd like.


    Cara Membuat Slide Gambar Posting Otomatis

    Pada tutorial ini kita akan belajar bagaimana Cara Membuat Slide Gambar Posting Otomatis pada blog dengan engine blogger.com, dan bagi anda yang telah berhasil mempraktikan tutorial Membuat Slide Gambar di Blog Dengan JQuery pada posting saya terdahulu saya ucapkan SELAMAT, dan anda bisa mencoba tutorial saya kali ini pada blog kesayangan anda.

    Beberapa klien MungBisnis.com | Jasa Pembuatan Blog Elegant Keren dan Murah ada yang menghendaki blog hasil redesain MungBisnis diberi slide gambar dan posting otomatis yang posisinya diletakan diatas posting, dibawah header, browsing cari-cari yang cocok, ketemulah di blognya mas kholis, hanya sedikit perubahan yang saya lakukan, yaitu compressing kode, dan beberapa saya non aktifkan, sebagai gambaran lihat demo di link berikut: mungdemo1.blogspot.com

    Oke, langsung ke tutorial Cara Membuat Slide Gambar Posting Otomatis di Blogger:
    WARNING!   Biasakan backup template anda supaya jika terjadi kesalahan, anda bisa mengembalikan template blog sebelum di edit (klik gambar dibawah untuk memperbesar tampilan).


    Cara backup template blog anda perhatikan gambar diatas.

    1. Login Blogger.com
    2. Buka Template dan klik EDIT HTML perhatikan gambar berikut:

    3. Letakkan kode dibawah ini tepat diatas kode ]]></b:skin>
    /*SLIDER MRMUNG.COM */
    #featured{width:530px;height:300px;position:relative;margin:0;padding:0}
    #featured ul.ui-tabs-nav{display:none;position:absolute;top:0;right:0;list-style:none;width:240px;height:300px;margin:0;padding:0}
    #featured ul.ui-tabs-nav li{position:relative;line-height:1.3em;padding:0}
    #featured ul.ui-tabs-nav li span{font:bold 12px Arial;line-height:1.3em;color:#000;margin:0;padding:0}
    #featured .ui-tabs-panel{width:530px;height:300px;background:#ddd;position:relative;overflow:hidden}
    #featured .ui-tabs-panel img{width:530px;height:300px}
    #featured .ui-tabs-hide{display:none}
    #featured li.ui-tabs-nav-item a{display:none;width:215px;height:57px;color:#000;overflow:hidden;background:#ddd;border-left:10px solid #999;line-height:1.4em;outline:none;margin:0 0 2px;padding:2px 10px 2px 5px}
    #featured li.ui-tabs-nav-item a:hover{border-left:10px solid #555;background:#ccc}
    #featured li.ui-tabs-selected{position:absolute}
    #featured ul.ui-tabs-nav li.ui-tabs-selected a{background:#aaa;display:block;border-left:10px solid #444}
    #featured ul.ui-tabs-nav li img{width:75px;height:48px;float:left;background:#333;border:none;margin:4px 7px 4px 0;padding:0}
    #featured .ui-tabs-panel .info{position:absolute;top:228px;left:0;height:71px;width:530px;background:#000;opacity:0.80;filter:alpha(opacity=80)}
    #featured .info a{text-decoration:none;color:#eee}
    #featured .info a:hover{color:#FE9A2E;text-decoration:underline}
    #featured .info h2{font-size:15px;font-family:Arial, serif;color:#fff;overflow:hidden;margin:0;padding:5px}
    #featured .info p{font-family:Arial;font-size:11px;line-height:15px;color:#f0f0f0;margin:0 5px}
    /*END SLIDER MRMUNG.COM */
    Keterangan: Angka yang saya beri warna merah pada kode diatas, silahkan anda ganti sesuai dengan kebutuhan anda.

    4. Copy kode dibawah ini dan letakkan di atas kode </head> 
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
    <script src='http://yourjavascript.com/511211242172/jquery-ui.min.js' type='text/javascript'/>

    <script type='text/javascript'>
        $(document).ready(function(){
            $(&quot;#featured &gt; ul&quot;).tabs({fx:{opacity: &quot;toggle&quot;}}).tabs(&quot;rotate&quot;, 4000, true);
        });
    </script>

    <script type='text/javascript'>
    //<![CDATA[
      eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('w=Z T();w[0]="1Y://2.1Z.1X.1W/-1U/1V-21/22/27/26/25+23.1T";V=17;28=17;19=1K;1I=20;X=4;14 15(18,1a){e s=18.q("<");u(e i=0;i<s.h;i++){g(s[i].z(">")!=-1){s[i]=s[i].N(s[i].z(">")+1,s[i].h)}}s=s.1M("");s=s.N(0,1a-1);1Q s}14 1L(C){j=(V)?M.1i((w.h+1)*M.1d()):0;n=Z T();u(e i=0;i<X;i++){e f=C.O.f[i];e G=f.R.$t;e P;e A;g(i==C.O.f.h)v;u(e k=0;k<f.l.h;k++){g(f.l[k].S==\'1e\'){A=f.l[k].D;v}}u(e k=0;k<f.l.h;k++){g(f.l[k].S==\'1f\'&&f.l[k].1g==\'1h/1c\'){P=f.l[k].R.q(" ")[0];v}}g("Q"E f){e r=f.Q.$t}J g("H"E f){e r=f.H.$t}J e r="";x=f.16.$t;g(j>w.h-1)j=0;n[i]=w[j];s=r;a=s.z("<n");b=s.z("F=\\"",a);c=s.z("\\"",b+5);d=s.1j(b+5,c-b-5);g((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))n[i]=d;e B=[1,2,3,4,5,6,7,8,9,10,11,12];e K=["1E","1F","1D","1B","1p","1q","1r","1o","1n","1k","1l","1m"];e 1s=x.q("-")[2].N(0,2);e m=x.q("-")[1];e y=x.q("-")[0];u(e o=0;o<B.h;o++){g(1t(m)==B[o]){m=K[o];v}}e I=\'<L 13="Y-U-1R Y-U-1P" 1z="W-\'+i+\'"><a D="\'+A+\'"><n 1A="24" 1y="1O" F="\'+n[i]+\'"/></a><L 13="1N"><1b><a D="\'+A+\'">\'+G+\'</a></1b><p>\'+15(r,19)+\'...<a D="\'+A+\'"></a></p></L></L>\';1v.1w(I);j++}}14 1H(C){j=(V)?M.1i((w.h+1)*M.1d()):0;n=Z T();u(e i=0;i<X;i++){e f=C.O.f[i];e G=f.R.$t;e P;e A;g(i==C.O.f.h)v;u(e k=0;k<f.l.h;k++){g(f.l[k].S==\'1e\'){A=f.l[k].D;v}}u(e k=0;k<f.l.h;k++){g(f.l[k].S==\'1f\'&&f.l[k].1g==\'1h/1c\'){P=f.l[k].R.q(" ")[0];v}}g("Q"E f){e r=f.Q.$t}J g("H"E f){e r=f.H.$t}J e r="";x=f.16.$t;g(j>w.h-1)j=0;n[i]=w[j];s=r;a=s.z("<n");b=s.z("F=\\"",a);c=s.z("\\"",b+5);d=s.1j(b+5,c-b-5);g((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))n[i]=d;e B=[1,2,3,4,5,6,7,8,9,10,11,12];e K=["1E","1F","1D","1B","1p","1q","1r","1o","1n","1k","1l","1m"];e 1s=x.q("-")[2].N(0,2);e m=x.q("-")[1];e y=x.q("-")[0];u(e o=0;o<B.h;o++){g(1t(m)==B[o]){m=K[o];v}}e I=\'<1u 1z="1C-W-\'+i+\'" 13="Y-U-1C-1J"><a D="#W-\'+i+\'"><n 1A="1G" 1y="1S" F="\'+n[i]+\'"/><1x>\'+G+\'</1x></a></1u>\';1v.1w(I);j++}}',62,133,'||||||||||||||var|entry|if|length||||link||img|u2||split|postcontent|||for|break|imgr|postdate||indexOf|posturl|month|json|href|in|src|posttitle|summary|trtd|else|month2|div|Math|substring|feed|pcm|content|title|rel|Array|tabs|showRandomImg|post|numposts1|ui|new||||class|function|removeHtmlTag|published|true|strx|summaryPost|chop|h2|html|random|alternate|replies|type|text|floor|substr|Oct|Nov|Dec|Sep|Aug|May|Jun|Jul|day|parseInt|li|document|write|span|height|id|width|Apr|nav|Mar|Jan|Feb|80|showrecentposts5|summaryTitle|item|70|showrecentposts4|join|info|246|hide|return|panel|50|jpg|uitX7ROPtTU|Tyv|com|blogspot|http|bp||G4NA_uI|AAAAAAAAFBY|image|400|no|s1600|NcWLPVnYEnU|aBold'.split('|'),0,{}))
     //]]>
    </script>
    5. Langkah terakhir Copy kode dibawah ini dan letakkan didalam widget HTML/ Java Script
    <div id='featured'>
    <ul class="ui-tabs-nav">
    <script>
    document.write("<script src=\"/feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts5\"><\/script>");
    </script>
    </ul>
    <script>
    document.write("<script src=\"/feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts4\"><\/script>");
    </script>

    </div>
    Perhatikan gambar berikut (klik gambar untuk memperbesar):



    Demikian, semoga berhasil anda prakatikan dan bermanfaat.

    Bagi yang gak ada waktu dan gak  mau repot cara membuat dan mengedit blog, serahkan saja kepada Mung Bisnis | Jasa Pembuatan Blog.

    Membuat Tombol Share Facebook Dengan Counter

    Membuat Tombol Share/ berbagi tulisan ke salah satu situs jejaring sosial yang lagi booming facebook sangatlah baik untuk mendongkrak jumlah visitor ke blog kesayangan kita. Dengan Counter atau penghitung otomatis ketika tombol share di klik bisa kita jadikan masukan tentang kwalitas dan laku tidaknya tulisan kita, tapi itu semua tidak lepas dari keinginan visitor sendiri untuk membagikan tulisan kita ke orang lain.
    Untuk membuat tombol share ke facebook dengan counter caranya adalah sebagai berikut:

    Script Membuat Buku Tamu Cepat dan Praktis

    Membuat buku tamu di blog sebenarnya sudah pernah saya posting di koleksi web penyedia layanan shout box  yang kebanyakan untuk mengambil script shout box yang akan dijadikan sebagai buku tamu, anda harus register terlebih dahulu.
    Untuk kali ini anda tidak perlu lagi repot register, verifikasi email dll, tapi langsung copy script Buku Tamu dibawah, sedikit perubahan, dan buku tamu sudah bisa digunakan. Sangat praktis dan simpel.

    Tips dan Trik Blog: Agar Title Blog Kita SEO Friendly

    Agar Title Blog Kita SEO Friendly,  Agar title blogger lebih lebih bersahabat dengan Search Engeine (SEO Friendly) kita dapat mengganti Title standar yang sudah ada di dalam template blog kita dengan Title kode yang sudah dimodifikasi.
    Caranya adalah:

    Membuat Slide Gambar di Blog Dengan JQuery

    Demo Membuat Slide Gambar di Blog Dengan JQuery Silahkan anda lihat di http://smpn1klw.sch.id dibawah header ada slide show gambar dengan animasi transisi yang berubah-ubah, dan hasilnya cukup apik juga.

    Cara menampilkan dokumen office (word, excell, power point) di blog

    Kebutuhan blog yang didedikasikan sebagai blog education saya kira tidak akan lepas dari menampilkan materi pembelajaran bisa berupa presentasi maupun hasil penilaian peserta didik. Dalam kondisi offline kita dengan mudah membuat file dokumen, presentasi dan laporan daftar nilai siswa dengan menggunakan program aplikasi dari Ms. Office atau menggunakan open office, namun apabila kita ingin menampilkan secara online kadang kita bingung bagaimanile-file dokumen kita secara mudah dan cepat. Sebenarnya fasilitas ini sudah lama disediakana cara menampilkan file yang sudah kita buat di komputer ke blog secara online, dan mudah untuk di edit apabila ada kesalahan. Ternyata eh ternyata, Google sebagai perusahaan raksasa di Internet sudah menyediakan software yang mampu mengonlinekan f Google, cuma kadang kita tidak menggunakanya karena belum adanya kebutuhan untuk menggunakan fasilitas ini.

    Cara Memasang Widget Twitter di Blog

    Memasang widget twitter di blog ternyata banyak juga yang menginginkanya, terbukti dari beberapa klien MungBisnis.com minggu ini banyak yang meminta fitur tambahan berupa widget twiter yang bisa menampilkan kicauanya di blog secara uptodate, walau sebenarnya dari sisi kecepatan loading blog cukup mempengaruhi, dan saya pribadi termasuk yang kurang begitu suka dengan blog yang lambat ketika diakses, namun, tidak ada salahnya jika pada posting kali ini saya sajikan tutorial cara memasang widget twitter di blog pendidikan atau blog guru atau blog pribadi anda.

    Berikut langkah-langkah membuat widget twitter yang bisa di pasang di blog anda:
    1. Silahkan anda login terlebih dahulu di twitter anda,
    2. Buka alamat ini: https://twitter.com/settings/widgets 
    3. Klik tombol Create New

    4. Atur sesuai kebutuhan anda, mulai dari memasukan username twitter anda, tinggi (height) tampilan widget twitter anda, dan terakhir anda klik tombol Create Widget

    5. Terakhir anda akan mendapatkan kode java script dari twitter, dan silahkan anda copy untuk dipasang di blog anda.


    Cara Memasang Widget Twitter di Blogspot:
    • Login ke blogger.com 
    • Buka tata letak atau layout blog anda
    • Klik tambah gadget dan pilih HTML/JavaScript
    • Copy - Paste kode javascript yang diberikan twitter kedalam kotak gadget HTML/JavaScript blogspot anda.
    • Klik tombol Simpan.
    • Alhamdulillah... widget twitter telah terpasang di blog anda.

    Projector DLP vs 3LCD

    Pada spesifikasi Projector anda perlu memperhatikan beberapa spesifikasi teknis. Umumnya, yang diperhatikan adalah ANSI Lumens, serta XGA atau SVGA. Ada satu lagi poin penting yaitu mengenai perbedaan teknologi Projector yang ada dipasaran saat ini, yaitu menggunakan dua jenis teknologi, yaitu:LCD (Liquid Crystal Display) atau sering disebut dengan 3LCD dan DLP (Digital Light Processing). Keduanya memiliki keunggulan tersendiri.

    TEhknologi DLP ,adalah sebuah tekhnologi optik semikonduktor atau DMD (DIGITAL MIRROR DEVICE) yang ditemukan oleh Dr. Larry Hornbeck of Texas Instruments in 1987..
    DLP ini adalah tekhnologi tercanggih pada sistem Projector ,yang dari DMD tsb memiliki 2juta micromirors yang masing-masing micromiror pada DLP ini ukuranya seperlima rambut manusia ,hmm bisa dibayangkan bagaimana banyaknya dan tak akan bisa dilihat oleh kasat mata.

    Micromirors pada DLP mampu menghasilkan 1024 warna putih dan hitam,ini mengakibatkan DLP sangat baik ketika menampilkan warna putih atau hitam pada layar.
    Sebuah cahaya putih dari sinar lampu pada tekhnologi DLP akan melewati panel roda warna red,green,blue yang dengan proses tsb proyektor dapat menampilkan warna 16,7juta dan nantinya hasil dari pemfilteran cahaya putih terhadap panel roda red,green,blue ini akan menghasilkan warna tambahan yaitu cyan,magenta dan bahkan yellow....dan tekhnologi ini hanya ada di DLP




    Iklan Oleh Google



    Dalam beberapa sistem DLP ,dimasukkan sebuah tekhnologi canggih untuk proyektor kelas tinggi yang bisa menghasilkan 35 triliun warna dan biasanya digunakan pada bioskop atau untuk konser.

    Selain daripada itu DLP juga tercatat sebagai Tekhnologi proyektor yang lebih bandel terhadap lingkungan luar yang kurang bersahabat seperti asap,debu dan suhu terlalu lembab atau terlalu panas yang dapat mengakibatkan proyektor lebih pendek umurnya.

    3LCD
    3lcd adalah sebuah tekhnologi canggih dari sebuah proyektor yang dapat memberikan kualitas warna dan gambar dengan sebenarnya.
    Proyektor dengan 3lcd ini menggunakan sistematik sbg berikut ,


    dari sebuah cahaya yang lalu diteruskan ke 3 panel cermin red ,green,blue dan setiap panel chip lcd menerima sinyal yang akhirnya dari ketiga panel warna tersebut menyatukan hasil cahaya dari panel masing2(RGB) kedalam sebuah prisma hingga dapat menghasilkan warna yang sangat terang dan indah.

    Selain dari itu 3LCD juga lebih hemat daya dari DLP sekitar 25%,per lumenya

    3LCD pertamakali dikeluarkan oleh EPSON dengan tipe VPJ 700 pada tahun 1989 dan pertamakali dibuat pada tahun 1980 .dan sekarang sudah banyak perusahaan membuat projector dengan harga dan kualitas yang berbeda dan dari sini akan saya ambil kesimpulan mana yang terbaik antara DLP dan 3LCD.

    DLP
    Kelebihan :
    • Bandel
    • Hasil warna untuk putih dan hitam lebih bagus dari 3lcd
    • Ukuran lebih kecil dibanding 3LCD 
    • Hasil gambar pada movie / gambar gerak lebih terlihat halus dan hidup karena memiliki tingkat kontrast ratio di setiap DLP projector yang lebih tinggi dari LCD
    • Harga yang bisa dibilang lebih murah untuk harga tipe LOW END ,dalam pembelian PRojector


    Kekurangan:
    HASIL warna yang kurang sama /sesuai dengan yang ada di layar komputer ,karena hasil dari pemfilteran panel DLP yang menggabungkan 3 panel warna

    3LCD
    Kelebihan :
    Dapat menampilkan hasil gambar / warna yang sangat terang,sesuai dan indah ,karena menggunakan 3 cermin panel secara terpisah,sangat cocok untuk design grafis

    Kekurangan :
    Lebih rawan dan dibutuhkan perawatan yang lebih dari pengguna.

    Hasil pengujian

    Dengan dilakukan pengujian terhadap LCD panel maka terindikasi fungsi-fungsi yang berkurang seiring dengan pemakaian dan waktu. Seperti area warna yang menyimpang, adanya bayangan gambar akibat terbakar dan adanya lubang yang terbakar di dalam panel setelah dipakai 2000 jam.

    Demikianlah perbedaan kedua teknologi ini yaitu: LCD (Liquid Crystal Display) atau sering disebut dengan 3LCD dan DLP (Digital Light Processing). Semoga bisa sebagai referensi awal sebelum membeli projektor untuk menunjang Kegiatan Belajar Mengajar dikelas anda.

    Sumber Informasi:
    1. http://egadged.blogspot.com/2011/08/perbedaan-dan-pengertian-projector-dlp.html
    2. http://www.winnertech.co.id/blog/69-projector-dlp-vs-lcd-mana-yang-lebih-baik.html

    Website Penyedia Layanan Shout Box

    Shoutbox, saybox, tagboard, atau chatterbox adalah fitur semacam chatting yang memperbolehkan pengunjung suatu situs web untuk meninggalkan pesan instan situs tersebut.

    Pada jenisnya yang paling sederhana, shoutbox hanya menampilkan pesan singkat, bersama dengan informasi penulisnya. Kotak shoutbox akan senantiasa diperbaharui, agar segera menampilkan pesan-pesan terbaru. Umumnya pesan yang sudah lama akan terhapus setelah jumlah tertentu telah dicapai, untuk menghemat kapasitas di server. (wikipedia)

    Shout Box sering saya buat sebagai Buku tamu atau ghuest book yang diperuntukan bagi para pengunjung blog yang ingin meninggalkan jejak mereka, dengan tujuan tentunya biar bisa saling berkunjung ke blog mereka.

    Website penyedia fasilitas buku tamu/ ghuest book/ pesan singkat sangatlah banyak beredar dijagat perinternetan, bertambahnya komunitas blogger, para blogger baru yang bermunculan menambah semangat juga bagi para penyedia layanan buku tamu untuk berlomba memberikan yang terbaik untuk blog-blog baru, tentunya hal ini tidak lepas dari unsur bisnis didalamnya. karena untuk mendapatkan fasilitas lengkap dan profesional, member diwajibkan memyumbangkan donasi atau berlangganan dengan mentransfer beberapa dolar ke pengelola website penyedia buku tamu/ ghuest book/ pesan singkat tersebut.

    Diantara website penyedia layanan buku tamu/ ghuest book/ pesan singkat adalah sebagai berikut:
    1. www.shoutmix.com
    2. www.cbox.ws/
    3. www.oggix.net/
    4. www.sbox.ws
    5. www.myshoutbox.com
    6. www.freeshoutbox.net
    7. www.shout-box.com
    8. www.shoutboxpro.com
    9. www.free-shoutbox.co.uk
    10. www.messengerfreak.com
    11. http://shoutbox.widget.me/

    Untuk mendapatkan script / kode shout box tersebut juga terbilang mudah, anda tingal daftar seperti biasa membuat nama user, buat password, masukan email, masukan alamat website dan get code atau tinggal ambil script kode shoutbox dan kemudian anda tambahkan gadget html/ JavaScript  di blog dan masukan kode yang sudah anda dapatkan tadi didalam gadget html/JavaScript. simpan dan nikmati shoutbox yang keren-keren ini.

    Semoga bermanfaat.

    Bagi yang gak ada waktu dan gak  mau repot cara membuat dan mengedit blog,
    serahkan saja kepada Mung Bisnis | Jasa Pembuatan Blog.

    Edit Menu dan Sub Menu Melalui Edit HTML Template

    Pada tutorial ini saya akan membahas cara mengedit menu dan sub menu pada jenis template yang mengharuskan mengedit melalui Edit HTML Template.
    Sebagai study kasus, kita akan mengedit menu dan sub menu seperti pada gambar berikut ini:

    1. Login halaman admin blog anda seperti biasa, => blogger.com  (masukan email dan password anda)
    Klik template dan klik pada Edit HTML Perhatikan  gamabar berikut:


    2. Setelah kode HTML template terbuka, beri centang pada expand Template Widget (ditunjukan dengan nomor 2 pada gambar diatas)
    Gunakan tombol kombinasi keyboard CTRL+F untuk menggunakan fasilitas Find (ditunjukan pada nomor 3), ketiklah nama menu yang akan anda edit, maka seperti contoh diatas ditunjukan pada nomor 4, menu yang ada dalam kode template akan tampak.

    Pada gambar dibawah ini merupakan contoh dimana saya akan mengedit Sub Menu Drop Menu 1, perhatikan gambar:


    Pada gambar diatas nomor 1 merupakan letak link tujuan menu ketika di klik, sedangkan nomor 2 merupakan nama menu/ sub menunya.

    Pada nomor 3 merupakan kode untuk 1 menu, jadi jika anda akan menambah menu lain, maka anda cukup mengcopy kode HTML sesuai gambar diatas.

    Pastikan anda sudah memposting tulisan sesuai dengan menu yang akan dibuat, karena nanti posting tersebut akan diambil link lokasinya untuk dipasang pada menu, sebagai contoh:
    Saya akan membuat menu Profil, maka saya memposting terlebih dulu dengan judul Profil, setelah dipublikasikan, maka kita bisa mendapatkan link lokasi posting Profil seperti link berikut:
    http://www.bloganda.com/2013/03/profil.html
    (kita bisa copy link diatas di Address Bar)

    Dari link yang sudah kita dapatkan, selanjutnya kita pasang di kode HTML menu, maka jadinya seperti kode berikut::
  • Menu Profil


  • Demikian, semoga bermanfaat.

    Kumpulan Gadget Terbaik dan Unik Di Dunia

    Posting informasi seputar Teknologi Terbaru dan Unik kelas dunia ini didapat dari forum kaskus, saya sengaja abadikan disini sebagai bahan tambahan pengetahuan materi TIK kelas 7 tentang pengenalan hardware, informasi ini menggambarkan betapa cepatnya laju Teknologi dan semakin canggihnya teknologi-teknologi terbaru yang ada, jangan sampai hanya puas menikmati komputer disekolah yang kebanyakan masih menggunakan komputer JADUL, anda bisa membayangkan masih ada sekolah atau mungkin pengguna rumahan yang masih "Istiqomah" dengan menggunakan komputer dengan processor Intel Pentium 2 atau Pentium 3, hmm..... (tapi Alhamdulillah gak terjadi di sekolahku lhoo...).
    okeh, langsung saja kita simak bersama dan nikmati gambar-gambar teknologi terbaru dan unik kelas dunia ini:

    Mungkin kita tahu saat ini perkembangan teknologi sangat pesat. Salah satunya dalam permasalahan gadget. Gadget adalah barang elektronik yang paling sering digunakan banyak orang untuk memudahkan suatu kegaiatan maupun hanya untuk sebagai pelengkap dalam keseharian.

    1. Window phone concept
    Berikut Merupakan sebuah ponsel keluaran I-Phone dengan fitur yang menarik yaitu memiliki tema handphone sesuai keadaan cuaca.




    2. AFGT Gaming Device
    Gadget ini digunakan sebagai pelengkap dalam Game konsole DII Nintendo, dengan sistem sentuhan kita dapat menggerakan permainan melalui gadget ini.



    3. Babelfisk
    Untuk yang satu ini mungkin terlihat agak norak, tapi asala anda tahu, dengan menggunakan kacamata ini anda dapat merekam semua pembicaraaan seseorang ke dalam flash drive yang ada dalam kaca mata ini.

    4. eRoll
    Gadget ini penggunaannya hampir sama dengan IPad namun kelebihannya dia bisa digulung seperti koran, hingga lebih mudah dibawa.

    5. Folding-out Laptop
    Laptop Transformer julukannnya karena memang laptop ini mempunyai keyboard seperti keyboard komputer pada umumnya. Bahkan lebih lengkap.

    6. HP LIM Glass computer
    Sebuah Komputer tranparan dengan dilengkapi LCD 19" Touchscreen akan membuat anda mengunakan komputer lebih nyaman.

    Yang saya posting disini hanya sebagian saja, lebih lengkapnya anda bisa buka blog berikut:

    Koleksi Tutorial Blog

    Arsip Blog