Tutorial Twitter di Blogskin Part 1



Hey hey there!! Sebenarnya tuto ni banyak orang request and Diya pun memang da lama nak buat cuma pening sikit coding di sebab banyak cara boleh buat.
Tak tahulah berapa banyak part Diya nak buat..depend on masa yang Diya ada la.
Sebelum ni Diya ada buat tuto Cute Floating Twitter Status.Kalau nak baca klik sini


1.Firstly pergi ke Template


2.Ctrl+F dan search <HTML>


3.Once da jumpa,copy code ni plak


<div style='padding-left: 0px; position: absolute; Z-INDEX: 300; margin-LEFT:554px; WIDTH: 228pxmargin-TOP: 148px; HEIGHT: 120px;background:#;'>

<ul id="twitter_update_list"></ul>
<a href="http://twitter.com/ID KORANG" id="twitter-link" style="display:block;text-align:right;"><img width="18" height="20"src="http://4.bp.blogspot.com/_LhHZAifMoFE/TU2OAkAaaaI/AAAAAAAAEw8/PamKpUKXdOs/s1600/Untitled-2.png" title="Follow my twitter" /></a>

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>

<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/ID KORANG.json?callback=twitterCallback2&count=1"></script>

</div>




5.Paste kod ni di bawah <HTML>


6.Banyaknya colour dekat font tu kan.

margin-LEFT:554px;
margin-TOP: 148px;


Yang nie plak untuk kedudukan Status korang..So korang ubah value dalam tu untuk ubah kedudukan Status korang tu..Korang ubah la nak kekiri ke kekanan ke ape ke.


WIDTH: 228px; 
HEIGHT: 120px;


Yang nie plak untuk size Status korang tu.Korang ubah la ikut size yang korang nak


ID KORANG
Gantikan dengan ID twitter korang.Tak tahu bole click sini

Warna Purple
Boleh gantikan dengan salah satu image bawah ni


http://1.bp.blogspot.com/-IqRetl7yn4k/TwANe-19zpI/AAAAAAAAAgc/ShIeaLHRAzE/s1600/diya1.png




http://2.bp.blogspot.com/-7zb3vXbUquc/TwANfuUYaHI/AAAAAAAAAgk/9GjchY-PF2E/s1600/diya2.png


http://3.bp.blogspot.com/-wiSK2LgS7bQ/TwANg5mmhoI/AAAAAAAAAgo/5ZjJ-0bmIes/s1600/diya3.png





http://1.bp.blogspot.com/-2InEAC8yhxM/TwANhSQaNPI/AAAAAAAAAgs/JaetyJ9Zcic/s1600/diya4.png


-nak ambik pape sila komen dulu k-

Tutorial Meletakkan Home Button di Blogskin



Hey hey there!! Actually tuto ni Diya saja try bodo2 je,then tengok-tengok jadi.Fungsi Home Button ni adalah untuk kembali ke laman utama blog kita lepas kia da pegi ke section lain.

Let's start

1.Pergi ke Template

2.Then click F3 dan search kod </Blogger>


3.Bila da jumpa,copy plak code ni






<a href="URL BLOG KORANG//"><img src="http://i1215.photobucket.com/albums/cc515/Awynmunchkin/Homeicon.png" border="0" /></a>



4.Preview,dulu kalau jadik Save!!

Gantikan font merah dengan url blog korang.
Gantikan font biru dengan image di bawah ni






http://3.bp.blogspot.com/-VAnOjjCxtHM/Tv67DWKcKKI/AAAAAAAAAfI/f-YNbKSil5c/s1600/home4.png




http://2.bp.blogspot.com/-MiQtvfnxGl8/Tv67EBM_hwI/AAAAAAAAAfQ/DW_WXeXReS4/s1600/home5.png



http://1.bp.blogspot.com/-gBlrjiBneg8/Tv67E3cuRUI/AAAAAAAAAfY/ZQJqNBCWpU0/s1600/home6.png



http://1.bp.blogspot.com/-7m-qLWnk2cY/Tv67FSLHTRI/AAAAAAAAAfc/7jMbeBU8BNU/s1600/home7.png




http://4.bp.blogspot.com/-tObboyti2kM/Tv67F1HaJ3I/AAAAAAAAAfo/23nOWJWgk-Q/s1600/home8.png



http://1.bp.blogspot.com/-VQ7zMLEHRDU/Tv67HeHChvI/AAAAAAAAAfw/38a9vhym2Fs/s1600/home9.png


http://1.bp.blogspot.com/-YS3dBQEvYKE/Tv67H8vO1wI/AAAAAAAAAf4/6AoDVd20J2s/s1600/home10.png




http://2.bp.blogspot.com/-cQhn5lOlECs/Tv67MtaSeDI/AAAAAAAAAgA/bKr-4CRYA9g/s1600/home1.png





http://4.bp.blogspot.com/-kV93ynlmmc4/Tv67NVZiPeI/AAAAAAAAAgI/IPT5xDpUqts/s1600/home2.png





http://4.bp.blogspot.com/-4g1eGLkAzRo/Tv67OsrZ-UI/AAAAAAAAAgQ/TwV5LOZrWsQ/s1600/home3.png


-kalau nak ambik pape kasi tau dulu yer-


Diya Sesame: Selamat Tahun Baru semuaa!!!!! Semoga 2012 ni tahun dipenuhi dengan followers keberkatan k^^


Tutorial Welcome Note atas Header di Blogskin

 
aku dan dia time tecik2 dulu :D

Hey hey there!! Selamat petaaaang,,wahh ramai tanya Diya macam mana nak buat welcome Note atas header.Yeayy before that jom pegi serbu blog Kak Myra and say thanks kat dia sebab Diya belajar dan ambil Freebies tu pun kat dia .Tahu welcome note tu macam mana?? Tengok pic bawah nie




Ok jom buat

1.Pergi ke Template


2.Ctrl + F and search code </style>

3.Copy code bawah ni




4.Pastekan kod tu di bawah kod </style>


5.Gantikan tulisan merah dengan URL image



http://1.bp.blogspot.com/-nIFY8pU1Fg4/TkzBngK4OAI/AAAAAAAABg8/bMX0dE7C6V4/s1600/syamira1.png 


http://2.bp.blogspot.com/-jAieLvCpJqE/TkzB9v3hHNI/AAAAAAAABhE/rKv0jc_UGiA/s1600/syamira2.png 


                                        
http://2.bp.blogspot.com/-sQKh--PUVFA/TkzB9zoEvxI/AAAAAAAABhM/41uRsUn9aCE/s1600/syamira3.png 

yg nie dari blog nurin
http://4.bp.blogspot.com/-67JlZDegWKg/T7U2suneNhI/AAAAAAAAAsk/NrHqj3ZYoJ4/s1600/cuteonlineuser.png




http://2.bp.blogspot.com/-uJXFxah6km4/T7U22bZg-JI/AAAAAAAAAss/Mf9DEsceFRY/s1600/cuteonlineuser1.png
http://1.bp.blogspot.com/-o5yED0r3sv8/T7U26uVekEI/AAAAAAAAAs0/gyp-pqcDQVg/s1600/cuteonlineuser2.png


-Kalau jadi ke tak jadi ke sila komen k-
-Kalau ambil pape sila komen k-
:

Tutorial Back To Top button di Blogskin






Hey hey there!! Kembali lagi di segmen Blogskin Tutorial..Kali ni jom kita belajar cara nak buat Button Back To Top pulak .

1.Firstly bukak Template Korang

2.Click F3 dan search </head>
.
3. Copy and paste code ini di bawah /head>





<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type='text/javascript' language='Javascript'>
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (1=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 500]},
controlHTML: '<img onmousedown="event.preventDefault ? event.preventDefault() : event.returnValue = false" src="URL IMAGE"/>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ center of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Fly To The Sky'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>


4.Replacekan kan URL IMAGE dengan URL button bawah ni



http://1.bp.blogspot.com/-vDQ-zadNcw4/Tv1mD5PThfI/AAAAAAAAAeY/olpBvf1OKTs/s1600/TOP1.png



http://3.bp.blogspot.com/-QaSiYxdnBC0/Tv1mEvpXgyI/AAAAAAAAAeg/76T_gp3aXq0/s1600/top2.png

http://2.bp.blogspot.com/-ui0WVdjhMBQ/Tv1mFhP1rxI/AAAAAAAAAeo/INzdcotCfU4/s1600/top3.png


http://3.bp.blogspot.com/-zNYRWiDzb9I/Tv1mGvaq7sI/AAAAAAAAAew/7gH5PaFqhRI/s1600/top4.png



-kalau nak ambik pape,sila tinggalkan comment k-

Tutorial Follow & Dashboard button di Blogskin Ver.2

.tetibe je rase dia comey:)


Hey hey there!! Assalamualaikum,ingat lagi tak haritu Diya ada buat tuto pasal
Tutorial Follow & Dashboard button di Blogskin.Tapi ramai orang kasi tau yang diorang buat tak jadi..Maybe sebab ada sesetengah blogskin tak sesuai dengan kod yang Diya bagi tuh.

Ok now,kita try yang second version pulak.
Hope jadik la kali ni.


1.Pergi ke . Dashboard -> Template -> Edit HTML


2.Click CTRL + F and search kod  </html>




3.Then bile da jumpa.copy code bawah ni


<a style="display:scroll;position:fixed;top:45px;left:15px;" href="http://www.blogger.com/follow-blog.g?blogID=BLOG ID KORANG" title="Follow"><img src="http://assets.tumblr.com/images/iframe_follow_alpha.png?468" /></a><a style="display:scroll;position:fixed;top:15px;left:15px;" href="http://www.blogger.com/home" title="Dashboard"><img src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?468" /></a>




4.Lepas copy paste-kan atas kod </html>




5.Gantikan tulisan merah dengan blog ID korang






Image from blog Mazmadi


Preview dan Save^^


Tutorial 'Welcome Note" setiap Entry di Blogskin


.tiba2 teringat Hana Tajima.


Hey hey there!! Assalamualaikum..Assalamualaikum,entry Diya hari ni pun berkaitan dengan Assalamualaikum.Ape die? Tutorial  Assalamualaikum  setiap Entry di Blogskin!

Ok Jom Start -__^

1.Picit F3  dan search    <BlogItemTitle>   


2.Da jumpa, copy kod ni   


<center><img src="http://1.bp.blogspot.com/-kjT7jAi_V_g/TvqsY9ohgUI/AAAAAAAAAA8/0Zs8c3wPXPM/s1600/tt8050455fltt.gif"/></center>


3.Pastekan di bawah  kod  <BlogItemTitle> 

Korang bole gantikan tulisan merah tu dengan image di bawah ni,ok


http://3.bp.blogspot.com/-rUudPp1dKvk/TvqsTgXZbGI/AAAAAAAAAAQ/5jq-5YUqgr8/s1600/tt8050437fltt.gif


http://3.bp.blogspot.com/-Lq8CwQeiQPA/TvqsUivhueI/AAAAAAAAAAY/8SrU5UQ_wqE/s1600/tt8050448fltt.gif


http://2.bp.blogspot.com/-b2T9FCOgiGE/TvqsWNGONVI/AAAAAAAAAAg/-_4zT1mmIcE/s1600/tt8050449fltt.gif


http://2.bp.blogspot.com/-5w5RSbf74D4/TvqsW9qve3I/AAAAAAAAAAk/kT1_LTgDFeA/s1600/tt8050450fltt.gif


http://1.bp.blogspot.com/-mxNr2lET1HY/TvqsXmoigCI/AAAAAAAAAAs/OOkkKWElntk/s1600/tt8050452fltt.gif


http://2.bp.blogspot.com/-zm1OfAsJp6E/TvqsYUlxxHI/AAAAAAAAAA0/BCYhRNGC7wI/s1600/tt8050454fltt.gif


http://2.bp.blogspot.com/-g_KoVkVGsHg/TvqsZkuUO_I/AAAAAAAAABE/UDl9dnJbw-0/s1600/tt8050456fltt.gif

http://1.bp.blogspot.com/-VaZ7Y0D16Fo/TvqsbAUa_3I/AAAAAAAAABY/5DVMlULI_Nw/s1600/tt8050458fltt.gif


http://4.bp.blogspot.com/-NFAsUZmLHWs/TvqsaPe6AXI/AAAAAAAAABM/-fXHDBWFnXM/s1600/tt8050457fltt.gif


http://3.bp.blogspot.com/-Rz7w01-V7gM/TvqscK6ob_I/AAAAAAAAABg/kdDAaNGU5wo/s1600/tt8050459fltt.gif


http://3.bp.blogspot.com/-6fF7oLFXgGk/TvqsdnLGW4I/AAAAAAAAABo/j1wS84RDP4A/s1600/tt8050462fltt.gif



http://4.bp.blogspot.com/-bwiSGFW5KGE/TvqseR5MjTI/AAAAAAAAABw/SbcPxizT7iM/s1600/tt8050463fltt.gif


http://4.bp.blogspot.com/-iQZklL09dcA/TvqshoJIwPI/AAAAAAAAACI/motcfcq9l4o/s1600/tt8050467fltt.gif


http://1.bp.blogspot.com/-kJRF11Y76rQ/Tvqsi0DOi3I/AAAAAAAAACQ/ozPxmb9jPGY/s1600/tt8050468fltt.gif


http://4.bp.blogspot.com/-S7EqmmOsyoU/TvqsjpLSRfI/AAAAAAAAACU/nLLV0en2JI8/s1600/tt8050469fltt.gif


http://3.bp.blogspot.com/-JWJDLnQfsLk/TvqskPZQAFI/AAAAAAAAACc/vFMcjh4dG4c/s1600/tt8050470fltt.gif


http://3.bp.blogspot.com/-9Vh8VkART7M/TvqslZu7wwI/AAAAAAAAACs/VRrcG3NMdJY/s1600/tt8050473fltt.gif


http://2.bp.blogspot.com/-w1sG-3nWdXE/TvqsmIorynI/AAAAAAAAAC4/boTwOYt9BI0/s1600/tt8050474fltt.gif



-Kalau nak ambik pape,kasi tau dulu k-