2014/05/28

Cara Membuat Ucapan Selamat Datang di Blog Seperti Punyanya Blog-AL

Advertisement

Cara Membuat Ucapan Selamat Datang-

Postingan Kali ini saya akan memberikan tutorial cara membuat ucapan selamat datang seperti milik blog saya ini. Saya membuat ucapan selamat datang di blog ini, awalnya saya melihat blog milik teman saya dan guru saya (guru sekolah), dan saya menjadi tertarik ingin mencoba membuatnya dan memasangkan di blog saya, dan saya cari di mbah google bagaimana cara membuat ucapan selamat datang, ternyata semuanya hampir mirip seperti yang lainnya, tidak seperti Blog-AL (hehehe). Dan setelah cari-cara sana-sini sampai memakan waktu 2 Bulan (bohong) akhirnya ketemu juga tetapi dengan tambahan sedikit kode untuk memaksimalkan. Hasilnya setelah saya terapkan seperti gambar dibawah ini.

blogku-al


Tutorial ini berbeda dari yang lain yang kebanyakan ucapan selamat datangnya akan muncul ketika memasuki halaman blog tersebut dan akan keluar ketika akan meninggalkan halaman blog tersebut dengan disertai tombol keluar atau yang lainnya, tetapi kalau milik Blog-AL akan muncul hanya pada halaman hompage saja dan letaknya tepat di atas postingan. jika memasuki halaman postingan akan tidak muncul, sobat juga bisa memunculkannya dengan menghilangkan kode tertentu, dan yang lebih saya sukai lagi dapat diberi background gambar(bisa .GIF .JPG). maaf sebelumnya kalau postingan saya ini menyinggung blogger lainnya, tetapi tujuan saya menulis ini hanya untuk berbagi kepada teman-teman saja bukan menuai kontrovesi dengan cara menulis artkel.

OK langsung saja ke TKP... ikuti langkah-langkah berikut dengan baik. ini caranya mudah jangan sampai tidak paham, kalau tidak paham silahkan menuliskan komentar dibawah.

1.Masuk akun Blogger sobat
2.Masuk pada Tata Letak
3.Klik Tambahkan Gadget
4.Pilih HTML/Javascript
5.Maukkan kode berikut:

<div style="background: url(http://i796.photobucket.com/albums/yy245/anggialanshori/5388gif_zpsf641d9d6.gif); border: 1px solid #ffff; height: 315px; overflow: auto; padding: 120px 60px 0px 60px; width: auto; line-height:1,5em; font-size:14px;"><p><b> Blog-AL adalah media pembelajaran dan hiburan online yang dapat di akses kapan saja anda mau.</b></p><p><b>Ikuti terus Blog-AL untuk mendapatkan berbagai tutorial, tips, trick, dan cerita saya.</b><p><b>Kunjungan anda sangat berarti sekali bagi saya, apalagi dengan meninggalkan komentar berupa Pujian, Kritik, dan Saran. Terimakasih atas kunjungannya...</b></p></p></div>

Kreasikan sendiri:

Warna Merah : Ganti dengan Url gambar sobat. sobat dapat menggunakan format .GIF atau .JPG
Warna Hijau : Sobat bisa tentukan sendiri tingginya.
Warna Biru : Isikan sambutan-sambutan ucapan selamat datang apa saja yang sobat inginkan.

6.Jangan beri judul, biarkan saja kosong.
7.Klik simpan.
8.Pindahkan gadget tersebut diatas Posting Blog, caranya klik tahan dan geser, letakkan diatas Posting Blog.-> Klik simpan.
9.Sebenarnya sampai langkah disini anda dapat mengakhirinya, tetapi widget tersebut akan muncul di semua halaman baik posting maupun halaman homepage. dan disini jika sobat ingin menampilkan di halaman homepage saja seperti milik blog saya, ikuti langkah selanjutnya.
10.Masuk Template->Edit HTML
11.Cari kata kunci Posting Blog, untuk memudahkan pencarian tekan ctrl+f masukkan kata kunci.
12.Lihat beberapa Baris keatas, cari kode seperti di bawah ini.
<!-- only display title if it's non-empty -->

13.Pastekan Kode Berikut tepat diatas kode tersebut.
<b:if cond='data:blog.url == data:blog.homepageUrl'>

14. Lihat sedikit beberapa baris kebawah ada kode </b:includable>. Tambahkan Kode </b:if> tepat di atasnya.

15.Maka kodenya setelah di buat akan menjadi seperti di bawah ini: Lihat kode yang saya kasih tanda warna kuning, itu adalah kode yang telah kita tambahkan tadi pada nomor 13 dan 14.
            <b:widget id='HTML8' locked='false'  type='HTML'>
            <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h3 class='title'><data:title/></h3>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
</b:if>
</b:includable>
            </b:widget>

Bagaimana sob? mudah kan..? terimakasih sudah mengunjungi blog saya , semoga tutorial Cara Membuat Ucapan Selamat Datang Pada Blog ini dapat bermanfaat bagi sobat.
Advertisement
Jika anda merasa artikel ini bermanfaat silahkan share dengan meng-klik tombol berbagi di bawah ini. Terima kasih.

2 comments:

  1. mantap sob template nya :)
    saya belum ada waktu nih buat edit edit :d

    ReplyDelete
    Replies
    1. hehehe biasa aja sob,,
      blog sobat juga sudah bagus....

      Delete

Silahkan berkomentar dibawah ini:

close ads