56 Menambahkan Basmalah dan Hamdalah di Awal dan Akhir Artikel

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ الرَّحِيم

Salam sahabat blogger, alhamdulillah dapat menyapa anda kembali, semoga dimanapun anda berada selalu dalam penjagaan-Nya. Setelah beberapa waktu sempat fakum, request tutorial yang disampaikan lewat komentar atau emailpun akhirnya menumpuk. Mohon maaf juga untuk pertanyaan-pertanyaan yang belum sempat terjawab satu persatu. Hari ini dan kedepan insyaAllah saya ingin mencicil request sahabat blogger, tapi mohon jangan ditambah dulu sebelum PR yang satu ini selesai! Baiklah tutorial kali ini saya ingin mengetengahkan cara menambahkan basmalah dan hamdalah diawal dan akhir artikel blog.

Hampir setiap muslim pasti mengenal kalimat basmalah dan hamdalah. Kalimat pendek sarat makna ini biasanya dipakai ketika akan memulai suatu pekerjaan dan usai mengerjakannya. Karena bacaannya yang pendek ini pula, banyak yang menyepelekan kalimat basmalah dan hamdalah. Padahal jika dikaji lebih mendalam, di samping sebagai sarana meraih cinta Allah, ternyata kedua kalimat ini mengandung kekuatan luar biasa dalam meraih kesuksesan dan keberkahan hidup. Tidaklah mengherankan jika para Nabi, Rasul, dan orang-orang sukses selalu membaca basmalah setiap memulai aktivitasnya dan mengakhiri dengan hamdalah sebagai ungkapan syukur.

Tapi tak menambahkan kedua kalimat ini dalam artikel yang anda tulis, dan mencukupkannya dilisan sendiri saja tentu juga sudah cukup dan baik karena menambahkan keduanya dipostingan bukanlah kewajiban.

Baiklah cukup untuk pengantar, berikut cara menambahkan basmalah dan hamdalah diawal dan akhir posting blog

  • Setelah login ke akun blogger anda
  • Pada dasbor >> klik  tab template >> Edit HTML
  • Klik tab drop down Lompat ke widget >> Blog1 >> Klik tanda panah kecil disamping kode dengan id Blog1
  • Klik tanda panah kecil disamping kode <b:includable id='post' var='post'>
  • Click Ctrl+F >> cari kode <data:post.body/>

Untuk menambahkan basmalah diawal posting tambahkan kode berikut diatas <data:post.body/>

<div style='text-align: center;'><span style='font-size: medium;'><span class='messageBody' data-ft='{&quot;type&quot;:3}'><span dir='rtl'>ب&#1616;س&#1618;ــــــــــــــــم&#1616; اﷲ&#1616;الر&#1614;&#1617;ح&#1618;م&#1614;ن&#1616; الر&#1614;&#1617;ح&#1616;يم</span></span></span></div><br/>

Untuk menambahkan hamdalah diakhir postingan tambahkan kode berikut dibawah <data:post.body/>

<div align='center'><span style='font-size: medium;'>ٱل&#1618;ح&#1614;م&#1618;د&#1615; ل&#1616;ل&#1614;&#1617;ه&#1616; ر&#1614;ب&#1616;&#1617;
ٱل&#1618;ع&#1614;&#1648;ل&#1614;م&#1616;ين</span></div>

  • Simpan template dan lihat hasilnya di blog anda.

Demikian tutorial kali ini, cara menambahkan basmalah dan hamdalah diawal dan akhir artikel blog. Semoga bermanfaat dan berkah.

Terimakasih.


ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Tips Trik Blogging

56 komentar :

  1. Ijin saya praktekkan di blog saya ya Mbak, terima kasih tutorialnya. Semoga menjadikan amal ibadah. :)

    BalasHapus
    Balasan
    1. MasyaAllah cepat banget apresiasinya mbak Indah :) Silahkan dan terimakasih ya!

      Hapus
    2. Heheh.. Alhamdulillah sukses saya pasang. Yg saya senangi tiap tutorial disini cara penyampaiannya simple banget apalagi utk pemula spt saya. Tapi hasilnya sangat istimewa dan beda dgn yg lainnya. Pokok'e mantep deh :)

      Hapus
    3. MasyaAllah apresiasi dari kerendahan hati. Alhamdulillah terimakasih mbak.

      Hapus
  2. bermanfaat sekali mbak,memang sudah selayaknya seorang muslim mengucapkan bissmillah diawal pekerjaan dan hamdallah diakir pekerjaan.izin saya save dulu ya mbak jazakallah..

    BalasHapus
    Balasan
    1. Silahkan di save, wa antum fa jazaakumullahu khrn.

      Hapus
  3. mantab juragan trik2nya sangat membantu ,,,tq yah

    BalasHapus
    Balasan
    1. Sama sama gan, thanks tuk apresiasinya.

      Hapus
  4. (b) mantap om, ini nih yang di cari-cari

    BalasHapus
    Balasan
    1. Syukurlah dah nemu yang dicari, makasih kunjungan dan apresiasinya Om.

      Hapus
  5. keren ni.. :)
    lebih mantep lagi kalau di awalnya suroh AL-Baqoroh dan diakhirnya suroh Yasin.... :d

    BalasHapus
    Balasan
    1. Weeh, silahkan aja pasang di blog sendiri :p

      Hapus
  6. request dong kakak cara buat konversi kode didalam form komentar (o)

    BalasHapus
    Balasan
    1. Wadooh nambah PR lagi. Jawab langsung disini aja ya! Ada dua cara, yang pertama manual dan yang kedua menggunakan script JQuery Append

      Yang manual dengan mencari kode <data:blogCommentMessage/> lalu dibungkus dengan tag span kemudian link konversi kodenya diletakkan setelahnya, jadi seperti ini:
      <span><data:blogCommentMessage/></span><a class='tombolkonversi' href='http://www.tipstrikblogging.com/p/konverter-html.html' onclick='window.open(this.href, &quot;popupwindow&quot;, &quot;status=0, height=420, width=400, resizable=0, top=50, left=100&quot;);return false;' target='_blank'>Konversi Kode di Sini!</a>
      kalau tdk salah kode <data:blogCommentMessage/> muncul 4 kali sebaiknya diganti semua.

      Cara ke dua tanya yang lebih ahli (bisa ke MKR-Site, Linknya di footer blog ini).

      Hapus
    2. kalo threaded coment kaya punya kamu gimana ya kak .. ?

      saya dulu nemu Link / blog dari sini .. setelah aku buka ada threaded comment kaya punya kakak .. tapi saya lupa link nya :(

      Hapus
    3. Lihat tutorialnya di blog blogger thailand duypham.info

      Hapus
    4. thanks kak x-) itu blog yg ane carii .. bookmark dulu :)

      Hapus
  7. pasti postingan akan menjadi lebih sempurna. makasih ya :)

    BalasHapus
    Balasan
    1. Tiada yang sempurna di dunia ini. Ups maksud saya penilaian tiap orang berbeda-beda. Makasih apresiasinya kawan.

      Hapus
  8. Mantap nih mbak, semoga dengan menambahkan bacaan basmalah dan hamdalah setiap posting yang kita buat selain bermanfaat untuk pengunjung bisa menjadi tabungan amalan kita nanti diakhirat. Amin

    setelah saya praktek alhamdulillah berhasil mbak, tapi sekedar tambahan. Bagi yang memasang readmore, letakkan kode yang mbak kasih diatas pada <data:post.body/> yang kedua, biasanya kode tersebut lebih dari satu tergantung template yang kita gunakan (paling tidak ini pengalaman setelah saya praktekkan tutorial diatas).

    BalasHapus
    Balasan
    1. Terimakasih dah menambahkan kekurangan diatas, juga tuk kunjungan dan apresiasinya.

      Hapus
  9. oh .. kirain pake gambar kak .. ternyata ada kodenya :) .

    BalasHapus
    Balasan
    1. Pake gambar juga boleh say, tambahkan aja URL imagenya diatas atau dibawah kode <data:post.body/>. Oh ya, yang kemarin komentar G+ diblog dah sukses instalansinya belum?

      Hapus
    2. oya mbak.. komentar g+ gagal tuh mbak beneran udah dipraktekin dari cara yang dari blog sebelah sama dari mbak tp malah komentarnya jadi gak muncul.. jadi saya masih tetep pake yang komen blogger deh.

      Hapus
  10. wah keren tutorialnya mba, izin copas kodenya ya mba...hasilnya keren banget, terima kasih tutorialnya mba

    BalasHapus
    Balasan
    1. Sama-sama sob, thanks juga tuk kunjungan dan apresiasinya.

      Hapus
  11. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  12. tutorial yang sangat2 bermanfaat..

    BalasHapus
  13. kakak .. cara menyembunyikan css diblog gmna ya [-( kalo di CTRL + U biar cssnya tersembunyi ;-(

    BalasHapus
    Balasan
    1. Upload dan simpan CSS ditempat hosting, kemudian instal eksternal linknya ke dlm template tapi anaa tidak menyarankan ini. Cukukkn saja hal itu u/JavaScript. Pakai aja trik redirect Ctrl U. Bisa lihat tutorialnya di blog Zhinto, lihat link profilnya di komentar artikel sebelumnya.

      Tapi itu hanya saran, keputusannya terserah sobat.

      Hapus
  14. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  15. makasih ukhti..berhasil :D

    BalasHapus
  16. jarak antar teks post dengan baca'an alhamdanya terlalu mepet, gimana cara memberi jarak 2 enter..

    BalasHapus
  17. Makasih mba ...semoga berkah

    BalasHapus
  18. untuk memperbesar ukuran textnya gimana ?

    BalasHapus
  19. Tutorial yang bagus nie, sudah lama aq cari

    BalasHapus
  20. Tutorial yang bagus nie,, sudah lama aq cari

    BalasHapus
  21. aslmkm. afwan mbak, saran saya sebaiknya tulisan arabnya diedit karena ada yang keliru nyambung hurufnya... krn saya juga sudah memasang dan mencermati. Bisa-bisa para follower juga melakukan kesalahan yg sama di blog-blog mereka, saya tunggu koreksinya... karena saya kagak bisa ngedit...
    syukron jazilan

    :-?

    BalasHapus
    Balasan
    1. Wa'alaikumussalam ya udh di edit. Jazaakumullahu khrn ats koreksinya.

      Hapus
  22. thanks atas tutorialnya kakak..sangat bermanfaat bagi pemula seperti saya..
    izin share ke temen-temen yang lain boleh?

    BalasHapus
  23. subahanallah ukhti, tutorial nya bermaanfaat banget, ma'an najah ya :)

    BalasHapus
  24. Mbak Kok Gak Work Di Blog gwe Sih Tolong inspirasinya makasih :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :(( :((

    BalasHapus
  25. keren mbak,,, saya sangat terbantu

    BalasHapus
  26. Numpang tanya nih, kalau yang memakai Auto Read More, code diatas di taroh dimana ya?

    BalasHapus
  27. Mantafff mbak,,Ilmu baru buat ane,, boleh copas ga?? di "http://andonesishare.blogspot.com"

    BalasHapus
  28. maaf ka' ganggu., ko gga work yh mohon penjelasannya,,

    terimakasih,

    BalasHapus
  29. ajiibb... bgussni (h), syukron jazakumullah

    BalasHapus

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

NB:Sebelum menyisipkan kode silahkan gunakan tool konversi kode terlebih dahulu untuk menampilkan kode tersebut pada kolom komentar
Konversi Kode di Sini!