MY TUTORIAL BLOG

Monday, May 21, 2012

TUTORIAL MEMBUAT AYAT BERKELIP

mula2 taip ayat seperti biasa
cth :- tekoyong itu sangat lambat

bagaimana mahu membuat ayat 'tekoyong itu sangat lambat' berkelip-kelip adalah dengan menambahkan kod html pada permulaan dan akhir ayat

seperti ini yer

<blink> tekoyong itu sangat lambat </blink>

nanti akan jadi sebegini

tekoyong itu sangat lambat

mudah sajakan

**********

catitan Bui

tapi malangnya,tutorial ayat berkelip ini hanya akan jadi jika anda menggunakan browser Mozilla Firefox..kalau guna chrome atau IE,statik jer ayat tu..huhu

Tuesday, April 24, 2012

Tutorial Dashed Hover Dekat Link

kalau tak faham apa yang bui maksudkan pasal title dekat atas,korang boleh klik dekat mana2 link yang ada dalam blog bui ni yer

so kalau dah tau apa tu,dan kalau berminat nak buat macam tu jugak,korang boleh try tutorial ni..jom

mula2
TEMPLATE > EDIT HTML > PROCEED

cari kod ini

a:hover {

dah jumpa..?ok,kalau dah jumpa korang copy kod dibawah

border-bottom: 5px dashed #FFC0CB;
text-decoration: none;
color: $(link.hover.color);
}

dan paste dibawah kod yang pertama tadi
tulisan yang berwarna biru tu korang tukar ikut citarasa masing2 yer
ok,dah siap..boleh preview dan save

jangan lupa baca entry di INI BLOG BUI

Tuesday, April 17, 2012

Edit Sesuka Hati

salam sayang semua..cehhhh..tetiba pulak kan..bukan nak cerita kisah best ataupun buat tutorial pun pagi ni yer..kepala manyak pening maaaa..hehehe..

lepas ni nak rehatkan otak yang terasa berpinar2 sebab telah menyeksa diri mengedit blog sesuka hati..dah perangai buruk (cepat jemu) datang..jadi terimalah akibatnya buiii..ngeeee

dan setelah berhempas pulas memerah idea,edit kod segala..blog BUI TUTORIAL berubah wajah lagi..bui tau memang tak cantik tapi asalkan hati bui senang melihatnya pun dah kira ok

lepas ni manalah tau mood nak update tutorial mencurah2 datang..mencurah2 lah sangat kan..hahaha..

tapi rasanya bui dah bertekad..bui akan update blog

1 entry sehari untuk blog INI BLOG BUI

dan

1 entry seminggu untuk blog BUI TUTORIAL

sabtu dan ahad,sekiranya bui dapat hidayah insyaallah akan ada entrylah nanti..

sesungguhnya bui tak larat mak jemah sekalian..dengan kerja lagi,dengan anak2 lagi,dengan hubby lagi..aduhaiiii..serius,memang tak larat..

***entry kembar dengan Ini Blog Bui..next entry on 24/4/2012

Saturday, April 14, 2012

Tutorial Buat Post Footer Background

✿ 14 April 2012 - 205 pagi ✿

selalunya bila buat tutorial memang bui akan buat eksperimen dekat blog sendiri dulu dan kalau menjadi,barulah bui berani nak buat tuto dan ajar korang pulak

kali ni bui nak ajar macam mana nak buat background dekat post footer (ala-ala macam blog INI BLOG BUI k)..

korang tengok gambar ni

nice kan..kalau korang nak buat macam ni jugak bolehlah cuba tutorial ni..jom

mula2
DASHBOARD > DESIGN > EDIT HTML (tak perlu tanda expand widget templates)

lepas tu,tekan F3 dan cari kod ini

.post-footer {

bila dah jumpa,korang copy kod dibawah

padding : 15px;
border-top : 3px dashed #F6E3CE ;
background-image: url(URL IMEJ BACKGROUND);
margin: 1.5em 0 0;
}

pastekan/gantikan dengan kod di atas dibawah kod yang pertama tadi seperti ini :-

.post-footer {
padding : 15px;
border-top : 3px dashed #F6E3CE ;
background-image: url(URL IMEJ BACKGROUND);
margin: 1.5em 0 0;
}

ok,tulisan biru tu korang ubah ikut citarasa sendiri yer..PREVIEW dulu,kalau puas hati barulah SAVE TEMPLATE..

tutorial letak button twitter tu,bui buat next entry ok..tunggu..

Wednesday, April 4, 2012

Tutorial Letak Fan Page Facebook Dalam Blog

ok,tadi dah belajar TUTORIAL BUAT FAN PAGE FACEBOOK kan..sekarang kita belajar macam mana nak letak fan page facebook dalam blog pulak..jom..

mula2 bukak fan page korang dekat facebook tu

klik Manage pastu klik Edit Page (tengok gambar)

dah klik,nanti akan keluar macam ni

korang klik pada Resources..akan keluar pulak macam ni

korang pilihlah Use Social Plugins tu yer..

nanti akan keluar pelbagai pilihan..korang pilihlah LIKE BOX

dah tu akan keluar pulak box macam ni..korang isikan url fan page korang yer

contoh url (bui pinjam Cik Pip punya url)

https://www.facebook.com/wanitacollection

lepas tu korang editlah like box tu ikut kesesuaian blog masing2..

dah puas hati baru klik Get Code..

PENTING!!!

sila klik IFRAME dan copy kod itu tadi dan paste kan dalam blog

(sila tengok gambar)

seperti biasa,

design > add gadget > html/java script

dan copy kod di atas tadi tu dalam ruang kosong html/java script tadi..

preview dulu,kalau puas hati bolehlah save..DONE!!

sekian,terima kasih..hehehe

psstt : bui ada buat LIKE BOX ni dekat INI BLOG BUI

Tutorial Buat Fan Page Facebook

tutorial ni Cik Pip yang tanya..rajin sungguh Cik Pip belajar yer..hehe..ok,tanpa membuang masa mari kita sama2 belajar macam mana nak buat fan page dekat facebook

mula-mula klik sini

CREATE FACEBOOK PAGE

pilih Brand or Product (tengok gambar)

lepas tu isikan tempat kosong tu seperti ini

dah isi,korang klik Get Started tu ok..

akan keluar page macam ni

korang isilah apa2 yang patut k..ok,dah siap part buat fanpage facebook ni..lepas tu korang tambahlah info-info dekat fanpage korang tu..jangan lupa promote dengan kawan2 supaya LIKE fanpage..hehe

ok,dah siap..next tuto..TUTORIAL LETAK FAN PAGE DALAM BLOG

Sunday, March 25, 2012

Tutorial Buang Garisan Bawah Link

lama dah bui tak buat tutorial..bukan apa,kalau nak buat tuto kena buat dengan hati yang gigih..lagipun tutorial sekarang berlambak2 dah orang buat..cuma kena rajin google dan rajin mencuba

bui buat blog ni pun sekadar nak berkongsi ilmu selain nak jadikan sebagai koleksi sendiri..kot2 manalah tau nak ubah itu ini,cuma refer dengan blog tutorial bui jer..takyah susah2 bukak blog orang

amboii..panjang pulak mukadimahnya..orite,meh belajar

tutorial ni sebenarnya Deqla yang tanya..maaflah dik sebab dah terlalu lama pertanyaan tu terbiar tanpa jawapan (ampunkan hamba penunggu gua..hahaha)

alamak..merapu again..ok,stop

mula2
DASHBOARD > DESIGN > EDIT HTML > CLICK EXPAND WIDGET TEMPLATES

tekan F3..taip perkataan
underline

dah jumpa tak..?kalau dah jumpa korang gantikan semua perkataan tu dengan
none

sekarang,SAVE..dah siap..senangkan..*_*

bila korang halakan cursor pada link,garisan tu tidak akan muncul lagi..

Saturday, March 3, 2012

Tutorial Centerkan Imej Header

mula2 pergi ke
DASHBOARD > DESIGN > TEMPLATE DESIGNER > ADVANCED > ADD CSS

copy kod dibawah

#header-inner img {
margin-left: auto;
margin-right: auto;
}

pastekan di ruangan css tadi seperti ini

klik untuk tumbesaran

preview dulu..kalau ok dan puas hati barulah klik Apply to Blog

p/s : jangan lupa baca entry di INI BLOG BUI

Saturday, January 7, 2012

Tutorial Cursor (Sparkle)

apa itu sparkle cursor?
lihat cursor bui ada benda2 jatuh kan..
itulah sparkle cursor..jom belajar..

mula2 pergi ke
DASHBOARD > DESIGN > ADD GADGET > HTML/JAVA SCRIPT

copy kod dibawah dan paste dekat ruang kosong html tadi

<script type="text/javascript">
</script>
<script type="text/javascript">
// <![CDATA[
var colour="#0000ff";
var sparkles=100;

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {

tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

#0000ff tu adalah warna benda2 jatuh tu..macam bui punya adalah warna biru
anda boleh ubah warna tu ikut selera masing2

save dan lihatlah hasilnya..*_*

Wednesday, December 14, 2011

TUTORIAL LETAK BACKGROUND PADA BLOG ARCHIVE

DASHBOARD > DESIGN > EDIT HTML > TICK EXPAND WIDGET TEMPLATES

cari kod seperti ini (ctrl F untuk memudahkan pencarian)

<div id='ArchiveList'>

copy kod dibawah

<div style='overflow:auto; height:300px; background:url(URL IMEJ BACKGROUND); background-repeat:repeat;'>

dan paste diatas kod yang berwarna merah tadi seperti ini :-

<div class='widget-content'>
<div style='overflow:auto; height:300px; background:url(URL IMEJ BACKGROUND); background-repeat:repeat;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if><b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>
<b:include name='quickedit'/>

kod yang berwarna biru adalah kod yang perlu anda tambah

300px adalah ketinggian kotak scroll
anda boleh mengurangkan atau menambah jumlah tersebut mengikut kesesuaian..

URL IMEJ BACKGROUND anda gantikan dengan url imej yang anda mahu letak sebagai background blog archive

url imej boleh cari kat SINI
cara copy url imej pulak boleh klik SINI

preview dulu,kalau puas hati baru save