Cara membuat Widget Selamat Datang di Blog

Cara membuat Widget Selamat Datang di Blog - Kali ini saya akan membagikan cara membuat widget selamat datang, apa kegunaan dari widget selamat datang. widget selamat datang ini berfungsi untuk memperkenalkan tentang blog kita. dan widget ini juga disertai dengan tombol Mulai dan Gabung, widget ini cukup responsive untuk buat kamu pasang di blog kamu, dan juga ini mirip seperti selamat datang di invert pro. gimana tertarik dengan tampilannya, langsung aja caranya dibawah ini...

Result

Cara Pemasangan :
1. Blogger > Template > Edit Template. masukkan kode dibawah ini tepat diatas kode ]]></b:skin>

/* Welcome */
.intro-invertpro{overflow:hidden;background:#f6f4f4;margin:0 0 2px;padding:3px}
.intro-invertpro h2 {font-family:"Open Sans Condensed",Arial,sans-serif;font-size:32px;}
.intro-invertpro p {line-height:1.6em;margin:1em 0;}
.intro-invertpro a.button{background:#55616d;color:#fff;font-family:"Open Sans Condensed",Arial,sans-serif;font-size:16px;font-weight:700;text-align:center;text-transform:uppercase;border:0;cursor:pointer;outline:none;padding:6px 18px;transition:all .3s;}
.intro-invertpro a.button.kiri{background:#606060;}
.intro-invertpro a.button.kanan{background:#00a5ff;margin-left:10px;}
.intro-invertpro a.button:hover{background:#fff;}
.intro-invertpro a.button.kiri:hover{background:#eb9950;}
.intro-invertpro a.button.kanan:hover{background:#919aa0;}
.intro-invertpro img{position:relative;display:block;float:left;height:auto;margin-right:30px}
@media screen and (max-width:640px){
.post .label-info{position:relative;margin:20px 0;top:0;left:0;}
.intro-invertpro,.post-thumbnail{display:none}}
@media screen and (max-width:384px){
.post h2.post-title.entry-title{font-size:20px;line-height:normal;}
.snippets {display:none;}}

2. Masukkan kode dibawah ini taruh dimana saja terserah. atau kalian bisa menaruhnya di bawah kode header atau navigasi..

  <div class='intro-invertpro'><img alt='Invert Pro' height='160' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNRCLmbaI1vS9F8S4wPphzqJZW9CTc3PrN7BQ8yxFWjAOaXuMaBw4AHga2HmZsH0Y0cXL71e9PCp0fFTMwYZMEFV6eJuDbTYDoV3vVwhp_qR8md8pEn0Pm41vJioMfEeI4c-ptQtscLXe8/s1600/Invert+Pro.png' title='Invert Pro' width='160'/><h2>Selamat Datang...</h2><p>terima kasih telah berkunjung kesini semoga kalian senang</p><a class='button kiri' href='http://masafdo.blogspot.co.id/search/label/Blogging?&amp;max-results=5' title='Telusuri Semua Kategori'>MULAI</a><a class='button kanan' href='https://www.blogger.com/follow-blog.g?blogID=4528952368826788719' rel='nofollow' target='_blank' title='Gabung di Blog masafdo'>Gabung</a></div>

Note : silahkan ganti gambar serta informasi lain didalamnya dengan blog sobat

3. Simpan dan Lihat hasilnya...

itulah Cara membuat Widget Selamat Datang di Blog. Semoga Bermanfaat