SELAMAT DATANG DI SITUS WEB DjFAMBO TEMPAT BERBAGI CERITA

Tips & Trick


Cara Memasang Facebook Recomendation Box di Blog Anda

Panduan instalasinya sangat sederhana, silahkan ikuti langkah-langkah mudah berikut ini:
  • Login ke Blogger Anda dan masuk ke Template
  • Backup template Anda bila perlu
  • Klik Edit HTML
  • Catatan (Jika Anda pernah memasang Facebook like box atau Facebook comment box maka Anda tidak perlu memasukkan kode JavaScript SDK dan langsung ke langkah berikutnya). Jika belum maka lanjutkan langkah berikut.
  • Cari kode <body>
  • Jika sudah ketemu maka letakkan kode JavaScript SDK berikut ini di bawah kode <body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

  • Simpan template Anda
  • Sekarang basuk ke Layout
  • Klik add a gadget dan pilih widget HTML/JavaScript
  • Kemudian masukkan kode HTML/JavaScript di bawah ini di dalamnya
<div class="fb-activity" data-site="http://www.dj-fambo.blogspot.com" data-width="300" data-height="450" data-border-color="#ffffff" data-header="false" data-recommendations="true"></div>

 Cara Kostumisasi
  • Gantilah http://www.dj-fambo.blogspot.com dengan URL website/blog Anda dengan struktur: http://www.blog-anda.blogspot.com.
  • Saya telah menetapkan lebar 300 pixel (300) dan tinggi 450 pixel (450). Silahkan sesuaikan dengan keinginan Anda.
  • Untuk menghilangkan garis batas biru di plugin, saya telah mengatur garis batas menjadi putih. Jika sidebar Anda memiliki warna background yang berbeda, silahkan sesuaikan warnanya dengan mengedit bagian #ffffff. Tip: Gunakan Color Generator Tool.
  • Lalu simpan widget Anda dan selesai. Silahkan periksa blog Anda maka widget recomendation box sudah muncul.

4 Perubahan Baru Editor HTML Pada Blogger Template - New Improvements

blogger template html editor
Apakah Anda seorang blogger atau web developer yang suka membuat halaman web dan template? Jika sudah masuk ke pekerjaan ini, Anda tidak akan lepas dari dunia coding. Nah, untuk para blogger ada beberapa kabar baik! Google Blogger baru saja memperbaharui Blogger Template Editor HTML dan menambahkan empat fitur baru untuk membuat pengalaman Anda lebih baik! Jika Anda adalah blogger yang suka mengutak-atik template blog-nya, mungkin artikel saya kali ini bisa berguna untuk Anda. Mari kita periksa fitur barunya sekarang!

Blogger Template HTML Editor memungkinkan Anda mengedit kode sumber situs web Anda dan men-tweaknya sesuai dengan keinginan Anda. Jika Anda tahu HTML, CSS, dan/ atau JavaScript, Anda dapat sepenuhnya menyesuaikan dengan preferensi Anda. Langitpun menjadi dekat jika Anda tahu apa yang Anda lakukan. :)

Untuk menemukan HTML editor, masuklah ke dashboard Blogger Anda kemudian bukalah blog yang ingin Anda edit templatenya. Dari dashboard Blog, klik opsi Template dari sidebar kiri dan kemudian Anda akan menemukan tombol Edit HTML.

new html editor

Apa Yang Baru Pada Template Editor?
Fitur-fitur baru yang berpusat lebih ke arah user-friendliness (atau lebih tepatnya programer-friendliness) dan bertujuan untuk meningkatkan produktivitas. Sebelumnya, Template HTML editor memiliki tampilan yang hambar dan tidak user friendly serta terkesan sulit untuk melakukan pengeditan kode template.
Mengedit template adalah hal lain yang dilakukan oleh blogger selain mengedit postingan. Jika sebelumnya kita harus men-download kode Template, mengeditnya di editor yang lebih nyaman (seperti Notepad++) kemudian meng-uploadnya lagi ke Template blogger. Sekarang Anda tidak perlu melakukan hal itu lagi karena perubahan yang dilakukan Blogger semakin memudahkan Anda untuk melakukan kostumisasi kode template Anda.

Blogger telah membuat editor HTML template menjadi jauh lebih nyaman digunakan dengan menghadirkan fitur-fitur berikut ini:
  • Line Numbering - Sekarang Anda dapat melihat nomor baris pada setiap baris sehingga jauh lebih mudah untuk menemukan kesalahan dan melacak kode Anda.
  • Syntax Highlighting - Sama seperti di editor kode yang sudah canggih, kini Anda dapat melihat syntax yang berwarna.
syntax highlighting
  • Auto-Indentation - Fitur ini terlihat seperti paragraf yang masuk ke dalam kalimat. Jadi fitur auto-indent membuat Anda tidak perlu menekan tombol Tab dan Spacebar karena fitur ini membantu untuk membuat kode Anda lebih terorganisis dan Anda dapat dengan mudah melacak kode apa yang menjadi satu kesatuan. Sebagai contoh, Anda dapat dengan mudah mengetahui apa yang ada di dalam tag div atau apa yang telah Anda masukkan ke dalamnya, dll. Anda akan melihat indentasi otomatis muncul ketika Anda sedang menulis beberapa kode. Anda dapat menggunakan pilihan Format Template untuk membersihkan seluruh indentation yang ada di template Anda.
  • Code Folding - Saya suka dengan opsi ini. Dengan fitur ini Anda dapat melipat kode dan tidak perlu melihat potongan kode yang sangat banyak lagi. Anda dapat menemukan fitur ini pada nomor baris yang terdapati simbol (►) panah hitam. Jika Anda klik simbol itu, Anda akan membuka lipatan kode yang di dalamnya terdapat kode-kode yang sangat banyak. Dengan fitur ini, semuanya menjadi lebih sederhana.
code folding blogger
  • Jump to widget - Sekarang Anda memiliki cara yang lebih cepat untuk melompat ke bagian tertentu dari kode di dalam template (kode yang dimiliki widget). Cukup klik pada tombol Jump to Widget di bagian atas editor dan Anda dapat melihat semua daftar widget yang ada. Klik salah satunya maka Anda akan dibawa ke masing-masing kode.


Cara Membuat Widget Twitter di Blogger/Blogspot


Cara Membuat Widget Twitter di Blogger/Blogspot

Cara Membuat atau Memasang Widget Twitter di Blogger/Blogspot - Halo sob, setelah kemarin saya membagi-bagikan Template, kali ini saya akan membagikan Cara Membuat Widget Twitter di Blogger, Tentu pasti sobat pernah melihat dari salah satu blog yang menggunakan Widget ini, dimana Widget ini menambah keindahan Blog sobat, lalu bagaimana caranya ?, inilah tutorialnya, silahkan sobat praktekan :

Membuat Widget Twitter di Blogger
Langkah 1 : Pastikan sobat udah punya Twitter dan Blog
Langkah 2 : Masuk pada akun Twitter sobat .
Langkap 3 : Kemudian masuk pada link : https://twitter.com/settings/widgets 
Langkah 4 : Lalu, akan ada tampilan seperti ini  : ( kemudian Klik "Create New" atau "Buat Baru" )
Create New 
 Langkah 5 : Setelah sobat klik Create New, lalu sobat tinggal mengganti tampilannya :
Langkah 7 : Setelah diatur, klik Buat Widget, lalu sobat akan mendapatkan Kode yang di beri oleh Twitter.

Langkah Terakhir : Gambar yang saya beri tanda merah, itulah kodenya, sobat tinggal masukan kode tersebut di dalam Tata Letak, contoh kode :

 
<a class="twitter-timeline"  href="https://twitter.com/FajriAndaviar"  data-widget-id="394239643782094848">Tweet oleh @FajriAndaviar</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Tadi adalah contoh pada kode Widget punya saya.

Cukup mudah bukan ?, dengan menambahkan widget tersebut, pengunjung sobat lebih mudah mengetahui Twitter sobat dan lebih mudah juga memfollow Twitter sobat. hanya itu saja yang bisa saya berikan, jika masih ada kekurangan silahkan sobat komen di kolom komentar yang telah disediakan, terima kasih atas kunjungannya, Wassalam.

1 komentar:

Langganan: Postingan (Atom)