Tampilkan postingan dengan label Script. Tampilkan semua postingan
Tampilkan postingan dengan label Script. Tampilkan semua postingan

Script No Klik Kanan dan CoPas

1

Bookmark and Share

Kali ini Tutorial Blogger akan memberikan trik "Anti CoPas dan Klik Kanan"

Ini script untuk "Anti CopAs", diletakkan bawah kode <head>
<script type="text/JavaScript">
//courtesy of tutorialblogger.blogspot.com
function killCopy(e) {
return false
}
function reEnable() {
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar) {
document.onmousedown=killCopy
document.onclick=reEnable
}
</script>

sedangkan untuk "Anti klik kanan"

<script language="JavaScript">
<!--
//Disable right mouse click Script
//By Tutorial Blogger ( elevenjune90@gmail.com This e-mail address is being protected from spambots. You need JavaScript enabled to view it ) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com
var message="Sorry, you can't Right Click!!!";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
// -->
</script>

NB: script untuk blogger, bisa langsung ditaruh di tambah gadget, untuk yang laen di taruh di bawah kode <head>.

Read More >>

Cara Memasang File Flash

0

Bookmark and Share
Untuk memasang flash ke dalam blog cukuplah mudah. Yang diperlukan yaitu file flash yang biasanya ber-ekstensi .swf lalu upload file tersebut ke hosting. File animasi flash tersebut bisa dijadikan hiasan pada blog atau bisa juga dijadikan hiasan di header sehingga membuat blog menjadi lebih animatif. Untuk memasang flash pada blog caranya sebagai berikut :
  1. Login ke blogger kemudian pilih menu "Tata Letak".
  2. Kemudian klik link "Tambah gadget" dimana akan ditempatkan animasi flash.
  3. Pilih "HTML/Javascript" kemudian taruh script berikut : 
<embed src="http://blogoholic.info/wellcome.swf" quality="high" bgcolor="white" width="500" height="100" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash"></embed>
* Ubah "http://blogoholic.info/wellcome.swf" dengan alamat file flash kamu yang telah ditaruh di hosting.
* Ubah width="500" height="100" dengan ukuran dari file flash Anda.


Read More >>

Membuat Recent Post Animasi

1

Bookmark and Share
Cara membuatnya sangat mudah karena tinggal menambahkan widget seperti biasa.
  • Masuk ke menu Tata Letak
  • Klik "Tambah Widget"
  • Pilih HTML/Javascript
  • Paste kode berikut ke dalamnya :
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/post.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='JavaScript'>
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://tutorialblogger.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

Kode berwarna merah ganti dengan alamat blog kamu

Warna hijau ganti dengan jumlah posting yang ingin ditampilkan

Klik tombol Simpan lalu lihat hasilnya!

Read More >>

Membuat Auto Readmore - Thumbnail

0
Anda Login ke Akun Blogger, Pilih Template lalu Edit HTML

Jika sudah Cari kode </head> kemudian letakan script dibawah ini di atas kode </head> .

copy paste script auto read more berikut ini:
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot) (C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script> 
Tetap pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" kemudian cari kode dibawah ini
<data:post.body/> 
Jika sudah ketemu, maka ganti kode <data:post.body/> dengan semua kode dibawah ini
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
Setelah selesai tekan simpan template

Keterangan tentang cara membuat auto read more : 
var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel).

Dengan keterangan di atas anda dapat merubah script fungsi auto read more sesuka hati.


Semoga bermanfaat....

Read More >>

Membuat Recent Post

0

Bookmark and Share
Pastikan Anda telah Login ke Blogger
1. Layout --> Page Elements
2. Pilih tempat yang kamu inginkan kemudian Add a Gadget
3. pilih HTML/JavaScipt dan taruh code dibawah didalamnya
<script src="http://sites.google.com/site/anasku2000/post-terakhir.js"></script>
<script>var numposts = 15; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="AlamatBlogAnda/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>
Angka 15 adalah angka postingan yang akan Anda tampilkan
AlamatBlogAnda adalah alamat blog Anda


Semoga bermanfaat :D


thanks to Anas
Read More >>

Memasang Save as PDF

0

Bookmark and Share
Banyak cara untuk menarik pengunjung datang keblog kita, salah satunya memasang sava page as pdf di blog kita, dengan adanya layanan ini mungkin pengunjung akan dimanjakan dengan output yang berbentuk pdf. Anda pasti masih ingat dengan layanan Fasilitas Print, ya tujuannya hampir sama, artikel kita bisa disimpan dan di baca sewaktu - waktu dengan format artikel yang bagus dan rapi dari pada menggunakan save page as browser.

Berikut langkah - langkah Memasang Save Page As PDF di Blog :
  1. Silahkan mendaftar dulu di http://web2.pdfonline.com,
  2. Kalau sudah silahkan singup, isi data temen - temen sesuai form yang sudah disediakan,
  3. Langsung aja klik button generate the javascript
  4. Maka otomatis scriptnya akan muncul dibawahnya, 


Semoga bermanfaat :D
Read More >>

Membuat Menu Horizontal Multilevel

0
Langkah pertama yaitu Login ke Blogger

Masuk pada bagian Template lalu Edit HTML

Masukkan code dibawah ini dibawah code <head>
<!--[if lte IE 7]> <style type="text/css"> html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/ </style> <![endif]-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/> <script src='http://sites.google.com/site/anasprod/jqueryslidemenu.js' type='text/javascript'/>
Lalu masukkan CSS dibawah ini diatas code ]]></b:skin>
.jqueryslidemenu{
font: bold 13px Verdana;
background: #800000;
width:100%;
float:left
}
.jqueryslidemenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}
/*Top level list items*/
.jqueryslidemenu ul li{
position: relative;
display: inline;
float: left;
}
/*Top level menu link items style*/
.jqueryslidemenu ul li a{
display: block;
background: #800000; /*background of tabs (default state)*/
color: white;
padding: 8px 10px;
border-right: 1px solid #778;
text-decoration: none;
}
* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}
.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
color: white;
}
.jqueryslidemenu ul li a:hover{
background:#B30000; /*tab link background during hover state*/
color: white;
}
/*1st sub level menu*/
.jqueryslidemenu ul li ul{
position: absolute;
left: 0;
display: block;
visibility: hidden;
background:#B30000;
}
/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}
/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
font: normal 13px Verdana;
width: 160px; /*width of sub menus*/
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid gray;
}
.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
background: #eff9ff;
color: black;
}
/* ######### CSS classes applied to down and right arrow images ######### */
.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}
.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}
#footheader {
width: 100%;
float:left;
margin:0 0 0;
padding:0 0 0;
position:relative;
}

Code diatas adalah style dari menu Anda, silahkan edit sesuai kebutuhan Anda.

Nah kalau sudah kita menuju kebawah untuk mencari kode seperti dibawah ini :
<div id='header-wrapper'><b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Bisnis Di Internet (Header)' type='Header'/>
</b:section>
</div>
Perhatikan saja kode yang berwarna merah karena kode yang berwarna hitam diatas berbeda-beda setiap template

lalu taruh code dibawah ini dibawah kode yang diatas tadi
<div id='footheader'>
<b:section class='footheader' id='footheader' preferred='yes'>
</b:section>
</div>

Kalau sudah SAVE

Pekerjaan kita belum selesai, langkah selanjutnya yaitu menuju menu "Tambah Widget"




Terlihat pada "Tata Letak" muncul tempat gadget baru, lalu klik saja "Tambah Widget" dan pilih HTML/JavaScript dan masukkan kode dibawah ini.

<div id="myslidemenu" class="jqueryslidemenu">
<ul>
<li><a href="/">Home</a></li>
<li><a href="http://tutorialblogger.blogspot.com">Tutorial Blogger</a></li>
<li><a href="#">Kategori</a>
<ul>
<li><a href="#">Sub Kategori 1</a></li>
<li><a href="#">Sub Kategori 2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://tutorialblogger.blogspot.com">Tutorial Blogger</a></li>
</ul>
<br style="clear: left" />
</div>

Kode diatas adalah kode dari widgetnya silahkan di edit sesuai kebutuhan Anda.

Kalau sudah silahkan SAVE...

Semoga bermanfaat :D
Read More >>

Membuat Floating Box

0

Bookmark and Share
Pertama yang Anda lakukan adalah Login ke blogger lalu masuk menu "Template" Kemudian Masuk bagian "Edit HTML"

Pasang code ini dibawah code <head> atau sebelum code </head>
<script src='http://sites.google.com/site/anasprod/adse.js' type='text/javascript'/>

Dan pasang Code CSS dibawah ini diatas code ]]></b:skin>
#topbar{
position:absolute;
border: 1px solid black;
padding: 2px;
background-color: lightyellow;
width: 620px;
visibility: hidden;
z-index: 100;
}

(Edit code CSS diatas untuk menentukan style dari box)

Kemudian Save dahulu.

Dan masuk pada bagian "Tata Letak -> Tambah Widget"

Pilih tempat Gadget yang Anda ingin (terserah karena box ini akan melayang) dan klik "Tambah Widget" Masukkan code dibawah ini
<div id="topbar">
MASUKKAN CODE SCRIPT / LAINYA DISINI
<a href="" onclick="closebar(); return false"><img src="http://sites.google.com/site/anasprod/close.gif" border="0" /></a>
</div>

Ingat ganti code yang berwarna merah diatas dengan code gadget.

Kalau sudah. . . SAVE..

Selesai..


Semoga bermanfaat :D


thanks to Anas
Read More >>

Membuat Fasilitas Print di Blog

0

Bookmark and Share
Mungkin Anda tidak menyangka bahwa fasilitas print juga bisa dipasang pada halaman blog kita, fasilitas ini bisa memudahkan pengunjung membaca tulisan - tulisan kita lebih mudah atau offline. Pembuatan fasilitas print ini pun tidak terlalu sulit seperti yang biasa digunakan. Langkah pertama Anda harus siapkan icon print.

Dibawah ini script fasilitas print, silahkan ganti alamat icon (teks yang berwarna merah) dengan alamat icon milik Anda, sedangkan teks yang berwarna biru adalah teks yang akan muncul disamping icon print (bisa diganti). Atau jika hanya ingin menampilkan icon print saja hapus tulisan yang berwarna biru.
<a target="blank" href="javascript:print(document)"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2PS11Ngwy_8I3S5ohzZVYEmEHNrWqLSDzO4vEhRd-DmeYjbIVVKxOVGGS7kjH4XiHNro2iZ25QMaWsG83Hw_T4aFZAFETFuGhvDBhR9ZaaTA4g8ENYTZK_u8ERTNeK4CGimCfCE9cexI/h120/print.png" alt="print this page" border="0"/>Print this page</a>
Hasilnya akan seperti ini :

Dengan tulisan : print this page Print this page

Tanpa tulisan : print this page

Semoga bermanfaat :D


Read More >>

Cara Membuat Komentar Facebook

0
Sistem komentar ini sebenarnya ditujukan agar pengguna facebook dapat berkomentar di blog kita dengan mudah
Sebelumnya Anda harus sudah dalam keadaan login di facebook
  • Kunjungi pengaturan Facebook Developer
  • Daftarkan blogmu dengan mengisi formulir yang diberikan: 
  • Nama situs: Nama situs/blog kamu 
  • Url situs: Alamat blog Anda (contoh:http://tutorialblogger.blogspot.com/ selalu akhiri dengan slahs "/") 
  • Lokasi: pilih bahasa Indonesia 
  • Kamu akan diberikan beberapa kode seperti ID Aplikasi, 
  • Copy kode tersebut atau catat di notepad karena nantinya kode itu akan dibutuhkan sebagai APP ID FACEBOOK ANDA 
Perlu diketahui bahwa sistem komentar ini menggunakan kode FBML

Supaya Template support FBML maka kita lakukan langkah berikut :
  • Masuk ke Blogger kamu 
  • Menuju ke "Template" dan pilih "Edit HTML
  • Cari kode <html lalu paste kode dibawah ini tepat disebelahnya
xmlns:fb='http://www.facebook.com/2008/fbml'
  • Sehingga secara keseluruhan menjadi:
<html xmlns:fb='http://www.facebook.com/2008/fbml'expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' >
  • Lalu langkah berikutnya paste kode dibawah ini dibawah <body>
<div id="fb-root"></div> <script>     window.fbAsyncInit = function() {     FB.init({       appId  : 'APP ID FACEBOOK KAMU',       status : true, // check login status         cookie : true, // enable cookies to allow the server to access the   session       xfbml  : true  // parse XFBML     });   };
    (function() {     var e = document.createElement('script');       e.src = document.location.protocol +   '//connect.facebook.net/en_US/all.js';     e.async = true;       document.getElementById('fb-root').appendChild(e);     }()); </script>
Kode berwarna merah adalah kode (ID) aplikasi facebook Anda yang tadi kamu dapatkan di langkah sebelumnya.
  • Langkah selanjutnya adalah memasang Open Graph protocol 
  • Caranya cari kode dan paste kode berikut distasnya
<b:if cond='data:blog.pageType == &quot;item&quot;'> <meta   expr:content='data:blog.pageTitle' property='og:title'/> <meta   expr:content='data:blog.url' property='og:url'/> <b:else/> <meta   expr:content='data:blog.title' property='og:title'/> <meta   expr:content='data:blog.homepageUrl' property='og:url'/> </b:if> <meta   content='SITUS ANDA' property='og:site_name'/> <meta   content='http://google.com/help/hc/images/logos/blogger_logo.gif'   property='og:image'/> <meta content='APP ID FACEBOOK KAMU'   property='fb:app_id'/> <meta content='ID FACEBOOK PROFILE KAMU'   property='fb:admins'/> <meta content='article'   property='og:type'/>

Keterangan kode:
kode berwarna ungu adalah nama situs Anda
kode berwarna kuning adalah logo aplikasi facebook Anda
kode berwarna merah adalah kode (ID) aplikasi facebookAnda yang tadi Anda dapatkan di langkah sebelumnya
kode berwarna hijau adalah kode (ID) faceboom profile Anda

Cara mengetahui ID facebook profile:
  • Anda masuk ke Profil Anda lalu lihat alamat di adress bar browser 
  • Contoh: http://www.facebook.com/namaanda 
  • Simpan template 

Selamat Blog kamu sudah support FBML

Selanjutnya adalah tahap pemasangan kotak komentar!
  • Anda expand widget template Anda 
  • Cari kode <data:post.body/> 
  • Lalu paste kode ini dibawahnya
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div><fb:comments width='450' expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id'/></div><div style='background-color: #FFFFFF;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'> <img alt='' class='icon-action' height='16' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK8aYHu9TvjhAl5Bta7vR9mLi9n6hwIEI2Qa3lNc_NrP5o0BhPDsz9lMWhQb2wZwlZISJVfWkEBiyWcDdVFm4NlWRYtqTiC0lEVAdmN5KULx0JWEkA8l11iGlyKpAUv4q1D_C5u2Mj9MA/' width='16'/> <b><a href='http://tutorialblogger.blogspot.com/' target='_blank'>Facebook comments untuk blogger</a> untuk mendapatkannya <a href='http://tutorialblogger.blogspot.com/2010/02/cara-membuat-komentar-facebook.html' target='_blank' title='Facebook Comment'>KLIK di sini</a></b></div>
</b:if>

Keterangan : Kode berwarna orange adalah lebar kotak komentar, ganti sesuai keinginan!

Simpan template


Bagi yang menginstal auto readmore, paste kode fecebook tadi tepat dibawah kode auto readmore..




Semoga bermanfaat :D
Read More >>

Cara Membuat Efek Heart/Hati

0

Bookmark and Share
Langkah pertama yang harus Anda lakukan adalah Log In ke Blogger lalu masuk menu Template kemudian masuk menu Edit HTML
Lalu taruh Code dibawah ini diatas code </body>

<script src='http://sites.google.com/site/anasku2000/lovingheart.js'></script>

Jika sudah Simpan dan lihat hasilnya...


Semoga bermanfaat :D


thanks to Anas
Read More >>

Cara Mengalihkan Blog

0
Jika Anda membutuhkan tutorial ini ikuti langkah-langkah dibawah ini :
  1. Masuk ke akun Blogger anda yang akan di alihkan
  2. Klik tata letak/rancangan
  3. Klik Edit Html
  4. Cari Kode <head> 
  5. Copy Script Kode Dibawah Ini :
    <meta content='nofollow' name='robots'/>
    <meta content='noindex' name='robots'/>
    <script type='text/javascript'><!--//--><![CDATA[//><!--
    var url = "URL tujuan Anda" (document.images) ? location.replace(url) : location.href = url;//--><!]]></script>
    <meta content='0;URL= URL tujuan Anda' http-equiv='refresh'/>
  6. Paste Script Kode Di atas Tepat Di bawah Kode <head>
  7. Klik Simpan

Keterangan :
Tulisan berwarna Biru : Ganti Dengan URL yang akan di gunakan sebagai tujuan pengalihan.


Semoga bermanfaat :D


Read More >>

Cara Membuat Spoiler

0

Bookmark and Share
Sebelum membahas Cara Sembunyikan Isi/Content Posting Dengan Spoiler, ada baiknya kita mengenal terlebih dahulu tentang Spoiler.

Spoiler adalah tehnik untuk menyembunyikan seluruh atau sebagian isi dari Content posting, dengan tujuan untuk menghemat space halaman posting dan mengurangi lamanya waktu loading web/blog, dimana misalnya posting tanpa spoiler loading memakan waktu 45 detik, maka jika dengan Spoiler cukup dengan 30 detik bahkan bisa kurang (tergantung dari isi content).

Fungsi Spoiler adalah selain untuk menyembunyikan content berupa text dan kode juga bisa untuk sembunyikan gambar dalam ukuran besar serta video.

Cara Kerja Spoiler adalah, content yang ditaruh di dalam spoiler hanya bisa dilihat seluruhnya oleh pembaca apabila tombol perintahnya diklik. Untuk membuktikannya silahkan Anda klik tombol spoiler di bawah ini:


Tutorial Blogger

Cara pasang spoiler pada postingan blog/website bukanlah hal yang sulit, karena kita tinggal memasukan isi content ke dalam kode HTML dan menaruhnya dalam content posting, sedangkan yang sulit itu adalah membuat kode-kode HTML-nya.
<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><span style="font-weight: bold;">Tutorial Blogger</span><input value="Spoiler" style="margin:5px;padding: 0px; width: 80px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup Spoiler'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka Spoiler'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">http://tutorialblogger.blogspot.com/2010/02/cara-membuat-spoiler.html </div></div></div></div>


Keterangan:
  1. Teks warna Merah adalah kata perintah tombol spoiler dan boleh diganti sesuai selera Anda;
  2. Teks warna Biru adalah tempat menaruh isi content postingan Anda;


Semoga bermanfaat :D


Read More >>

Cara Membuat ScrollBar Pada Arsip Blog

0
Untuk membuat arsip blog memiliki fungsi scroll sangat mudah, untuk membuatnya silahkan ikuti langkah-langkah berikut :
  1. Masuk ke blogger
  2. Klik Tata Letak
  3. Klik Tambah Widget
  4. Tambahkan sebuah Widget => Tambah Widget Arsip Blog
  5. Tapi Anda harus pilih gaya Hierarki

Pada Menu Diatas Itu belum terdapat fungsi scroll, untuk membuatnya memiliki fungsi scroll ikuti langkah-langkahnya lagi !
  • Setelah itu, klik Edit Html
  • Beri tanda centang pada tulisan Expand Widget Template
  • Lalu Anda cari kode seperti ini 
<b:widget id='BlogArchive1' locked='false' title='Archives' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:150px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>

Kode warna merah dan hijau adalah kode yang ditambahkan kedalam script tersebut
Kode warna hijau yang dicetak tebal adalah tinggi dari elemen tadi, silahkan Anda ganti agar sesuai dengan blog Anda.

Semoga bermanfaat :D




Read More >>

Cara Memasang Emoticon pada Blogger

0

Bookmark and Share
Apakah Anda suka dengan tampilan emoticon di blog, seperti telah memasang emoticon di kotak komentar dll, jika ya maka di sini ada tambahan untuk emoticon. Kali ini emoticon akan dipasang dalam halaman blogger. Karena blogger tidak terdapat layanan untuk ini maka kita harus membuatnya sendiri, berikut Cara Memasang Emoticon pada Blogger :

  1. Masuk ke template lalu edit HTML
  2. Beri tanda pada Expand Widget Templates 
  3. Setelah itu cari kode dibawah ini (Ctrl + F) :
    ]]></b:skin>
  4. Jika sudah ketemu copy code javascript di bawah, dan letakan dibawah kode ini ]]></b:skin>
    <script src='http://louislim2.googlepages.com/addSmiley.js ' type='text/javascript'/>
  5. Lalu Simpan
Standar kode smile yang bisa digunakan :
:) or :-)
:D or :-D
:$ or :-$
:( or :-(
:p or :-p
;) or ;-)
:k or :-k
:@ or :-@
:# or :-#
:x or :-x
:o or :-o

Selamat mencoba Cara Memasang Emoticon pada Blogger

Semoga bermanfaat :D

Read More >>
 
Tutorial Blogger Design by Trick and Tips Powered by Blogger