cara ngatur blog: Widget

Tampilkan postingan dengan label Widget. Tampilkan semua postingan

Cara Membuat Gallery Video di Blogspot dan Wordpress

Kadang kala seorang blogger apalagi yang aktif bermain divideo tutorial membutuhkan space agar videonya tayang sekaligus di postingan blognya, atau disalah satu page dalam blognya. Ada banyak tols yang bisa digunakan, namun sangat sedikit yang bisa digunakan untuk blogspot dan wordpress sekaligus.

Kali ini Blogooblok akan memberikan tols yang bisa digunakan untuk membuat gallery video untuk

Cara Mudah Membuat Google Maps Sendiri

Ada banyak alasan orang untuk membuat peta sendiri. Namun lebih banyak digunakan untuk menunjukkan secara langsung lokasi-lakasi bisnis, misalnya hotel, perumahan atau lokasi toko online Anda. Peta ini tentu saja ditempatkan di web atau blog yang menjelaskan tentang produk tersebut.

Dengan menempatkan alamat Anda secara utuh di blog atau website, maka secara tidak langsung akan menambah nilai

Membuat Gambar Ilustrasi dengan Awesome Screenshot

Sebelumnya kita telah membahas cara membuat gambar ilustrasi berbentuk animasi. Untuk membuatnya dibutuhkan aplikasi pihak ketiga yang diinstal ke komputer, yakni LICEcap. Kali ini kita akan berkenalan dengan screenshot.

Aplikasi screenshot yang akan kita bahas ini bukan bawaan komputer. Dimana bisa dilakukan dengan menekan tombol prt sc sysrg atau print screen pada keybord komputer atau

Cara Membuat Gambar Ilustrasi Berbentuk Animasi

Gambar ilustrasi dalam sebuah postingan punya peranan tersendiri bagi blogger. Apalagi untuk blog yang memang diperuntukkan khusus membahas soal tutorial. Ibarat, sayur tanpa garam, sebuah blog tutorial tanpa gambar ilustrasi terasa hambar.

Ada beberapa macam gambar ilustrasi yang bisa dipasang ditiap postingan. bloGoooblok ~ dan banyak blogger lainnya lebih sering menggunakan gambar ilustrasi

Membuat dan Memasang Google Groups di Blogspot

Jika Anda senang menggunakan Google Groups, maka tak ada salahnya membuat lalu memasangnya di blog. Fasilitas forum diskusi dari Google ini, semakin easy looking dan mudah digunakan setelah Google melakukan update.

Produk Google yang satu ini punya banyak fungsi dan kegunaan. Anda bisa melakukan interaksi secara online dan membahas topik apa saja. bloGoooblok ~ juga sudah memasang fasilitas ini.

Cara Mudah Membuat Disclaimer Untuk Blog

Sebelum membuat disclaimer untuk blog, Anda harus paham dulu apa yang dimaksud dengan disclaimer dan apa pentingnya untuk blog Anda.

Jika Anda menjalankan blog hanya sebagai tempat curhat tanpa berniat monetize, maka disclaimer tidak ada gunanya. Tapi jika untuk tujuan komersial, hal ini penting. Apalagi jika peruntukannya untuk melamar jadi publiser di Google Adsense.

Selain privacy policy dan

Membuat Slider yang Elegan dan Simple di Blogspot

Slider atau yang juga sering disebut slideshow adalah informasi yang berjalan atau sliding di blog atau website. Slider pada dasarnya untuk menampilkan informasi utama yang tertuang dalam sebuah konten blog.

Karena untuk kenyamanan pengunjung, tampilan slider juga menjadi penting diperhatikan. Jika menampilkan slider dengan asal-alasan bukan tidak mungkin akan merusak estetika sebuah website.

Cara Mudah Membuat Tombol Back To Top di Blogspot

Ada banyak cara yang ditawarkan blogger lain untuk membuat atau memasang tombol back to top di blog. Salah satu yang paling banyak digambarkan dengan memasang script tombol back to top di HTML blogspot.

Namun beberapa pengguna, khususnya yang belum (bukan tidak) paham dengan script HTML, akan sedikit ragu, jangan-jangan script tersebut malah membuat tampilan atau load blognya semakin lambat.

Mengaktifkan Google Drive di Browser dan Desktop

Google sudah menetapkan satu akun bisa mengakses seluruh layanannya. Oleh karena itu, jika telah memiliki akun Gmail, Anda sudah bisa menggunakan seluruh layanan Google, termasuk Google Drive. Hanya saja seluruh layanan itu harus diaktifkan satu persatu.

(Baca: Cara Mudah Membuat Email Gmail)

Untuk menggunakan layanan Google Drive ada dua cara yang bisa dilakukan. Melalui browser atau melalui

Penjelasan dan Syarat Membuat Privacy Policy

Privacy Policy merupakan syarat mutlak bagi setiap website atau blog yang dikelola secara serius. Baik itu situs berita, e-commersil hingga blog-blog gratis yang serius menekuni bisnis online.

(Baca: Cara Mudah Membuat Privacy Policy Buat Blog).

Walau ada cara mudah dalam membuatnya, namun bloGoooblok ~ tidak menyarankan hal itu dilakukan. Hal ini karena, privacy policy atau kebijakan privasi

Cara Memasang Lagu dari Soundcloud ke Blogger

Jika Anda bermaksud memasang lagu di blog Anda, salah satu pilihan yang paling baik saat ini adalah Soundcloud. Anda tinggal mengupload lagu yang ingin Anda pasang di blog lalu menautkannya dengan blog Anda. Cara ini lebih ringan, ketimbang mengupload lagu langsung lewat blog.

Sama dengan memasang video youtube ke blog, Soundcloud juga memiliki cara tersendiri. Tapi sedikit lebih mudah dan

Formulir Kontak untuk Halaman Statis Blogger dengan CSS

Google telah merilis formulir kontak atau contact form untuk Blogger tahun kemarin. Namun peruntukannya lebih dikhususkan agar terpasang di sidebar Blogspot. Hanya saja bagi sebagian orang, hal ini tidak relevan dan kurang tepat.

Olehnya itu, banyak yang meminta agar formulir kontak ini dipindahkan ke halaman statis yang hanya bisa dibuka jika hendak menggunakannya. Dengan menempatkan formulir

Cara Membuat Kotak Subscribe Keren di Blog

Kotak langgaran artikel atau subscribe bagi blogger memiliki banyak fungsi. Apalagi bagi blogger yang jumlah pengunjungnya cukup tinggi. Kotak langganan ini bisa membantu sekaligus meningkatkan jumlah pembaca.

Bagi Anda yang belum tahu apa yang dimaksud dengan Subscribe ada baiknya membaca dulu tulisan ini; Mengenal dan Cara Membuat Layanan Subscribe.

Postingan kali ini, kita akan membahas cara

Cara Membuat Widget Recent Comments With Thumbnail

Tutorial Belajar Blog - Cara Membuat widget Recent Comment With Thumbnail - Recent Comment kalau diartikan ke dalam bahasa Indonesia yaitu komentar terakhir, Maksud widget recent comment ini berfungsi agar sobat atau pengunjung blog sobat dapat melihat para readers yang berkomentar di blog sobat. Selain itu, widget ini juga bisa untuk meningkatkan pageview blog sobat. Karena setiap komentar yang telah di publish lalu diklik dan dilihat oleh seseorang.

Widget ini Dibuat oleh Way2Blogging. Kelebihan dari widget ini adalah Widget Yang Stylish dari pada versi sebelumnya, Memiliki Avatar yang dibingkai bulat dibandingkan dengan versi sebelumnya yang tidak memiliki avatar, Widget ini juga bisa diatur dengan anda seberapa anda ingin menampilkan Komentar, Anda juga bisa mengatur avatar, Dan Widget ini juga mudah dipasang. Untuk Itu saya akan menjelaskan kepada anda cara untuk membuatnya. Untuk itu berikut cara untuk membuatnya:

Silahkan Login Ke Blogger Anda.
Setelah itu, Klik Menu Tata Letak, --> Klik Tombol Add Gadget, Lalu Tambahkan Gadget HTML.
Masukan kode berikut ini :

<style type="text/css">
    ul.asharexp_recent_comments{list-style:none;margin:0;padding:0;}
    .asharexp_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .asharexp_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
    .asharexp_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .asharexp_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 11px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
numComments = 5,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 40,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
maxfeeds=100,
adminBlog='Oktri Darmadi';
//]]>
</script>
<script type="text/javascript" src="http://tutorialbelajarblogger.googlecode.com/files/Recent%20Comments%20thumbnail.js"></script>
<script type="text/javascript" src="http://tutorialbelajarblogger.blogspot.com/feeds/comments/default?alt=json&callback=asharexp_recent_comments&&max-results=100"></script>
<div style="text-align:center">
<span style="float:left;font:italic 10px Arial, Sans-Serif; color:#3D3D3D;"><a target="_blank" href="http://tutorialbelajarblogger.blogspot.com/2013/05/cara-membuat-widget-recent-comments.html">.:Get Widget:.</a></span>
</div>

Keterangan:

numComments = 5 adalah jumlah komentar yang ditampilkan pada widget recent comment with thumbnailnya. Bisa ditambah atau dikurang sesuai keinginan
characters = 40 adalah jumlah isi komentar yang ditampilkan. Bisa sobat tambahkan atau dikurang sesuai keinginan
adminBlog='Oktri Darmadi' adalah nama admin yang ada di blog sobat. Silahkan ganti dengan nama author/admin yang ada di blog sobat
Tulisan yang berwarna merah ganti dengan url blog sobat

Semua kode script itu tinggal sobat copy lalu sobat pasang di blog sobat. Lalu atur dari jumlah yang sobat tampilkan, isi komentar, admin blog, url blog dan lain lain, simpan widget lalu lihat hasilnya. Oke sob, sekian dulu untuk membuat widget recent comment with thumbnail. Sampai Jumpa ;)

Cara Membuat Widget Entri Populer Keren

Cara Membuat Widget Entri Populer Keren - Sesuai dengan judul tersebut belajar blog ingin berbagi membuat tips blog membuat widget entri populer lebih keren, mungkin Cara Membuat Widget Entri Populer Keren dan Cantik ini bisa menjadi salah satu pilihan. entri popular kalau dari google tentunya biasa saja,, tanpa ada variasi yang menarik dan keren. dengan tambahan script pada artikel ini sobat dapat Membuat Widget Entri Populer Keren

Nah,,, waktunya ke TKP Cara Membuat Widget Entri Populer Keren dan Cantik , untuk lebih lanjut nih,,,, baca tutorialnya :

1. Login ke blog anda
2. Klik Tata letak >> Tambah Gadget >> Entri Populer >> tampilkan entri populer hanya judulnya saja. Jangan menggunakan tubnail dan cuplikan. Atur jumlah judul posting yang akan dimunculkan.
3. Klik simpan
4. Selanjutnya klik Template
5. Klik Edit Html >>klik lanjutkan
6. Cari kode ]]></b:skin> Jika sudah ketemu kopi paste kode css berikut ini tepat diatas kode ]]></b:skin>

#PopularPosts1 ul li a:hover{color:#fff;text-decoration:none}
#PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"}
#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:90%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:90%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}

7. Sobat Preview dahulu, setelah berhasil baru di SAVE

Sekian Dulu Sobat Cara Membuat Widget Entri Populer Keren semoga bermanfaat. Good Luck

Cara Menyisipkan Al-Quran Digital dengan Suara pada Blog

Sesuai dengan perkembangan teknologi masa kini, Al-qur’an pun dikemas dalam bentuk digital secara online. Hal ini akan memudahkan umat muslim untuk belajar membaca Al-Qur’an lengkap dengan memahami artinya, mendengarkan lapasnya sesuai dengan tajwid secara Online. Selain itu, Al-Quran digital ini juga bisa dipelajari per-surah. Sehingga akan memudahkan kita untuk membacanya.

Al-quran digital ini dibuat oleh Alquran-indonesia.com, dapat kita sisipkan kedalam blog. Bagi rekan-rekan blogger yang ingin menyisipkan Al-Quran ini kedalam blog dapat meng-copy kode dibawah ini :

<iframe width="100%" height="400" frameborder="0" src="http://m.alquran-indonesia.com/mquran/index.php/quran">

</iframe>

Hasilnya akan menjadi seperti dibawah ini :

Cara Menampilkan Postingan Berdasarkan Label

widget-feed-label Untuk menampilkan postingan yang hanya pada label tertentu, kita bisa memanfaatkan jasa LABEL pada blogspot. Sebagai contoh, saya memiliki blog yang dikelompokkan kedalam beberapa label, salah satunya berlabel Widget. Dan saya ingin menampilkan widget artikel yang berisikan artikel dalam label Widget saja. Jadi artikel dengan label lain tidak diikutsertakan.

Nah bagaimana cara membuatnya ? Berikut triks singkat untuk membuatnya :

Login ke Blogger anda. Pilih menu Design > Page Elements.
Kemudian klik Add a gadget.
Lalu cari widget yang bertuliskan Feed. Klik pada tulisannya atau pada gambar bersimbol (+).
Lalu akan muncul form isian seperti dibawah ini :

- Ketikkan alamat ini pada form :
http://alamat-blog-anda.blogspot.com/feeds/posts/default/-/Widget
Ubahlah teks alamat-blog-anda menjadi alamat blog anda.
- Jika menggunakan nama labelnya lebih dari satu kata seperti “Widget Saya”, maka harus menambahkan %20 diantara kedua kata label tersebut. Hasilnya menjadi :
http://alamat-blog-anda.blogspot.com/feeds/posts/default/-/Widget%20Saya
- Untuk menampilkan urutan postingan dari yang terbaru ke yang lama, ubah menjadi
http://alamat-blog-anda.blogspot.com/feeds/posts/default/-/Widget?orderby=updated
Klik tombol SAVE.

Cara Menambahkan Widget Label / Kategori

widget-label Sebelumnya kita haruslah tahu dengan Istilah Label pada blog. Label merupakan pengelompokkan postingan kedalam kategori-kategori tertentu. Jika beberapa postingan diberikan label yang sama, maka artinya postingan tersebut termasuk kedalam kategori yang sama pula.

Widget Label merupakan widget standard bawaan blogspot. Dengan menambahkan widget label ini, akan memudahkan pengunjung untuk mencari artikel berdasarkan label / kategori tertentu.

Berikut Langkah-langkah menambahkan Widget Label :

Login ke Blogger anda, lalu pilih Design > Page Elements.
Kemudian klik pada Tulisan Add a Gadget.
Lalu cari widget yang bertuliskan Labels. Klik pada tulisannya atau pada gambar bersimbol (+).
Aturlah konfigurasi seperti yang anda inginkan. Sebagai contoh bisa dilihat pada gambar dibawah ini :

Title : Tuliskan judul widget yang anda inginkan, bisa anda tulis dengan Kategori, Menu, Kompetensi, dll.
Show : Terdapat 2 pilihan dibagian ini. Jika ingin menampilkan semua label yang ada, silahkan pilih All Labels, jika hanya ingin menampilkan Label-label tertentu saja silahkan pilih Selected Labels.
Sorting : Pilih metode pengurutan label yang muncul berdasarkan Alphabetically (Abjad) atau berdasarkan By Frequency (berdasarkan jumlah artikel terbanyak pada label).
Display : Jika anda ingin menampilkan label secara berurutan dari atas kebawah, pilihlah opsi List. Tetapi jika ingin menampilkan dari kiri ke kanan, pilihlah opsi Cloud.
Pada tulisan Show number of posts per label boleh dipilih atau tidak, tergantung kebutuhan anda.
Klik tombol SAVE.

Widget label akan muncul disidebar anda. Klik gambar Obeng untuk melakukan perubahan opsi yang diinginkan.

Tukaran Link Otomatis Yuk

Mau Tukaran Link Secara Otomatis dengan Blog ini ? Disinilah tempatnya. Cukup Masukkan Nama Anda dan URL dari Blog anda, langsung jadi deh :)

Cara Memasang Widget Cuaca (Weather)

Sebenarnya informasi tentang cuaca diperlukan juga untuk diketahui. nah bagi sobat blogger yang ingin memasang widget informasi cuaca pada blognya, bisa mengikuti langkah-langkah dibawah ini.

Info cuaca ini tidak hanya menampilkan info cuaca dikota-kota besar, seperti Pekanbaru. Tetapi juga bisa menampilkan kota kecamatan seperti Rumbai, Gobah, Air Molek, dll. Tinggal memasukkan kata kunci nama daerah, apakah tersedia info daerah sobat blogger.

Bagaimana Cara Memasang Widget Cuaca pada Blogger ?

1. Silahkan buka situs HotelsCombined.com.

2. Aturlah konfigurasi untuk Widget sobat

- Pilih Jenis Satuan (Celcius / Fahrenheit)

- Pilih Skin / Warna Widget

3. Ketikkan nama kota / daerah bertempat tinggal. (Widget akan langsung menampilkan preview)

4. Lalu tekan Tombol Get Code. Copy code tersebut

5. Login ke Blogger sobat.

6. Pilih Menu Design > Add Gadget . Pastekan kode yang telah di generate tadi.

7. Simpan Perubahan.

Hasilnya terlihat seperti dibawah ini :

See 10-Day Forecast