Saturday, October 13, 2012

Banner

Greeting Text

                                                
                                                   Banner blog ini

<a href="http://s1160.photobucket.com/albums/q500/Nad199/?action=view&current=anigif-7.gif" target="_blank"><img src="http://i1160.photobucket.com/albums/q500/Nad199/th_anigif-7.gif" border="0" alt="Photobucket" ></a><br></a>
Jom terjah blog lain jugak ! 



          
        
  






Tutorial Letak Banner di Sidebar

Greeting Text


Sebelum tu, korang kena upload dulu banner korang utk dapatkan code.
Upload la dimana2 tpi biasanya di Photobucket

Step ;

1) Dashboard > Layout > Add a Gadget > Html / Javascript

2) Copy code nie
<a href="LINK-URL"target="_blank"><img border="0"width="" height="" src="PIC-URL" alt="" width="125" height="125"></a>
* merah - url blog korang
  biru - url banner korang 

3) Bawah tu, copy code nie plak

<div align="center">
<textarea cols="20" name="code" rows="3">TEXT APE NAK LETAK</a></textarea></div>
* biru - code banner korang 

4) Save ! :)





Tutorial Cusor Bertukar Bila Sentuh Link

Greeting Text


First thing, maksud tuto nie ialah cusor korang akan bertukar bila sentuh link . okey :D

Step ;

1) Dashboard > Layout > Add a Gadegt > Html / Javascript

2) Copy code nie & pastekan
<style type="text/css">body, a, a:link{cursor:url(url cursor 1), default;} a:hover {cursor:url(url cursor 2),wait;}</style>
* biru - cusor yang korang nk guna
  merah - cusor yg akan muncul bila sentuh link

3) Dah siap. Boleh save ! :)

-klu nk contoh cusor comel2, pegi kat sini



Tutorial Scroll To Top

Greeting Text


Step ;

1) Dashboard > Layout > Add a Gadget > Html / Javascript

2) Copy code nie & pastekan 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
//** jQuery Scroll to Top Control script- (c) I made this script myself (Kyle Monk) and it is hosted on my personal site so would appreciate if you followed my blog at kylemonk.tumblr.com if you use it or for details on how to change the location.
//** Graphic originally from tumbler dashboard, for details on how to change graphic colour, contact me at kylemonk.tumblr.com
//** v1.1 (April 7th, 10'):
//** 1) Adds ability to scroll to an absolute position (from top of page) or specific element on the page instead.
//** 2) Fixes scroll animation not working in Opera.
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 (0=top).
    setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
    controlHTML: '<img src="URL PICTURE" style="filter:alpha(opacity=70); -moz-opacity:0.1; width:100px; height:70px" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
    controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom 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:'Back to Top'})
                .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>


* biru - gantikan url image korang

3) Save ! :)

Tutorial Letak Ayat Assalamualaikum

Greeting Text


Step ;

1) Dashboard > Template > Edit Html > Tick Expand Widget

2) Tekan ctrl + F serentak utk search code nie
<data:post.body/>
3) Dah jumpa, copy code nie dan pastekan ATAS code tadi

<div align='center'><a href='' target='_blank'><img src='URL IMAGE' style='border: 0 !important; background: transparent;'/></a></div>
* merah - gantikan dengan url image korang

4) Dah preview ? Boleh save ! (:

- kalau nk gambar yg comel2 , tekan ' Freebies Ayat Assalamualaikum ' di Google Search 




Tutorial Tukar Home, Older, Newer ke Icon Comel

Greeting Text


Step ;

1) Dashboard > Template > Edit Html > Tick Expand Widget

Untuk newer post

tekan ctrl + F serentak utk search code nie
<data:newerPageTitle/>
gantikan code tu dengan code nie
<img src="DIRECT LINK"/> 
* direct link gantikan dengan image url korang

Untuk older post 

tekan ctrl + F serentak utk search code nie
<data:olderPageTitle/>
gantikan code di atas dengan ini 
<img src="DIRECT LINK"/> 
 * direct link gantikan dengan image url korang

Untuk home

tekan ctrl + F serentak utk search code nie

<data:homeMsg/>

gantikan code di atas dengan ini 
<img src="DIRECT LINK"/> 
 * direct link gantikan dengan image url korang

Ini ada contoh gambar yg kauorg blh amik.


http://i1136.photobucket.com/albums/n489/puanfarah/gohome.png

http://i1136.photobucket.com/albums/n489/puanfarah/newerpost.png

http://i1136.photobucket.com/albums/n489/puanfarah/olderpost.png

Dah preview ? Boleh save ! (: 
















Tutorial Buang Nav Bar

Greeting Text


Step ;

1) Dashboard > Template > Edit Html

2) tekan ctrl + F serentak utk search code nie
/* Variable definitions
3) Dah jumpa ? Copy code nie dan pastekan ATAS code tadi
#navbar-iframe { display: none !important; }
4) Dah preview ? Boleh save ! (: 

Tutorial Cantikkan Scroll Bar

Greeting Text


Sebelum start, bagi yg tak tahu Scroll Bar itu ape , tengok gambar dibawah -.-


* Perhatian juga !
Tutorial ini hanya menjadi untuk pengguna Google Chrome
Step ;

1) Dashboard > Template > Edit Html > Tick Expand Widget

2) Tekan ctrl + F serentak untuk search code nie
]]></b:skin> 
3) Dah jumpa ? Copy code nie dan pastekan ATAS code tadi

::-webkit-scrollbar {height:12px;width: 12px;background: #D9D9D9;}::-webkit-scrollbar-thumb {background-color: #F2F5A9;-moz-border-radius: 10px;border-radius: 10px;  
}
* merah - background scroll bar
  biru - warna scroll bar itu

4) Kalau korang nk gantikan background / scroll bar itu dengan image, gantikan code itu dengan ini

background-image:url(URL BACKGROUND);
5) Kalau nk letak border pon boleh, tambah code nie lepas border-radius tu

border: 1px solid #000000;
kalau nk code warna, boleh ke sini

6) Dah preveiw ? Boleh save ! (:







Tutorial Gambar Melengkung

Greeting Text


Step ;

1) Dashboard > Template > Edit Html > Tick Expand Widget

2) tekan ctrl + F serentak utk search code nie
 img { 
3) Copy code bawah nie dan pastekan BAWAH code tadi

-moz-border-radius-topleft: 15px;-moz-border-radius-bottomright: 15px;-moz-border-radius-topright: 15px;-moz-border-radius-bottomleft: 15px;-webkit-border-top-left-radius: 15px;-webkit-border-top-right-radius: 15px;-webkit-border-bottom-left-radius: 15px;-webkit-border-bottom-right-radius: 15px;-top-right-radius: 15px;border-top-left-radius: 15px;border-top-right-radius: 15px;border-bottom-left-radius: 15px;border-bottom-right-radius: 15px;}
4) Dah preview ? Boleh save ! (:



Tutorial Center & Letak Background pada Post Tittle

Greeting Text


Step ;

Untuk Post Tittle
1) Dashboard > Template > Edit Html

2) tekan ctrl + F serentak utk search code nie
h3.post-title {
3) korang akan jumpa mcm nie kan ?
h3.post-title {margin: 0;font: $(post.title.font);}
.comments h4 {margin: 1em 0 0;font: $(post.title.font);}
atau
h3.post-title, .comments h4 {font: $(post.title.font);margin: .75em 0 0;}
4) code tadi buang dan gantikan dgn code bawah nie
h3.post-title, .comments h4 {text-align:center;font: $(post.title.font);-moz-border-radius: 40px 10px;border-radius: 40px 10px;margin: .75em 0 0;background:url(http://dl4.glitter-graphics.net/pub/960/960924wm6l862838.gif)}
merah - gantikan dengan url image background korang 

5) Dah preview ? Boleh save ! (:

Untuk Sidebar Tittle

1) Dashboard > Template > Edit Html

2) tekan ctrl + F serentak utk search code nie
h2 {
3) then, jumpa mcm nie kan ?
h2 {
font: $(widget.title.font);
text-transform: $(widget.title.text.transform);
color: $(widget.title.text.color);
margin: .5em 0;
}
4) buang code tadi, gantikan dengan code nie
h2 {text-align:center;-moz-border-radius: 40px 10px;border-radius: 40px 10px;margin: 0 0 1em 0;
font: $(widget.title.font);color: $(widget.title.text.color);text-transform: uppercase;background:url(http://dl4.glitter-graphics.net/pub/960/960924wm6l862838.gif) }
* merah - gantikan dengan url image background korang 

 5) Dah preview ? Boleh save ! (:




 
Hak cipta terpelihara Miraa Hussin| Copyright-2012