Cara Merubah Link Credit G Vusion 2

Template G Vusion 2 Karya (ARLINA Design)....
disini saya akan berbagi cara untuk Merubah Link Credit G Vusion 2.
Caranya :

1. Download Template G Vusion 2
2. Extract File
3. Buka File Klik Folder Template >> Buka template Menggunakan Notepad / Wordpad.
4. Cari Code Seperti Ini : \x6A\x51\x75\x65\x72\x79","\x75\x73\x65\x20\x73\x74\x72\x69\x63\x74","\x69\x6E\x69\x74","\x63\x75\x72\x72\x65\x6E\x74\x5F\x74\x61\x62","\x6F\x70\x74\x69\x6F\x6E\x73","\x74\x61\x62\x73","\x24\x65\x6C\x65\x6D\x65\x6E\x74","\x65\x6C\x65\x6D\x65\x6E\x74","\x63\x68\x69\x6C\x64\x72\x65\x6E","\x64\x65\x66\x61\x75\x6C\x74\x73","\x6D\x74\x61\x62\x73","\x66\x6E","\x65\x78\x74\x65\x6E\x64","\x70\x72\x6F\x74\x6F\x74\x79\x70\x65","\x6C\x65\x6E\x67\x74\x68","\x62\x75\x69\x6C\x64\x54\x61\x62\x4D\x65\x6E\x75","\x62\x75\x69\x6C\x64","\x74\x61\x62\x5F\x74\x65\x78\x74\x5F\x65\x6C","\x63\x6F\x6E\x74\x61\x69\x6E\x65\x72\x5F\x63\x6C\x61\x73\x73","\x6F\x6E\x52\x65\x61\x64\x79","\x69\x73\x46\x75\x6E\x63\x74\x69\x6F\x6E","\x70\x75\x73\x68","\x74\x61\x62\x5F\x6E\x61\x6D\x65\x73","\x74\x65\x78\x74","\x68\x69\x64\x65","\x3A\x66\x69\x72\x73\x74","\x66\x69\x6C\x74\x65\x72","\x66\x69\x6E\x64","\x65\x61\x63\x68","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22","\x74\x61\x62\x73\x5F\x63\x6F\x6E\x74\x61\x69\x6E\x65\x72\x5F\x63\x6C\x61\x73\x73","\x22\x20\x2F\x3E","\x77\x72\x61\x70\x41\x6C\x6C","\x24\x77\x72\x61\x70\x70\x65\x72","\x2E","\x77\x72\x61\x70\x49\x6E\x6E\x65\x72","\x63\x61\x6C\x6C","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x65\x6C","\x3C","\x20\x63\x6C\x61\x73\x73\x3D\x22","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x63\x6C\x61\x73\x73","\x22\x3E","","\x72\x65\x70\x6C\x61\x63\x65","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x74\x61\x62","\x74\x6D\x70\x6C","\x63\x6C\x69\x63\x6B","\x74\x72\x69\x67\x67\x65\x72","\x69\x6E\x64\x65\x78","\x70\x72\x65\x76\x65\x6E\x74\x44\x65\x66\x61\x75\x6C\x74","\x73\x68\x6F\x77","\x6F\x6E","\x24\x74\x61\x62\x73\x5F\x6D\x65\x6E\x75","\x3C\x2F","\x3E","\x70\x72\x65\x70\x65\x6E\x64\x54\x6F","\x74\x6F\x4C\x6F\x77\x65\x72\x43\x61\x73\x65","\x6E\x6F\x64\x65\x4E\x61\x6D\x65","\x61\x63\x74\x69\x76\x65\x5F\x74\x61\x62\x5F\x63\x6C\x61\x73\x73","\x6F\x6E\x54\x61\x62\x53\x65\x6C\x65\x63\x74","\x61\x64\x64\x43\x6C\x61\x73\x73","\x3A\x65\x71\x28","\x29","\x72\x65\x6D\x6F\x76\x65\x43\x6C\x61\x73\x73","\x72\x65\x6D\x6F\x76\x65\x44\x61\x74\x61","\x73\x74\x79\x6C\x65","\x72\x65\x6D\x6F\x76\x65\x41\x74\x74\x72","\x75\x6E\x77\x72\x61\x70","\x72\x65\x6D\x6F\x76\x65","\x64\x61\x74\x61","\x6F\x62\x6A\x65\x63\x74","\x73\x74\x72\x69\x6E\x67","\x74\x61\x62\x73\x2D\x63\x6F\x6E\x74\x65\x6E\x74","\x61\x63\x74\x69\x76\x65\x2D\x74\x61\x62","\x68\x31\x2C\x20\x68\x32\x2C\x20\x68\x33\x2C\x20\x68\x34\x2C\x20\x68\x35\x2C\x20\x68\x36","\x74\x61\x62\x73\x2D\x6D\x65\x6E\x75","\x75\x6C","\x3C\x6C\x69\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x61\x62\x2D\x7B\x30\x7D\x22\x3E\x3C\x73\x70\x61\x6E\x3E\x7B\x31\x7D\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x6C\x69\x3E","\x43\x72\x65\x61\x74\x65\x64\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x61\x72\x6C\x69\x6E\x61\x64\x65\x73\x69\x67\x6E\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x22\x3E\x41\x72\x6C\x69\x6E\x61\x20\x44\x65\x73\x69\x67\x6E\x3C\x2F\x61\x3E","\x68\x74\x6D\x6C","\x23\x63\x70\x72\x69\x67\x68\x74","\x23\x63\x70\x72\x69\x67\x68\x74\x3A\x76\x69\x73\x69\x62\x6C\x65","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x68\x74\x74\x70\x3A\x2F\x2F\x61\x72\x6C\x69\x6E\x61\x64\x65\x73\x69\x67\x6E\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D","\x72\x65\x61\x64\x79
5. Lalu Anda Copy dan pastekan di DDECODE >> selanjutnya klik decode
6. Maka Akan Terlihat Sebagai Berikut : jQuery","use strict","init","current_tab","options","tabs","$element","element","children","defaults","mtabs","fn","extend","prototype","length","buildTabMenu","build","tab_text_el","container_class","onReady","isFunction","push","tab_names","text","hide",":first","filter","find","each","<div class="","tabs_container_class","" />","wrapAll","$wrapper",".","wrapInner","call","tabsmenu_el","<"," class="","tabsmenu_class","">","","replace","tabsmenu_tab","tmpl","click","trigger","index","preventDefault","show","on","$tabs_menu","</",">","prependTo","toLowerCase","nodeName","active_tab_class","onTabSelect","addClass",":eq(",")","removeClass","removeData","style","removeAttr","unwrap","remove","data","object","string","tabs-content","active-tab","h1, h2, h3, h4, h5, h6","tabs-menu","ul","<li class="tab-{0}"><span>{1}</span></li>","Created by <a href="http://arlinadesign.blogspot.com">Arlina Design</a>","html","#cpright","#cpright:visible","href","location","http://arlinadesign.blogspot.com","ready
7. Ini Belum selesai Kemudian anda kunjungi Rapidtables
   
8. Ganti code yang di warnai biru dengan link blog anda dan nama anda
9. copy pastekan *jangan lupa kash code di depannya \x
10. klik Convert
11. lalu ganti code pertama dengan hasil convert
12. cari /find kembali : https://cdn.rawgit.com/Arlina-Design/redvision/master/view-image.js dan https://cdn.rawgit.com/Arlina-Design/redvision/master/flexscroll.js terdapat kode juga didalamnya anda gantisaja seperti cara yang di atas kemudian save dengan .js kemudian upload di yourjavascrip atau google drive.
13. jika sudah ganti link credit dengan blog anda dan nama anda . simpan lalu upload template tersebut di blog anda

Semoga dapat dimengerti dengan seksama...
jika ada yang tidak jelas. coment di bawah 

TERIMAKASIH

Cara Merubah Link Credit Minima Colored 2.1

Template Minima Colored 2.1 Karya (ARLINA Design)....
disini saya akan berbagi cara untuk Merubah Link Credit Minima Colored 2.1.
Caranya :

1. Download Template Minima Colored 2.1
2. Extract File
3. Buka File Klik Folder Template >> Buka template Menggunakan Notepad / Wordpad.
4. Cari Code seperti : \x6A\x51\x75\x65\x72\x79","\x75\x73\x65\x20\x73\x74\x72\x69\x63\x74","\x69\x6E\x69\x74","\x63\x75\x72\x72\x65\x6E\x74\x5F\x74\x61\x62","\x6F\x70\x74\x69\x6F\x6E\x73","\x74\x61\x62\x73","\x24\x65\x6C\x65\x6D\x65\x6E\x74","\x65\x6C\x65\x6D\x65\x6E\x74","\x63\x68\x69\x6C\x64\x72\x65\x6E","\x64\x65\x66\x61\x75\x6C\x74\x73","\x6D\x74\x61\x62\x73","\x66\x6E","\x65\x78\x74\x65\x6E\x64","\x70\x72\x6F\x74\x6F\x74\x79\x70\x65","\x6C\x65\x6E\x67\x74\x68","\x62\x75\x69\x6C\x64\x54\x61\x62\x4D\x65\x6E\x75","\x62\x75\x69\x6C\x64","\x74\x61\x62\x5F\x74\x65\x78\x74\x5F\x65\x6C","\x63\x6F\x6E\x74\x61\x69\x6E\x65\x72\x5F\x63\x6C\x61\x73\x73","\x6F\x6E\x52\x65\x61\x64\x79","\x69\x73\x46\x75\x6E\x63\x74\x69\x6F\x6E","\x70\x75\x73\x68","\x74\x61\x62\x5F\x6E\x61\x6D\x65\x73","\x74\x65\x78\x74","\x68\x69\x64\x65","\x3A\x66\x69\x72\x73\x74","\x66\x69\x6C\x74\x65\x72","\x66\x69\x6E\x64","\x65\x61\x63\x68","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22","\x74\x61\x62\x73\x5F\x63\x6F\x6E\x74\x61\x69\x6E\x65\x72\x5F\x63\x6C\x61\x73\x73","\x22\x20\x2F\x3E","\x77\x72\x61\x70\x41\x6C\x6C","\x24\x77\x72\x61\x70\x70\x65\x72","\x2E","\x77\x72\x61\x70\x49\x6E\x6E\x65\x72","\x63\x61\x6C\x6C","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x65\x6C","\x3C","\x20\x63\x6C\x61\x73\x73\x3D\x22","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x63\x6C\x61\x73\x73","\x22\x3E","","\x72\x65\x70\x6C\x61\x63\x65","\x74\x61\x62\x73\x6D\x65\x6E\x75\x5F\x74\x61\x62","\x74\x6D\x70\x6C","\x63\x6C\x69\x63\x6B","\x74\x72\x69\x67\x67\x65\x72","\x69\x6E\x64\x65\x78","\x70\x72\x65\x76\x65\x6E\x74\x44\x65\x66\x61\x75\x6C\x74","\x73\x68\x6F\x77","\x6F\x6E","\x24\x74\x61\x62\x73\x5F\x6D\x65\x6E\x75","\x3C\x2F","\x3E","\x70\x72\x65\x70\x65\x6E\x64\x54\x6F","\x74\x6F\x4C\x6F\x77\x65\x72\x43\x61\x73\x65","\x6E\x6F\x64\x65\x4E\x61\x6D\x65","\x61\x63\x74\x69\x76\x65\x5F\x74\x61\x62\x5F\x63\x6C\x61\x73\x73","\x6F\x6E\x54\x61\x62\x53\x65\x6C\x65\x63\x74","\x61\x64\x64\x43\x6C\x61\x73\x73","\x3A\x65\x71\x28","\x29","\x72\x65\x6D\x6F\x76\x65\x43\x6C\x61\x73\x73","\x72\x65\x6D\x6F\x76\x65\x44\x61\x74\x61","\x73\x74\x79\x6C\x65","\x72\x65\x6D\x6F\x76\x65\x41\x74\x74\x72","\x75\x6E\x77\x72\x61\x70","\x72\x65\x6D\x6F\x76\x65","\x64\x61\x74\x61","\x6F\x62\x6A\x65\x63\x74","\x73\x74\x72\x69\x6E\x67","\x74\x61\x62\x73\x2D\x63\x6F\x6E\x74\x65\x6E\x74","\x61\x63\x74\x69\x76\x65\x2D\x74\x61\x62","\x68\x31\x2C\x20\x68\x32\x2C\x20\x68\x33\x2C\x20\x68\x34\x2C\x20\x68\x35\x2C\x20\x68\x36","\x74\x61\x62\x73\x2D\x6D\x65\x6E\x75","\x75\x6C","\x3C\x6C\x69\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x61\x62\x2D\x7B\x30\x7D\x22\x3E\x3C\x73\x70\x61\x6E\x3E\x7B\x31\x7D\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x6C\x69\x3E","\x43\x72\x65\x61\x74\x65\x64\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x61\x72\x6C\x69\x6E\x61\x64\x65\x73\x69\x67\x6E\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x22\x3E\x41\x72\x6C\x69\x6E\x61\x20\x44\x65\x73\x69\x67\x6E\x3C\x2F\x61\x3E","\x68\x74\x6D\x6C","\x23\x63\x70\x72\x69\x67\x68\x74","\x23\x63\x70\x72\x69\x67\x68\x74\x3A\x76\x69\x73\x69\x62\x6C\x65","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x68\x74\x74\x70\x3A\x2F\x2F\x61\x72\x6C\x69\x6E\x61\x64\x65\x73\x69\x67\x6E\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D","\x72\x65\x61\x64\x79"
5. Lalu Anda Copy dan pastekan di DDECODE >> selanjutnya klik decode
6. maka akan terlihat : jQuery","use strict","init","current_tab","options","tabs","$element","element","children","defaults","mtabs","fn","extend","prototype","length","buildTabMenu","build","tab_text_el","container_class","onReady","isFunction","push","tab_names","text","hide",":first","filter","find","each","<div class="","tabs_container_class","" />","wrapAll","$wrapper",".","wrapInner","call","tabsmenu_el","<"," class="","tabsmenu_class","">","","replace","tabsmenu_tab","tmpl","click","trigger","index","preventDefault","show","on","$tabs_menu","</",">","prependTo","toLowerCase","nodeName","active_tab_class","onTabSelect","addClass",":eq(",")","removeClass","removeData","style","removeAttr","unwrap","remove","data","object","string","tabs-content","active-tab","h1, h2, h3, h4, h5, h6","tabs-menu","ul","<li class="tab-{0}"><span>{1}</span></li>","Created by <a href="http://arlinadesign.blogspot.com">Arlina Design</a>","html","#cpright","#cpright:visible","href","location","http://arlinadesign.blogspot.com","ready"
7. Ini Belum selesai Kemudian anda kunjungi Rapidtables
   
8. Ganti code yang di warnai biru dengan link blog anda dan nama anda
9. copy pastekan *jangan lupa kash code di depannya \x
10. klik Convert
11. lalu ganti code pertama dengan hasil convert
12. cari /find kembali : https://cdn.rawgit.com/Arlina-Design/redvision/master/view-image.js dan https://cdn.rawgit.com/Arlina-Design/redvision/master/prism.js terdapat kode juga didalamnya anda gantisaja seperti cara yang di atas kemudian save dengan .js kemudian upload di yourjavascrip atau google drive.
13. jika sudah ganti link credit dengan blog anda dan nama anda . simpan lalu upload template tersebut di blog anda

Semoga dapat dimengerti dengan seksama...

jika ada yang tidak jelas. coment di bawah 

TERIMAKASIH

Cara Memasang Meta Refresh Otomatis

Meta Tag refresh otomatis sering digunakan para blogger dalam meningkatkan trafic blognya. Untuk dapat memasang meta refresh ini, sobat hanya perlu meletakkan kode refresh di bawah ini sebagai meta tag. Sebelumnya sobat harus tau jenis jenis dari fitur ini.
Oke langsung saja kita mulai saja, langkah langkah memasang Meta Tag Refresh otomatis

1. Langkah Pertama Login ke Blogger
2. Kemudian klik Rancangan dan Pilih Edit Html.
3. Selanjutnya silakan anda masukan kode meta tag refresh di bawah ini :
   Contoh :  <meta http-equiv=”refresh” content=”600“/>
4. Lalu taruh saja kode tersebut di antara kode : <head> …. </head>

Keterangan :
Ada 4 Macam Refresh

• Meta Refresh Otomatis tanpa waktu tunggu .

<meta http-equiv=”Refresh” content=”0" />

• Refresh Otomatis dengan tanpa waktu tunggu dan dialihkan ke web lain.

<meta http-equiv=”refresh” content=”0;URL=http://sidary.blogspot.com” />

• Refresh Otomatis dengan menggunakan waktu tunggu.

<meta http-equiv=”refresh” content=”10” />

• Refresh Otomatis dengan waktu tunggu dan dialihkan ke blog/page lain.

<meta http-equiv=”refresh” content=”10;URL=http://sidary.blogspot.com” />

Keterangan: Meta content=”10"           Rentang waktu tunggu dalam detik.
URL=http://sidary.blogspot.com” />             Tujuan direct atau reload.

Membuat Daftar Isi / Sitemap Mirip Kang Ismet

Cara Memasang Daftar Isi atau Sitemap Seperti Kang Ismet :

1. Login ke blogger
2. Kemudian buat artikel baru di halaman statis
3. Selanjutnya pilih tab HTML dan salin kode di bawah ini didalamnya :

<style type="text/css" scoped="scoped">

/* Multi feed sidary */

.list-entries{background:white;border:1px solid #d8d8d8}

.list-entries ul,.list-entries li{margin:0;padding:0;list-style:none}

.list-entries li{padding:1em;border-bottom:1px solid #ddd}

.list-entries .main-title{padding:0}

.list-entries .main-title h4{display:block;font:inherit;font-weight:bold;padding:.5em 1em;background-color:#4f93c5;color:#fff;margin:0;line-height:normal;font-size:14px;margin-top:0!important}

.list-entries .title a{font-weight:300;font-size:14px;text-decoration:none;line-height:.5em;color:#222}

.list-entries .title a:hover{text-decoration:underline;color:#5886a7}

.list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 1em 0 0;padding:0;float:left}

.list-entries .summary{overflow:hidden;color:#999}

.list-entries .more-link{border-bottom:none}

.list-entries .more-link a{display:block;line-height:2em;height:2em;overflow:hidden;text-decoration:none;background-color:#82b965;padding:.5em 1em;position:relative;font-weight:bold;color:white}

.list-entries .more-link a:after{content:"";width:0;height:0;position:absolute;top:50%;right:.3em;border:4px solid transparent;border-left-color:white;margin-top:-4px}

.list-entries .more-link a:hover{background-color:#71a555}

.list-entries{margin:7px;width:251px;float:left;font-size:11px}

</style>

<script type="text/javascript">

var multiFeed = {

    feedsUri: [

        {

            name: "Travel",

            url: "http://sidary.blogspot.com/",

            tag: "Travel"

        },

        {

            name: "Labels",

            url: "http://sidary.blogspot.com/",

            tag: "Labels"

        },

        {

            name: "Lifestyle",

            url: "http://sidary.blogspot.com/",

            tag: "Lifestyle"

        },

        {

            name: "Travel",

            url: "http://sidary.blogspot.com/",

            tag: "Travel"

        },

        {

            name: "Labels",

            url: "http://sidary.blogspot.com/",

            tag: "Labels"

        },

        {

            name: "Lifestyle",

            url: "http://sidary.blogspot.com/",

            tag: "Lifestyle"

        }

    ],

    numPost: 4,

    showThumbnail: true,

    showSummary: true,

    summaryLength: 80,

    titleLength: "auto",

    thumbSize: 72,

    containerId: "feed-list-container",

    readMore: {

        text: "Selengkapnya",

        endParam: "?max-results=8"

    }

};

</script>

<script type="text/javascript" src="https://rawgit.com/Arlina-Design/nubie/master/multifeedblog.js"></script>

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

</div>

    4. Publikasikan Post

Cara Membuat Blog Anti Maling

Cara Membuat Blog Anti Ctrl+U, Ctrl+Shift+K, F12, Ctrl+Shift+I, Ctrl+S, Dan Lain Sebagainya. Fungsinya agar orang lain tidak dapat melihat HTML/Javascrip Blog kita.

Langkah-langkah Menggunakan Code :

1. Masuk Ke blogger anda / blogger.com
2. Pilih salah satu blog anda
3. Klik Template
4. Pilih Edit HTML
5. Cari Kode <Head> biasanya terdapat di paling atas ketemu
6. Masukan Kode Berikut <script src='http://goo.gl/hOc7A9' type='text/javascript'/>
7. Klik Simpan Template /Save Template
8. Coba Anda Klik CTRL + U 

Cara Membuat 4 Kotak Iklan

Cara membuat 4 kotak iklan Responsive dengan HTML / Java Scrip
Tambahkan Widget , Pilih HTML / Javascript.
Copy dan pastekan kode berikut :

<style type='text/css'>
.kotak-iklan { background : #ddd; text-align : center; border-radius : 4px; padding : 12px 0; }
.kotak-iklan img { background : #ebf5f9; margin : auto; padding : 5px; text-align : center; width : 125px; height : 125px; }
.kotak-iklan img:hover { background : #fff; }
</style>

<div class="kotak-iklan">
<a href="/p/ads.html" title="Pasang Iklan"><img alt="iklan banner" src="http://3.bp.blogspot.com/-LngNhzp0-GQ/Vkk8ky0ozXI/AAAAAAAAC6k/087t7QviMeE/s1600/PasangIklan.jpg"/></a>
<a href="/p/ads.html" title="Pasang Iklan"><img alt="iklan banner" src="http://3.bp.blogspot.com/-LngNhzp0-GQ/Vkk8ky0ozXI/AAAAAAAAC6k/087t7QviMeE/s1600/PasangIklan.jpg"/></a>
<a href="/p/ads.html" title="Pasang Iklan"><img alt="iklan banner" src="http://3.bp.blogspot.com/-LngNhzp0-GQ/Vkk8ky0ozXI/AAAAAAAAC6k/087t7QviMeE/s1600/PasangIklan.jpg"/></a>
<a href="/p/ads.html" title="Pasang Iklan"><img alt="iklan banner" src="http://3.bp.blogspot.com/-LngNhzp0-GQ/Vkk8ky0ozXI/AAAAAAAAC6k/087t7QviMeE/s1600/PasangIklan.jpg"/></a>
</div>

Klik Save.

Kunjungi terus sidary

Cara Membuat Spot Light

Spotlight merupakan efek yang akan menyorot atau memfokuskan suatu titik objek berdasarkan letak mouse yang kita arahkan.

Buka Notepad atau Wordpad....
Masukan script berikut:
@font-face { /* A nice web font */
    font-family: 'LeagueGothicRegular';
    src: url('League-Gothic-fontfacekit/League_Gothic.eot');
    src: local('League Gothic'), local('LeagueGothic'), url('League-Gothic-fontfacekit/League_Gothic.woff') format('woff'), url('League-Gothic-fontfacekit/League_Gothic.ttf') format('truetype'), url('League-Gothic-fontfacekit/League_Gothic.svg#LeagueGothic') format('svg');
}
* {
margin: 0;
padding: 0;
}
html, body {
overflow: hidden;
background: #C23;
}
div {
margin-top: 6em;
font-family: "LeagueGothicRegular";
color: #FFF;
-webkit-transform: rotate(-10deg); /* Make it more dynamic! */
-moz-transform: rotate(-10deg);
text-align: center;
}
h1 {
font-size: 24pt;
letter-spacing: 4pt;
}
p {
font-size: 48pt;
line-height: 48pt;
}
p + p {
font-size: 18pt;
color: #800;
}
strong {
display: block;
font-size: 100pt;
line-height: 100pt;
}
.spotlight {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 1px solid #000;
pointer-events: none;
/* this is the sweet spot */
background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.8)), color-stop(0.8, rgba(0,0,0,0)));
background-image: -moz-radial-gradient(50% 50% 45deg,circle closest-side,transparent 0,transparent 100px,rgba(0, 0, 0, 0.8) 120px);
}

Simpan dengan  Nama style.css

selanjutnya buka baru notepad atau wordpad
masukan script berikut:
<html>
<head>
    <title>Spotlight</title>
    <link rel="stylesheet" href="style.css" type="text/css">
</head>

<body>
<div>
<h1>Spotlight SIDARY</h1>
<p>Turn on the <strong>light!</strong></p>
<p>Works with Webkit &amp; Firefox</p>
</div>

<span id="spot" class="spotlight"></span>

<script type="text/javascript">
var spot = document.getElementById('spot');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
   
/* A bit of JS to respond to mouse events */
function moveSpot(e){
    var x = 0;
    var y = 0;

    if (!e) var e = window.event;
    if (e.pageX || e.pageY)
    {
        x = e.pageX;
        y = e.pageY;
    }
    else if (e.clientX || e.clientY)
    {
        x = e.clientX + document.body.scrollLeft;
        y = e.clientY + document.body.scrollTop;
    }
   
    if (navigator.userAgent.match('AppleWebKit')) {
        var style = '-webkit-gradient(radial, '+x+' '+y+', 0, '+x+' '+y+', 100, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.8)), color-stop(0.8, rgba(0,0,0,0)))';
    } else {
        var style = '-moz-radial-gradient('+x+'px '+y+'px 45deg,circle closest-side,transparent 0,transparent 100px,rgba(0, 0, 0, 0.8) 120px)';
    }
    spot.style.backgroundImage = style;
}

window.onload = function() {
    window.onmousemove = moveSpot;
}
</script>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-572751-1");
pageTracker._setDomainName(".svay.com");
pageTracker._trackPageview();
} catch(err) {}</script>

</body>
</html>

simpan dengan nama spotlight.html
Kunjungi Terus Sidary.