TOP NEWS

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas mattis nisi felis, vel ullamcorper dolor. Integer iaculis nisi id nisl porta vestibulum.

Sunday 17 June 2012

Tutorial :Buat Auto Hide Menu


Korang tau tak apa itu auto hide menu? Cuba tengok gambar kt atas ni. Inilah yang dinamakan auto hide menu. Auto hide menu ni digunakan bagi menampakkan blog kita nampak lebih kemas. Tak ada adalah list yang berjela2 panjangnya dan visitor yang datang pon boringkan.

Tutorial kali ni nak share dengan korang macammana nak buat auto hide menu ni. Apa2 pun mula2 kredit dulu lah pada silampuneon untuk tutorial ni. First time nampak auto hide menu ni pun kt blog ni. Tq yekk...

Tapi tutorial ni dah disesuaikan dengan blog ni lah. Korang boleh tukar ikut kesesuaian korang k.


1. Pergi ke Dashboard > Design > Edit HTML

2. Cari code berikut dengan CTRL + F      

3. Letakkan kod di bawah dan letakkan di atas kod yang korang cari di step 2 tadi.

    
<style type="text/css">
.texthidden {display:inline}
.shown {display:block}
</style>

<script type="text/javascript">
document.write('<style>.texthidden {display:none} </style>');
</script>

<script type="text/Javascript">
function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className=="shown") {
whichpost.className="texthidden";
}
else {
whichpost.className="shown";
}
}
</script>

 

4. Save

5.  Pergi ke Dashboard >Layout >Add A Gadget >HTML/Javascript.

6.  Copy kod di bawah ni dan letakkan pada HTML/Javascript.

    <ul><a href="javascript:void(0);" onclick="expandcollapse('keyword')"> <h4>[+/-] POPULAR POST</h4></a></ul>
<ul class="texthidden" id="keyword">
<center> LETAKKAN KOD WIDGET KORANG KT SINI *</center>
 *</center>
</ul>

<ul><a href="javascript:void(0);" onclick="expandcollapse('button')"> <h4>[+/-]PESERTA CONTEST</h4></a></ul>
<ul class="texthidden" id="button">
<center><li><a href="http://teanyh.blogspot.com/2011/04/you-wannitcome-and-get-it-contest.html">cikblogger</a></li></center>
*</center>
</ul>


Note : 

- Pada perkataan berwarna merah korang boleh tukarkan dengan tajuk yang korang nak.
- Pada perkataan berwarna hijau, make sure sama kalau tak auto hide menu tak berfungsi. Tapi letakkan perkataan yang berlainan untuk setiap menu. Contohnya kalau menu pertama korang letak keyword, kt menu kedua tu letaklan banner atau apa2 perkataan yang korang nak.
- Pada perkataan berwarna biru, letakkan kod widget korang macam contoh di atas. Boleh ditambah ikut kesesuaian korang k.    

Sumber: LEPAK the place u should be

0 comments:

Tutorial : Tunjukkan loading time pada blog


Korang nak tau berapa loading time blog korang? Senang jer. Kat sini nak share sikit cara-cara nak tunjukkan loading time kt blog korang.

1. Pergi ke Dashboard > Design > Edit HTML


2. Cari code berikut dengan CTRL + F    

3. Letakkan kod di bawah selepas kod yang korang cari di step 2 tadi.


<!-- page load timer -->
<script type='text/javascript'>
var d = new Date();
var starttime = d.getTime(); //Get the start time
</script>


4. Cari code berikut dengan CTRL + F  </body>

5. Letakkan kod di bawah sebelum  kod yang korang cari di step 4 tadi.


<!-- page load timer start -->
<script type='text/javascript'>
var d2 = new Date();
var endtime = d2.getTime(); //Get the end time
//Find the difference between the start and end times
var totaltime = (endtime - starttime)/1000;
//Round 2 decimal places
var result = Math.round(totaltime*100)/100;
//Output results to a &quot;P&quot; element
document.getElementById(&quot;loadtime&quot;).innerHTML = &quot;Page loaded in: &quot;+ result +&quot; seconds&quot;;
</script>
<!-- page load timer end -->


6. Save

7.  Pergi ke Dashboard >Layout >Add A Gadget >HTML/Javascript.

8.  Copy kod di bawah ni dan letakkan pada HTML/Javascript.

<!-- Widget portion -->





<p id="loadtime">Write your custom message here</p>


9. Preview dan save dan lihatlah hasilnya. Selamat mencuba.




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Letak Scrolling Title di Browser



 Tutorial kali ini ialah untuk letakkan scrolling title di browser seperti dalam blog ini. Sila lihat contoh gambar di atas.

1. Pergi ke Dashboard > Design > Edit HTML

2. Cari code berikut dengan CTRL + F      

3. Letakkan kod di bawah dan letakkan sebelum kod yang korang cari di step 2 tadi.

<script type='text/javascript'>
//<![CDATA[
msg = "==>Blog untuk anda berkongsi Informasi...Selamat Datang!<==";
msg = " .................................. " + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
//]]>
</script> 


4. Save dan Preview




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Letak animasi jam dalam blog



Salam semuaaaaaa.....rasanya dah lama tak update tutorial dalam blog ni kan......rasa kosong plak....chewaahhhh.....

Okaylah, tutorial kali ni ialah untuk korang letakkan animasi jam pada blog korang. Sangat2 mudah....korang ikut jer step di bawah ni okay....

1. Pergi ke Dashboard >Layout >Add A Gadget >HTML/Javascript.

2. Masukkan kod berikut:
    (jenis jam : Clicking Digital Clock)



<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-33.swf"><embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-33.swf" width="150" height="150" wmode="transparent"> </embed></object>

3. Save dan Preview. Selamat mencuba!!...


p/s : korang boleh juga mencuba jenis jam yang lain dgn mencubanya di http://flash-clocks.com/




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Upload video dalam blog

Korang ada video nak upload dalam blog?.....Senang jer cara dia......sebelum ni saya ada bagi tutorial macmamana nak upload video youtube.

Tutorial kali ni macmamana nak upload video dalam blog...Jom kita tgk cara2 dia....

1. Buka New Post dan klik insert a video.



 2. Kt sini korang bleh pilih nak letak video sendiri atau dari youtube.






3. Senang bukan?....selamat mencuba.....





Sumber:

LEPAK the place u should be

0 comments:

Sunday 3 June 2012

Apa itu SEO




SEO....Rasanya korang yang dalam dunia blogging ni sure tau apa itu SEO kan...... Dalam dunia blogging ni SEO adalah perkara yang paling penting bagi menaikkan trafik pada blog kita.


Apa itu SEO?

SEO ni adalah singkatan daripada perkataan Search Engine Optimization iaitu kaedah yang digunakan untuk mendapatkan kedudukan yang tinggi dalam enjin carian. Sape tak nak web@ blog kita sentisa berada di kedudukan yang teratas dalam enjin carian. Bila kedudukan kita antara yang teratas so secara tidak langsung trafik yang datang ke blog kita akan bertambah hanya dengan mengaplikasikan konsep SEO dalam blog kita.

Sebagai contoh lah kan, kalau kita ada web@blog berkaitan perniagaan dan nak mempromosikan produk yang kita jual, konsep SEO amat sesuai diaplikasikan dalam blog kita bagi mempromosikan produk.

Dengan mengaplikasikan konsep SEO ni, akan meningkatkan populariti sesebuah web@blog seterusnya meningkatkan trafik. Kebiasaannya, SEO ini bermain dengan kata kunci  @ keyword samaada menggunakan kata kunci yang popular atau menaikkan kata kunci yang luar biasa yang belum pernah digunakan.

Saya akan terangkan bagaimana kata kunci @ keyword yang kita gunakan mampu untuk meningkatkan trafik blog pada entri akan datang. Tunggu tauuu.....



Sumber:

LEPAK the place u should be

0 comments:

Apa itu Backlink

Apa itu Backlink? Bagi blogger, backlink memang tak asing lagi.

Backlink dengan bahasa mudahnya ialah link web kita yang berada atau disimpan di dalam web/blog orang lain.

Kenapa ramai yang mengejar backlink?
Sebab semakin banyak backlink semakin banyaklah trafik akan masuk ke dalam blog kita.
Kalau kita perhatikan, kita boleh tengok backlink tu dengan banyak cara. Antaranya ialah

1. Apabila link kita dimasukkan ke dalam bloglist blog lain. So rajin2lah join bloglist dan manfaatnya bukan pada kita sahaja tapi kedua2 pihak. Saya sendiri suka join bloglist sebab bila blog saya selalu diupdate dan sentiasa akan berada di senarai atas sekali. Secara tak langsung menaikkan trafik bila org klik link saya. Ada juga yang memang dah masukkan blog saya dlm bloglist. Terima kasih.

2. Korang perasan tak bila korang letak button share kt artikel korang tu. Bila orang klik share then artikel tu akan dikongsikan dengan org lain melalui facebook. Cuba korang bayangkan ada berapa orang dalam FB tu. Secara tak langsung kita dah dapat backlink kt situ. Betul tak?...huhuhu....

3. Melalui komen. Tak dinafikan dengan komen di blog lain akan meningkatkan trafik sebab kita dah tinggalkan link blog kita kt situ. Bila ada link orng akan klik kt link tu. So jgnlah jadi silent reader...Rajin2 la mengomen jek...huhuhu....

4. Letak signature link blog kita bila join forum dan hantar email. Sambil2 join forum letakkan link blog kita..kt situ dah dapat backlink.

5. Melalui join contest dan segmen blog lain juga dapat backlink. Tak caya?..Cubalah join mana2 contest atau segmen. Saya suka join contest dan segmen sebab selain dapat memperkenalkan blog saya, link blog saya sentiasa berada dalam blog tersebut selagi contest atau segmen tu berjalan.

6.Buatlah artikel yang menarik dan berkualiti sebab bila artikel kita dikongsi dalam blog lain, biasanya akan dikreditkan ke blog kita. Sebagai contoh blog saya ada tutorial untuk blogspot dan ada beberapa blog yang share artikel saya di blog mereka.

7. Selalu blogwalking sebab kita akan meninggalkan link di ruangan shoutbox.

8. Exchange link dengan blog lain. Tinggalkan seberapa banyak link. Huhuhuh.....Saya suka dengan blog yang membolehkan saya letak link saya.

Sebenarnya ada banyak lagi cara untuk mendapatkan backlink dan kadang2 kita tak sedar sebenarnya kita dah tinggalkan link kita. Kalau korang ada maklumat tambahan lagi bolehlah tulis di ruangan komen yer...bolehlah kita berkongsi maklumat.



Sumber:

LEPAK the place u should be

0 comments:

6 Cara Tingkatkan Page View

Page View ialah jumlah halaman @ page dalam blog yang dibuka oleh pengunjung. Semakin tinggi page view maknanya semakin banyak page blog tu dibuka oleh pengunjung blog. Ada beberapa cara untuk kita tingkatkan page view dan saya nak share beberapa tips atau cara untuk kita sama2 tingkatkan page view.


1. Letak Related Post

Post2 yang terpilih ialah post-post yang sama labels so bila kita letak related post ni secara tak langsung page view kita akan tinggi. Contohnya kalau visitor blog buka entri tentang tutorial, di related post akan disenaraikan entri2 lain yang berkaitan dengan entri dibaca tadi. Visitor blog tak perlu susah payah untuk cari entri lain yang berkaitan.


2. Letak Linkwithin

Linkwithin lebih kurang sama dengan related post cuma post yang dipaparkan adalah secara random yang relate dengan post tetapi masih boleh meningkatkan page view sebab gambar yang terpapar akan menarik minat visitor blog untuk klik dan baca entri tersebut.



3. Gunakan Read More dalam entri dalam blog

Adalah digalakkan untuk pasang read more dalam blog supaya dapat melajukan page blog kita dan secara tak langsung meningkatkan page view. Di samping itu dengan memasang read more akan membuatkan visitor blog yang datang akan klik pada entri yang kita tulis tu untuk mengetahui dengan lebih lanjut isi kandungan enti. Kalau entri korang tu menarik mesti visitor akan klik.


4. Tidak letakkan terlalu banyak enttri dalam main page blog

Seboleh2nya, elakkan letak terlalu banyak entri dalam main page blog sebab akan melambatkan / memberatkan blog. Bila blog kita lambat dan berat, visitor mesti akan tinggalkan blog kita dan secara tak langsung mengurangkan page view. Kalau boleh just letak dalam 1 ke 2 entri sahaja di main page blog dan akan menyebabkan visitor klik pada entri yang lama untuk membaca entri yang lain. Jangan letak terlalu banyak.


5. Letak Popular Post

Popular post juga dapat menarik minat visitor blog untuk klik pada mana-mana popular post dalam blog. Biasanya popular post diletakkan di side bar blog.


6. Letak link entri yang lama dalam entri

Biasakan dengan meletakkan link bagi entri lama ke dalam entri yang baru kita tulis. Contohnya korang buat satu entri tentang SEO, so cuba kaitkan entri tersebut dengan entri lama yang pernah korang tulis sebelum ini dengan meletakkan link tersebut. Secara tidak langsung, visitor akan klik pada link tersebut untuk mengetahui lebih lanjut isi kandungan link tersebut.

Okaylah.....setakat ini sahaja untuk saya share. Sekiranya korang ada tips atau cara lain, bolehlah share juga yer......





Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Popular Post bergerak



Salam semua. Tutorial kali ini ialah bagaimana nak jadikan post popular kita bergerak. Sila ikut step di bawah.

1. Add gadget Popular post dulu dalam Design>PageElements>Add Gadget>Popular post



2. Pergi ke Design>Edit HTML>Expand Widget Templates dan cari kod berikut:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
 <b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
 <ul>
<marquee align='left' direction='up' height='140' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='3' width='100%'>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == &quot;false&quot;'>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (3) Show only thumbnails -->
            <div class='item-thumbnail-only'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            </div>
            <div style='clear: both;'/>
          <b:else/>
            <!-- (4) Show snippets and thumbnails -->
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
              <div class='item-snippet'><data:post.snippet/></div>
            </div>
            <div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
      </b:loop>
   </marquee> </ul>
    <b:include name='quickedit'/></div>
  </div>
</b:includable>
</b:widget>

Note : Tambahkan kod yang berwarna merah berikut dan boleh ubah kelajuan pada scrollamount='3'.


Kredit : teknikbuatblog


Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Buat Widget Post bergerak

Salam semua......hari ni nak share macammana nak buat widget post bergerak. Kegunaan widget ini ialah bagi membolehkan pengunjung kt blog korang tau entry korang yang lepas tanpa perlu pergi satu2 untuk melihat entry korang yang lepas-lepas. Entry korang akan keluar secara random.

Jom jenguk cara-cara nak buat widget post bergerak ni.




 1. Pergi ke Dashboard >Layout >Add A Gadget >HTML/Javascript.

 2. Masukkan kod berikut:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style media="screen" type="text/css">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
margin-bottom:-20px;
padding:0px 0px -20px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
float:center;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:200px;
padding: 2px 2px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:center;
height:70px;
overflow: hidden;
background:#FFFFFF;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#A32929;
font-size:12px;
height:0px;
overflow:hidden;
margin: 0px 0px;
padding:0px 0px 0px 0px;
}
#spylist li img {
float:left;
margin-right:10px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:0px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:0px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:0px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://img15.imageshack.us/img15/5439/noimagex.png";
imgr[1] = "http://img15.imageshack.us/img15/5439/noimagex.png";
imgr[2] = "http://img15.imageshack.us/img15/5439/noimagex.png";
imgr[3] = "http://img15.imageshack.us/img15/5439/noimagex.png";
imgr[4] = "http://img15.imageshack.us/img15/5439/noimagex.png";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = " ";
showPostDate = false;
showcomments = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 20;
home_page = "http://NamaBlogKorang.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://sites.google.com/site/testingsahaja/recentpostslide.js?attredirects=0&d=1" type="text/javascript"></script>
</div>


3. Selamat mencuba.



kredit : budaknakal



Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Cara backup post blog

Tutorial kali ni ialah nak share macammana untuk backup post di blogspot. Tutorial ni saya dapat dari Syafzmagz. Pinjam tutorial yer...huhuhu....

Backup ni penting bagi memastikan post yg kita dah buat sebelum ni masih ada lagi sekiranya terdapat masalah pada blogspot ataupun tiba2 post-post kita sebelum ni hilang ke kan. So eloklah kiranya kita backup siap2.


1. Pergi ke Settings > Basic > Blog Tools. Pilih Export blog.



2. Tekan DOWNLOAD BLOG  


3. Save fail yang korang download tadi.




Untuk upload kembali fail yang korang dah download tadi, ikut langkah berikut:




1. Pergi ke Settings dan klik Import blog


2.  Klik Browse dan pilih fail yang kita download tadi. Lepas tu, tick pada kotak Automatically publish all imported posts dan tekan IMPORT BLOG



3. Sebaik-baiknya korang backuplah selalu sebagai persediaan.



Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Buat Drop down menu di header menu dalam blog

Tutorial kali ini ialah saya nak share dengan korang cara-cara untuk buat drop down menu di header menu macam gambar di bawah ni.


1. Pergi ke Dashboard > Design > Edit HTML>Expand Widget
2. Cari kod berikut  </head>

3. Letakkan kod berikut sebelum kod yang korang cari di step 2 tadi.

<style>
#sddm
{ margin: 0;
padding: 0;
z-index: 30}

#sddm li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
/*Font of menu top*/
font: bold 11px arial}

#sddm li a
{ display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
/*width of each menu top*/
width: 60px;
/*background color of main menu*/
background: #66CC00;

/*text color of main menu*/
color: #FFFFFF;
text-align: center;
text-decoration: none}

#sddm li a:hover
{

/*background color of main menu on hover*/
background: #00991A}

#sddm div
{ position: absolute;
visibility: hidden;
margin: 0;
padding: 0;

/*background color of drop down menu */
background: #66CC00;
/*border of the drop down menu*/
border: 1px solid #5970B2}

#sddm div a
{ position: relative;
display: block;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
/*background color of each menu element*/
background: #FFFFFF;
/*text color of each menu element*/
color: #00CC00;
/*font of each menu element*/
font: 11px arial}

#sddm div a:hover
{
/*background of each element on hover*/
background: #00991A;
/*font color of each menu item on hover*/
color: #FFFFFF}
</style>
<script type='text/javascript'>

var timeout = 500;
var closetimer = 500;
var ddmenuitem = 0;

// open hidden layer
function mopen(id)
{
// cancel close timer
mcancelclosetime();

// close old layer
if(ddmenuitem) ddmenuitem.style.visibility = &#39;hidden&#39;;

// get new layer and show it
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = &#39;visible&#39;;

}
// close showed layer
function mclose()
{
if(ddmenuitem) ddmenuitem.style.visibility = &#39;hidden&#39;;
}

// go close timer
function mclosetime()
{
closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}

// close layer when click-out
document.onclick = mclose;
</script>
  










 
Untuk menambahkan menu:

1. Pergi Dashboard > design > add a gadget > HTML/javascript

2. Letakkan kod berikut:

<ul id="sddm">

<li><a href="http://easy-xs.blogspot.com">Home</a></li>

<li><a href="#"
onmouseover="mopen('m1')"
onmouseout="mclosetime()">Tutorial</a>
<div id="m1"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime()">
<a href="#">Nuffnang</a>
<a href="#">Blogspot</a>
<a href="#">Trafik Blog</a>
</div>
</li>

<li><a href="#"
onmouseover="mopen('m2')"
onmouseout="mclosetime()">Tempat</a>
<div id="m2"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime()">
<a href="#">Percutian</a>
<a href="#">Tempat menarik</a>
</div>
</li>

<li><a href="#">Hiburan </a></li>
<li><a href="#">Dunia IT </a></li>
<li><a href="#">Sejarah </a></li>

</ul>



Note : 

i.  Tukar tajuk menu dan link ikut kesesuaian blog korang.

ii. Untuk menukar warna pada menu boleh rujuk kod warna berikut : colour

Sekiranya ada sebarang pertanyaan bolehlah komen di bahagian komen yer.....





Sumber:

LEPAK the place u should be

0 comments:

Sunday 27 May 2012

Tutorial : Letak scrollbox pada bloglist

Tutorial : Letak scrollbox pada bloglist:


Salam semua, kali nak share satu lagi tutorial. Kalau sebelum ni saya ada buat satu tutorial buat scroll box untuk widget  so kali ni nak share macammana nak letak scrollbox pada bloglist.

Bloglist merupakan satu widget yang selalu dipasang di dalam blog tetapi bloglist yang terlalu panjang membuatkan visitor yg dtg ke blog kita boring dan nampak tak kemas. So, bagi mengemaskan kt bloglist tu kita letakkan scrollbox pada bloglist tu.


1. Letak widget Bloglist ni dalam blog dengn pilih Dashboard>design>page elements>bloglist



2. Pergi pada Design >Edit Html (tick bahagian Expand Widget Templates) dan dengan menggunakan Control + F, cari kod  ]]>

3. Pastekan kod berikut di atas kod yang korang cari di step 2. Height boleh ditukar ikut kesesuaian sidebar korang.


#BlogList1 .widget-content{
height:200px; width:auto;
overflow:auto;
}  



4. Save dan Preview




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Letak lagu dalam blog

Tutorial : Letak lagu dalam blog:

Korang pernah tak bila visit blog lain ada dengar lagu berkumandang?  Pada sesiapa yang belum tahu lagi, kali ni saya nak share dengan korang semua macammana nak letakkan lagu dalam blog.


1. Pergi ke 4shared

2. Pilih lagu di ruangan carian



3. Klik pada lagu yang korang dah pilih tadi dan copy kod dari benamkan/embed


4. Pergi pada Design>Page Element> Add a gadget> HTML/Javascrip dan pastekan kod yang korang dah copy tadi

<embed src="http://www.4shared.com/embed/151403631/fc8a439c"
width="420" height="250" allowfullscreen="true" 
allowscriptaccess="always"></embed>


Note : Tukarkan perkataan yang berwarna merah itu mengikut kesesuaian blog korang. Dicadangkan kekalkan width dan tukarkan height kepada 20.



Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Letak lagu autoplay dalam blog

Tutorial : Letak lagu autoplay dalam blog:


Minggu lepas saya mendapat pertanyaan daripada student yang belajar blog dengan saya macammana nak letak lagu autoplay dalam blog. Sebelum ni entry saya ialah tutorial letak lagu dalam blog.


1. Cari lagu yang korang nak cari dalam youtube.

2. Klik pada Share dan Embed




 3. Tick pada Use old embed code [?]




 4. Copy kod berikut dan paste pada HTML/Javascript

<object width="425" height="20"><param name="movie" value="http://www.youtube.com/v/_SrQRnQtpI8?version=3&amp;autoplay=1;hl=en_US" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><embed src="http://www.youtube.com/v/_SrQRnQtpI8?version=3&amp;autoplay=1;hl=en_US" type="application/x-shockwave-flash" width="425" height="20" allowscriptaccess="always" allowfullscreen="true"></embed></object>


Note : Tambahkan perkataan berwarna merah berikut ke dalam kod tadi dan pada perkataan berwarna biru korang boleh tukar ikut suka korang.


5. Save dan Preview dan lihatlah hasilnya.





Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Buat Sticky Post untuk blog

Tutorial : Buat Sticky Post untuk blog:



Tutorial kali ni saya nak share dengan korang macammana nak buat sticky post di blog korang.

Sticky post ni kita letak dalam blog kita supaya entry yang kita jadikan sticky post tu sentiasa berada di bahagian atas sekali di antara entry2 kita yang lain.

Contohnya, pada blog saya ni, saya nak promote Contest SEO: Aku Seorang Blogger vs Buat Duit Dengan Tip Blogging Terbaik anjuran 2dayblogger sehingga pada tarikh tutup contest tersebut. So saya nak entry tu sentiasa berada di atas walaupun saya ada entry baru bagi tujuan promosi contest tersebut. Lebih kurang macam tu lah maksud dia.


Langkah2 untuk buat sticky post ni ialah:

i. Tulis entry/post dan publish ataupun pilih Edit Post kalau korang nak pilih entry yang sedia ada.

ii. Klik Post Option > Pilih Setting date and Time (Tukarkan tarikh dan masa untuk entry itu dijadikan sebagai sticky post).




iii. Klik Publish Post.

iv. Lihat hasilnya.



Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Buat tulisan conteng pada blog

Tutorial : Buat tulisan conteng pada blog:




Pernah tak korang tengok ada tulisan yang diconteng macam kat atas ni?...Rasanya pernah lah kot. Biasanya kita tengok tulisan yang diconteng ni bila kita nak tukar ayat atau promosi iklan yang sebelumnya.

Cara dia mudah ajer....

1. Buka Posting > New Post > Edit HTML

2. Copy dan paste kod berikut

  <strike>(Tulis perkataan yang korang nak contengkan)</strike>


3. Save dan preview.




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Letak Related Post blog

Tutorial : Letak Related Post blog:

Salam dan selamat berpuasa semua....hari ni saya nak share dengan korang macammana nak letak widget related post dalam blog. Contoh related post adalah seperti dalam gambar di bawah yang terdapat di blog LEPAK.





Untuk pengetahuan, related post ni tak sama dengan linkwithin yang biasa kita letak dalam blog sebab dalam widget related post ni, post2 yang terpilih ialah post-post yang sama labels. Linkwithin pula akan pilih random post yang ada relate dengan post. Related post ni akan cari semua perkataan yang mempunyai label yang sama. (Ayat sedikit terbelit....huhuhu).

Ada banyak kelebihan sekianya blog dipasang dengan widget related post ni. Antaranya ialah membantu tingkatkan trafik blog dan pageview. 


Cara-cara letak related post


1. Pergi ke Dashboard > Design > Edit HTML > Expand widget templates

2. Cari code berikut dengan CTRL + F 
   </head>

3. Kemudian copy code ini, dan paste sebelum kod yang korang cari macam di step 2. 

    <style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEbzs4fTTk9kao_ueBw7c3Xr2sgHj9kFkDtY3M0LIZhZdzFgOoNtS3dt8djUPX55bb-OiMD2ztuzINB-sRW8B6vMShUTUYkeOpihUnQFlxqePTjct9ugWyZ_C8eiJHpnpzZR5wbrS6g3s/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://theblogtemplates.com/scripts/Related_posts_hack.js' type='text/javascript'/>

   
4. Cari code berikut dengan CTRL + F
  <data:post.body/> atau  <div class='post-body>



5. Kemudian copy code ini, dan paste selepas kod yang korang cari macam di step 4. 
    
<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b: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> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>


6. Boleh ubah max-result=5 ikut kesesuaian.

7. Save dan Preview.



Sumber:

LEPAK the place u should be

1 comments:

Monday 21 May 2012

Tutorial : Buat widget Copy Artikel

Tutorial : Buat widget Copy Artikel: Tutorial kali ni nak share macammana nak buat widget copy artikel macam gambar di bawah ni. Mesti korang selalu tengok gambar kt bawah ni di sesetengah blog kan.

Tujuannya ialah untuk membolehkan artikel yang menarik perhatian dicopy oleh visitor yg datang ke blog korang.



Langkah2:

1. Pergi ke Dashboard > Design > Edit HTML > Expand widget templates

2. Cari code berikut dengan CTRL + F

   <data:post.body/>

3.  Copy code di bawah ni dan paste kan di bawah code yang korang cari di step ke 2 tadi


<div style='text-align: center;'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/> <br/>
Sila copy artikel ini,
untuk mendapat backlink ke blog ini
<form action='http://www.blogger.com/blog-this.g' method='post' target='_blank'>
<textarea cols='45' name='t' onclick='select()' readonly='readonly' rows='5'>
<data:post.body/> <br/> Sumber:
<a expr:href='data:post.url'>
<data:blog.title/>
</a>
</textarea> <br/>
<input expr:value='data:post.url' name='u' type='hidden'/>
<input expr:value='data:post.title' name='n' type='hidden'/>
<input type='submit' value='Blog This!'/>
</form>
</b:if>
</div>
 



4. Tukarkan pada perkataan yang berwarna biru kepada perkataan korang sendiri.

5. Save dan Preview


kredit:budaknakal
 

Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Cara buat entry Autopublish

Tutorial : Cara buat entry Autopublish: Rasanya dah lama tak buat tutorial kan...huhuhu.....Buat sekian lamanya, hari ni saya nak buat satu tutorial macammana nak buat entry autopublish.

Entry autopublish ni sesuai kalau kita nak setkan bila kita nak entry kita publish. Contohnya nak buat entry yang banyak dalam satu hari atau nak buat entry sekaligus dalam seminggu ke.....kita siap2kan entry dan kemudian setkan tarikh dan masa. Sangat2 sesuai kalau korang ni bz sangat2 dan siapkan 2,3 entry sekali gus dan setkan masa.


Jom kita ikut tutorial ni


1. Buat entry baru di New Post


2. Selesai taip entry, klik pada Publish Post




3. Pada Post date and time pilih Scheduled at. Setkan tarikh dan masa untuk entry di publish.




4. Publish Post dan akan keluar notis seperti di bawah




5. Entry korang akan di publish mengikut masa dan tarikh yang telah ditetapkan.




Sumber:

LEPAK the place u should be

0 comments:

Tutorial : Cara buat kotak SELAMAT DATANG ke dalam blog

Tutorial : Cara buat kotak SELAMAT DATANG ke dalam blog: Korang pernah tak bila masuk blog orang lain tiba2 ada box yang mengalu-alukan kedatangan korang...contohnya "selamat datang ke blog saya" dan sebagainya lah.


Nak tahu macammana nak buat kotak tu?....Senang jer cara dia ..jom ikut tutorial kt bawah ni yek....

1.  Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

2. Copy kod di bawah ni

<script type='text/javascript'>alert("Masukkan sebarang ucapan yang korang nak kt sini")</script>

3. Save dan preview





4. Mudah bukan?...Cubalah...




Sumber:

LEPAK the place u should be

0 comments: