Cara Membuat Subscribe Box Bersebelahan Related Post

5

Cara Membuat Subscribe Box Bersebelahan Related Post

Tentu semua sudah sedia maklum apakah fungsi Subscribe box dan juga fungsi related post.Kedua-duanya mempunyai fungsi yang amat berguna yang akan memudahkan visitor kita nanti.Pada pendapat aku dengan membuat Subscribe Box bersebelah dengan Related Post akan membuatkan blog itu kelihatan lebih kemas dan tersusun.Korang rasa macam mana?..Sebenarnya kita juga boleh meletakkan benda lain bersebelahan dengan subscribe box contohnya seperti iklan dan lain-lain,korang boleh buat sendiri mengikut kreativiti korang sendiri.Tetapi Subscribe box dan Related post yang akan aku tunjukkan ini mungkin hanya bersesuaian Kepada mereka yang menggunakan fungsi read more sahaja.Dan kepada yang tidak menggunakan read more kalau nak cuba pun boleh cuma nanti mungkin kelihatan tak berapa cantikla.Ok kepada yang ingin cuba buat subscribe box bersebelahan dengan related post bolehla ikuti langkah-langkahnya dibawah.

Sila buat backup dahulu template korang supaya tidak timbul masalah nanti

1.Pergi ke Layout—>pilih edit Html

2.Kemudian cari kode ]]></b:skin> selepas itu anda copy dan pastekan kode dibawah ini diatas kode yang dicari tadi.

/* ---------------[ Related Posts on Single Post Page ]--------------- */ #related { background:#f4f4f4 url(http://img62.imageshack.us/img62/3792/dotl.gif) 45% 0 repeat-y; border:1px solid #e3e2e1; height:180px; padding:10px; margin:0 0 0 5px; } #related .related-posts { font-weight:bold; width: 53%; float:right; } #related .related-posts p { margin:0; } #related .related-posts h3, #related .related-posts h2, #related .related-posts h1 { margin:0; font-size:12pt; letter-spacing:0; } #related .related-posts ol { font-weight:normal; margin:2px 0 0 5px; } #related .subscribe { width: 43%; float:left; } #related .subscribe p.intro { font-weight:bold; } #related .subscribe p.feed { margin-bottom:10px; font-weight:bold; padding-left: 21px; background: url(http://img130.imageshack.us/img130/1448/feedicon16u.gif) 0px 50% no-repeat; } #related .subscribe form { margin:0; padding:0; }

3.Kemudian korang perlu copy Java Script untuk Related post ini dan upload ke hosting anda sendiri kemudian letakkan Javascript itu dibawah kode ]]></b:skin> .

Diingatkan file javascript akan membuatkan blog korang menjadi berat sewaktu proses loading nanti,kalau tak ada hosting sendiri boleh ikut macam yang aku buat sekarang.Sila refer sini untuk tahu lebih lanjut.

var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break; } } } } function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i]; } } relatedTitles = tmp2; relatedUrls = tmp; } function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false; } function printRelatedLabels() { var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; while (i < relatedTitles.length && i < 20) { document.write('

' + relatedTitles[r] + ''); if (r < relatedTitles.length - 1) { r++; } else { r = 0; } i++; } }

4.Langkah terakhir yang perlu korang buat ialah cari kode  <data:post.body/> kerana kita nak letakkan kode ini selepas read more dan kedudukannya dibawah post.Masih didalam kotak Edit Html cuma korang perlu berikan tanda centeng didalam kotak Expand Widget Templates itu.Selepas jumpa kode <data:post.body/> korang copy dan pastekan kode html ini dibawahnya.

<div id="related" class="clearfix"> <div class="related-posts"> <p>Related posts:</p> <ol><loop var="label" values="data:post.labels"><if cond="data:blog.pageType == &quot;item&quot;"><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/> </b:if></b:loop> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script></if></loop> <div class="subscribe"> <p class="intro">If you enjoyed this article, subscribe to receive more great content just like it.</p> <p class="feed"><a href="http://namablogkorang.blogspot.com/feeds/posts/default">Subscribe via RSS Feed</a></p> <form onsubmit="window.open(&amp;apos;http://feedburner.google.com/fb/a/mailverify?uri=idfeedburnerkorang&amp;apos;, &amp;apos;popupwindow&amp;apos;, &amp;apos;scrollbars=yes,width=550,height=520&amp;apos;);return true" method="post" action="http://feedburner.google.com/fb/a/mailverify" target="popupwindow"><input type="hidden" name="uri" /> <input type="hidden" name="loc" /> <input id="botsub" name="email" /> <input id="botsubbutton" type="submit" /> <br /><small>Your information will not be shared. Ever.</small> </form></div> </ol> </div> </div>

5.Kemudian save dan lihat hasilnya.

jangan lupa tukarkan yang aku tandakan dengan warna merah itu kepada alamat blog dan id anda sendiri.Tak berjaya buat boleh tinggalkan pertanyaan dibawah kita akan cuba selesaikan bersama-sama.

Read More

Cara memasang featured content slider di blogger

10

Cara memasang featured content slider di blogger

Adakah anda mahu memasang featured content slider di blog anda seperti yang sedang aku gunakan ini.Featured content slider yang ingin aku tunjukkan kepada anda ini adalah daripada Revolution Template yang telah dibuat oleh Brian Gardner. Kini telah terdapat banyak template yang mempunyai Featured Content slider seperti ini dan selalunya kita boleh tengok terdapat di Template Khasnya untuk pengguna Wordpress.

Lihat Demo Featured Content Slider.

Sebenarnya anda tidak perlu lagi untuk memasang Featured Content Slider ini kerana telah terdapat begitu banyak sekali template-template yang berasal daripada wordpress yang mempunyai slider telah diconvertkan kepada blogspot dan anda boleh dapatkannya dengan percuma seperti di bloganol.com,Voothemes,Cahayabiru,free wordpress blogger templates serta banyak lagi diblog-blog yang lain.Tetapi kebanyakkan Featured content slider ini hanya terdapat di template yang berstail Magazine dan aku pasti bukan semua orang  berminat untuk menggunakan template jenis Magazine ini jadi aku harap dengan Tutorial Cara memasang Featured content slider ini akan memudahkan kepada anda semua memasangnya di tempalte yang anda gemari.Jika anda rasa berminat dan ingin mencuba memasang featured content slider ini bolehlah ikuti langkah-langkahnya dibawah.

P/S:Untuk memasang Featured content slider ini aku nasihatkan supaya anda gunakan hosting anda sendiri ini bagi membuatkan slider anda itu berfungsi dengan baik tetapi aku tahu tidak semua orang yang memiliki hosting untuk menyimpan javascript jadi anda boleh cuba menggunakan hosting yang free seperti   di Hotlinkfiles dan Opendrive.Mungkin banyak lagi terdapat free hosting yang menyediakan direct link nanti aku akan cuba untuk membuat Research dan membuat satu list supaya senang untuk anda semua upload file Javascript di hosting anda sendiri secara percuma.Kepada sesiapa yang tahu tempat untuk menyimpan fail js selain yang aku sebutkan ini bolehlah share dengan semua ya.

1.download dan Upload semula Js file dan Css ini ke hosting anda sendiri.

Mootools.js

Jd.Gallery.js

Jd.gallery.Css

2.Setelah siap upload sekarang anda perlu memanggil semula File Js dan juga Css itu dan diletakkan di dalam blog anda.Buat seperti dibawah.

<script src='http://linkurlanda/Mootools.js'type='text/javascript'/>
<script src='http://linkurlanda/Jd.Gallery.js'type='text/javascript'/>
<link href='http://linkurlanda/Jd.gallery.css' media='screen' rel='stylesheet' type='text/css'/>

kemudian anda cari kode <head> dan pastekan File Js dan Css ini dibawahnya.Kemudian kilk save.

3.Setelah itu anda perlu buat gambar yang ukurannya bersesuainya dengan kehendak anda dan berpadanan dengan blog anda itu.Contoh aku buat gambar yang berukuran 400x196.Dan aku nak ingatkan kepada anda supaya tidak membuat  terlalu banyak gambar dan tidak terlalu besar ukurannya ini untuk mengelakkan blog anda menjadi lambat disaat loading.Anda boleh upload gambar anda di photobucket,imageshack,picasa,Tinypic dan lain-lain.

contoh gambar

  

4.Kemudian anda cari kode <div id='main-wrapper'> dan copy dan pastekan kode dibawah ini dibawahnya.Kemudian klik save.Tetapi Sebelum anda memasukkan kode dibawah ini anda perlu memasukkan link url gambar anda disimpan,Target link dan singkatan daripada artikel anda terlebih dahulu.Sila lihat contohnya dibawah.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='featured'>
<style>
#myGallery, #myGallerySet, #flickrGallery {
width: 400px;
height: 190px;
z-index:5;
border: 1px solid #000;
}

.jdGallery .slideInfoZone
{
position: absolute;
z-index: 10;
width: 100%;
margin: 0px;
left: 0;
bottom: 0;
height: 85px;
background: #000;
color: #fff;
text-indent: 0;
overflow: hidden;
}
</style>

    <script type='text/javascript'>
        function startGallery() {
            var myGallery = new gallery($(&#39;myGallery&#39;), {
                timed: true
            });
        }
        window.addEvent(&#39;domready&#39;,startGallery);
    </script>

<div id='myGallery'>
                               <div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div
                <div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div

                <div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div

<div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div
        <div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div
</div>

</div>
</b:if>

 

contoh yang aku buat>

<div class='imageElement'>
            <h2>pic 1</h2>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec a pede et erat fringilla aliquet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nunc vel urna. Vestibulum id nisi eget lectus tempor tincidunt.</p>
            <a class='open' href='http://arieyblog.blogspot.com/' title='Read More'/>
            <img class='full' src='http://i530.photobucket.com/albums/dd350/dadumerah79/porschedes6.jpg'/>
            <img class='thumbnail' src='http://i530.photobucket.com/albums/dd350/dadumerah79/porschedes6.jpg'/>

</div>

dan dibawah ini apa yang perlu anda tukarkan>

<div class='imageElement'>
           <h2>Tajuk Artikel anda</h2>
           <p>Singkatan daripada artikel anda </p>
           <a class='open' href='target link anda' title='Read More'/>
           <img class='full' src='Link url gambar anda disimpan'/>
           <img class='thumbnail' src='Link url gambar anda disimpan'/>
       </div>

dan kode dibawah ini pula adalah untuk saiz tinggi dan lebar featured content slider ini anda boleh menukarkanya mengikut kesesuain blog anda

#myGallery, #myGallerySet, #flickrGallery {
width: 400px;
height: 190px;
z-index:5;
border: 1px solid #000;

5.Selesai.selamat mencuba aku ucapkan.

Read More

Cara Membuat Image Hover Effect dengan Javascript di blogspot

10

Cara Membuat Image Hover Effect dengan Javascript di blogspot

Sebenarnya banyak cara untuk membuat image hover tetapi aku lagi tertarik untuk menunjukkan bagaimana cara untuk membuat image hover ataupun lebih sinonim dipanggil mouseover image effect dengan menggunakan Javascript.Kenapa aku memilih untuk menunjukkan cara membuat image hover/mouseover image effect ini dengan Javascript ini adalah kerana effect yang terjadi kepada image lebih cantik berbanding dengan cara membuat image hover/mouseover image effect dengan menggunakan Css.Kepada anda yang masih tidak tahu apakah dia image hover/mouseover image effect itu boleh tgk demonya disini.®

Anda hanya perlu lalukan mouse anda itu diatas image tersebut kemudian anda akan dapati image itu akan menjadi kabur dan kemudian terang seperti sediakala.Bagaimana rasa berminat tak nak cuba?.sila ikuti langkah-langkah untuk membuat image hover/mouseover image effect dengan Javascript ini dibawah.

1.Login ke dashboard

2.Kemudian pilih layout► Edit HTML.

3.Selepas itu anda cari kode </head> kemudian copy dan pastekan Javascript dibawah ini diatasnya.

<script src='http://sites.google.com/site/ariey79site/javascript/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;.post img&quot;).fadeTo(&quot;slow&quot;, 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(&quot;.post img&quot;).hover(function(){
$(this).fadeTo(&quot;slow&quot;, 0.7); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo(&quot;slow&quot;, 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;.latest_img&quot;).fadeTo(&quot;slow&quot;, 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(&quot;.latest_img&quot;).hover(function(){
$(this).fadeTo(&quot;slow&quot;, 0.7); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo(&quot;slow&quot;, 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>

4.Kemudian anda klik save.Selesai cubalah tengok samaada menjadi atau tidak.

Apa pendapat anda tentang semua tutorial yang aku tunjukkan selama ini adakah membantu anda atau tidak?..Perlukah blog ini menjadi seperti blog-blog yang lain hanya bercerita tentang isu-isu terkini serta cerita-cerita peribadi sahaja.Jika ya aku akan stop membuat tutorial dan hanya bercerita tentang isu-isu terkini sahaja.Masih dalam MOOd kecewa setelah Si Kijang telah dijinakkan oleh Si Rusa Semalam.Beli Tiket dengan harga Rm40 satu berbaloi-baloi..

Read More

Cara membuat Guestbook di blogspot

20

Cara membuat Guestbook di blogspot

Jika anda mempunyai blog sudah tentu anda menginginkan {FEEDBACK} daripada pengunjung-pengunjung di blog anda.Dengan adanya {FEEDBACK} daripada pengunjung-pengunjung ke blog anda itu sudah tentu sedikit sebanyak anda akan dapat menilai  hasil penulisan anda itu samaada disukai ataupun dibenci oleh mereka .Disamping itu dengan adanya guestbook juga tentu lebih menyenagkan pengunjung-pengunjung di blog anda membuat Spam blogwalking bertanya khabar berita.Oleh itu pada kali ini aku akan tunjukkan bagaimana cara untuk membuat Guestbook khasnya di blogspot.Untuk membuat Guestbook anda boleh gunakan Shoutmix ataupun Cbox .Walaupun sudah ramai dikalangan anda yang menggunakan Shoutmix dan juga Cbox tetapi kedudukan Shoutmix dan juga Cbox itu tidak terlalu bergaya jadi aku akan tunjukkan cara yang lebih bergaya untuk meletakkannya supaya lebih kelihatan seperti Guestbook..

Lihat Demo Guestbook..

Bagaimana suka tak?..Kalau berminat nak buat boleh ikuti cara-caranya dibawah.

1.Pergi ke layout.

2.Klik add a gadget;kemudian pilih HTML/JavaScript.

3.Kemudian anda copy semua JavaScript dibawah ini dan pastekan didalam HTML/JavaScript itu.

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i530.photobucket.com/albums/dd350/dadumerah79/tabs-1.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()">   </div>

<div class="gbcontent">

----------------sila tukarkan dengan kode Shoutmix atau Cbox anda--------------------

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe scrolling="auto" width="160" frameborder="0" src="http://www5.shoutmix.com/?ariey79" height="400" title="ariey79">
<a href="http://www5.shoutmix.com/?ariey79">View shoutbox</a>
</iframe>
<br/><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br/>
<!-- End ShoutMix –>

------------------------------------------------------------------------------------------------------

<div style="text-align:right">
<a href="javascript:showHideGB()">
[Closed]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

4.Kemudian Klik Save.Selesai

Ada masa aku tunjukkan bagaimana nak membuat Guestbook dengan versi lain pula.

Read More

Cara membuat Table Of Contents di blogspot

6

Cara membuat Table Of Contents di blogspot

Pada post aku yang terdahulu aku ada menunjukkan bagaimana cara untuk membuat show all post atau table of content,sila rujuk disini tetapi cara yang aku tunjukkan itu tidak terlalu detail kerana hanya menunjukkan kesemua post yang telah dibuat didalam blog kita sahaja dan untuk memasangnya mungkin agak sukar kepada yang kurang mahir bermain dengan kode.Tetapi kini telah terdapat cara yang lebih mudah untuk membuat table of contents di blogspot.Cara membuat table of contents yang baru ini telah direka oleh Abu Farhan dan tentu sahaja rekaan beliau amat berguna kepada pengguna-pengguna blog di blogspot.

Dengan adanya Table of content rekaan Abu Farhan ini akan dapat memudahkan visitor diblog anda mencari post-post anda yang terdahulu dan sudah tentu dapat menjimatkan masa mereka mencari post yang mereka inginkan.Terdapat dua cara untuk menunjukkan kesemua post anda itu yang pertama menunjukkan kesemua post dengan label dan yang kedua menunjukkan kesemua post dengan tarikh.Lihat contoh table of content dengan label disini. Sila ikuti langkah-langkah untuk membuatnya dibawah.

1-Membuat table of Content dengan label

<script style="text/javascript" src="http://sites.google.com/site/ariey79site/javascript/blogtoc-min.js"></script>
<script src="http://arieyblog.blogspot.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc"></script>

2-Membuat Table Of Content dengan tarikh

<script src="http://sites.google.com/site/ariey79site/javascript/tocbyarchivemin.js">
</script>
<script src="http://arieyblog.blogspot.com/feeds/posts/default?max-results=500&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Cara menggunakannya.

Anda hanya perlu copy salah satu javascript yang diatas ini samaada mahu menggunakan table of content dengan label atau tarikh .Sebelum itu sila tukarkan link url yang aku tandakan dengan warna merah itu kepada link blog anda.

<script style="text/javascript" src="http://sites.google.com/site/ariey79site/javascript/blogtoc-min.js"></script><script src=http://link blog anda.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc></script>

kemudian anda pergi ke dashboard dan buat satu post yang baru

Selepas itu anda pastekan salah satu javascript table of content itu contohnya aku buat untuk label.Sila pilih EDIT HTML semasa anda mahu membuat post itu.

Setelah itu anda hanya perlu publish kan sahaja post anda itu.kemudian anda lihat semula samaada menjadi atau tidak.Aku ucapkan selamat berjaya kepada anda.

Read More

Alternatif menggunakan javascript tanpa hosting.

16

Alternatif menggunakan javascript tanpa hosting.

Adakah di dalam blog anda ada menggunakan javascript?.Javascript digunakan untuk membuat pelbagai jenis special efek yang mungkin berguna untuk mencantikkan blog kita.Contoh javascript yang aku gunakan didalam blog ini ialah auto readmore dengan thumbnail image.Dengaan adanya javascript ini akan lebih memudahkan kerja kerana tidak memerlukan kita memotong ayat secara manual.Walaubagaimanapun penggunaan Javascript ini juga ada terdapat sedikit kelemahannya seperti akan melambatkan sedikit loading blog jika didalam blog itu terdapat terlalu banyak javascript.Punca terjadinya kelembapan sewaktu proses loading ini adalah kerana menggunakan hosting yang percuma dan hanya mendapat limited bandwitch.Perkara ini mungkin tidak terjadi jika anda mempunyai hosting sendiri.Tetapi aku akan menunjukkan Alternatif cara menggunakan javascript tanpa memerlukan hosting.

Adakah anda tahu yang kita boleh memasukkan javascript itu terus kedalam kode HTML didalam template kita.Dibawah ini adalah cara yang biasa kita gunakan untuk memasukkan javascript dengan menggunakan hosting.

Pergi ke layout—>Edit HTML

<script src='http://URL-JAVASCRIPT-ANDA.js' type='text/javascript'></script>

letakkan sebelum kode </head>

Dibawah ini pula cara untuk memasukkan javascript kedalaman template tanpa menggunakan hosting.

Pergi ke Layout—>Edit HTML

Copy kode dibawah ini

<script type='text/javascript'>
//<![CDATA[
your fulljavascript code here
//]]>
</script>

Dan letakkan juga sebelum kode </head>

Read More

Cara memasang Slider seperti Zinmag Primus template

18

Cara memasang Slider seperti Zinmag Primus template

Adakah anda mahukan slider seperti Zinmag Primus Template berada didalam blog anda?Cuba anda lihat disini untuk melihat contoh slider yang aku maksudkan itu.

Anda nampak tak gambar yang bergerak-gerak itu?.Itulah yang dinamakan slider yang diambil dari Zinmag Primus Template.Tetapi untuk sesetengah template mungkin lebar slider ini terlalu besar atau kecil jadi anda perlu mengubah lebarnya itu.Jika anda berminat untuk meletakkannya didalam blog anda bolehlah ikuti caranya untuk membuatnya dibawah.

1.Cari kode ini ]]></b:skin> dan letakkan kode dibawah ini diatas kode ]]></b:skin> tadi.

#slider {
background:url(http://i530.photobucket.com/albums/dd350/dadumerah79/tryslider.png);
height: 254px;
overflow: hidden;
position: relative;
margin: 5px 0;
}

#mover {
width: auto;
position:absolute;
overflow:hidden;
}

.slide {
padding: 20px 0px;
width: 1000px;
float: left;
position: relative;
height:200px;
}

.slide h2 {
font-family:georgia, Helvetica, Sans-Serif;
font-size: 22px;
color: #A04075;
padding:0px 0px 0px 30px;
margin:0px 0px;
width:500px;
overflow:hidden;
}

.slide h2 a:link, .slide h2 a:visited {
color:#fff;
background-color: transparent;
}

.slide h2 a:hover {
color: #ddd;
background-color: transparent;
}

span.slmet {
color: #A04075;
font-size: 10px;
font-family:Tahoma, georgia, Helvetica, Sans-Serif;
line-height: 20px;
width: 500px;
padding:0px 0px 0px 30px;
margin:0px 0px;
text-transform:uppercase;
}
.slide p {
color: #999;
font-size: 12px;
font-family:georgia, Helvetica, Sans-Serif;
line-height: 20px;
width:500px;
padding:0px 0px 0px 30px;
margin:0px 0px;
}

.slide img {
position: absolute;
top: 20px;
left: 577px;
background:#fff;
padding:10px 10px;
}

#slider-stopper {
position: absolute;
font-family: Georgia, Helvetica, Sans-Serif;
top: 113px;
right: 10px;
color: #A04075;
padding: 3px 8px;
font-size: 13px;
text-transform: uppercase;
z-index: 1000;
}

2.Kemudian letakkan kode javascript ini dibawah ]]></b:skin>

<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/jquery-1.2.6.min.js' type='text/javascript'/>
<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/slider.js' type='text/javascript'/>
<script type='text/javascript'><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("catmenu").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>

3.Kemudian cari kode ini <div id='content-wrapper'>

P/S: sesetengah template mungkin berlainan kode <div id='content-wrapper'> ini jadi anda perlu kode yang bersesuaian untuk meletakkan kode slide itu.Contohnya mungkin ada yg begini <div id='header-wrapper'>

kemudian anda copy kode dibawah ini dan letakkan dibawah kode <div id='content-wrapper'> .

<!-- Slider -->
<div id='slider'>
<div id='mover'>

<div class='slide'>
<h2><a href='#' title='Superbowl'>Superbowl</a></h2>
<span class='slmet'> Posted by Ariey On December - 1 - 2008 </span>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. ...</p>
<img alt='' height='120' src='http://web2feel.com/monezine/wp content/uploads/2008/12/stad.jpg width='250'/>

</div>
<div class='slide'>
<h2><a href='#' title='Bond with a vengeance'>Bond with a vengeance</a></h2>
<span class='slmet'> Posted by Ariey On December - 1 - 2008 </span>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. ...</p>
<img alt='' height='120' src='http://web2feel.com/monezine/wp-content/uploads/2008/12/bond.jpg width='250'/>
</div>

</div>
</div>
</div>
<div class='clear'/>

4.Selesai.Semoga berjaya. Jika sesiapa yang mahukan template yang aku dah edit ini anda boleh contact aku ye isikan contact me form itu.Jika anda masalah untuk memasangnya jangan berasa segan silu untuk bertanya.

P/s:Apa yang perlu diubah

Lebar slider

#slider {
background:url(http://i530.photobucket.com/albums/dd350/dadumerah79/tryslider.png);
height: 254px;
overflow: hidden;
position: relative;
margin: 5px 0;
}

Creadit To: O-om.com

Read More

Meletakkan Widget Technorati link Reaction dibawah post

2

Meletakkan Widget Technorati link Reaction dibawah post

Widget technorati link digunakan untuk mengetahui berapakah jumlah reaksi yang telah anda dapat setelah orang ramai link kepada post yang telah anda buat.Tetapi widget yang asal yang diberikan oleh Technorati itu hanya akan dapat menunjukkan keseluruhan link untuk kesemua post anda tetapi dengan cara yang telah dibuat oleh blogger hack anda akan dapat mengetahui berpakah jumlah reaksi link yang telah anda dapat untuk setiap satu post yang telah dibuat oleh anda itu jadi dengan cara ini anda akan dapat mengetahui post apakah yang paling digemari oleh orang ramai.

Jika anda berminat untuk meletakkan widget Technorati link Reaction ini anda boleh ikuti langkah-langkah untuk membuatnya di bawah.

1.Pergi ke layout—>Edit HTML(berikan tanda di dalam kotak expand template widget)

2.Kemudian anda cari kode ini <data:post.body/>

3.Selepas itu anda copy semua script di bawah ini dan pastekan di bawah kode yang anda cari tadi.

<script src='http://embed.technorati.com/linkcount' type='text/javascript'/>
<a class='tr-linkcount' expr:href='&quot;http://technorati.com/search/&quot; + data:post.url ' id='technauthority' style='background: url(http://static.technorati.com/static/css/img/icn/talkbubble.png) no-repeat; background-position:right; padding-right:20px;' target='_blank'>View blog reactions</a>

4.Selesai.Semoga berbanga dengan status anda sebagai blogger.

Read More

Create Zoom Effect Untuk Image di blogger.

0

Create Zoom Effect Untuk Image di blogger.

Hari ini aku nak tunjukkan bagaimana cara untuk kita membuat zoom effect untuk image didalam blog khususnya kepada mereka yang menggunakan platform blogger.Tujuan membuat zoom effect ini adalah kerana image yang akan dizoom itu akan kelihatan lebih menarik dan dapat menyerlahkan lagi penampilan didalam blog anda.Untuk melihat contoh zoom effect untuk image ini berfungsi anda boleh lihat disini

Bagaimana berminat tak untuk membuatnya didalam blog anda.Jika anda rasa berminat sila ikuti langkah-langkah untuk membuatnya dibawah.

langkah 1
Pergi ke layout->Edit Html.Kemudain cari kode ini

</b:skin>

Langkah 2
anda copy semua script dibawah ini dan pastekan di bawah

</b:skin>

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<script language='Javascript' type='text/javascript'>
var cssNode = document.createElement(&#39;link&#39;);
cssNode.type = &#39;text/css&#39;;cssNode.rel = &#39;stylesheet&#39;;
cssNode.href = &#39;http://h1.ripway.com/ane73/lightbox.css&#39;;
cssNode.media = &#39;screen&#39;;
cssNode.title = &#39;using lightbox 2 with GPC&#39;;
document.getElementsByTagName(&quot;head&quot;)
[0].appendChild(cssNode);
</script>

<script src='http://h1.ripway.com/ane73/prototype.js' type='text/javascript'/>

<script src='http://h1.ripway.com/ane73/scriptaculous.js?load=effects,builder' type='text/javascript'/>

<script src='http://h1.ripway.com/ane73/lightbox.js' type='text/javascript'/>
</b:if>

Langkah 3
anda perlu uploadkan image anda itu terlebih dahulu ke hosting yang menyimpan gambar contohnya photobucket.Kemudian anda copy link url image anda dan letakkan di tempat yang aku tandakan dengan warna merah dibawah.

<div style="text-align: center;"><a href="http://linkurlimageanda/" rel="lightbox"><img style="width: 110px; display: inline; height: 110px; margin-left: 0px; margin-right: 0px;" src="http://linkurlimageanda/" align="left" border="0" /></a> </div>

Langkah 4
Setelah siap anda letakkan link untuk image anda itu,anda copy semua kode tadi dan pastekan di posting area anda.Siap dan lihat hasilnya semoga anda berjaya membuatnya.

Read More

Cara Membuat Automatik Thumbnail dan Read More.

11

Cara Membuat Automatik Thumbnail dan Read More.

Pada artikel yang lepas aku telah menunjukkan bagaimana cara hendak membuat read more.sila lihat disini.Tetapi cara membuat read more yang aku tunjukkan dulu memerlukan kita memotong ayat secara manual jadi ini tentu serba sedikit akan menyukarkan anda untuk membuatnya.Tetapi cara yang akan aku tunjukkan ini tidak memerlukan kita memotong ayat lagi kerana ianya akan memotong ayat dalam artikel kita secara automatik dan sekaligus akan mengecilkan gambar jika anda ada meletakkan gambar didalam artikel yang ditulis oleh anda itu.Cuba lihat screenshoot di bawah untuk mengetahui lebih lanjut bagaimana Automatik Thumbnail dan Read More ini berfungsi.

Gambar sebelum membuat Automatik Thumbnail dan Read More

Gambar selepas membuat Automatik Thumbnail dan Read More

Sila ikuti langkah-langkah untuk membuatnya dibawah.

Sila lakukan backup keatas template anda sebelum membuatnya.

1.Pergi ke Layout----> Edit HTML

2.Berikan tanda didalam kotak "Expand Widget Templates"

3.Cari kode dibawah ini.Tekan CTR+F untuk cari

<data:post.body/>

4.Bila dah jumpa sila gantikan kode yang anda cari tadi dengan kode yang dibawah ini.

<script type='text/javascript'> summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://kfile.110mb.com/summary-post.js' type='text/javascript'/> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script> <span class='rmlink' style='float:right'><a expr:href='data:post.url'>Read more</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

5.Kemudian klik save.Selesai

p/s:Sila tinggalkan pertanyaan didalam kotak komen jika anda mempunyai masalah untuk membuatnya.

Read More

Cara membuat Rotating Banner

4

Cara membuat Rotating Banner

Adakah anda mempunyai masalah tidak mempunyai cukup ruang untuk meletakkan banner di dalam blog anda?.Jika ya tentu dengan membuat rotating banner ini akan dapat menyelesaikan masalah anda itu.Dengan membuat rotating banner anda akan dapat meletakkan lebih banyak banner di satu kawasan.Semua banner yang anda letakkan ini akan bertukar apabila setiap kali visitor di blog anda melakukan reload ataupun refresh di dalam halaman blog anda.Contohnya anda boleh lihat banner aku yang berukuran 468 X 60 tu dan cuba anda reload ataupun refresh blog aku dan lihat banner itu akan bertukar.Tetapi rotating banner ini hanya akan berhasil untuk image banner sahaja dan tidak akan brhasil untuk text banner.Jika berminat anda boleh melihat cara-cara untuk membuat rotating banner ini di bawah.
1.Anda perlu copy dan pastekan script dibawah ini di kawasan yang anda mahu banner anda itu kelihatan.Contohnya aku letakkan di headerright.

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var jumlah_iklan = 3;
var waktu_sekarang = new Date()
var detik = waktu_sekarang.getSeconds()
var pasang_iklan = detik % jumlah_iklan;
pasang_iklan +=1;
if (pasang_iklan==1) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
if (pasang_iklan==2) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
if (pasang_iklan==3) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
document.write('<center>');
document.write('<a href=\"' + url + '\" target=\"_top\">');
document.write('<img src=\"' + banner + '\" width=')
document.write(width + ' height=' + height + ' ');
document.write('alt=\"' + alt + '\" border=0><br>');
document.write('<small>' + txt + '</small></a>');
document.write('</center>');
// End -->
</SCRIPT>

2.Untuk menggunakan rotating banner ini anda hanya perlu tukarkan Alamat Urlnya sahaja.
Contoh banner yang aku sedang pakai

if (pasang_iklan==1) {
txt="Earn Money From Linkworth";
url=" http://www.linkworth.com?a=22220 ";
alt="Alamat URL";
banner="http://www.linkworth.com/adm/affiliate_manager/affiliate_banners/bann-36.gif";
width="468";
height="60";
}

3.Script kode diatas adalah untuk 3 banner sahaja jika anda mahu meletakkan lebih banyak banner anda hanya perlu tambahkan kode scriptnya sahaja.Sila tukarkan no pasang iklan itu kepada no 4 jika anda mahu letakkan 4 banner dan no seterusnya jika lebih.

if (pasang_iklan==4) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}

dan sila tambahkan no di jumlah iklan itu juga untuk keseluruhan iklan

var jumlah_iklan = 4;
var waktu_sekarang = new Date()
var detik = waktu_sekarang.getSeconds()
var pasang_iklan = detik % jumlah_iklan;

4.Selesai.Semoga berjaya.

creadit to o-om.com

Read More

Compress Javascript anda di Banana.com

0

Compress Javascript anda di Banana.com

Adakah anda meletakkan terlalu banyak script di dalam blog anda.Salah satu penyumbang kepada
lambatnya blog anda untuk di buka adalah kerana terlalu banyak script.Dan di blog aku juga tidak terkecuali terkena musibah ini.Tetapi tidaklah sampai kena tunggu sampai 2-3 minit untuk dibuka kesemuanya walaupun aku memakai snailmyx streamyx 60 combo aku dapat loading semua blog aku dalam masa beberapa saat sahaja jadi haraplah bersabar jika memasuki blog aku ya.Nak buat macam mana aku terlalu minat nak pakai template Revolution Chrunch megazine ni hehe.Tapi template ni pun tak tahu berapa lama boleh bertahan.Tunggu jelah.Kita sambung tajuk kita yang diatas tadi kembali di banana.com anda boleh mengecilkan sedikit saiz script anda tetapi mungkin hanya support kepada file js sahaja.Jadi dengan mengecilkan sedikit file js akan dapat membantu mengurangkan sedikit kelembapan blog anda sewaktu proses loading.Jadi jika anda berminat untuk mencubanya boleh ikuti caranya di bawah.

1.pergi ke laman web banana.com

2.Browse file js anda di dalam pc untuk di upload ke banana.com

3.Kemudian anda klik compress.

4.Gambar dibawah menunjukan file js anda sedang di compress yang mengambil masa hanya 9 seconds.

5.Cuba anda lihat saiz asal file js yang aku compress adalah 24754 bytes.

kemudian apabila sudah selesai compress saiznya sudah mengurang kepada 7121 bytes.
Jadi sudah dapat mengecilkan file js anda sebanyak 17633 bytes.

6.Kemudian anda klik download untuk memuat turun file js anda yang telah siap di compress tadi.

selamat mencuba.

Read More

Buat Animated Window Opener dengan Script

0

Buat Animated Window Opener dengan Script

Untuk Apakah Animated Window Opener dibuat?
Tujuan Animated Window Opener dibuat ialah untuk menghubungkan link ke website atau Url yang lain dari blog kita dalam bentuk animasi.Memang kaedah untuk membuat pautan link pun sudah ada di dalam blogger,tapi pautan itu adalah berbentuk seperti biasa sahaja tetapi dengan Script Animated Window Opener ini pautan untuk pergi ke url lain akan lebih nampak menarik.Apabila kita klik pautan link ke
sesuatu address ia akan terbuka sedikit demi sedikit dan nampak seperti Profesional.Jika anda rasa berminat untuk memakai script Animated Window Opener bolehlah ikuti Tutorialnya dibawah.
1.Anda copy semua Script di bawah ini.Tekan CTR+C untuk copy.

<script>
<!--
var winheight=100
var winsize=100
var x=5
/*
Animated Window Opener Script (updated 00/04/24)-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions, 100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/
function openwindow(thelocation){
temploc=thelocation
if (!(window.resizeTo&&document.all)&&!(window.resizeTo&&document.getElementById)){
window.open(thelocation)
return
}
win2=window.open("","","scrollbars")
win2.moveTo(0,0)
win2.resizeTo(100,100)
go2()
}
function go2(){
if (winheight>=screen.availHeight-3)
x=0
win2.resizeBy(5,x)
winheight+=5
winsize+=5
if (winsize>=screen.width-5){
win2.location=temploc
winheight=100
winsize=100
x=5
return
}
setTimeout("go2()",50)
}
//-->
</script>
<p><a href="javascript:openwindow('http://twitter.com/ariey79')">Follow Me On Twitter</a>
<p><a href="javascript:openwindow('http://aikonblog.blogspot.com')">Free Software</a>

Yang ditanda warna hijau Anda Boleh tukarkan kepada link url dan nama link yang anda mahukan.
2.kemudian anda pergi ke Layout-Page element.

3.Setelah itu anda klik Add A Gadget dan pilih HTML/Java Script
4.Anda pastekan script yang anda copy tadi kedalam Ruang HTML/Java Script itu.
5.Selesai.Semoga berjaya.
6.Contoh Animated Animated Window Opener

  Creadit to www.dynamicdrive.com

Read More

Bagaimana nak buat disable text selection

11

Bagaimana nak buat disable text selection

Dalam post aku yang lepas aku ada tunjukkan macammana nak buat disable right klik bertujuan untuk mengelakkan artikel kita daripada di copy paste oleh orang lain, Tetapi cara itu mungkin tidak berhasil kerana hanya right klik sahaja yang disable tetapi orang masih lagi boleh copy artikel kita dengan menekan CTR+C.Hari ini aku akan cuba tunjukkan bagaimana cara nak buat disable text selection di dalam blog kita

Apakah Fungsi disable text selection?

Fungsi disable text selection ialah orang tidak akan boleh highlight artikel anda dan tidak boleh copy walaupun menggunakan CTR+C.Tentu orang yang tidak suka artikelnya dicopy paste sekarang akan berasa sangat teruja untuk membuatnya.betul tak?Sebenarnya aku tak kisah sangat kalau orang nak copy paste artikel kita kerana itu menunjukkan artikel kita bagus dan mungkin sesetengah newbie tidak tahu bagaimana nak bermula menulis artikel macam akulah(pelan-pelan kayuh)..jadi teknik copy dan paste ini sedikit sebanyak dapat membantu mereka dari segi penulisan.dan apabila sudah agak mahir mereka sudah boleh menulis artikel sendiri tanpa copy dan paste dari blog orang lain lagi. Cuma diminta kepada yang copy dan paste itu berikanlah backlink semula ke blog yang diambil artikel itu ya..barulah kita dalam situasi menang menang bukan gores dan menang ya muhahaha.Tetapi sebenarnya bagi aku copy dan paste artikel dari blog orang lain ke dalam blog kita tidak dapat memberi kepuasan kerana cara peyampain yang berbeza dan artikel itu juga bukan dari hasil kita sendiri.Tapi itu semua terpulanglah kepada pendapat individu.Jadi kepada sesiapa yang berasa hendak copy paste artikel diblog aku disilakan tapi tlg bagi backlink ke blog aku ok itupun kalau ada yang nak copy macam takde je.Kepada yang tak suka artikel dia dicopy dan paste boleh ikuti tutorial bagaimana nak disable text selection dibawah.

1.Mula-mula anda copy semua script di bawah ini.Tekan CTR+C untuk Copy

<script type="text/javascript">
/***********************************************
* Disable Text Selection script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
target.style.MozUserSelect="none"
else //All other route (ie: Opera)
target.onmousedown=function(){return false}
target.style.cursor = "default"
}

//Sample usages
//disableSelection(document.body) //Disable text selection on entire body
//disableSelection(document.getElementById("mydiv")) //Disable text selection on element with id="mydiv"

</script>


<script type="text/javascript">
disableSelection(document.body) //disable text selection on entire body of page
</script>

2.Pergi ke layout/page element


3.Kemudian pergi ke add a gadget


4.Pilih HTML/JavaScript.Dan pastekan script yang anda copy tadi kedalam ruang HTML/JavaScript itu.


5.Kemudian dengan rasminya blog anda sudah menjadi zon larangan Copy dan Paste.Selesai.

Aku harap tutorial ini dapat membantu anda menyelesaikan masalah artikel anda dicopy paste.Tolong tinggalkan komen disini jika tutorial yang aku bagi ini menjadi.Sekadar untuk pengetahuan aku ok.semoga ceria selalu di arieyblog.

Thanks to dynamicdrive for this script.

Read More

Buat disable Right Klik Di blog anda.

4

Buat disable Right Klik Di blog anda.

Adakah anda sudah mengetahui cara untuk disable right klik di dalam blog anda?..
Jika belum hari ini aku akan tunjukkan caranya bagaimana cara untuk membuat disable right klik.macammana disable right klik itu..ok cuba anda klik mouse anda sebelah kanan..Jangan risau mouse anda tidak mengalami kerosakkan cuma aku dah disablekan penggunaan right klik di blog ini.

Untuk apa kita nak disable right klik.?
Salah satu tujuannya adalah kerana tidak mahu orang lain menciplak karya yang dihasilkan oleh anda.Tentu Anda merasa bengang kerana anda yang bertungkus lumus menyiapkan artikel orang lain hanya copy dan paste sahaja kedalam blog mereka.Tetapi bukan bermaksud dengan disable right klik orang lain sudah tidak boleh untuk copy artikel anda,masih ada cara lain untuk copy artikel anda dengan menggunakan keyboard,tetapi susahlah sikit jika dengan menggunakan mouse.Ini hanya sekadar untuk peringatan kepada mereka yang suka sangat copy dan paste itu supaya janganlah asyik copy dan paste sahaja cubalah menaip ayat sendiri banyak manafaat yang kita dapat dengan menaip.Ok kepada anda yang ingin cuba membuat disable right klik ini boleh ikuti tutorial yang aku buat dibawah.

1.Anda copy semua script yang ada didalam kotak ini.

<script language=JavaScript>
<!--

//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com

var message="Function Disabled!";

///////////////////////////////////
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>

2.kemudian anda pergi ke layout kemudian klik page elements.



3.Pergi ke add a gadget..cari HTML/Javascript kemudian pastekan semua script yang anda copy tadi kedalam kotak itu.Cuba klik jadi tak.





4.Selesai


Apa komen anda tentang orang yang suka copy dan paste ini.Adakah betul atau tidak apa yang mereka buat itu.Berikan komen anda dibawah

Read More

Macammana nak buat Title Time Script.

0

Macammana nak buat Title Time Script.

Hai..Apa khabar anda semua,diharap anda semua sihat sejahtera.Hari ini aku nak tunjukkan kepada anda macammana kita nak buat Title Time Script.Untuk pengetahuaan anda Title Time Script ini akan menunjukkan kepada kita waktu secara live semasa kita sedang menggunakan internet.Senang ceritala Tittle Time Script ini adalah jam yang boleh kita letakkan di Tittle Browser kita.Mungkin tidak berguna sangat kerana di komputer anda pun sudah mempunyai jam tetapi bolehla anda buat untuk menunjukkan yang anda ni nampak macam kreatif sikit.. Ok jika anda rasa berminat nak buat boleh ikuti caranya seperi di bawah ini.

1.Anda Copy semua yang ada didalam kotak ini.

<script language="JavaScript"><!-- Hide /* This script was written by Mike Cullen, 1999 Featured on Dynamic Drive (dynamicdrive.com) For full source code, installation instructions and many more DHTML scripts Visit Dynamicdrive.com */ var scroller; var ampm; var actualtitle=document.title+" " function antiMilitaryTime() { if (hr == "12"){ ampm="P.M." } else if (hr == "13"){ hr="1" ampm="P.M." } else if (hr == "14"){ hr="2" ampm="P.M." } else if (hr == "15"){ hr ="3" ampm="P.M." } else if (hr == "16"){ hr = "4" ampm="P.M." } else if (hr == "17"){ hr = "5" ampm="P.M." } else if (hr == "18"){ hr = "6" ampm="P.M." } else if (hr == "19"){ hr = "7" ampm="P.M." } else if (hr == "20"){ hr = "8" ampm="P.M." } else if (hr == "21"){ hr = "9" ampm="P.M." } else if (hr == "22"){ hr = "10" ampm="P.M." } else if (hr == "23"){ hr = "11" ampm="P.M." } else if (hr == "24"){ hr = "12" } } function addZero(){ if (min <= "9"){ min = "0"+min } if (sec<= "9"){ sec = "0"+sec } if (hr <=9){ hr = "0"+hr } } function time(){ dt=new Date() sec=dt.getSeconds() hr=dt.getHours() ampm="A.M." min=dt.getMinutes() } function scroll() { time() antiMilitaryTime() addZero() var scroller="TIME: "+hr+":"+min+":"+sec+" "+ampm var timeout=setTimeout("scroll()", 1000) document.title=actualtitle+scroller } if (document.all||document.getElementById) scroll() //--></script>

2.Pergi ke layout

3.Pergi ke Add a Gadget

4.Pergi ke HTML/Java Script

5.Pastekan script yang anda copy tadi ke dalam kotak HTML/JavaScript itu.

6.Selesai..Thanks To dynamicdrive.com untuk script ini.

semoga Tutorial ini dapat membantu anda dan dapat menambahkan pengetahuaan anda.
Jangan lupa subscribe aku jika anda rasa tutorial ini bagus.Thanks For Reading.

Read More