widgets
Tampilkan postingan dengan label Tutorial Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blogger. Tampilkan semua postingan

Jumat, 04 April 2014

Cara Memasang Tabel Kode Warna Pada Blog


Untuk mengedit atau mendesain blog kita pasti butuh referensi kode warna. Untuk itu terkadang kita harus bolak balik situs yang memiliki postingan tabel kode warna, capek nggak? Mungkin kalau capek tidak ya, tapi pernah kah terlintas dibenak sobat bagaimana cara menampilkan tabel code warna tersebut dalam postingan atau pada elemen blog kita (Sebagai gadget githu)?
Contohnya bisa lihat disini
Nah berikut rahasianya eh tutorial cara memasang tabel kode warna pada blog.
  • Seperti biasa sobat harus dalam keadaan login keblogger
  • Masuk menu Tata Letak=> klik Edit HTML (Sebelumnya baiknya sobat backup dulu templatenya dengan mengklik tulisan download template lengkap dengan begitu jika ada kesalahan sobat bisa mengembalikkan kembali template seperti semula!)
  • Copy code JS berikut dan paste tepat diatas kode </head> 

Minggu, 30 Maret 2014

Cara Membuat Animasi Bergerak di Sudut Blog


 facessetelah lama berusaha mencari widget-widget animasi lucu bergerak dan menarik dari berbagai situs untuk anda dalam memasang animasi di sudut atau pojok blog dan membuat tampilan blog anda semakin segar dengan adanya animasi yang bergerak di sudut blog, akhirnya ketemu juga widget-widget yang lucu dan unik yang pastinya bergerak atau berformat gif ,pada kumpulan widget animasi bergerak ini anda bisa membuat animasi bergerak di pojok blog anda, mungkin di antara kalian ada juga yang senang dengan animasi - animasi lucu yang bergerak ini untuk di pasang di sudut  blog kalian. tapi tentu saja di setiap situs-situs tersebut tidak semua animasi bergerak sama oleh karena itu dalam postingan kali ini saya akan memberikan kumpulan postingan animasi bergerak yang lucu dan gokil dari berbagai situs yang telah saya kunjungi .silakan kalian kalau mau copas kode-kode script berikut di blog kalian .big hug

sebelum kalian meng copas kode kode tersebut .. sebaiknya kalian mengikuti tutorial cara memasang animasi pada blog berikut ini . untuk memasang widget widget animasi bergerak seperti naruto dan onepiece pada blog kalian ..( tepatnya animasi- animasi bergerak  tersebut akan ada di sudut pojok bawah pada blog kalian ).dan kalian dapat merubah lokasi penempatannya/ukuran gambarnya sesuai dengan tempat/ukuran favorit anda .!!!

News Flash !!!
mau pelihara hamster kaya gini di blog ??? klikdisini
                                    
catatan !!!
coba anda klik pada kotak hamster di atas  !!!
bagaimana ??? kerenkan


lanjut ke tutorial pasang animasi naruto onepiece dll di sudut blog 

adapun langkah-langkah dalam memasang widget animasi bergerak   yaitu :

  • masuk atau login ke blog kalian
  • klik Rancangan / Design kemudian klik Elemen laman / page Elements
  • Lalu klik tambah gadget / add gadget , setelah di klik akan muncul banyak pilihan ..
  • pilih HTML/JAVA SCRIPT
  • lalu copy pastekan script-script berikut  ini ( sebaiknya jangan di beri judul )


    script di bawah ini telah di setting sedimikian rupa agar animasi tersebut ada tepat di pojok kiri bawah blog jika kalian tidak mau animasi tersebut berada di pojok kiri bawah blog kalian .. silakan kalian hapus atau edit kembali script yang berwarna hijau pada contoh di bawah ini setelah gambar animasi ..
Animasi Helikopter Gif

silakan copas :


CARA MEMASANG ANIMASI KLUB SEPAKBOLA KEREN DI POJOK BLOG





bagi anda anda para blogger yang gila banget sama sepak bola dan ingn memasang logo klub favorit di blog tapi belom tau cara nya
tenang Kali ini ane bakal nge-share sejumlah animasi pojok blog yang bertemakan sepak bola, mau tau? wani piro hahahahaha 
ya udah langsung saja ke TKP
Cekidott......


Caranya :
1. Buka Tata Letak


2. Tambah Gadget
3. Copy Link di bawah ini 
<div style="position: fixed; top: 0px; right: 10px;width:130px;height:160px;"><a href=http://adf.ly/Su8Pf/" target="_blank"><img border="0" src="
http://th1223.photobucket.com/albums/dd515/myieshamiya/th_manchesterUnit.gif" title="glory glory man.united". alt="lihat lebih banyak animasi klub bergerak" /></a><small><center><a href="http://dimensikamak.blogspot.com/" target="_blank" title="Cara Memasang Widget Animasi Klub di Pojok Blog">is the best club in the world</a></center></small></div>




NP:
- Link berwarna hijau bisa kamu ubah
Bottom = Bawah
Top = Atas
Left = Kiri
Right = Kanan

Link berwarna merah tersebut kamu ganti dengan URL animasi di bawah ini

1. Manchester United Logo Flip

http://th1223.photobucket.com/albums/dd515/myieshamiya/th_manchesterUnit.gif





2. Manchester United Heart
http://th1000.photobucket.com/albums/af129/SuNeZ01/BeatingHearts/th_manchesterunitedheart.gif




Cara Meringankan Blog Terbaru 2013

Cara Meringankan Blog
Cara Meringankan Blog Terbaru 2013 - berikut ini adalah tips dan trik cara meringankan Blog, meringankan blog memang menjadi hal paling penting di dunia blogger, selain untuk mempercepat blog pengunjung jadi betah di blog kita. nah untuk tips dan triknya berikut ini

1. Bagaiman Cara Cek Kecepatan Loading Blog Kita : Ada banyak alat untuk memeriksa kecepatanblog atau website namun Google Speed ​​Test Tool adalah alat terbaik yang saya rekomendasikan untuk semua blogger.
  • Kunjungi situs Google Speed ​​Test Tool.
  • Masukkan url website dan memeriksa kecepatan.
  • Jika persentasi pada pengecekan memperlihatkan 90% - 100% maka blog anda sudah cukup baik akan tetapi jika muncul pada 80% maka anda periksa flash atau gambar yang sangat berat pada blog  anda segeralah untuk menggantinya dengan kapasitas gambar yang lebih kecil.

Cara Cepat Membuat Auto Readmore pada Blog


Auto Read More adalah Membuat Otomatis Readmore pada blog .Auto Readmore digunakan untuk menghemat tempat post pada beranda kita. dengan Auto Read More anda tidak perlu repot-repot memberi jumpbreak pada setiap postingan anda pada blogger, selain itu juga postingan pada beranda akan tertata rapi karena tidak akan menggangu posting statis milik kita.pokoknya lebih efisien deh jika meggunakan AUTO READMORE ini..ingin mencobanya ????silahkan baca artikel dibawah ini..

Langkah :
  • Pertama masuk dulu ke akun blogger agan, 
  • Kemudian masuk ke Dashboard Blogger--Template--Edit HTML(JANGAN LUPA mencentang Expand Widget Template)
  • Apabila anda sudah mengisi script Auto Read More maka anda harus menghapusnya terlebih dahulu. Gunakan Tutorial Auto Read More yang anda pakai sebelumnya, untuk mengetahui script mana yang harus anda hapus
  • Cari tag </head> dan copy--kan script dibawah ini tepat dibawah tag </head>(Gunakan Ctrl+F dan F3 untuk mempermudah pencarian)

Menaikkan Pengunjung Blog Dengan Cepat


Menaikkan Pengunjung Blog Dengan Cepat - Banyan cara yang dilakukan oleh para pengelola blog agar blognya banyak dikunjungi oleh para pembaca yang baik dan budiman. Apapun dilakukan. Dengan tujuan blognya laris manis di datangi.

Tentunya anda pun punya cara jitu dan mantap agar blog anda di kunjungi. Dan saya percaya bahwa anda telah melakukannya.

Mau tahu cara itu? Tidak lain adalah PROMOSI.


Menaikkan Pengunjung Blog Dengan Cepat

Sabtu, 29 Maret 2014

Cara Mengukur Kecepatan Blog dengan Pingdoms Tools

 Cara Mengukur Kecepatan Blog dengan Pingdoms Tools - Hai sobat share di kesempatan kali ini saya akan berbagi info khususnya bagi sobat blogger sekalian tentang cara mengukur kecepatan blog kita pada situsPingsdom,pada tool ini bukan hanya menghitung seberapa cepat loading blog kita tetapi juga memperlihatkanJavascript, CSS,HTML sehingga kalau ada loadingnya yang lama bisa kita compress atau kita delete,OK langsung saja disimak


Cara Mengukur Kecepatan Blog dengan Pingdoms Tools


Cara Mengukur Kecepatan Blog dengan Pingdoms Tools
1) Kunjungi situs http://tools.pingdom.com/fpt/
2) Lalu pada kotak " Masukkan URL Blog Anda" isikan dengan alamat blog sobat,sebagai contoh https://perilian.blogspot.com/

WIDGET:Random posts widget in sidebar

We have seen popular posts and recent posts widgets on many blogs sidebar. These widgets helps readers to find relevant posts and increase internal linking.

These widgets helps you to hold your visitors for more time on your blog and increase page views along with reduce bounce rate. To add this widget on to your blog sidebar please follow these step.



How to add Random posts widget in blogger sidebar

Step 1. Go to blogger layout. (see image below)


Step 2. Click on add a gadget (see image below)


Memasukkan Blog ke Mesin Pencari (Google, Yahoo!, dll)

Memasukkan Blog ke Mesin Pencari (Google, Yahoo!, dll)

Buat para sobat blogger yang berkeinginan blognya dimasukkan ke daftar pencarian Google, ada sebuah tools di internet yang bisa membantu kita. Namanya SubmitStart. Tools ini berfungsi untuk memasukkan halaman web apapun (termasuk blog) kedalam mesin pencari, seperti Google. Selain itu, SubmitStart juga bisa membantu kita untuk memasukkan blog ke mesin pencari selain Google, seperti Bing dan Yahoo!

Langkah – langkahnya :
  1. Klik gambar dibawah ini, kemudian masukkan alamat website atau blog anda. Kemudian klik Submit.
  2. Maka anda akan dibawa ke halaman utama SubmitStart. Disini anda diminta untuk memasukkan alamat E-Mail yang valid. Setelah itu klik Submit.


  3. Selesai? Belum, sekarang periksalah akun email anda, apakah ada email dari submitstart.com. Jika ada, bukalah link yang telah disertakan didalamnya (lihat gambar dibawah) :

WIDGET: Create google custom search engine for blogger



create google custom search engine for blogger
Every blog must have search widget which help visitor to find relevant information from blog. Most of blogger use Google custom search engine for their blogs. Adding Google custom search engine widget to blogger not only reduce time of visitors to find relevant posts but also help you to make some quick bucks.

But question rise how to add Google custom search engine widget to blogger. In this tutorial we will create a Google custom search engine and granting permission to ad-sense to show relevant ads on search results.


It's time for you to learn how to create your own custom Google search engine, which is 100% embedded and customization.


Lets start with tutorial how to create google custom search engine for blogger

First we will create Custom search engine for blog with Google.

Step 1. Creating Google custom search engine is very easy. Visit Custom Search Enginesite. You must login to google account with your email id.

Step 2. Click on create a custom search engine button (see image below)



Step 3. Enter your site name, Select Language and click on create button.





Belajar Animasi CSS3 dan 3D transformasi


CSS3
Animation

Klik pada elemen di bawah ini, untuk melihat perbedaan antara transformasi 2D dan 3D transform: 
2D rotate
3D rotate

Script :
<style script="text/javascript">
#animated_div
{
width:60px;
height:40px;
background:#92B901;
color:#ffffff;
position:relative;
font-weight:bold;
font-size:20px;
padding:10px;
animation:animated_div 5s 1;
-moz-animation:animated_div 5s 1;
-webkit-animation:animated_div 5s 1;
-o-animation:animated_div 5s 1;
border-radius:5px;
-webkit-border-radius:5px;

}

@keyframes animated_div
{
0%        {transform: rotate(0deg);left:0px;}
25%        {transform: rotate(20deg);left:0px;}
50%        {transform: rotate(0deg);left:500px;}
55%        {transform: rotate(0deg);left:500px;}
70%        {transform: rotate(0deg);left:500px;background:#1ec7e6;}
100%    {transform: rotate(-360deg);left:0px;}
}

@-webkit-keyframes animated_div
{
0%        {-webkit-transform: rotate(0deg);left:0px;}
25%        {-webkit-transform: rotate(20deg);left:0px;}
50%        {-webkit-transform: rotate(0deg);left:500px;}
55%        {-webkit-transform: rotate(0deg);left:500px;}
70%        {-webkit-transform: rotate(0deg);left:500px;background:#1ec7e6;}
100%    {-webkit-transform: rotate(-360deg);left:0px;}
}

@-moz-keyframes animated_div
{
0%   {-moz-transform: rotate(0deg);left:0px;}
25%  {-moz-transform: rotate(20deg);left:0px;}
50%  {-moz-transform: rotate(0deg);left:500px;}
55%  {-moz-transform: rotate(0deg);left:500px;}
70%  {-moz-transform: rotate(0deg);left:500px;background:#1ec7e6;}
100% {-moz-transform: rotate(-360deg);left:0px;}
}

@-o-keyframes animated_div
{
0%   {transform: rotate(0deg);left:0px;}
25%  {transform: rotate(20deg);left:0px;}
50%  {transform: rotate(0deg);left:500px;}
55%  {transform: rotate(0deg);left:500px;}
70%  {transform: rotate(0deg);left:500px;background:#1ec7e6;}
100% {transform: rotate(-360deg);left:0px;}
}
</style>
<hr>
<div id="animated_div">CSS3<br><span style="font-size:10px;">Animation</span></div>
<hr>

Cara Membuat Chat Box Auto Hide (Tersembunyi)

Layaknya Buku tamu chat box merupakan salah satu aplikasi chat yang mampu menampung pesan yang kita tinggalkan dalam sebuah box,
caranya gamabang :
  • Sign Up di CBOX
  • setelah terdaftar Log In terlebih dahulu,
  • Aturlah tampilan CBOX sesuai keinginanmu,
  • setelah Selesai, Klik Tab PUBLISH dan Get Code ( Copy Code diStep 3)
Kemudian: 
  1.  Masuk ke Blogger, Pilih Tata Letak - Add Gadget - Pilih HTML/Javascript :
  2. Copy Code Dibawah ini ke dalam Gadget HTML tersebut. ( tau kali ga usah dijelasin )
  3. Ganti code Berwarna Biru dengan Code CBOX mu,

    Cara Buat Floating Bar Untuk Like Facebook & Tombol Share Lainnya



    Ini adalah salah satu dari beberapa widget Sharing yang menyita banyak waktu saya dalam merancang. Anda telah melihat tren tombol hitung berbagi mengambang di blog populer. Icon tradisional kini digantikan dengan auto tombol kontra bertambah yang diperbarui dalam hitungan detik. Kami menciptakan versi yang berbeda dari bar ini menerapkan kedua efek Jquery dan CSS3 gaya tapi widget ini berbeda karena mengandung kustom twitterpinterest dan tombolEmail. Layanan seperti AddThis dan ShareThis keduanya melakukan pekerjaan yang besar tetapi mereka masih perlu bekerja pada beberapa konflik integrasi Plugin mereka. 
    Pinterest pin itu tombol yang menyebabkan masalah besar dan itu pun gagal total dalam mengambil gambar thumbnail yang benar. Dalam kebanyakan kasus, bahkan tidak memilih gambar sehingga membuat  seluruh konsep menjepit hambar. Kami namun didesain ulang widget yang disediakan oleh ShareThisuntuk membuat yang baru dengan memperbaiki semua kekurangan. Sharing Bar Ini  akan mengambang di sebelah kiri posting blog Anda dan akan mengikuti sebagai gulungan pengunjung atas atau bawah. Widget ini berisi counter situs jejaring sosial penting yang memiliki potensi untuk membawa Anda melalui Lintas oleh sirkulasi konten Anda ke khalayak yang lebih luas. Kami telah menguji widget pada browser besar seperti IE7 +, Firefox, Chrome dll dan membuat itu bekerja dengan baik tanpa masalah kompatibilitas atau konflik desain.

    Pengembang dan blogger diminta untuk me-link kembali ke posting ini jika dalam kasus kalian ingin berbagi Code kami dengan pembaca mereka. Mari sekarang kita bekerja !


    Prioritas pertama Anda terkadang harus selalu FacebookGoogle+TwitterLinkedin danSekarang ada tambahan PinterestSemua loket berbagi ini bermain dengan baik dalam sirkulasi konten Anda melalui berbagai pengunjungMedia Sosial adalah mesin non-stoppable, yang jika digerakkan dengan benar dan hati-hati dapat membawa ton lalu lintas yang berharga setiap pengunjung senilai satu dolarKarena terlalu banyak menampilkankotak hitung pasti bisa mempengaruhi waktu buka blog Anda sehingga kami telah menambahkan tombol share AddThis yang menyediakan pengunjung dengan lebih dari 330+ pilihan berbagi sosial semua di satu tempat.


    Mengapa tidak menggunakan JQuery?

     
    Abaikan JavaScript dan perpustakaan yang mempunyai Jquery sebanyak mungkin. Browserseperti Internet Explorer masih kekurangan dukungan untuk semua fungsi yang ditawarkan oleh jquery. Apalagi JavaScript bertanggung jawab untuk persentase besar waktu buka blogAnda secara keseluruhan. Oleh karena itu kita tidak menambahkan efek geser halus untukplugin ini karena sebelumnya kita lakukan untuk Jquery Sliding widget share
    .


    Bagaimana cara kerjanya?

     
    Kami telah terintegrasi baik AddThis dan layanan ShareThis di dalamnya. Dalam rangkauntuk menyesuaikan tombol twitter dan lain-lain kami mengambil kode default ShareThis dan menyesuaikannya untuk mengubah gambar tombol, ukuran gelembung dan teks count

    Menambahkan Floating Bar Untuk Blogger
    Langkah-langkahnya disingkat sangat mudah diterapkan. Yang Anda butuhkan adalah hanya copy dan paste potongan code yang kami kembangkan dan uji sepanjang hari. Ikuti langkah-langkah yang pelan-pelan :