Acim X-7

Cara Membuat Menu Rocking Rollong Rounded

Written By Unknown on Jumat, 30 November 2012 | 04.34

Pada liburan kali ini akan saya isi dengan aktifitas blogging, dan hari ini saya akan share tutorial yang sangat menarik untuk disimak dan di terapkan di blog kita. Rocking Rollong Rounded adalah sebuah menu navigasi yang dibuat sedemikian rupa sehingga bisa memikat hati siapapun yang melihatnya.

Fungsi dari menu ini sama saja fungsinya dengan menu navigasi horizontal sih menurut saya, kalau ada yang berpendapat berbeda silahkan berikan pendapatnya pada kotak komentar ya hhe... bagi yang penasaran dengan menu navigasi Rocking Rolling Rounded-nya silahkan sobat lihat gambar di bawah ini.

Masih belum jelas juga? nih saya kasih demonya, untuk melihat demonya sobat bisa megunjungi link ini . Nah bagaimana setelah melihat tampilan menu navigasinya, sekarang sobat tinggal mencari tempat yang tepat untuk meletakkan menu navigasi ini pada blog anda. Berikut ini langkah-langkah Cara Membuat Menu Navigasi Rocking Rolling Rounded.

1.log in ke blogger.
2.Klik rancangan » edit HTML » centang kotak Expand Template Widget. Atau klik template » edit HTML » centang kotak Expand Template Widget. Dan disarankan untuk membackup template anda, sebagai cadangan bila terjadi kesalahan dalam pengeditan.
3.Pastikan pada template anda sudah dilengkapi dengan Jquery 1.3.2. kalau belum ada silahkan anda letakkan kode Jquery ini di atas kode </head>.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

4.Letakkan juga kode di bawah ini tepat di bawah kode Jquery yang ada di atas.

5.Selanjutnya letakkan kode CSS di bawah ini di atas kode ]]></b:skin>.

#rocking-rolling{
width:auto;
height:52px;
text-align:left;
font-family:"Trebuchet MS",sans-serif;
font-size:16px;
font-style:normal;
font-weight:bold;
text-transform:uppercase;
}

#rocking-rolling h2,#rocking-rolling p, #rocking-rolling form{
/* netralisasi tampilan elemen heading, paragraf dan formulir */
margin:0 0 0 0;
pading:0 0 0 0;
border:none;
background:transparent;
}

#rocking-rolling .item{
position:relative;
background-color:#f0f0f0;
float:right;
width:52px;
margin:0px 5px; height:52px;
border:2px solid #ddd;
-moz-border-radius:30px;
-webkit-border-radius:30px;
border-radius:30px;
-moz-box-shadow:1px 1px 3px #555;
-webkit-box-shadow:1px 1px 3px #555;
box-shadow:1px 1px 3px #555;
cursor:pointer;
overflow:hidden;
}

#rocking-rolling .link{
left:2px; top:2px;
position:absolute;
width:48px;
height:48px;
}

#rocking-rolling .icon_home{
background:transparent url(http://3.bp.blogspot.com/-fuX8vT6cIzs/TlXFJXROx2I/AAAAAAAAAxE/D1kiRmSFBy4/s1600/home.png) no-repeat top left;
}

#rocking-rolling .icon_mail{
background:transparent url(http://2.bp.blogspot.com/-FaTjV0LsMXQ/TlXFJ_5vpxI/AAAAAAAAAxc/JRPFgDCZ6lg/s1600/mail.png) no-repeat top left;
}
#rocking-rolling .icon_help{
background:transparent url(http://4.bp.blogspot.com/-l7M2zGOJAQo/TlXFJ0YZR6I/AAAAAAAAAxM/32acLuLn_r8/s320/help.png) no-repeat top left;
}

#rocking-rolling .icon_find{
background:transparent url(http://4.bp.blogspot.com/-ZIEGzN0LZCg/TlXFJ8WVzEI/AAAAAAAAAxU/2-oDKLYjsKw/s1600/find.png) no-repeat top left;
}

#rocking-rolling .icon_photos{
background:transparent url(http://4.bp.blogspot.com/-IwFEevO-np8/TlXFKFu47FI/AAAAAAAAAxk/aejG1YmQumc/s1600/photos.png) no-repeat top left;
}

#rocking-rolling .item_content{
position:absolute;
height:52px;
width:220px;
overflow:hidden;
left:56px;
top:7px; background:transparent; display:none;
}

#rocking-rolling .item_content h2{
color:#aaa;
text-shadow:1px 1px 1px #fff;
background-color:transparent;
font-size:14px;
}

#rocking-rolling .item_content a{
background-color:transparent;
float:left;
margin-right:7px;
margin-top:3px;
color:#bbb;
text-shadow:1px 1px 1px #fff;
text-decoration:none;
font-size:12px;
}

#rocking-rolling .item_content a:hover{
color:#0b965b;
}

#rocking-rolling .item_content p{
background-color:transparent;
text-transform:none;
font-weight:normal !important;
display:none;
}

#rocking-rolling .item_content p input{
border:1px solid #ccc;
padding:1px;
width:155px; float:left;
margin-right:5px;
box-shadow:none;
-moz-box-shadow:none;
-webkit-box-shadow:none;
}

6.Yang terakhir adalah meletakkan kode pemanggil Menu navigasi Rocking Rolling Rounded yang bisa sobat letakkan di mana saja/ terserah anda ingin meletakkannya di mana, tetapi kali ini saya akan meletakkannya di bawah header, maka carilah kode <div id='content-wrapper'> dan letakkan kode di bawah ini tepat di atas-nya.

<div id='rocking-rolling'>
<div class='item'>
<a class='link icon_mail'></a>
<div class='item_content'>
<h2>KONTAK SAYA</h2>
<p>
<a href='#'>Email</a>
<a href='#'>Twitter</a>
<a href='#'>Facebook</a>
</p>
</div>
</div>

<div class='item'>
<a class='link icon_help'></a>
<div class='item_content'>
<h2>BANTUAN</h2>
<p>
<a href='#'>Buku Tamu</a>
<a href='#'>Lapor</a>
<a href='#'>Kritik dan Saran</a>
</p>
</div>
</div>

<div class='item'>
<a class='link icon_find'></a>
<div class='item_content'>
<h2>TELUSURI</h2>
<p>
<form expr:action='data:blog.homepageUrl + "search/"' method='get'><input name='q' type='text'/></form>
</p>
</div>
</div>

<div class='item'>
<a class='link icon_photos'></a>
<div class='item_content'>
<h2>GALERI FOTO</h2>
<p>
<a href='#'>Kategori</a>
<a href='#'>Arsip</a>
<a href='#'>Daftar Isi</a>
</p>
</div>
</div>

<div class='item'>
<a class='link icon_home'></a>
<div class='item_content'>
<h2>MULAI DARI SINI</h2>
<p>
<a href='#'>Pelayanan</a>
<a href='#'>Portfolio</a>
<a href='#'>Pembayaran</a>
</p>
</div>
</div>

<div style='clear:both;'></div>
</div>

<script type='text/javascript'> function collapse(a){var b=1440;var c=setInterval(function(){if(b==0){clearInterval(c);return}b-=40;$('.link',a).stop().animate({rotate:'+=40deg'},0)},10);a.stop().animate({width:'52px'},1e3).find('.item_content').stop(true,true).fadeOut().find('p').stop(true,true).fadeOut()}function expand(a){var b=0;var c=setInterval(function(){if(b==1440){clearInterval(c);return}b+=40;$('.link',a).stop().animate({rotate:'+=-40deg'},0)},10);a.stop().animate({width:'268px'},1e3).find('.item_content').fadeIn(400,function(){$(this).find('p').stop(true,true).fadeIn(600)})}$('.item').hover(function(){var a=$(this);expand(a)},function(){var a=$(this);collapse(a)}) </script>

Kode-kode yang saya berikan warna di atas bukan hanya untuk hiasan lho sobat tetapi untuk memudahkan sobat untuk mengedit kodenya. begini keterangannya :

Kode yang berwarna biru adalah judul menu.
Kode yang berwarna merah adalah nama menu.
Kode yang berwarna kuning adalah link yang akan ditujukan.

Kalau sudah selesai silahkan save template sobat, dan lihat hasilnya. Dan selesai sudah langkah-langkah Cara Membuat Menu Navigasi Rocking Rolling Rounded. Mudah-mudahan postingan saya kali ini bisa bermanfaat bagi sobat.

04.34 | 0 komentar | Baca Selengkapnya !!

Cara Membuat Title Blog pada Tab Bergerak dan Berganti-ganti

Written By Unknown on Rabu, 28 November 2012 | 02.40

Halo sobat blogger, kali ini saya akan berbagi sesuatu yang menarik, yaitu cara membuat judul/title blog pada tab menjadi bergerak dan berganti-ganti. Bagi kalian yang ingin mempercantik blog boleh coba, atau bagi kalian yang ingin mencobanya saja, itu tak masalah. cara ini saya dapatkan ketika saya berselancar ke blog-blog teman. Mungkin langsung aja ya, hehe.. untuk contohnya anda bisa melihat tab pada blog ini.

Langkah pertama ialah:

1. Login ke Blogger terlebih dahulu
2. Kemudian pilih Template
3. Lalu pilih Edit Html > Lanjutkan, lalu klik Expand Template Widget

Klik pada gambar untuk perbesar

4. Jika sudah, cari kode </head> dengan tekan tombol Ctrl+F pada keyboard
5. kalau sudah menemukan kodenya, Copy kode dibawah ini dibawah kode </head>

<script language='JavaScript'>var txt=" Welcome to Ino-Yasha's Blog "; var kecepatan=120;var segarkan=null;function bergerak() { document.title=txt;txt=txt.substring(1,txt.length)+txt.charAt(0);segarkan=setTimeout("bergerak()",kecepatan);}bergerak(); </script>

*Note:

Ganti tulisan berwarna Merah diatas dengan teks yang anda inginkan
Ganti tulisan berwarna Biru dengan angka yang anda inginkan untuk kecepatannya, semakin besar angka, maka semakin lambat kecepatannya, dan begitu sebaliknya

Nah mudah bukan sahabat blogger, lalu bagi yang ingin membuat teksnya berganti-ganti, caranya ada di bawah ini sobat.

1. Login dulu ke Blogger
2. Kemudian pilih Tata Letak
3. Lalu klik Tambah Gadget > pilih Html/Javasript
4. Lalu masukkan Script di bawah ini

<script>function tb8_makeArray(n){this.length = n;return this.length;}tb8_messages = new tb8_makeArray(3);

tb8_messages[0] = "Hai Sobat Blogger...";
tb8_messages[1] = "Welcome to Ino-yasha's Blog";
tb8_messages[2] = "Ino-Yasha.blogspot.com";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb8_speed = 125;
tb8_delay = 1000;
var tb8_counter=1;
var tb8_currMsg=0;
var tb8_tekst ="";
var tb8_i=0;
var tb8_TID = null;
function tb8_pisi(){
tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
document.title = tb8_tekst;
tb8_sp=tb8_speed;
tb8_i++;
if (tb8_i==tb8_messages[tb8_currMsg].length){
tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
}
if (tb8_currMsg == tb8_messages.length){
if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
clearTimeout(tb8_TID);
return;
}
tb8_counter++;
tb8_currMsg = 0;
}
tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
}
tb8_pisi()
</script>

*Note:

Ganti tulisan yang berwarna Merah dengan tulisan yang kamu inginkan
Kalau anda, para sobat blogger ingin menambahkan kata-kata lagi maka tambahkan saja script berikut diatas script tb8_rptType = 'infinite'; (agar lebih mudah gunakan Ctrl+F)

tb8_messages[3] = "Masukkan Kata-katamu di sini";
tb8_messages[4] = "Masukkan Kata-katamu di sini";
tb8_messages[5] = "Masukkan Kata-katamu di sini";

5. Klik Save/Simpan dan lihat hasilnya

Bagaimana mudah bukan sobat, sekian dulu Tips and Trick mempercantik Blog dari saya, Selamat Mencoba ^_^

02.40 | 0 komentar | Baca Selengkapnya !!

Cara Membuat Komentar Facebook Kosong & Panjang

break, crack, facebook, fb, social, social media icon

Kali ini Acim X-7 mau mempostingkan posting yang berjudul Cara Membuat Komentar Facebook Kosong & Panjang sangat lah mudah . karena ada temen yang mau tahu Bagaimana Cara Membuat Komentar Facebook Kosong & Panjang Acim X-7 lalu ingin berbagi dengan cara membuat tutorial nya di blogger. Walau pun Ini informasi hasil karangan saya sendiri .

Ikuti Tata Cara Berikut !!

Log In Di Facebook
Cari status yang mau di komentari
Copy Tulisan Kode dibawah ini

@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]
@[1:1:　]

Semakin banyak kode yang di Paste-kan pada komentar semakin panjang juga komentar kosong yang anda postingkan
Silakan di lihat apa yang terjadi pada status yang anda komentari

Semoga Bermanfaat
^-^

02.29 | 0 komentar | Baca Selengkapnya !!

Cara Mempercepat Loading Blogger

Written By Unknown on Selasa, 27 November 2012 | 04.47

Bagi pemilik blog atau blogger, tentu juga menginginkan seperti halnya yang ingin banyak pengunjung inginkan, yaitu loading blog yang lebih cepat. Dengan loading blog yang cepat membuat pengunjung blog nyaman, traffik dan page view blog pun bisa semakin meningkat. Blog yang memiliki loading yang cepat tentu juga dikarenakan halaman blog yang ringan.
Berikut adalah tips untuk membuat blog menjadi lebih cepat loadingnya:

1. Kurangi Widget Blog yang Kurang Bermanfaat
Salah satu penyebab blog menjadi berat dan loadingnya lama adalah pemasangan widget yang terlalu banyak yang dipasang di blog. Memang ada beberapa widget yang wajib ada di blog, tetapi beberapa widget yang kurang memiliki manfaat untuk blog lebih baik dihapus saja. Selain dapat membuat blog lebih cepat loadingnya juga bisa membuat pengunjung blog fokus pada konten blog.

2. Hindari Penggunaan Script yang Berlebihan
Pengunaan script baik itu CSS, HTML, dan JavaScript yang berlebihan membuat blog menjadi lebih berat sehingga membuat halaman blog terbuka lebih lama. Kita bisa memilih dan menghapus kode CSS yang sudah tidak berfungsi lagi yang ada di atas ]]></b:skin>. Atau bisa juga mengkompres script baik itu CSS, HTML, JavaScript, ataupun script blog secara keseluruhan agar loading blog lebih cepat. Salah satu tool yang bisa dimanfaatkan adalah http://htmlcompressor.com/compressor.html

3. Menambahkan Script untuk Mempercepat Loading Blog
Cara lain untuk mempercepat loading blog adalah dengan menambahkan script dari Laziload. Yaitu dengan menaruh script berikut ini ini tepat di atas kode </head>.

<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://cuerosb.googlecode.com/files/cueros%20-lazyload.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$("img").lazyload({placeholder :
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXZRuxlUt3e13w-b7wNEbFZFv4Ww03DcxMwypKeTt5dQA-_LGqwX5Tq6j-SgZQDDHjOvE1UZ9ng6LbYzvAqi6z0VgN7EWyGjivv9726lYY6NHTGI3sbbugv1UmRTaLQ8V_S-kKj7IcF4s/",threshold
: 200});
});
</script>

Semoga Bermanfaat
^-^

04.47 | 1 komentar | Baca Selengkapnya !!

Cara Membuat Kata Sambutan dan Penutup Pada Blogger

A. Cara membuat Kata Sambutan di blog

1. Login di Blogger
2. Edit Tata Letak/ Rancangan

3. Tambah Gadged

4. Pilih HTML/JavaSricpt

5. Save

6. OK

<SCRIPT language='JavaScript'>alert("WELCOME TO BLOG ANDIS-TO-B-ONE 'Jangan Lupa Follow Me & Beri Komentar ya' ");</SCRIPT>

Ket : Gantilah kata-kata yang berwarna BIRU sesuai keinginan kamu.

B. Cara membuat pesan penutup di blog

Proses nya sama dengan di atas OK

Ket : Gantilah kata-kata yang berwarna BIRU sesuai keinginan kamu..

04.25 | 0 komentar | Baca Selengkapnya !!

Trik Jitu Membuat Jumlah Komentar Palsu

Salam blogger, pada posting kali ini saya akan sedikit berbagi ilmu blogger yang telihat curang. Kenapa saya sebut curang, karena posting ini berisi tutorial blogger yang berguna untuk menghandle masalah yang terjadi di blog anda, lebih jelasnya lagi yaitu kita akan membuat jumlah komentar yang palsu jika dimana blog kita tak kunjung dikomentari orang. Nah, dengan posting ini blog anda akan sedikit berevolusi dari tidak terdapat comment menjadi banyak comment dan juga akan sedikit mempercantik keadaan blog.

Oke langsung saja, Tutorial Membuat Jumlah Komentar Palsu:

1. Log in ke account blogger sobat

2. klik menu Template

3. kemudian pilih Edit Html

4. pilih lanjutkan untuk masuk ke Setup Html

5. setelah masuk jangan lupa centang kotak kecil di pojok kiri yang

bertuliskan "expand template widget"

6. cari kode ]]></b:skin>

gunakan ctrl+f agar lebih mudah

7. copy kode dibawah ini lalu paste di atas kode ]]></b:skin>

a.comment-link:before{content:"10";}

8. Simpan Template

Gimana mudah kan, silahkan dipraktekan di blog anda.

04.19 | 0 komentar | Baca Selengkapnya !!

Cara Memasang Jam Dan Kalender Di Blogger

Salam Blogger, kali ini Saya menemukan editing blog terbaru dengan memasang Jam dan Kalendar sekarang pada blogger anda. Bagi sobat ada berbagai macam aksesoris yang bisa di tambahkan pada blog nya salah satu widget yang mungkin berguna bagi SEOrang blogger ialah memasang Jam serta kalender di blognya tersebut. widget jam dan kalender ini selain berfungsi untuk menghiasi blog bisa juga bermanfaat untuk mengingatkan atau menunjukkan waktu serta tanggal pada audience di internet.

Cara Pasang Jam di Blog :

Tuju situs http://www.clocklink.com/gallery.php
Setelah anda masuk di situsnya pilih “Gallery” jam yang ada, yang ini saya sarankan sesuaikan gallery jam yang di pilih dengan tema blog anda agar lebih seragam, misalkan blog anda membahas mengenai olah raga maka pilih Sports.
Pilih model jam yang anda inginkan, misalkan jam berbentuk bola lalu klik “View HTML Tag” yang berada tepat pada gambar jam yang di pilih tersebut.
Selanjutnya jika ada keluar halaman persetujuan license, klik saja tombol “Accept”dan akan muncul halaman pengaturan warna, jam serta zise yang di inginkan yang di sertai dengan dua kotak Text box yang berisi scrip kode jam tersebut.
Ambil salah satu kode tersebut, dan pastekan dan save langsung di halaman posting/artikel atau di widget blog anda tergantung di mana anda mau meletakkan jam tersebut.
Selamat, anda sudah mempunyai jam sebagai penunjuk waktu di blog anda, untuk contoh jam seperti beriktu:

Cara Pasang Kalender di Blog :

Tuju situs http://www.free-blog-content.com/
Selanjutnya pilih tipe kalender yang anda inginkan pada kolom di bagian bawah, yang terdiri dari “Animated Calendars, Nature Calendars, Car Calendars, Abstract Calendars, Girl Calendars, Plain Calendars, Animal Calendars, Calendar with Clock”
Setelah anda memilih salah satu tipe dan model kalender, anda akan di arahkan ke halaman selanjutnya yang berisi model tampilan kalender serta scrip kode kalender tersebut.
Ambil salah satu kode kalender yang anda sukai kemudian pastekan dan save di halaman posting/artikel atau widget blog anda, tergantung di mana anda mau meletakkannya.
Sekarang di blog anda sudah mempunyai Kalender yang menghiasi blog anda sekaligus mengigatkan tanggal ke pada anda.

"Sekian Tips dari saya, moga bermanfaat"

04.13 | 0 komentar | Baca Selengkapnya !!

Acim X-7

Profil Google +

Pengunjung

Badge Blogger