Sunday, 29 January 2012

TUTORIAL : HOVER GAMBAR MELENGKUNG BILA CURSOR MENYENTUH


adeh panjang benor dah tajuk tu hah.. ok.. harini cik N nak tunjuk satu lagi tutorial yang cik N sendiri apply kat blog.. yelah.. kalau tak apply macamna nak bagi contoh.. erk~!

macamana nak buat gambar yang korang post dalam entry atau gambar gambar kat side bar ke.. mana mana lah gambar yang wujud dalam blog korang tu jadi melengkung comel macam gambar kat bawah ni.. 
cer try ^_^ .. comey tak?? tak?? *sedehnye~!!*

contohnye: 


ni munyet cik N.. nak jugak?? ikot tuto cik N bawah ni.. :)



1) korang just pergi kat dashboard -->  design --> edit HTML --> tick  ..

2) nak edit dah kan? tekan CTRL + F serentak .. dan cari kod ni.. 




/* Header



3) copy pulak kod bawah ni dan masukkan kat atas kod yang korang cari tadi (2) boleh?


/*------ IMAGE ANIMATION------*/
img {filter:alpha(opacity=100);
-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #FF3366; -moz-box-shadow: 0px 0px 20px #FF3366; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#FF3366; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
u {
text-decoration:underline;
border-bottom: 2px dotted #ff0080;
padding: 0px;
}
4) yang kod warna oren tu.. korang boleh tukar warna nye.. ikot warna yang korang suka.. (KOD WARNA)

5) preview dulu dan try bawak cursor korang sentuh mana mana gambar.. jadi tak?? ^_^ kalau jadi bagitahulah ye.. kalau tak jadi pun bagi tahu tau.. daa~!!

p/s: cik N tak apply kat blog dah sebab blog cik N tak sesuai guna hover kot.. nanti gambar header jadi blur :)

TUTORIAL : KOD WARNA BLOG


nak cari warne.. nak cari warne.. 

"mane ??"

haa!! kat sini korang boleh pilih warna warna kesukaan korang untuk apply dalam mana mana tutorial ye!!









































































































































































































Kode warna yang terpilih :



p/s: senang cikit kan.. :)

Tuesday, 24 January 2012

TIPS : CARA NAK DAPATKAN BE NUFFNANG VERSI NURFERL ..



ok.. seperti yang dijanjikan.. uhuk uhuk..
nurul nak kongsikan tips.. macamne nurul boleh dapat BE nuffnang haritu...
simple je stepnye...
macamne nuffnang boleh bagi pun tak tahulah..
cubalah ya... insyaAllah.. tak rugi..



Memula sekali  korang pergi kat nuffnang korang.. login semua..


1- korang pergi dekat blog manager-->dalam kotak manage blog tu.. ada update survey *klik situ*..
then korang update semua balik semula..

*untuk soalan 5) jangan sesekali korang tanda politik/sosial sebab nuffnang tak suka blog macamtu..
 sebab takde pengiklan yang nak bagi iklan nanti..*

*untuk soalan 13) korang ceritalah tentang blog korang.. kalau nak cerita dalam bi pun boleh.. kalau rajinlah kan.. tapi nurul campur campur bahasa nye..*

lepas tu submit je..

emm.. tido jap.. *erk*

2- lepas tu korang pergi pulak dekat blogger bio.. pun macam biasa korang isi semua semula..

 kalau boleh buat ayat panjang panjang sikit..
 kreatif kreatif sikit... alaa.. korang kan kreatif.. hee.. 

3- haa.. yang ni penting.. nampak tak hubungi kami kat bahagian atas tu...

Klik hubungi kami-->hantar tiket-->support-->tanda dekat Pertanyaan/Cadangan blogger-->Klik seterusnya..



lepastu korang isi dekat bahagian subjek : BE 
bahagian message : cakaplah ape ape yang korang nak tanye.. kenapa tak dapat BE ke ape ke.. nurul buat dalam BI .. BM pun boleh kot..



nak tahu nurul message ape??
pendek sesangat.. jangan gelak.. hee~


kat atas tu jawapan nuffnang.. kat bawah yang ciput tu soalan nurul.. 
when will i get some be.. so sad..
ngee~ yang nuffang jawab panjang berjela jela.. takde nye nurul bace banyak banyak tu.. hik hik..

tarikh nurul hantar tiket ni dalam 17 hb jan 2012  lepas tu 22 hb jan 2012 dapat BE.. 1 jelah.. 
kalau hantar banyak banyak dapat lagi tak agak agaknye??
hahaha!!!

jangan mare haa~

beng!! beng!! beng!!






TUTORIAL : LETAK VIDEO YOUTUBE DALAM BLOG


haa.. harini nurul nak tunjuk satu lagi tuto macamne nak letak video youtube dalam blog dengan kemas tanpa ada button pause and full screen bebanyak ..  sebab cik yaya kite yang comey ni tanye.. 



ok macamni ye senang je...

i) mula mula pergi dekat youtube.. pilih video ape yang korang nak masukkan dalam blog.. *hee ombak rindu sesaje contohnye*

ii) ikut step dalam gambar ni ok.. 


1- korang tekan button *share* 
2- tekan button embed
3- copy html kod bawah tu..

iii) lepas tu buka new post dan ikut bawah ni..


1- korang tekan button Edit HTML tu..
2- pastekan kod html yang korang copy kat youtube dalam step (ii-3) tu..

add : kalau korang nak tambah <center> kat depan kod dan </center> di akhir kod tadi pun boleh.. sebab youtube punya kod takde center nanti video korang senget kat tepi..

iv) ok sekarang korang boleh check.. 

1- tekan button compose tengok keluar tak video..?? :)

lepastu bolehlah kalau korang nak create ape ape dalam post tu.. then publish macam biasa.. 
orait.. :)


boleh?? ape ape tanye je k... im always here for u.. :) ececeh~











Monday, 23 January 2012

BE NUFFNANG?? NAK TAHU MACAMANA NURUL DAPAT??


Haish korang ni cakap BE je cepat je sampai kan..

*waa.. mestilah.. sape tak nak duit masyukk dik oii!!*



untuk sahabat sahabat sye yang dah bace entry ni.. ~
dah tahu kan yang nurul baru first dapat BE dari nuffnang..
BE yang ciput nak buat study study boleh lah...



nak tahu macamna nurul dapat BE tu??
haaa... nanti nurul cite.. 
korang kena picit picit dulu iklan nuffnang yang ada dalam blog nurul ni..
kalau tak.. tak nak cite~
hee~ kejamnye..

actually nurul pun baru dapat satu..
dalam proses nak cube dapatkan lagi..
korang supportlah nurul ye.. klik klik iklan nuffnang ni ni..

bagitahu je korang dah klik..
nanti nurul return klik kat blog korang~!!
mesti punyalah..





nak tahu macamana ye~???
tunggu~~~~


Friday, 20 January 2012

TUTORIAL : DISABLE RIGHT CLICK


tak nak orang copy gambar korang??

yelahkan .. zaman sekarang ramai orang suka ambil kesempatan.. 
tahu tahu je gambar kita dah jadi apa..
so... korang just follow tutorial bawah ni.. macam biasa.. simple saje !! :)


1) copy code bawah ni..


<script language=JavaScript>
<!--

//edit by unwanted


var message="Masukkan Mesej Anda Disini";

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

// -->
</script>

2)  Paste yang korang copy atas ni pada "HTML/javascript" dalam blog anda.


     Dashboard >Layout>Add a Page element >html/javascript.

 



ok dah siap!! cuba try tengok jadi tak..?? :)


credit to: unwanted..

note: tq 4 supporting me..

Sunday, 15 January 2012

TUTORIAL : BUAT FACEBOOK LIKE FANPAGE POPUP WINDOW FREE !!


hai hai hai..
harini nurul nak tunjukkan korang cara cara nak buat popup windows untuk blogspot..
untuk fanpage korang,..


like this..
try refresh blog nurul..
ade tak kuar macam atas ni..??





haaa... tutorial ni sangat sangat mudah ok...


1) Pergi ke bahagian Design - Html Sila rujuk gambar dibawah.



2) Tandakan "expande widget templates" , rujuk gambar dibawah .



3) Tekan CTRL + F dan carikan kod ini <body>. Sila rujuk gambar dibawah :



 

4) Copy kan kod - kod dibawah dan letakkan dibawah kod <body> tadi.


<!--FB Popup Mr J Starts--><link href='https://sites.google.com/site/pengerindu/home/fb-like-pop.css' rel='stylesheet' type='text/css'/><script src='https://sites.google.com/site/pengerindu/home/jquery.min.js'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/><script src='https://sites.google.com/site/pengerindu/home/fb-like-pop.js' type='text/javascript'/><!--FB Popup Mr J Starts Ends-->

akan jadi macam ni..



5) Preview dulu dan  klik butang " Save Template "


6) Lepas tu pergi ke Design - Page Elements - Add a Gadget - HTML/JavaScript
dan masukkan kod - kod dibawah ini.

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('body').facebookTrafficPop( {
timeout: 60,
title: "Anda Sudah Join Facebook Kami?",
message: 'Bersama rakan - rakan NurUl di Facebook!',
url: "http://www.facebook.com/MiszzYUyu",
'opacity': 0.5,
'advancedClose':false,
closeable: true
} );
});
//]]>
</script>


7) tukar * message: 'Bersama rakan - rakan NurUl di Facebook!', *
    dan * url: "http://www.facebook.com/miszzyuyu", *

kepada nama dan url fanpages korang.. siap!!

credit to: bro pengerindu ..

sila baca review ini kalau korang still tak boleh buat ok.. :)




REVIEW : FB LIKE FANPAGE POPUP WINDOW BY BLOGGER PENGERINDU


Dua tiga hari lepas nurul ada search tutorial nak buat popup like window kan..
saje bosan.. tengok banyak blog ade..
ada dua cara .. first tu kena guna html.. tick expand widget semua tu lah kan..
second.. guna page element je..

search punya search jumpa blog brother pengerindu ni..
cuba buat sendiri..
ok fine..
xmuncul muncul pun popup window ni.. 

then try contact dia sendiri dan dia buatkan..
baik kot.. free of charge lagi..


tengok tengok.. jadikan??

kalau tak jadi korang cakap lah.. huhu..
sebab kenape nurul refresh nurul tengok takde pun .. :p hihi..

haritu ade nampak orang lain siap buat bisnes lagi sekali buat rm30..
mahal kan kan kan???
gila betul...

nurul akan wat tutorial ni.. masukkan kat tutorial mudah atas tu..
tapi if korang rase tak jadi..
contact je en. pengerindu ni..
dekat facebook die ni..

ok.. :)


Tuesday, 10 January 2012

TUTORIAL : SALJI YANG MENIMBULKAN EFFECT SEJUK PADA BLOG



sejok tak?? hihi.. 


*contoh efek salji yang akan timbul :)*


First tutorial ni nurul buat just untuk isi masa terluang yang melampau ni..
ok banyak sebenarnya tutorial ni kalau di search kat google..
tapi nurul nak buat jugak.. tak kire!! -__-
sape tak nak takpelah.. *sedey*

ok !! :) cuma follow 3 step ini ok.. :

1) Masuk ke Dashboard > Design > Add Gadget > HTML / Javascript

2) Copy kod dibawah ni ye.. :)

<script src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js"></script>

3) Dan save !! senang kan.. cubalah.. :) ianya tak akan memberatkan blog korang.. 

note: if boleh tell me ya.. :)

TUTORIAL : LETAK FACEBOOK SHARE BUTTON DALAM ENTRY

Assalamualaikum..
nak letak facebook share button macam cik N kat entry belah kiri atas tu??
tutorial ini untuk newbie diluar sane.. pada otai otai.. tumpang lalu ya~

1) pergi ke dashboard > design > edit HTML > Expand Widget Templates (Jangan lupa backup template)


2) tekan CTRL+F cari kod :

<div class='post-header-line-1'/>
3) Copy code ni :


 <div style="float:right;padding:4px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/> <script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/></div>


4) paste dibawah code yang korang cari tadi..


preview dulu.. kalau jadi save ok.. :) 

TUTORIAL : LETAK FACEBOOK LIKE BUTTON DI SETIAP ENTRY

Assalamualaikum..


nak letak like button dekat setiap entry korang??
ikut ni..


1) pergi ke dashboard > Design > Html > Expand Widget Template


2) Tekan  Ctrl + F  dan taip code ini :
data:post.body atau <data:post.body/>
 3) copy code ini dan pastekan di BAWAH code di langkah 3 tadi :


<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=standard&amp;show-faces=true&amp;width=530&amp;height=60&amp;action=like&amp;colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:530px; height:60px'/>


dah siap?? preview dulu.. pastu save ok?

TUTORIAL : BORDER POST TITLE & TITLE SIDEBAR SENGET

Assalamualaikum..

kali ni cik N nak tunjuk cara buat border senget untuk post title ..
ikut sini~ hoyeeeh.. camni haa..



1) pergi ke Dashboard > Design > Edit HTML > Tick Expand Widget Templates.


2) cari code ini untuk post title :
h3.post-title, .comments h4 { 
atau

h3.post-title {
* cari code ini untuk title sidebar :
/* Headings
----------------------------------------------- */
h2 {

kalau tak jumpe jugak korang delete satu satu huruf tu eh.. mesti ade lah..  

3) bawah code kat atas tu korang akan jumpa code macam bawah ni.. ish.. seakan akan macam ni bukan sebijik macam ni ok..

margin : 0 ;
padding : 0 ;
font-size: 100% ;
font weight: bold ;

4) korang gantikan dengan code ini:


padding:4px;

margin:1.5em 0 .75em; font-size: 14px;

background: #FFFFFF;

border-top: 3px dotted #000000;

border-bottom: 3px dotted #000000;

border-left: 3px solid #000000;

border-right: 3px solid #000000;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
text-align:center;
}
.post-title:hover {
-moz-border-radius: 1em 4em 1em 4em;               
border-radius: 1em 4em 1em 4em;                 
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
}


kelabu: Your font size.
merah : Warna background.
oren: Ketebalan border.
hijau: Boleh ditukarken kepada solid / dashed / dotted.
turqoise: Warna border. sini..
biru: Jenis-jenis border. Kalau nak tukar, sini... 
ungu: Kedudukan text. Tukar ke left right center

pinksenget border korang. Yang diberi tu senget ke kanan, kalau nak ke kiri tukarkan jadi 2. Nombor pun boleh tukar, makin besar nombor, makin senget la border korang, sampai nombor 5 je ok..

dah jadi??? preview dan save ukey!!

TUTORIAL : BENTUK BORDER MACAM CIK N

Assalamualaikum..


contohnye..


border cik N?? bentuk die lengkung di atas je kan?? macamana nak buat??


1) pergi ke Dashboard>Design>Edit html>Tick Expand Widget Templates (download full template dulu ok..


2) cari code ini.. untuk letak di sidebar..

/* Headings
----------------------------------------------- */

h2 {
 * cari code ini.. untuk letak di post title ..


.post h3 {


3) copy code bawah ni..


-moz-border-radius-topleft: 20px;-moz-border-radius-topright: 20px;-webkit-border-top-left-radius: 20px;-webkit-border-top-right-radius: 20px;-top-right-radius: 20px;border-top-left-radius: 20px;border-top-right-radius: 20px;border-bottom: 7px solid #F5A9E1;background : url(http://2.bp.blogspot.com/-UViideWihGk/TsdKAt0qLrI/AAAAAAAAAJQ/4T6XJ16Yw2A/s1600/backgroundpinkk.png); font-size:14px;padding: 4px;margin: 5px}


dan paste kan di bawah code yang korang cari tadi .. boleh??


merah : korang boleh tukar.. main main kod.. kalau korang nak lengkung nye ke bawah ke kann.. mane tahu..
hijau: ketebalan border yang bawar tu..
biru: boleh tukar ke dashed & dotted *popular*
ungu : kaler border yang bawah tu jugak.. tukar sini..
oren : background untuk border bahagian atas tu cari kat sini..


dah?? preview dulu.. dan save.. :)

TUTORIAL : BENTUK BENTUK BORDER YANG COMEL

Assalamualaikum..

kat sini ade beberapa contoh border yang boleh korang guna.. untuk hias blog korang.. pertama tama sekali korang kena tahu nak letak kat mana tau..

untuk post title :

1) pergi Dashboard > Design > Edit HTML> Tick expand widget


2) cari code ni untuk letak di post title :


h3.post-title {

atau

 .post h3 {

untuk sidebar title :


cari code :


/* Headings


then bawah sikit ade code h2 {  ..


kalau tak jumpa korang try delete satu satu huruf yang korang cari tu ok??
pastu paste je code sidebar bawah ni di bawah code h2 {   yang korang cari tadi.. faham?? maaf ayat belit.. 






-moz-border-radius-bottomright: 50px;
border-bottom-right-radius: 50px;
}
-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;
}

-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;
}

-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
}

-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}


-moz-border-radius: 35px;
border-radius: 35px;
}


selamat mencuba.. :)
Related Posts Plugin for WordPress, Blogger...
Bookmark |