Miss Apple Lover .. follower

Jumaat, 26 Ogos 2011

tutorial shoutmix backround

Hye u all .. hari nie .. Miss apple nk buat satu tutorial yang direquest oleh Nur Asilah ..

ok .. ikut step nie
dashboard>gadget>html
  • u all kene copy code nie ..
 <div style='display:scroll; position:fixed; top:10px; right:10px;'>
<a class='linkopacity' href='http://wanhazel.blogspot.com/2011/05/tutorial-slide-float-shoutbox-with-cute.html' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='get slide float shoutbox'><img border="0" src="" /></a><br />
<a href="javascript:void(0);"onclick="showHideAT()"/><img class= width="140" height="140"src="http://i1234.photobucket.com/albums/ff409/TheMiaph/shoutsyifs.png" alt="Shoutbox" title="Shoutbox" /></a>

</div>

<style type="text/css">
#at{
position:fixed;


top:0;
;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}


.atcontent{
float:right;

background:url(http://i1234.photobucket.com/albums/ff409/TheMiaph/SHOUTBOXSYIFA-1.png
)
no-repeat 0 0 transparent;
width:700px;
height:700px;center scroll ;


padding:56px 0 20px 5px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url() no-repeat;">



<br /><br /><br /><br /><br /><br />

Masukkan shoutmix u all dengan lebar 270 dan tinggi 280

<center><div id="author"><a href="javascript:void(0);" onclick="showHideAT()"><input type="button" value="Close" class="close" />
</a></div>
</center></div>
</div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script></div></div>
  • Lepas korang copy kod tu..Korang masukkan kod Shoutbox korang k..Dekat bahgian yang Miss apple ada tulis tu


    Masukkan Shoutbox korang denagn lebar 270 dan tinggi 280


Dan law korang nak Ubah Frame untuk Slide Shoutbox korang nie..Korang ubah kod yang nie..

http://i1234.photobucket.com/albums/ff409/TheMiaph/SHOUTBOXSYIFA-1.png

.

Dan law korang nak ubah Icon Slide Shout korang nie lak..Korang ubah kod nie..

http://i1234.photobucket.com/albums/ff409/TheMiaph/shoutsyifs.png" alt="Shoutbox" title="Shoutbox

hah .. nie Miss apple nk bagi percuma frame shout kt bawah nie .. u all gunalah .. tp jgn lupe follow and credit Miss apple tau ..

 
http://4.bp.blogspot.com/-CRg9oMC8KUw/TlhpDydSumI/AAAAAAAAAJ4/4qp1UwBjC84/s1600/shout+frame1.png
http://1.bp.blogspot.com/-Upqhy8ayA68/TlhpGmEgFbI/AAAAAAAAAJ8/HMAvR3ix9Rs/s1600/shoutbox+5.png
http://1.bp.blogspot.com/-J6h_bX8DBSg/TlhpI3pKBWI/AAAAAAAAAKA/BwqHPlzwcEU/s1600/shoutbox4.png

http://3.bp.blogspot.com/-mVxnAoUfzIc/TlhpKBcNB6I/AAAAAAAAAKE/ejsct3IIZR4/s1600/shoutbox3.png

http://4.bp.blogspot.com/-wPUS0GZWZhY/TlhpL5900cI/AAAAAAAAAKI/EHEXi0WqF3A/s1600/shoutbox.png

but ... kalo u all x tukar url .. nnty shoutmix u all sme ngan miss apple nye .. kalo nk x yah tukar ape2 url ..
but masukkan code shoutmix sje ..

Selamat mencuba ..!!
but , spe yang nk frame nie .. bgi tahu ya ..

Jumaat, 19 Ogos 2011

Tutorial Single Blockquote

hye ... u all .. ari nie ..  miss apple nk request kn permintaan dr seorang follower miss apple.. iaitu Kak nurul ...

k.. bgi sesiapa lagi yang ingin tahu cm ne nk uat blockquote ikut step nie ya..

1. Dashboard>Design>Edit html>Tick Expand Widget Templates
2. cari code nih :

.post blockquote{ 
3.Copy code bawah nie ...
blockquote {
background:url(); background:#ffffff;
border-top: 2px dashed #F5A9D0;
border-left: 4px solid #F5A9D0;
border-right: 4px solid #F5A9D0;
border-bottom: 2px dashed #F5A9D0;
margin:1em 20px;
colour:}
blockquote:hover {
background: url() repeat right bottom ;
background:#ffffff;
border-top: 2px dashed #F5A9D0;
border-left: 4px solid #F5A9D0;
border-right: 4px solid #F5A9D0;
border-bottom: 2px dashed #F5A9D0;
margin:1em 20px;
  }
4. paste bawah  code nih  .post blockquote{

5. tulisan merah tu , ubah warna yg korang pilih
    tulisan oren tu , korang boleh ubah jugak



6. korang kalau nak letak gambar letak url gambar tu dekat tulisan biru tu . yang bentuk macam nih ()
   yang untuk gambar betukar tu , letak yang bahagian hover tu .

benda nih , korang kena pandai bace code sikit .

7. preview & save ...

Selamat Mencuba ya ..!!

Jumaat, 5 Ogos 2011

Tutorial Black pink and white background

hye semua pembaca blog .. ini ..
ari nie naseb baek miss apple ade mase untuk uat tutorial nie hee...
k.. ikut step nie .. mudah je ..

first step .. sign in blogger > Dashboard > Design > Add Gadget HTML
second step .. pilih salah satu background yang u all nk kt bawah nie ..
pas2 paste kn kt dalam Gadget

Black Pink and White star












Copy Code nie 

<style>body{background:black url(http://www.mycutegraphics.com/layout/bpw/bpw19.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;margin-top:5px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> by <a href="http://www.mycutegraphics.com" title="Images">MyCuteGraphics.com</a> </div>

Black and pink Flower







Copy code nie

<style>body{background:black url(http://content.mycutegraphics.com/backgrounds/bpw/bpw39.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;margin-top:5px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> by <a href="http://www.mycutegraphics.com" title="Images">MyCuteGraphics.com</a> </div>

Black Pink Retro












Copy code nie

<style>body{background:black url(http://content.mycutegraphics.com/backgrounds/bpw/bpw35.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;margin-top:5px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> by <a href="http://www.mycutegraphics.com" title="Images">MyCuteGraphics.com</a> </div>

 Ok.. tu jer la yg miss apple can share .. kalo nk background laen ..
mungkin miss apple boleh tolong share kn .. okkk

Khamis, 4 Ogos 2011

Tutorial Animated background

 hye .. ari nie Miss Apple free .. so Miss Apple nk share Background ...

k..first step u all  kene la  sign in blogger>Design>Page Elements>Add Gadget HTML
Then u all pilih background yg mne u all nk pas2 u all copy code background yg u all nk ..
Pas2 paste kn kt add gadget HTML .. pas2 save .. siap ..

Animated Background 







copy code  nie ...

<style>body{background:white url(http://content.mycutegraphics.com/backgrounds/animated/animatedbg12.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;position:absolute;bottom:0px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> & <a href="http://www.mycutegraphics.com/backgrounds/animated-backgrounds.html" title="Animated Backgrounds">Animated Backgrounds</a> </div>

 Animated Blinking Star






copy code nie ..

<style>body{background:white url(http://content.mycutegraphics.com/backgrounds/animated/animatedbg15.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;position:absolute;bottom:0px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> & <a href="http://www.mycutegraphics.com/backgrounds/animated-backgrounds.html" title="Animated Backgrounds">Animated Backgrounds</a> </div>

Animated Blinking Sun

 







Copy Code nie

<style>body{background:white url(http://content.mycutegraphics.com/backgrounds/animated/animatedbg13.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;position:absolute;bottom:0px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> & <a href="http://www.mycutegraphics.com/backgrounds/animated-backgrounds.html" title="Animated Backgrounds">Animated Backgrounds</a> </div>

Animated Butterfly








Copy code nie

<style>body{background:white url(http://content.mycutegraphics.com/backgrounds/animated/animatedbg18.gif) fixed;}</style>
<style>.cred{align:center;font-size:12px;font-face:arial;position:absolute;bottom:0px; }
</style><div class="cred" align="center"><a href="http://www.mycutegraphics.com" title="Backgrounds">Backgrounds</a> & <a href="http://www.mycutegraphics.com/backgrounds/animated-backgrounds.html" title="Animated Backgrounds">Animated Backgrounds</a> </div>

klik ...