Hafiz Zulkafly

Freebies : Tiny Cursor

Jumaat, Julai 27, 2012



Assalamualaikum

Hari ni tetibe semangat nak bagi freebies . kali ni buat tiny cursor . ape yang bestnya , cursor ni , buat sendiri . hand made gitu . haha . medium yang digunakan untuk buat cursor ni ? of course lah Photoshop kan ? hehe . kalau buruk maaf , den reti buat simple simple jepp . nahh ;



http://i.imgur.com/UFVaP.png


http://i.imgur.com/5pOYV.png


http://i.imgur.com/gIrSO.png


http://i.imgur.com/py5Xl.png


http://i.imgur.com/ECuB6.png


http://i.imgur.com/UGdqW.png


http://i.imgur.com/o07AO.png


http://i.imgur.com/DUo2A.png


http://i.imgur.com/VBHyQ.png


Tutorial : Shadow Link Hover

Selasa, Julai 24, 2012

Assalamualaikum

Yoo . aritu ada orang request dekat cbox apis tutorial ni . rasanya dah ramai blogger dekat luar sana dah buat tutor ni . tapi takpe apis buat gak sebab ada orang request :) . okay tutor ni actually sama je dengan tutor yang INI . cuba korang kena tambah satu lagu coding . okay nak tau code apa ? jom mula .


BLOGSKINS USER ONLY


1) Dashboard > Template > Edit HTML .

copy code bawah ni . paste dekat atas </style>


a:link, a:visited {
text-decoration:none;
color:#000;
padding:2px;
-webkit-transition-duration:.2s;
-moz-transition-duration:.2s;
}
a:hover {
padding:2px;
text-shadow:0px 0px 5px #969696;
-webkit-transition-duration:.2s;
-moz-transition-duration:.2s;
}

*yang mana di boldkan tuh . sila ubah mengikut citarasa anda :)

2) Save .

okay , siap . mudah kan ? cume kena tambah code shadow untuk tulisan kita je . okay , sila lah cube kepada mereka yang masih lagi belum mencuba . kalau jadi , komen komen lah ye . if tak jadi bagitau apis . kena check semula . hehe . kbai o/

Tutorial : Opacity Navigation

Isnin, Julai 23, 2012

Assalamualaikum

Annyeong o/ . lol . update tutor sebab tengah ada mood . hehe ^^ . okay tutor ni ada orang request dekat twitter. terima kasih sudi request . berupdate jugak lah blog ni . okay opacity navigation tuh macam mana ? berminat ? meh sini nak share ilmu :)


UNTUK PENGGUNA BLOGSKINS

1. Dashboard > Template > Edit HTML .

Copy code ni , paste dekat ATAS </style>


#chanyeol{
background-image: url('http://i.imgur.com/sKEY0.gif');
width:200px;
border:5px solid #444;
}
#sehun {
background:#fff ;
font-size:10px;
color:black;
font-family:trebuchet ms;
text-align:justify;
padding:3px;
width:195px;
height:180px;
opacity:0.00;
-webkit-transition:1300ms;
}
#sehun:hover {
opacity:1;
-webkit-transition:1300ms;
}

*untuk background-image tuh , aku sarankan korang pakai gambar yang beresolution 200X200 . kalau tak die tak jadi and takkan muat


2. Copy code bawah ni pulak paste dekat mana section yang korang nak . code ni terpulang korang nak paste dekat mana .


<div id="chanyeol">
<div id="sehun">
CODE NAVIGATION OR YOUR FOREWORD !
</div>
</div>

3. Save . SIAP .

UNTUK PENGGUNA SIMPLE TEMPLATE

1. Dashboard > Design > Edit HTML

Copy code bawah ni , paste dekat ATAS

/* Header
----------------------------------------------- */


#chanyeol{
background-image: url('http://i.imgur.com/sKEY0.gif');
width:200px;
border:5px solid #444;
}
#sehun {
background:#fff ;
font-size:10px;
color:black;
font-family:trebuchet ms;
text-align:justify;
padding:3px;
width:195px;
height:180px;
opacity:0.00;
-webkit-transition:1300ms;
}
#sehun:hover {
opacity:1;
-webkit-transition:1300ms;
}

2. Save. then pergi pulak dekat Dashboard > Design > Page Element > Add a Gadget > HTML/JavaScript .

copy and paste code ni dekat dalam gadget tu .


<div id="chanyeol">
<div id="sehun">
CODE NAVIGATION OR YOUR FOREWORD !
</div>
</div>

3. Save and siap :)

*mana mana code yang di bold kan tuh . boleh tukar ikut suka korang :)

ce tengok , jadi tak ? insyaallah aku rasa kalau korang ikut betul betul tutor ni mesti jadi . hehe . kalau tak jadi , sila bagitau ye . aku akan bantu korang sampai menjadi . okay selamat mencuba !

Tutorial : Link Hover

Ahad, Julai 22, 2012


*gambar takde kena mengena dengan tutor =='


Assalamualaikum

Annyeong . o/ . sihat , dah makan ? haha . lama dah tak bagi tutor . tutor ni ada orang request dekat apis . thanks kepada si request kerana sudi request tutor dari apis . okay , ape yang die request ? ni die :

Assalamualaikum.Mm Nak request ni: Buat tutorial link hover background b'warna 4 blgskin, boleh?Thks

Okay , nasib request die tak susah mana . alhamdulillah apis dapat bantu die . hehe . okay ape tunggu lagi , jom mula :)


FOR BLOGSKINS USER .

1. Dashboard > Template > Edit HTML

Copy code bawah ni . and paste dekat ATAS </style> .



a:link, a:visited {
text-decoration:none;
color:#000;
background:transparent;
padding:1px;
-webkit-transition-duration:.2s;
-moz-transition-duration:.2s;
}
a:hover {
color:#fff;
background:#000;
padding:2px;
-webkit-transition-duration:.2s;
-moz-transition-duration:.2s;
}

*mana mana yang apis bold tu ikut suka korang nak pakai warna apa . dekat mana nak dapat code warna ? meh lompat sini .

then SAVE . siap . mudah kan , ce preview jadi ke tidak . insyaallah , confirm jadi punya .  kalau tak jadi , jangan malu , jangan segan . comment je bagitau yang tak menjadi . nanti apis akan tolong korang secara manual . hehe :)

Tutorial : Link Shortener

Jumaat, Julai 13, 2012

Assalamualaikum & Salam Sejahtera

Kali ni update tutor lagi . dah lama rasa nya tutor tak berupdate . // eh bukan semalam baru update ka ? haha . okay sila ignore . style aku intro memang panjang . nak buat macam mana . terpaksa bagi intro panjang sebab tutor ni pendek and simple . okay first nak tanya . korang pernah tak jumpa link link macam ni dekat cbox korang > http://goo.gl/xXeu3 ?. ha , actually . itu link yang telah dipendekkan menggunakan url shortener ni . untuk apa pendekkan ? yela . mana lah tau kalau korang nak hantar link dekat cbox someone ke , link kan kadang kadang panjang . cbox pulak ade limit berapa patah perkataan . so guna kan lah url shortener ni bagi memudahkan . hehe . apa tunggu lagi , jom belajar.


1. Pergi dekat laman web ni : Google URL Shortener

2. Kemudian ikut step dalam gambar dekat bawah ni .




Okay . siap . mudahkan ? so lepas ni boleh lah korang pendek pendek kan segala link link yang panjang berjela jela tu ha . ada paham ? . hehe . Aku pon baru tau benda ni . dapat je tahu , terus update tutor . k itu tipu . kalau tak paham . jangan malu nak tanya . malu bertanya sesat jalan . kbai o/

lepas ni nak bagi freebies skin pulak ^^

Tutorial : Widget Twitter di Blog

Selasa, Julai 10, 2012

Assalamualaikum

Yoo . update lagi ni ha . aritu ada orang request tutor ni dekat cbox apis . walaupun apis tau dah ramai yang buat tutor ni . tapi tutor ni apis buat jugak untuk si request . special for you . HAHA . apa tu twitter widget ? nak tengok contoh boleh hover ke navigation apis and click pada contact . haa . itu lah twitter widget . sekali button nak follow tu ha . macam mana nak buat ? nahh :)

1) Copy code ni . and paste dekat mana yang korang nak atau korang suka :


<center><script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 10,
  interval: 30000,
  width: 250,
  height: 150,
  theme: {
    shell: {
      background: '#eee',
      color: '#000'
    },
    tweets: {
      background: '#eee',
      color: '#000',
      links: '#000'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: true,
    behavior: 'all'
  }
}).render().setUser('USERNAME KORANG').start();
</script></center>
<br />
<center>
<a href="URL TWITTER KORANG" class="twitter-follow-button" data-show-count="false">Follow @USERNAME KORANG</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></center>
</div>

2. Mana mana yang apis boldkan tuh . korang boleh tukar ikut suka korang . pastuh save .

Siap . semudah kicap ABC . hehe . so apa tunggu lagi . cube lahh . takkan nak tengok je kan . dah cube bagitau . jadi ke , tak jadi ke . bagitau lah yee . kalau tak jadi tu meh sini apis bantu ^^

*NOTA : WIDGET NI TAKKAN JADI KALAU KORANG PRIVATE KAN TWEET KORANG . SO UNPRIVATE KAN TWEET KORANG . SETTING > ACCOUNT > UNTICK PROTECT MY TWEET .

Tak Layan Dah

Ahad, Julai 01, 2012

Assalamualaikum

Yoo . Hari ni kelas pukul 3 . so sempat update blog dulu sebelum pergi kelas . okay berbalik ke entry semalam . apis dah pon tutup tempoh untuk pemenang tuntut hadiah mereka . MAAF . walaupun agak kejam , tapi apis terpaksa buat macam tuh sebab lepas ni mungkin apis dah tak banyak masa lagi untuk menghadap laptop ni . lumrah student memang gitu . so disini apis nak tunjuk printscreen mereka mereka yang dah pon hantar segala maklumat kepada apis . terima kasih kerana memberi kerjasama . jom tengok yang korang punya ada ke tidak :

GMAIL




FACEBOOK




TWITTER


BLOG



Hanya 8 orang sahaja yang menghantar maklumat yang apis perlukan . so lagi 2 orang tuh , apis consider yang korang tak berminat dengan hadiah die walaupon apis tau hadiahnye tak menarik langsung . takpe . so kepada pemenang pemenang sekalian . apis harap korang sabar okay . lagi lagi yang menang cursor , banner and header tuh . maybe agak lewat sikit . yang topup pula apis akan masukkan secepat yang mungkin . so makesure no yang pernah korang bagi tu betul okay . k tuh je nak cakap . hehe . kbaii

sambung main game Zoo Tycoon . lama gila tak main game ni . sekali dapat , perhhh ^^
© 2017 HAFIZ ZULKAFLY ALL RIGHTS RESERVED