Selasa, 25 November 2014
Tag :// Tips Blogger
Blog Indra-kun kini dengan tampilan baru yang di mana tampilan luar seperti ini
.png "Blog Indra-kun")
Dan tampilan posting nya seperti ini
.png)
Dan bagaimana cara membuat nya?
Beberapa mungkin sudah familiar dengan kata-kata Tag Kondisional, atau mungkin sebagian baru mendengar apa itu tag kondisional. Secara sederhana, arti tag kondisional adalah tag yang digunakan untuk mengatur elemen-elemen di mana akan ditampilkan, atau dimana akan disembunyikan. Dan kali ini saya akan menunjukan cara nya membuat tampilan posting menjadi gambar yang berbeda dengan tampilan luar
1. Mengganti Background Utama (Tampilan Luar)
Apabila ingin mengganti tampilan gambar luar cari code :
body{
margin: 0 auto;
padding: 0px 0px 0px 0px;
background: #EEFAFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRYnRdN4dXpM0kxNz06EZXQFpX3Kty73D5YqYZtcJGN0jPrY3iYuRK9Xgc34t187U1W4-_eZ-e8GfSFqiaC_Gb9YltH4eTxEsMpvNBf1idm8mCtesbl5DKy4dWluwZEJO0ETgnCr5QTJHx/s1600/bg_01.png);
font-family: 'Open Sans', sans-serif;
color: #222;
overflow-x: hidden;
font-size: 13px;
margin: 0 auto;
padding: 0px 0px 0px 0px;
background: #EEFAFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRYnRdN4dXpM0kxNz06EZXQFpX3Kty73D5YqYZtcJGN0jPrY3iYuRK9Xgc34t187U1W4-_eZ-e8GfSFqiaC_Gb9YltH4eTxEsMpvNBf1idm8mCtesbl5DKy4dWluwZEJO0ETgnCr5QTJHx/s1600/bg_01.png);
font-family: 'Open Sans', sans-serif;
color: #222;
overflow-x: hidden;
font-size: 13px;
*catatan : untuk kalian yang menggunakan template Djogzs letak nya ada di atas #casing{
apabila tidak ketemu letak nya coba cari dengan CTRL + F
body { atau body{
apabila sudah ketemu code tersebut ganti semua nya dengan :
/* background utama Blog Indra-kun*/
body{
margin: 0 auto;
padding: 0px 0px 0px 0px;
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB3OXwqmB9iH63ZOupOhq00-3iVG4m3MdKPTWWpQNMs2En6tJ2PFql0HoQyyYLGa1zlAInSPvZbnOqJ25WwBx0_S_JtEhvbPTvGTncReU-ZkHUJYuKUeoFStemQeFgwVjM3hDDaLH7gITh/s1600/Blog+Indra-kun.png)top center no-repeat;
color: #222;
overflow-x: hidden;
font-size: 13px;
body{
margin: 0 auto;
padding: 0px 0px 0px 0px;
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB3OXwqmB9iH63ZOupOhq00-3iVG4m3MdKPTWWpQNMs2En6tJ2PFql0HoQyyYLGa1zlAInSPvZbnOqJ25WwBx0_S_JtEhvbPTvGTncReU-ZkHUJYuKUeoFStemQeFgwVjM3hDDaLH7gITh/s1600/Blog+Indra-kun.png)top center no-repeat;
color: #222;
overflow-x: hidden;
font-size: 13px;
Link berwarna merah bisa diganti dengan link yang kalian inginkan, fungsi dari code
top center no-repeat; adalah untuk tetap diam diatas atau Top Center sedangkan #000 adalah warna backround bisa diganti sesuai yang kalian inginkan
top center no-repeat; adalah untuk tetap diam diatas atau Top Center sedangkan #000 adalah warna backround bisa diganti sesuai yang kalian inginkan
2. Menganti Background Posting
Untuk mengganti Background posting kita akan meletakannya diatas </head> gunakan tombol CTRL + F untuk pencarian, apabila sudah ketemu masukan code dibawah tepat diatas </head>
/* Background Posting Blog Indra-kun */
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic' rel='stylesheet' type='text/css'/>
<script src='https://googledrive.com/host/0B6G3XEDWZaMaTUFNbmtWeHpzOTQ' type='text/javascript'/>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<style type='text/css'>
body{
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_xg_jog9M6Mo8NOo-yUkOkv3Q6DGDt1A6DUvN5EI0yM1psjiHnOBe2ivJhNz-zhgDGvsgJ26xnPD5VAca3idF98dy0aizUYrU7SsBk3l_XRZjH1KTwSq_lErkyf1bSQ6Qe6SuzoDYyeM/s1600/Trinity_Blog_indra-kun.png)top center no-repeat;
}
</style></b:if>
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic' rel='stylesheet' type='text/css'/>
<script src='https://googledrive.com/host/0B6G3XEDWZaMaTUFNbmtWeHpzOTQ' type='text/javascript'/>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<style type='text/css'>
body{
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_xg_jog9M6Mo8NOo-yUkOkv3Q6DGDt1A6DUvN5EI0yM1psjiHnOBe2ivJhNz-zhgDGvsgJ26xnPD5VAca3idF98dy0aizUYrU7SsBk3l_XRZjH1KTwSq_lErkyf1bSQ6Qe6SuzoDYyeM/s1600/Trinity_Blog_indra-kun.png)top center no-repeat;
}
</style></b:if>
Ganti link berwarna merah dengan yang kalian inginkan sama seperti Mengganti Background Utama tadi fungsi dari code top center no-repeat; adalah untuk tetap diam diatas atau Top Center sedangkan #000 adalah warna backround bisa diganti sesuai yang kalian inginkan. Apabila sudah Save template Selamat Mencoba.
.png)
.png)
