Tampilkan postingan dengan label Image. Tampilkan semua postingan
Tampilkan postingan dengan label Image. Tampilkan semua postingan

Membuat Tampilan di pojok Layar

0

Bookmark and Share

Untuk membuatnya ikuti langkah berikut :
  1. Login ke blogger trus klik Template -->> Edit HTML
  2. Cari kode ini ]]></b:skin> kalau sudah ketemu taruh kode berikut ini di atasnya.
    #trik_pojok {
    position:fixed;_position:absolute;bottom:0px; left:0px;
    clip:inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft+document.documentElement.clientWidth - offsetWidth); }
  3. Teks yang dicetak merah tebal adalah posisinya, kalau ingin ganti di posisi pojok kanan bawah tinggal teks "left" diganti dengan "right". Begitu juga tulisan "bottom", jika ingin di posisi atas bisa diganti dengan "top".
  4. Langkah selanjutnya yaitu letekkan script berikut ini sebelum kode </body>
  5. <div id="trik_pojok"><a href="http://tutorialblogger.blogspot.com">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRbn7KpqOw7J8OuN8xkjaDkykJnrMtGldEUpEG9JAaJuCymYramGVp74cpm7mUu5RtB3lt23zmCay5tIIQt5wXgPrphDfx7aJzrRhEfw1mZ6xCoPvwjX86ksjUaX9Yc2tIxJY-hTAkujw/" border="0" /></a>
    </div>
    "http://tutorialblogger.blogspot.com" adalah link. ganti dengan link kamu.
    "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRbn7KpqOw7J8OuN8xkjaDkykJnrMtGldEUpEG9JAaJuCymYramGVp74cpm7mUu5RtB3lt23zmCay5tIIQt5wXgPrphDfx7aJzrRhEfw1mZ6xCoPvwjX86ksjUaX9Yc2tIxJY-hTAkujw/" adalah lokasi gambar. ganti dengan lokasi gambar kamu.

  6. Jika kamu ingin yang ada disitu bukan gambar tetapi jam/ kalender/ hit counter/ widget-widget yang lain, maka ganti teks yang berwarna biru dengan script widget-widget tersebut.
  7. Simpan hasil kerja kamu dan lihat hasilnya...

Read More >>

Mengganti Background dengan Gambar sendiri

0

Bookmark and Share

Siapkan gambar yang ingin dijadikan background pada blog anda, denganukuran terserah anda, akan tetapi jangan terlalu besar, karena akanmemperlama pengunjung membuka blog anda.
Upload gambar anda ke situs-situs file hosting...misalnya Picasa..

Jika gambar sudah ditentukan, ikuti langkah-langkah berikut :

  1. Lakukan Login terlebih dahulu pada blog anda
  2. Klik Menu Layout
  3. Klik Edit HTML tab (Note : Untuk menghindari kesalahan, silahkan Backup terlebihdahulu blog anda dengan memberikan checklist pada Download fulltemplate dan klik Download atau dengan cara meng-Copy seluruh kodeTemplate, paste pada notepad lalu save)
  4. Kemudian tambahkan kode (alamat gambar) berikut pada style sheet css anda dan letakkan pada teks yang berwarna merah:

url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwkB1wIUO-mY6-kJTIUaIjv_pBFfMNDttG2JMwKnYal27mVnz-d-AMCLUk-vieiTf2UP0mvinHE4kIA7PlqbrTGTaIvZOJorlSugSI3VPsDjZGbOeVk0VF6A7P8XY3w0odORtDhO6w8jjJ/s912/cool20090108_021.jpg');

untuk minima klasik :

body {      background: $bgColor;    font: $bodyFont;    text-align: center;    margin: 0px;    padding: 0px;        color: $textColor;     
    }

untuk minima baru :

body {
    background: $bgColor url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwkB1wIUO-mY6-kJTIUaIjv_pBFfMNDttG2JMwKnYal27mVnz-d-AMCLUk-vieiTf2UP0mvinHE4kIA7PlqbrTGTaIvZOJorlSugSI3VPsDjZGbOeVk0VF6A7P8XY3w0odORtDhO6w8jjJ/s912/cool20090108_021.jpg');    font: $bodyFont;    text-align: center;    margin: 0px;    padding: 0px;        color: $textColor;     
    }


Silahkan diganti alamat link gambar yang berwarna diatas dengan alamat gambar anda.

Klik tombol Preview untuk melihat perubahan

Jika sudah sesuai dengan keinginan, klik tombol Save Template


Semoga bermanfaat :D
Read More >>
 
Tutorial Blogger Design by Trick and Tips Powered by Blogger