Jumaat, 29 Jun 2012

tutorial title blog bergerak : version 2

Siti Nurfariha | 11:02 PG | 2Comments |
1. dashboard - design - page element - add gadget Html/java script

2. copy & paste code nie .

<script type="text/javascript">
//Created by Title bar Maker (http://www.bosiljak.hr/titlemaker)
function tb1_makeArray(n){
this.length = n;
return this.length;
}
tb1_messages = new tb1_makeArray(1);
tb1_messages[0] = "title blog korang";
tb1_bln = 50;
tb1_rptType = 'infinite';
tb1_rptNbr = 5;
tb1_speed = 100;
tb1_counter=1;
tb1_timer = null;
tb1_last = 1;
tb1_st='';
tb1_currMsg = 0;
function tb1_scrolltitle(){
if (tb1_last > tb1_messages[tb1_currMsg].length){
if (tb1_st.length == 0){
tb1_last=1;
if (tb1_currMsg == tb1_messages.length-1){
if ((tb1_rptType == 'finite') && (tb1_counter==tb1_rptNbr)){
clearTimeout(tb1_timer);
return;
}
tb1_counter++;
tb1_currMsg=0;
}
else{
tb1_currMsg++;
}
}
else{
tb1_st=tb1_st.substring(1,tb1_st.length);
}
}
else{
tb1_st = tb1_messages[tb1_currMsg].substring(0, tb1_last);
for (var i=0; i<=(tb1_bln+tb1_messages[tb1_currMsg].length-tb1_last); i++)
tb1_st="_"+tb1_st;
tb1_last++;
}
document.title = tb1_st;
tb1_timer = setTimeout("tb1_scrolltitle()", tb1_speed);
}
tb1_scrolltitle();
</script>

3. save & view blog .

Tutorial - Title Bog Kelip - Kelip : version 1

Siti Nurfariha | 11:02 PG | 0Comments |
hello :) 
Kita nak buat tutorial nie . kali nie untuk buat title blog kelip-kelip . eemm means , title tu bergerak lah . 

1. dashboard - design - page element - add gadget Html/java script

2. copy & paste code dekat add gadget .

<script type="text/javascript">

//Created by Title bar Maker (http://www.bosiljak.hr/titlemaker)
function tb3_makeArray(n){
this.length = n;
return this.length;
}
tb3_messages = new tb3_makeArray(1);
tb3_messages[0] = "title blog korang";
tb3_rptType = 'infinite';
tb3_rptNbr = 5;
tb3_speed = 500;
tb3_nbrOneMsg = 5;
var tb3_currMsg=0;
var tb3_timerID = null;
var tb3_switcher = 0;
var tb3_countOneMsg=0;
var tb3_counter=1;
function tb3_blinktitle(){
if (tb3_countOneMsg == tb3_nbrOneMsg){
if (tb3_currMsg == tb3_messages.length-1){
if ((tb3_rptType == 'finite') && (tb3_counter==tb3_rptNbr)){
clearTimeout(tb3_timerID);
return;
}
tb3_counter++;
tb3_currMsg=0;
tb3_countOneMsg=0;
}
else{
tb3_currMsg++;
tb3_countOneMsg=0;
}
}
if (tb3_switcher==0){
document.title = tb3_messages[tb3_currMsg];
tb3_switcher=1; tb3_countOneMsg++;
}
else{
document.title = "______________________________________________________________";
tb3_switcher=0;
}
tb3_timerID = setTimeout("tb3_blinktitle()", tb3_speed)
}
tb3_blinktitle();
</script>

3. done ! save & view blog korang .

Khamis, 28 Jun 2012

Tutorial - Buat Iklan Di Sidebar

Siti Nurfariha | 11:42 PG | 2Comments |
1. design > page element > add gadget > Html/java script


2.copy & paste code di bawah nih
<center>

<a href="link iklan" target="_blank" title="Support this campaign">
<img style="border:1px double #DA81F5;" src="url image" height="70" /></a>
<a href="link iklan" title="Support this campaign">
<img style="border:1px double #DA81F5;" src="url image" height="70" /></a>
<a href="link iklan" target="_blank" title="Support this campaign">
<img style="border:1px double #DA81F5;" src="url image" height="70" /></a>
</center>
3.okey , now edit code tu ikut cita rasa korang .
merah : letak link iklan korang . churp-churp , heartbeat , dll
purpel : letak lah ayat apa-apa kalau nak tukar
hitam : ketebalan border .
biru : warna border .
oren : url gambar .


4. done , save ! :D hehe . 

Isnin, 25 Jun 2012

Tutorial - Cara Tukar Favicon Blogspot

Siti Nurfariha | 8:40 PG | 0Comments |
Apa itu favicon? Favicon sebenarnya adalah singkatan kepada “Favourite Icon” iaitu icon atau logo. Favicon terletak di tepi title tab pada browser. Favicon ini juga mewakili identiti blog kerana apabila kita buka sesebuah blog akan terpapar favicon pada tab browser.

Cara untuk menukar favicon ini amatlah mudah. Tutorial ini hanya bagi pengguna blogspot sahaja okey. ;-)

STEP 1
DASHBOARD>DESIGN>PAGE ELEMENTS> klik “edit” pada tepi widget favicon seperti dalam gambar dibawah;

STEP 2
Apabila klik edit html akan kuar pop out seperti di gambar di bawah. Klik “Choose File” dan browse favicon dari laptop/notebook/computer yang dah korang ada simpan. Selepas siap masukkan gambar, sila klik “Save”

STEP 3
Kemudian klik “Preview” untuk lihat hasilnya. Berpuas hati boleh klik “Save” pada Page Elements.

Jumaat, 22 Jun 2012

.Tutorial - Import dan Export Pos-pos Blog

Siti Nurfariha | 8:01 PG | 0Comments |
kalau korang rasa korang dah lima tahun berblog lepastuh berlambak pulak entry korang buat,eeemm seminit satu entry lah katakan. korang boleh lah ikut tutorial yang kita bagi ni. :D
Export blog.

1.1 Pilih
Settings | Basic | Export Blog:

1.2 Selepas klik Export blog klik DOWNLOAD BLOG:

1.3 Samada pelayar internet akan terus menyimpan fail yang diexport dalam directory yang telah ditetapkan atau akan membuka satu dialog box. Pilih Save File dan klik Ok.

1.4 Fail adalah dalam format XML dan Blogger akan menamakan fail ini seperti blog-04-01-2010. Ingatkan di mana fail ini disimpan dalam komputer anda. Nama fail boleh dipinda kemudian seupaya sesuai dengan blog berkenaan.

1.5 Fail backup yang diexport hanya mengandungi semua pos-pos dan komen-komen bersangkutan jika ada. Segala widget atau gadget yang ada dalam sidebar blog anda tidak termasuk fail ini. Sila uruskan backup widget dalam sidebar dengan cara manual.
Import Blog.

2.1 Export fail yang telah disimpan di atas boleh diimport bila-bila masa kedalam mana-mana blog yang ada. Fail ini juga boleh di import kedalam blog selain dari blog yang menggunakan platform blogger. Semua pos-pos akan terus di publish.

2.2 Pilih Settings | Basic | Import Blog:

2.3 Selepas klik Import Blog, Browse cari fail yang telah disimpan di atas:

2.4 Kesemua pos-pos yang diexport akan di siarkan dalam blog yang mengimport.

Selamat Mencuba!
=.=
sumber:calipso tuorial blog

Khamis, 21 Jun 2012

.Tutorial - Page FB Yang Lebih Style Untuk Blog

Siti Nurfariha | 4:05 PTG | 0Comments |
1. Dari dashboard > design > add a gadget > HTML/javascript.

2. Copy dan paste code di bawah kedalam ruangan HTML/javascript dan ubah seperti yang dinyatakan dalan nota di bawah.

<center><iframe style="height:250px; width:85%; " scrolling="no" frameborder="0"href=" 

URL PAGE
"src="http://www.facebook.com/plugins/fan.php?id=
NO ID PAGE
&width=292&height=250&connections=25&stream=false&header=false&logobar=false&css=https://sites.google.com/site/unwanted86/javascript/fblike.css" ></iframe></center><center><iframe src="http://www.facebook.com/plugins/like.php?href=
URL PAGE
&send=false&layout=standard&width=292&show_faces=false&action=like&colorscheme=light&font&height=40" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:40px;" allowtransparency="true"></iframe></center><p align="right"> <small><a href="http://tutorialuntukblog.blogspot.com/2011/09/page-fb-yang-lebih-style-untuk-blog.html">Get tutorial here </a></small></p>

Nota:
a)Gantikan url page dengan url page korang
b) Gantikan No ID page dengan no ID page korang
klik pada 'edit info', kemudian daripada paparan yang muncul akan anda no di url, itu adalah No ID page korang
dah selesai gantikan yang berkenaan, save dan lihat hasilnya.:)

Tutorial - centerkan date header

Siti Nurfariha | 3:38 PTG | 0Comments |
Dashboard-Design-edit HTML-tick Expand Widget Templat.
Dengan CTRL+F cari code ni:

    /* Posts
    -----------------------------------------------
    */
    h2.date-header {
    margin:1.5em 0 .5em;
    }

Dah jumpa,copy code ni dan paste kat BAWAH code tadi:
text-align:center
Preview dan Save
;-)

.Tutorial - Bentuk bentuk border untuk sidebar, post dan blockquote

Siti Nurfariha | 3:19 PTG | 0Comments |

Step 1 :
Dashboard > design > edit html > tick expand widget template
Tekan Ctrl + F

Untuk sidebar/ tajuk sidebar
cari : h2 { 
ataupun .sidebar .widget{
ataupun .sidebar h2 {
 
Untuk tajuk post
h3.post-title {

Untuk blockquote
.post blockquote {

Step 2 :Copy dan paste kan coding kat bawah ni, letak selepas coding yang korang search tadi

(A)
    -moz-border-radius-bottomright: 50px;
    border-bottom-right-radius: 50px; 

(B)
    -moz-border-radius-bottomright: 50px 25px;
    border-bottom-right-radius: 50px 25px;

(C)
    -moz-border-radius-bottomright: 25px 50px;
    border-bottom-right-radius: 25px 50px;
(D)
    -moz-border-radius: 1em 4em 1em 4em;
    border-radius: 1em 4em 1em 4em;

(E)
    -moz-border-radius: 25px 10px / 10px 25px;
    border-radius: 25px 10px / 10px 25px;

(F)
    -moz-border-radius: 35px;
    border-radius: 35px;


Selepas tu, tekan preview
Kalau ok tekan SAVE

.Tutorial - Background Dalam Entry

Siti Nurfariha | 9:23 PG | 2Comments |

"HA! NI LAH BACKGROUND DALAM ENTRY YANG KITA CAKAP KAN"

AMARAN : code ini akan berfungsi dalam Edit HTML bukan Compose dalam posting korang..so sila taip post korang dalam format Edit HTML
step 1
korang boleh cari background untuk entry korang di SINI pilih mana yang berkenan dan upload dalam photobucket
step 2
dapatkan direct link dekat photobucket dan copy direct link tu.
step 3 
dah copy then pastekan sebelum entry korang, korang boleh pilih entry mana korang nak letak background nie.
bila dah siap semua step 1 & step 2 korang taip entry korang seperti biasa, bila korang nak letak background korang just copy and paste code dibawah ini

<div style="background:url(URL BACKGROUND) repeat;" >
TAIP ENTRY DI SINI
</div>
kalau tak faham tanya ye.
:-)
Bye Bye

Jumaat, 15 Jun 2012

. Tutorial - Cara nak delete Malware dalam blog

Siti Nurfariha | 10:52 PG | 0Comments |

Dulu blog kita pun pernah kena serang dengan Malware ni..Memang menggelabah lah kan, menjejaskan reputasi belog kita jerk :p
Yela, kalau blogger baru, bile tengok warning malware ni mesti dah tak nak visit blog kita..
Tapi lepas kita test and cuba rupanya cara nak delete Malware, senang jer pun..

dekat bawah ni adalah tips-tips nak delete Malware dalam blog
Delete semua link bloglist dekat blog
Clearkan semua history dalam browser yang korang guna. 
Scan secara online 
Download Malwarebyte's Anti Malware.
Tips yang pertama dan kedua adalah wajib harus dan sunat..


Okey Bye 

Khamis, 14 Jun 2012

. Tutorial - jenis jenis border untuk sidebar, post dan blockquote

Siti Nurfariha | 1:18 PTG | 0Comments |
Pilih border yang korang suka
 Step 1 :
Dashboard > design > edit html > tick expand widget template
Tekan Ctrl + F
Untuk kotak sidebar/ tajuk sidebar
 cari : h2 {
ataupun .sidebar .widget{
ataupun .sidebar h2 {

Untuk tajuk post
h3.post-title {

Untuk blockquote
.post blockquote {

Step 2 :
Copy dan paste kan coding kat bawah ni, letak selepas coding yang korang search tadi

(A)
-moz-border-radius-bottomright: 50px;
border-bottom-right-radius: 50px;

(B)
-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;

(C)
-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;

(D)
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;

(E)
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;

(F)
-moz-border-radius: 35px;
border-radius: 35px;

Selepas tu, tekan preview..Kalau ok tekan SAVE

Ini adalah contoh border yang kita gunakan untuk tajuk sidebar

.sidebar h2 {
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
text-align: center;
background:#FAAFBE;
margin:0;
padding:0 0.2em;
line-height:1.5em;
}

. Tutorial - Center kan header

Siti Nurfariha | 1:13 PTG | 3Comments |
tengah tengah buat tutorial masukkan code dalam entry tadi kawan kita sms, dia minta kita buat tutorial nak centerkan header. sebab kadang kadang korang punya header tak kan center dengan betul. jadi korang perlu lakukan step ni. untuk dapatkan header yang center dan tersusun kemas hehehe
 
Step 1:
pergi kat Dashboard > Design > Template Designer > Advance > Add CSS

Step 2:
Masukkan code ini
#header-inner img {margin: 0 auto !important;}
#header-inner {text-align:center !important;}
 
Step 3:
Tekan apply.. siap :-)

Tutorial - Masukkan code dalam entry

Siti Nurfariha | 1:04 PTG | 0Comments |
Selamat tengahari semua ? okey kali ini ieyha nak ajar korang macam mana nak meletakkan code/html ke dalam entry. tutorial kali ini sangat senang untuk di fahami.
okey. tanpa buang masa, mari ikut tutorial ieyha ni. :-)
Step 1 : click di sini yea then dia akan keluar 1 box.                          
Step 2 : Masukkan code/html yang korang nak masukkan. then, click pada Encode.
Step 3 : Bila dah click button Encode, automatik akan bertukar code/htmlny
Step 4 : Copy & Paste kan code tersebut ke dalam entry yang nak dipostkan. before that, preview dulu baru save.
Step 5 : Siap !

kalau tak faham tanya ye
>_____<

Rabu, 13 Jun 2012

Tutorial - Ketahui Kelajuan Load Element Blog

Siti Nurfariha | 1:37 PTG | 0Comments |
Kecepatan sesebuah blog untuk dibuka oleh pengunjung juga memainkan peranan penting dalam dunia blogging. Selain bergantung kepada jenis browser yang digunakan dan kecepatan internet, perkara penting lain adalah kandungan element yang mencorakkan sesebuah blog.

macam mana eik cara korang nak tahu selaju mana blog korang load, dan apakah element yang tidak mendatangkan masalah, dan elemen manakah yang menyumbang kepada masalah lambat load pada blog korang.?:-)
Caranya mudah sahaja.

1. Buka website ini. http://tools.pingdom.com
2. Masukkan url blog anda, kemudian tekan 'test now'
 3. lepas tuh korang akan dapat sedikit informasi tentang blog korang, dan yang paling penting adalah masa load setiap element. Tindakan seterusnya bergantung kepada kehendak korang.:)
nampak tak dekat anak panah kita tuh! masa 

said: Kebiasaanya yang menyebabkan lambat adalah gambar beranimasi ataupun javascript.:)

Isnin, 11 Jun 2012

. Tutorial - Calendar Belog.

Siti Nurfariha | 4:22 PTG | 0Comments |
teacher fariha yang lagi cute nak buat tutorial ni, siapa nak belajar!?hehehe. tengah bosan bosak dekat office tak tahu nak buat apa, dah mati kutu ni tak ada kerja nak buat so amik kesempatan atas apa yang ada kita buka belog tercinta :-) ngehngehngeh

Sebelum itu kita nak bagi introduce sikit untuk tutorial ini. calendar belog ni sebenarnyakan sama juga dengan blog archive biasa tapi dia lebih compact dan sejuk mata apabila dipandang hehehe =.=. 

Contohnya, kalau reader click mana-mana tarikh kat calender itu, maka dengan izin allah entry yang di tulis pada tarikh tersebut akan keluar. Reader pun senang nak cari sebab tarikh-tarikh yang kita tulis entry tersebut akan di BOLD kan.nampak tak anak panah tuh tunjuk apa! ha itu lah calendar yang dia boleh review entry lepas lepas
Cara nak buatnya senang sahaja :

1. Sign in blogger > Design > Add Gadget > Html/JavaScript
2. Copy code di bawah dan paste ke dalam Html/Java Script



<center><div id="blogCalendar"></div>
<script type="text/javascript" src="http://lvchen-recentcomments.googlecode.com/svn/trunk/Calendar/1.0/calendar_pack.js"></script>
<script type="text/javascript">
Calendar.base="sitinurfariha.blogspot.com/";
Calendar.timeZone="+08:00";
Calendar.timeZoneCheck = true;
Calendar.drawTable();
</script>
<style>
#blogCalendar {
display:block;
text-algin:center;
border:3px solid #ffffff;
width:90%;
background: #ffffff;
}
#CalendarCaption a {
text-decoration:none;
}
#CalendarCaption {
border-bottom: 2px solid #ffffff;
width:85%;
margin:auto;
}
#CalendarTable a {
font-weight:bold;
color: #ff0000;
}
.Today {
background: #ffffff;
font-weight:bold;
text-decoration:none;
}


#CalendarFooter {
font-weight:bold;
margin-top:5px;
margin-bottom:5px;
background: #ffffff;
}
.yearInput {
color: #000000;
background: #ffffff;
}
.monthTable {
color: #000000;
background: #ffffff;
}
</style></center>


3. Gantikan sitinurfariha.blogspot.com dengan link blog korang.warna font merah tu warna untuk background dan border. Nak tukar colour tengok sini. Kalau nak macam gambar di atas guna je code yang kita dah bagi tu.

4. Save dan lihat hasilnya.