Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts

Nov 25, 2014

Tutorial : Buat Border Blog Melengkung

Assalamualaikum and peace be upon you. ^^



Hello you all!Tutorial ini direquest oleh Miss Typo.Ok,let's learn now! :D

PERHATIAN : TUTORIAL INI KHAS UNTUK PENGGUNA TEMPLATE DENIM.KALAU SIMPLE TEMPLATE,TAK TAHU JADI KE TAK TAPI BOLEH TRY.

Tutorial : Buat Border Blog Melengkung.

1.Dashboard--->Template--->Edit HTML

2.Tekan CTRL+F dan cari code .content-inner atau {#content-wrapper {

3.Dah jumpa?Copy code bawah ni.
-moz-border-radius-topleft: 20px;-moz-border-radius-bottomright: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-top-right-radius: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
4.Paste code korang copy tadi kat bawah code yang korang cari tu.

5.Preview dulu.Kalau dah jadi,tekan save. :)

SELAMAT MENCUBA! ^^


Tutorial : Cara Letak Tab Menu Blogskins

Assalamualaikum and peace be upon you. ^^



Hai semua!Kali ni Wani nak buat tutorial Blogskins.Tutorial ini direquest oleh Ainul Mardhiah. :)

Tutorial : Cara Letak Tab Menu Blogskins.

1.Dashboard--->Template--->Edit HTML

2.Tekan CTRL+F dan search code body { atau .page {

3.Copy dan paste code dibawah kat bawah code yang korang search tadi.


a.navi {
background:#ffffff;
padding-left:12px;
padding-right:12px;
color:#FF467A;
margin-right:4px;
border:1px solid #FF467A;
border-radius:4px;
-webkit-transition:1s;
}
a.navi:hover {
background:#FF467A;
color:#ffffff;
-webkit-transition:1s;
border:2px solid #ffffff;
}

3.Search code </style> pula dan copy code dibawah.
<center>
<a class="navigate" href="https://www.blogger.com/null" onclick="document.getElementById('entry').innerHTML=document.getElementById('diary').innerHTML" title="">Home</a>
<a class="navigate" href="https://www.blogger.com/null" onclick="document.getElementById('entry').innerHTML=document.getElementById('about').innerHTML" title="">Owner</a>
<a class="navigate" href="https://www.blogger.com/null" onclick="document.getElementById('entry').innerHTML=document.getElementById('link').innerHTML" title="">Linkies</a>
<a class="navigate" href="https://www.blogger.com/null" onclick="document.getElementById('entry').innerHTML=document.getElementById('blog').innerHTML" title="">Stuff</a>
</center>
4.Paste code diatas kat bawah code </style>

5.Search code <blogger> dan copy code dibawah.

<div id="can" style="display:none;">
<div class="title">The Owner</div><br>
ISI BIODATA KORANG
</div>
<div id="you" style="display:none;">
<div class="title">My Friends</div><br>
ISI BLOG LIST KORANG  </div>
 <div id="feel" style="display:none;">
<div class="title">Tutobies</div><br>
ISI TUTORIAL KORANG </div>
</div>
 <div id="it" style="display:none;">

6.Paste code diatas kat bawah code <blogger>

7.Preview dulu.Kalau dah jadi dan berpuas hati,tekan 'Save Template'.

NOTE : YANG DIWARNAKAN BOLEH TUKAR.

SELAMAT MENCUBA! ^^ 


Nov 12, 2014

Tutorial : Cara Buat/Edit Blogskin Part 1

Assalamualaikum and peace be upon you. ^^



Hai semua!Kali ni Wani nak buat tutorial cara/edit blogskin.Okay,jom mula sekarang! :D

Tutorial : Cara Buat/Edit Blogskin.

1.Ikut tutorial INI dahulu.

2.CURSOR

-Search code : body {
-Copy code dibawah dan paste selepas code body { tadi


cursor:url("http://fc06.deviantart.net/fs12/i/2006/303/0/7/site_favicon_by_snut.gif"),text;
 Biru : URL CURSOR (tukar ye)

 3.FAVICON


-Search code : <html>
-Copy code ni dan paste dekat bawah <html> tadi
<link href='URL IMAGE' rel='shortcut icon' type='image/x-icon'/>
 Biru : URL FAVICON

4.TITLE BLOG

-Search code : <title>

-Delete ayat yang sedia ada dengan title blog korang.
5.BACKGROUND
-Search code : body {
-Nanti kat bawah ada code seakan akan macam nie :
#Tak semua blogskins sesuai letak header
<center><img src="URL HEADER"></center>
 Biru : URL Header

-AKAN BERSAMBUNG DI PART 2- 

CREDIT TO : Yana


Tutorial : Cara Letak NRelate (Anda Mungkin Juga Meminati)

Assalamualaikum and peace be upon you. ^^



Hai kawan-kawan!Kali ni Wani nak buat Tutorial : Cara Letak Nrelate.Apa tu?Cuba tengok bawah post ni,ada kan 'Anda Mungkin Juga Meminati'?Tulah Nrelate! :) Nak juga?Jom! :D

Tutorial : Cara Letak NRelate (Anda Mungkin Juga Meminati)

1.Pergi ke laman web INI.

2.Isi semua maklumat.

3.Tekan 'I Accept'.

4.Tekan icon Blogger.

5.Isi dengan link blog korang.

6.Tekan 'Posts Only'.Nak pilih yang lagi dua tu pun boleh.

7.Tekan 'Add Widget'.

8.Pergi ke SINI dan Log In.

9.Tekan 'Settings'. *rujuk gambar dibawah*


http://i.imgur.com/Uyf76Cs.jpg
Click gambar untuk lebih jelas

10.Adjust dan tukar mengikut citarasa anda. *tekan 'Style' kalau nak tukar style*

11.Selepas puas,tekan 'Update'.

12.Tengok blog. *refresh dulu ya*

13.TADA!! :D


http://i.imgur.com/XzSd9MU.jpg
Click gambar untuk lebih jelas

SELAMAT MENCUBA! ^^

NOTE : SEBARANG PERTANYAAN BOLEH NYATAKAN SOALAN DI KOMEN. 


Nov 11, 2014

Tutorial : Cara Buat Sticky Post

Assalamualaikum and peace be upon you. ^^



Tutorial : Cara Buat Sticky Post.

Nov 10, 2014

Tutorial : Cara Tukar Favicon

Assalamualaikum and peace be upon you. ^^v



Kali ini Wani nak buat tutorial Cara Tukar Favicon yang telah direquest oleh cik Halisya Isma.Thanks Halisya sebab request. ^^ First of all,Wani nak tanya korang.Korang tahu tak apa itu Favicon?Tahu?Tak tahu?Meh Wani tunjuk.


https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-xpa1/v/t34.0-12/10728887_753668591383892_496821483_n.jpg?oh=de06aadf016bc0ac01a20a877dc0bb91&oe=54623BC1&__gda__=1415776478_7295f7aec7586ccfd1da381430410878
Click gambar untuk lebih jelas

Yang dibulatkan merah tulah Favicon.Tak nampak?Tekan gambar diatas. :) Dah nampak?Jom mula! :D

Tutorial : Cara Tukar Favicon.

Simple Template.

1.Dashboard--->Layout

2.Tekan 'Edit' yang kat sebelah 'Favicon'. *rujuk gambar dibawah*


http://i.imgur.com/iYNw7iT.jpg
Click gambar untuk lebih jelas

3.Lepas keluar Pop Up Box,tekan 'Browse'. *rujuk gambar dibawah*


http://i.imgur.com/CB5kpbI.jpg
Click gambar untuk lebih jelas

4.Pilih icon yang awak mahu. :)

5.Selepas sudah,tekan 'Save'.

6.Lihat blog.

Blogskins.

1.Dashboard--->Template


2.Search code : <html>

3.Copy code ni dan paste kat bawah code <html>
<link href='URL IMAGE' rel='shortcut icon' type='image/x-icon'/>
4.Tekan 'Save Template' atau seumpamanya.

5.Lihat blog.

SELAMAT MENCUBA! ^^


Nov 6, 2014

Tutorial : Cara Letak Lagu Kat Blog (SCM Player)

Assalamualaikum and peace be upon you. ^^




Hai semua.Hari ni Wani nak buat tutorial yang telah direquest oleh ramai blogger.Tutorial apa?Tutorial Letak Lagu Kat Blog!Nak cuba?Jom!

Tutorial : Cara Letak Lagu (SCM Player).

1.Pergi ke laman web INI.

2.Pilih Skin yang awak mahu dan tick.

3.Tekan 'Edit Playlist'.

4.Isi kotak 'Song Title' dengan tajuk lagu yang anda mahu masukkan dan isi kotak 'Song URL' dengan link video lagu Youtube.

5.Tekan punat 'Add More Songs' kalau mahu tambahkan lagu.

6.Setelah puas,tekan 'Configure Setting' pula.

7.Tick,pilih dan adjust mengikut kepuasan anda.

8.Tekan butang 'Done' yang terletak dibawah. 

9.Copy semua kod yang disediakan.

Cara Letak Lagu Kat Blog.

Blogskin.

1.Dashboard--->Template

2.Paste code yang korang paste tadi kat bawah sekali. *kat kotak code*

Simple Template/Blogger Template.

1.Dashboard--->Layout

2.Add A Gadget--->HTML/JAVASCRIPT

3.Paste code yang korang copy tadi.

SELAMAT MENCUBA. ^^


Nov 1, 2014

Tutorial : Cara Tukar Link Blog

Assalamualaikum and peace be upon you. ^^

Google Source

Hai semua!Kali ini Wani nak buat tutorial tukar link blog pula.Entah kenapa hari ini terlebih rajin pula mahu buat tutorial. ^^ Tutorial ini khas untuk yang tidak reti tukar link blog dan ada berhasrat ingin tukar link blog.Baiklah,let's learn now! :D

Tutorial : Cara Tukar Link Blog

1.Dashboard--->Settings. *rujuk gambar di bawah*

http://i.imgur.com/TWPCgVF.jpg
Click gambar untuk lebih jelas

2.Tekan 'Edit'. *rujuk gambar di bawah*

http://i.imgur.com/wCf8R59.jpg
Click gambar untuk lebih jelas


3.Tukar dengan link yang baru.

4.Tekan punat 'Save Settings' atau seumpamanya.

5.Cuba buka blog.

6.Siap!! :)

Selamat mencuba! ^^

Tutorial : Letak Tapak Iklan Bergerak

Assalamualaikum and peace be upon you. ^^



Assalamualaikum semua.Hari ni Wani nak buat tutorial letak iklan bergerak.First of all,Wani credit tutorial ini kepada kak Uzu a.k.a Emas Putih.Ok,let's do now! :D

Tutorial : Letak Tapak Iklan Bergerak

1.Dahshboard--->Layout--->Add A Gadget.

2.Pilih 'HTML/JAVASCRIPT'.

3.Copy dan paste code dibawah :

Oct 14, 2014

Tutorial : Cara Cantikkan Blog (Blogskins)

Assalamualaikum and peace upon you. ^^



Hai semua!Hari ni Wani nak ajar korang cara guna Blogskins.Blogskins memang sesuai bagi 'New Blogger' dan Blogger yang mahu cantikkan blog kerana tidak perlu edit edit bagai dan terus pakai.Nak cuba?Jom!

Tutorial : Guna Blogskins.

1.Log in--->Dashboard.


2.Template--->Revert to classic templates (scrool ke bawah sampai jumpa).

3.Tinggalkan dan pergi ke laman web www.blogskins.com.

4.Pilih Blogskins yang dimahukan.

5.Tekan 'Blogger Main'. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

6.Copy semua code.

7.Pergi ke blog anda semula dan padam semua code di kotak yang disediakan.

8.Paste dengan code yang anda copy tadi.

SELAMAT MENCUBA! ^^

If you have any question,tell me at the comment box. :)


Tutorial : Cara Buat Blog

Assalamualaikum and peace upon you. ^^



Hari tu ada beberapa orang kat Facebook tanya,

"Macam mana cara buat blog?"

Baiklah,meh Wani ajar. :)

Tutorial : Cara Buat Blog.

1.Pastikan ada account gmail.Kalau tiada,boleh register di SINI.

2.Pergi ke laman web INI.

3.Tekan 'New Blog'.

4.Tulis 'Nama Blog' dan 'Link Blog' di ruangan yang disediakan. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

5.Tekan 'Create Blog'. *rujuk gambar diatas*

6.Sekarang anda boleh menggunakan dan menulis di blog anda! :)

SELAMAT MENCUBA! ^^


Tutorial : Transparent Gambar Guna Pixlr Editor

Assalamualaikum and peace upon you. :)


Doodle : Fizgraphic

Selalu search Google,Tutorial Transparent Gambar guna Photoshop kan?Meh Wani ajar cara Transparent Gambar guna Pixlr Editor pula.Lebih mudah dan senang. :) Ok,jom mula!! ^^


Tutorial : Transparent Gambar Guna Pixlr Editor.


1.Buka laman web Pixlr Editor ----> SINI!SINI!


2.Tekan 'Open image from computer' atau 'Open Image From URL'. *rujuk gambar dibawah*



Click gambar untuk lebih jelas 

3.Pilih gambar yang mahu di transparent.

4.Layer 0 (yang kat kanan) ----> Tekan mangga dua kali.

5.Tekan icon Wand Magic Tool. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

6.Click tempat gambar yang mahu di transparent. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

7.Click 'Edit' dan click 'Cut'. (tekan CTRL + X pun boleh) *rujuk gambar diatas*

8.Tekan 'File' dan tekan 'Save...' (kat bahagian atas)

9.Pastikan 'PNG (Transparent,full quality)'. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

10.Click 'Ok'. *rujuk gambar diatas*

SELAMAT MENCUBA!

Kalau ada apa-apa pertanyaan boleh tanya di komen. :)


Oct 13, 2014

Tutorial : Letak Top Comentators

Assalamualaikum and peace upon you. ^^


Source


Ada blogger sorang ni,tanya:

"Macam mana letak top commentators?"

Oh,mudah je.Sebelum tu,Wani nak credit tutorial ini kepada www.duniashida.com. :)

Ok,let's start now!

Tutorial : Letak Top Commentators.

1.Dashboard--->Layout--->Add A Gadjet--->HTML/JAVASCRIPT.


2.Copy dan paste code ini di ruangan yang disediakan :


<script type="text/javascript"> function getYpipe(feed) { document.write('<ol>'); var i; for (i = 0; i < feed.count ; i++) { var href = "'" + feed.value.items[i].link + "'"; if(feed.value.items[i].link == "") var item ="<li>" + feed.value.items[i].title + "</li>"; else var item = "<li>" + "<a href="+ href + '" target="_blank">' + feed.value.items[i].title + "</a> </li>"; document.write(item); } document.write('</ol>'); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run? YourBlogUrl=http://wani-siulatbuku.blogspot.com &ExcludedNick1= Anonymous &ExcludedNick2= Noor Izwani Eliyana &ShowHowMany= 10 &ExcludeCommentsBefore=01-01-2014 &IncludeCommentsBefore=30-12-2014 &_callback=getYpipe &_id=50b225c916b74b06779b9489abceef2a &_render=json" type="text/javascript"></script>
Biru Pekat : Orang yang dikecualikan daripada tersenarai
Merah : Bilangan Top Commentators
Hijau : Tarikh mula Top Commentators
Ungu : Tarikh akhir Top Commentators

Yang tarikh mula dan tarikh akhir tu,contohnya awak nak buat Top Commentators Oktober,jadi tarikh mula letak 01/10/2014 dan tarikh akhir letak 31/10/2014.Faham? ^^

SELAMAT MENCUBA! :)


Sep 20, 2014

Tutorial : Buat Cursor Sendiri

Assalamualaikum and peace upon you. ^^


Google Image Source
Wani telah menerima request tutorial daripada Adik Aqilah.Dia bertanya :

"Macam mana nak buat cursor sendiri?"

Oh,mudah sahaja.Mari Wani ajar secara step by step. :)

Tutorial : Buat Cursor Sendiri.

1.Mula-mula,cari pointer/arrow kat Google dan save.

2.Lepas sudah,cari pula icon kiut-miut mengikut pilihan anda dan save.

3.Lepas sudah save,buka Photoscape.

4.Tekan 'Editor'. *rujuk gambar dibawah*


Click gambar untuk lebih jelas

5.Tekan 'Menu'. *rujuk gambar dibawah*

Click gambar untuk lebih jelas
6.Bila keluar Pop up box,tekan 'New Photo'. *rujuk gambar dibawah*

Click gambar untuk lebih jelas

7.Adjust Width dan Height mengikut kesesuaian.


Click gambar untuk lebih jelas
8.Klik Object dan klik icon pemandangan.Tekan Photo... lepas keluar Pop up box. *rujuk gambar dibawah*

Click gambar untuk lebih jelas
9.Pilih pointer yang anda save.

10.Letak pointer yang anda masukkan tadi di penjuru atas sebelah kiri. *rujuk gambar dibawah*

Click gambar untuk lebih jelas
11.Masukkan pula icon kiut-miut. *ikut step no.8 dan 9*

12.Letakkan icon yang baru anda masukkan di bawah pointer. *rujuk gambar dibawah*


13.Tekan 'Save' dan lepas keluar Pop up Box,tekan 'Save As'. *rujuk gambar diatas*

14.Upload cursor anda itu di imgur.com untuk dapatkan URL.

15.Sudah?Copy code ini dan paste di ruangan HTML/Javascript (add gadjet) :

<style type="text/css">
body{cursor: url("URL CURSOR ANDA"), auto;}
</style>


Warna biru : Ganti dengan URL cursor anda upload tadi. :)

16.Siap! ^^ 

Bagaimana?Mudah kan? ^^ 

Kalau ada sebarang pertanyaan boleh tanya di komen. :) Bye! ^^

Note : Cursor anda tidak transparent?Nantikan Tutorial Cara Buat Gambar Transparent! ^^


 
© Copyright | All Right Reserved by Noor Izwani Eliyana.Template by Samiqa