Cara buat blog versi youtube video

1. Klik tanda anak panah yang bertuliskan " CREATE A BLOG "

2. Daftar akaun blogger dengan alamat gmail atau email anda.

3. Taipkan Blog Title dengan nama yang ingin anda gunakan. Sebagai contoh, Ini blog saya.

4.Taipkan alamat blog anda di ruangan Blog Adress (URL). Sebagai contoh, Iniblogsaya2010.blogspot.com.

5. Isi dibahagian Word Verification dengan teks yang dipaparkan pada captcha.

6. Seterusnya klik Continue.

7. Pilihlah template yang anda inginkan. Kemudian klik button anak panah yang bertuliskan Continue.

8. Setelah keluar tulisan Start Blogging, klik button tersebut. Anda kini sudah boleh mula menulis. Setelah selesai menulis, klik Publish Post.

Read More

Cara pasang tab menu pada blogspot

Untuk memasang tab menu seperti yang boleh anda lihat pada blog ini (sila klik), sila ikut beberapa langkah di bawah.

p/s: Sila save script template anda.

Langkah 1

Log in blog => Dashboard => Layout Edit HTML.

Langkah 2

Dengan menggunakan keyboard, taip atau paste kod ]]></b:skin> pada ruang Find dan seterusnya tekan Enter.


Langkah 3

Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod ]]></b:skin>

#tabmenu{
width: 210px;
margin: 0 auto;
}
.box{
background: #fff;
width: 196px;
padding: 0 5px 0 5px;
}
.boxholder{
clear: both;
padding: 2px;
background: #ccc;
}
.tab{
float: left;
height: 28px;
width: 68px;
margin: 0 0px 0 1px;
text-align: center;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMrP2MVFw-42MzEAEEZlKVggvLUnDLVJkBmMR8tPqoOVLG8Nd7XVSwUWpsw2gFesFh0kKMWHvEo9AP0QxrbIYZHBd9m4f9v7z11MpTA9IfFr52de4zQrtndWAx59nQuGzGjWX8F5YeFWo/s320/btn_3.png) no-repeat;
}
.tabtxt{
margin: 0;
color: #fff;
font-size: 12px;
font-weight: bold;
padding: 8px 0px 0 5px;
}

Langkah 4

Sekali lagi, dengan menggunakan keyboard taip kod </head> dan seterusnya, tekan Enter.


Langkah 5

Salin kod berwarna merah di bawah dan paste di atas atau sebelum kod </head>

<script type="text/javascript" src="http://sites.google.com/site/defaultjssite/prototype.lite.js"></script>
<script type="text/javascript" src="http://sites.google.com/site/defaultjssite/moo.fx.js"></script>
<script type="text/javascript" src="http://sites.google.com/site/defaultjssite/moo.fx.pack.js"></script>
<script type="text/javascript">
function init(){
    var stretchers = document.getElementsByClassName('box');
    var toggles = document.getElementsByClassName('tab');
    var myAccordion = new fx.Accordion(
        toggles, stretchers, {opacity: false, height: true, duration: 600}
    );
    //hash functions
    var found = false;
    toggles.each(function(h3, i){
        var div = Element.find(h3, 'nextSibling');
            if (window.location.href.indexOf(h3.title) > 0) {
                myAccordion.showThisHideOpen(div);
                found = true;
            }
        });
        if (!found) myAccordion.showThisHideOpen(stretchers[0]);
}
</script>

Langkah 6

Salin kod hijau di bawah dan paste pada notepad. Edit teks yang di bold dengan memasukkan teks, link ataupun script yang sesuai.

<b:widget id='HTML100' locked='false' title='Tab menu' type='HTML'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div id='tabmenu'>
    <div id='content'>
    <h3 class='tab' title='first'><div class='tabtxt'><a href='#'>Title 1</a></div></h3>
    <div class='tab'><h3 class='tabtxt' title='second'><a href='#'>Title 2</a></h3></div>
    <div class='tab'><h3 class='tabtxt' title='third'><a href='#'>Title 3</a></h3></div>

    <div class='boxholder'>

        <div class='box'>
            Masukkan teks,link atau script disini
        </div>
        <div class='box'>
            Masukkan teks, link atau script disini
        </div>
        <div class='box'>
            Masukkan teks,link atau script disini
        </div>
        
    </div>
</div>

</div>
<script type='text/javascript'>
    Element.cleanWhitespace('content');
    init();
</script>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

Langkah 7

Sekali lagi dengan menggunakan keyboard, taip atau paste kod <b:section class='sidebar' id='sidebar' preferred='yes'> 

Langkah 8

Salink kod yang telah siap di edit pada langkah 6 tadi dan paste kod tersebut di bawah atau selepas kod <b:section class='sidebar' id='sidebar' preferred='yes'>

Akhir sekali, klik Preview dan jika tiada mesej Error terpapar dan anda berpuas hati dengan hasilnya, klik saja Save.

Read More

Cara pasang menu bar dengan drop down versi pink

Untuk memasang menu bar dengan drop down versi pink seperti yang boleh anda lihat di sini (sila klik), hanya ikut beberapa langkah yang di tunjukkan di bawah.

p/s: Sila save script template anda.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML.

Langkah 2

Dengan menggunakan keyboard, tekan kekunci Ctrl+F dan taip atau paste kod ]]></b:skin> . Seterusnya, tekan Enter.

Langkah 3

Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod ]]></b:skin> (rujuk langkah 2)

#pinkmenubar{
/*float: left;*/
/*width: 100%;*/
margin: 0 0 10px 0 ;
padding: 2px 2px 2px 20px;
height: 28px;

background-color: #FEE4F6;

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhuW_z4zqF3maiSWJuCy_J3bdZPkzPiJ4MrhNXBC-UJfz09RWVDOQQpKNJX531X0scWvBQzXo70TABGZhIiKc52LmJKNti23WFC0e3AlVlUI6l7HLSwaThABfm76kDXHqKCQP6Xjr8_ko/s400/navbg.png");
background-repeat: repeat-x;
background-position: bottom;
border-color: #E3099E;
border-width: 1px 0 1px 0;
border-style: solid;
text-transform: lowercase;
line-height: 100%;
width: auto;

}

#pinkmenubar > li{
float: left;
width: 130px;
height: 28px;
margin: 0;
padding: 0;
list-style: none;
position: relative;
}

#pinkmenubar > li > a{
display: block;
width: 99px;
height: 15px;
padding: 5px 24px 8px 7px;

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwlPk279D-74zYnzX5MFbDt_IGfcuQSp3lEhjEszr7TLl1QZMfsMwHtQWxn6q0OwMLs2oMeysxIVNRINhFPxFvF4NlBMoPQDW-hxYXFyIXPryEAT-q030py1wir1HWXXlyPm8zD7Kzr50/s400/buttonbg.png");
font-size: 13px;
color: #FA69CC;
text-decoration: none;
font-family: Trebuchet MS;

}
#pinkmenubar > li:hover > a{
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgviyURNVhwbb6NnzpX92rEmCHEIZJ9B9NcLYnkuemJpoFF31GoZC8Kj2GJFMhDlF9F5FMta5tBsXGn3oMxrQOTKoWABpT6oqFjbskv1Tc8iWDfLKpUOQZyCxqqlxhau0lW8_Wcd9y0_sY/s400/buttonbghover.png");
color: #E3099E;

}

ul#pinkmenubar > li > ul{

/*

position: absolute;
right: 5px;
top: 4px;


*/

float: right;
width: 17px;
height: 20px;


margin-top: -24px;
margin-right: 5px;



padding: 0;

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVWUeHUC8Xe2YI2_whQTQFNWicrhDmOs8DDeQ2AgfIxHskV6OHJzmxTFAEgJNbUgGtAVskFkPdqpU17NX-plla7LC_1AcgffKZAiEL_vS_L54XA7Zh9erFgjWykyLr3F8yiGLid85eCQc/s400/dropdown.png");
z-index: 50;

overflow: hidden;

}
ul#pinkmenubar > li > ul:hover{

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQBQzqpOIt0riQiHcmecq-aR1EdcKSE1zmuuvPD9y7-VxmrhB8pNK9uZHauHKPFshWEosX_spDPYme1o40sEHbjdd0DCJ_NuiudGhOFAid9C06eI2WuIrfMrgoiY75Rqx9YiTD5nkgDrc/s400/dropdownhover.png");
overflow: visible;

}


ul#pinkmenubar li ul li{
position: absolute;
margin-left: -9000px;
}
ul#pinkmenubar > li > ul:hover > li{
display: block;
width: 117px;
margin: 0 0 0 -99px;
padding: 0;
position: relative;
z-index: 500;

}

ul#pinkmenubar > li > ul:hover > li:first-child{
margin-top: 18px;
padding-top:3px;

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhScj8j4ZXWHkJ0kb3L7e7gduCfK4NN4zHQQcRxhhtLQKXaHdOq_Yf1FrcEfZJca2_g8NZ5lqVB1TnQpL0r4ryvl83iYPaaMhXWy9nyvXY8XR90VgoIQIPDMN3ZrJGlwpO97lAjFyC6moA/s400/topsubmenu.png");
background-repeat: no-repeat;
background-position: 100% 0;

}
ul#pinkmenubar > li > ul:hover > li:last-child{

padding-bottom:3px;

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdrIwvTKePUrroUSjEwueLkf7SHhA5jeyDxzbZH6sjuvGfje6-pAa85azdHGKdA66SBdmdfyPLMKCB_EYnDfQ_2LyLI8SIxFBElSyZewqxyPnbssMWfoTYkvLmQWjn7VbAdCRYcl2U5u4/s400/bottomsubmenu.png");
background-repeat: no-repeat;
background-position: 0 100%;

}
ul#pinkmenubar > li > ul:hover > li:last-child:hover{
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg2Hmae326as3SIPWhyKk-Vj8SDLfwzfJw3lWNjzWyvNqy-K-9gpSIk7xCvtJmNdGbmZi5MF01iwYxDWG91CqaEVD18rVpB0C6spWBHngAUBPjYB-r0FetBgRKJdh4RUYA2pft_u6hh9A/s400/bottomsubmenuhover.png");
}

ul#pinkmenubar > li > ul:hover > li > a{
display: block;
background-color: #FFF5FC;
border-color: #E3099E;
border-width: 0 1px 0 1px;
border-style: solid;
padding: 1px 4px 1px 4px;
margin: 0;
font-family: Trebuchet MS;;
text-decoration: none;
font-size: 12px;
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnNFz36LhUDszN5yAHFf19xjr3Jf0Qth8ROCCyX-L-elgK8uSb7B7nYvo4P85oZgJATB4EIVG6Gy1TgfjLNtUy0ovyVxYvR0XpCfNsZiocqNCA9Py5H65Gl6CqanqOoiRwpOUGjavfNYE/s400/submenubutton.png");
color: #E3099E;
}
ul#pinkmenubar > li > ul:hover > li > a:hover,
ul#pinkmenubar > li > ul:hover > li:hover > a{
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIbpXhPS0uo4DEzIHNtlo4FYf-fKJ2DwUEDMMhOLG6nO8CFolmJvQSX6MZ56QTMJ_xT83duNOLU46Rb_CQqS9vhb4nnKxu1CrLVUHug-GisSANz1Xp1XtcQW4g-bwycySjcDQl4KduMZc/s400/submenubuttonhover.png");
}

code.pre {
white-space: pre;
background-color: #f8f8f8;
display: block;
line-height: 140%;
}

Langkah 4

Salin kod berwarna merah di bawah dan paste pada notepad. Edit kod yang di bold dengan menggantikan URL dan title anda.

<ul id='pinkmenubar'>

<li ><a href='masukkan URL di sini'>HOME</a></li>

<li ><a href='masukkan URL di sini'>about</a>

<ul>

<li><a href='masukkan URL di sini'>Squirrel?</a></li>

<li><a href='masukkan URL di sini'>Seamus</a></li>

<li><a href='masukkan URL di sini'>Portfolio</a></li>

<li><a href='masukkan URL di sini'>Contact</a></li>

</ul>

</li>

<li ><a href='masukkan URL di sini'>play ground</a>

<ul>

<li><a href='masukkan URL di sini'>css play</a></li>

<li><a href='masukkan URL di sini'>xsl&lt;/a></li>

<li><a href='masukkan URL di sini'>backgrounds</a></li>

<li><a href='masukkan URL di sini'>flash</a></li>

</ul>

</li>

<li ><a href='masukkan URL di sini'>rants</a></li>

</ul>

Langkah 5

Sekali lagi, dengan menggunakan keyboard, taip atau paste kod <div id='content-wrapper'>

Langkah 6

Salin kod yang telah siap di edit pada langkah 4 tadi dan paste kod tersebut di bawah atau selepas kod <div id='content-wrapper'>

Akhir sekali klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.


p/s:

Jika kod <div id='content-wrapper'> tiada pada script template anda, gantikan dengan <div id='header-wrapper'> . Seterusnya cari penutup kod <div id='header-wrapper'> iaitu </div>

Contoh:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='my test page (Header)' type='Header'/>
</b:section>
</div> -----> Penutup

Paste kod yang telah siap di edit pada langkah 4 tadi dan paste di bawah atau selepas </div>

Read More

Cara pasang menu bar versi 2

Untuk memasang menu bar dibawah header, seperti yang boleh anda lihat pada blog ini ataupun di template classic(sila klik), sila ikut beberapa langkah yang di tunjukkan di bawah.

p/s: Sila save script template anda.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML.

Langkah 2

Dengan menggunakan keyboard, taip atau paste kod ]]></b:skin> pada ruang Find. Seterusnya tekan Enter.

Langkah 3

Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod ]]></b:skin> ( rujuk langkah 2)

p/s: Anda boleh edit kod warna yang di bold mengikut keseuaian blog anda jika perlu.

.invertedshiftdown{

padding: 0;

width: 100%;

border-top: 5px solid #000;

background: transparent;

voice-family: "\"}\"";

voice-family: inherit;

}

.invertedshiftdown ul{

margin:0;

margin-left: 40px;

padding: 0;

list-style: none;

}

.invertedshiftdown li{

display: inline;

margin: 0 2px 0 0;

padding: 0;

text-transform:uppercase;

}

.invertedshiftdown a{

float: left;

display: block;

font: bold 12px Arial;

color: black;

text-decoration: none;

margin: 0 1px 0 0;

padding: 5px 10px 9px 10px;

background-color: white;

-moz-border-radius-bottomleft: 5px;

border-bottom-left-radius: 5px;

-moz-border-radius-bottomright: 5px;

border-bottom-right-radius: 5px;

}

.invertedshiftdown a:hover{

background-color: #000;

padding-top: 9px;

padding-bottom: 5px;

color: white;

}

.invertedshiftdown .current a{

background-color: #D10000;

padding-top: 9px;

padding-bottom: 5px;

color: white;

}

Langkah 4

Salin kod merah di bawah dan edit pada notepad. Gantikan kod merah yang di bold dengan URL dan teks pilihan anda.

<div class='invertedshiftdown'>

<ul>

<li><a href='masukkan URL di sini'>Link 1</a></li>

<li class='current'><a href='masukkan URL di sini'>Link 2</a></li>

<li><a href='masukkan URL di sini'>Link 3</a></li>

<li><a href='masukkan URL di sini'>Link 4</a></li>

<li><a href='masukkan URL di sini'>Link 5</a></li>

<li><a href='masukkan URL di sini'>Link 6</a></li>

</ul>

</div>

<br style='clear: both;'/>

Langkah 5

Dengan menggunakan keyboard, taip atau paste kod <div id='content-wrapper'> pada ruang Find dan seterusnya tekan Enter.

Langkah 6 

Salin kod berwarna merah yang telah di edit (rujuk langkah 4) dan paste kod tersebut di bawah atau selepas kod <div id='content-wrapper'> (rujuk langkah 5)


Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Read More

Cara pasang menu bar pada blog

Untuk memasang menu bar dibawah header, seperti yang boleh anda lihat pada blog ini (sila klik), sila ikut beberapa langkah yang di tunjukkan di bawah.

p/s: Sila save script template anda.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML.

Langkah 2

Dengan menggunakan keyboard, taip atau paste kod ]]></b:skin> pada ruang Find. Seterusnya tekan Enter.

Langkah 3

Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod ]]></b:skin> ( rujuk langkah 2)

p/s: Anda boleh edit kod biru yang di bold mengikut keseuaian blog anda jika perlu.

/* menu bar */

#menubar{

margin: 0;

padding: 0;

float:left;

border:1px solid #e5e5e5;

width:100%;

background:#e5e5e5;

}

#menubar li{

margin: 0;

padding: 0;

list-style: none;

float: left;

font: bold 11px arial;

}

#menubar li a{

display: block;

margin: 0;

padding: 4px 10px;

background: #666;

color: #fff;

text-align: center;

text-decoration: none;

border:2px solid #ffffff;

border-right:3px solid #ccc;

}

#menubar li a:hover{

background: #000;

}

#menubar div{

position: absolute;

visibility: hidden;

}

Langkah 4

Salin kod merah di bawah dan edit pada notepad. Gantikan kod merah yang di bold dengan URL dan teks pilihan anda.

<ul id='menubar'>
<li><a href='#'>HOME</a></li>
<li><a href='masukkan URL profile di sini'>PROFILE SAYA</a></li>
<li><a href='mailto:masukkan e mail di sini'>E MAIL SAYA</a></li>
<li><a href='masukkan link 1'>LINK 1</a></li>
<li><a href='masukkan link 2'>LINK 2</a></li>
</ul>

Langkah 5

Dengan menggunakan keyboard, taip atau paste kod <div id='content-wrapper'> pada ruang Find dan seterusnya tekan Enter.

Langkah 6 

Salin kod berwarna merah yang telah di edit (rujuk langkah 4) dan paste kod tersebut di bawah atau selepas kod <div id='content-wrapper'> (rujuk langkah 5)


Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Cara mudah tukar icon Favicon blog

Terdapat satu trik yang paling mudah sekali jika anda ingin menukar icon favicon blog yang terpapar pada navigation toolbar dan juga tab. Contoh icon favicon yang telah di tukar tersebut boleh anda lihat pada gambar yang di tunjukkan di atas.

Untuk menukar ikon tersebut, sila ikut beberapa langkah yang di tunjukkan di bawah.

Langkah 1

Bina satu image yang bersaiz 50px x 50px. Anda juga boleh menggunakan gambar muka anda sendiri jika perlu.

Langkah 2

Upload image tersebut pada file hosting. Anda juga boleh upload image tersebut pada post dan klik Saved. Seterusnya, salin URL image tersebut.

Bagi anda yang upload image tersebut pada post, URL yang di highlightkan pada contoh gambar di bawah adalah URL bagi image yang di upload itu.

Langkah 3

Paste URL image( rujuk langkah 2) dan paste pada teks Masukkan URL image di sini pada kod berwarna biru di bawah.

<link href='Masukkan URL image di sini' rel='shortcut icon' type='image/x-icon'/>

Contoh kod yang telah di edit:

<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1q3qS67ql4GpzqGTPU9hWQrTXT8lN2NO_lZbvZPTTCq1-xUsyfN1RPlc4VTquywUlWnZyIoEXkAXzRcaH8n4a62HxT1JyakmyIvqlYoLkHfkA5Qiex7woew7RBat66WVYuRM5KlcU9Ue-/s320/favicon.jpg' rel='shortcut icon' type='image/x-icon'/>

Langkah 4

Log in blog => Dashboard => Layout => Edit HTML. 

Langkah 5

Dengan menggunakan keyboard, tekan kekunci Ctrl + F dan taip atau paste kod ]]></b:skin> pada ruang Find. Seterusnya tekan kekunci Enter.

Langkah 6 

Salin kod yang telah siap di edit tadi( rujuk langkah 3) dan paste kod tersebut di bawah atau selepas kod ]]></b:skin>

Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Read More

Free template blog untuk butik online

Di sini tersenarai beberapa jenis template yang mungkin sesuai untuk di jadikan sebagai theme bagi pemilik butik online yang inginkan kelainan. Template-template yang berkonsep photo ini di rasakan amat bersesuaian dan terbaik dari segi kekemasan.

Kebiasaannya, butik online banyak memaparkan gambar sebagai rujukan kepada pengunjung. Dengan menggunakan template yang berkonsep photo ini, banyak gambar dan image yang dapat di paparkan pada muka depan. Ini sebenarnya dapat memudahkan pengunjung yang masuk ke butik online tersebut untuk explore setiap gambar yang berkaitan sebagai rujukan.

Jika anda ingin mencuba template-template yang tersenarai di bawah, anda boleh download di site btemplates.com

Tequilas-Flamejantes

hybrid-gallery

My-Showcase

sgallery

showcase

Showcase-Light

Read More

Memasang signature/tandatangan di bawah post

Mungkin ada di antara anda pernah melihat blog rakan anda yang memaparkan signature ataupun tandatangan di ruangan bawah setiap posting. Jika anda berasa tertarik untuk meletakkan signature yang seperti itu, mylivesignature.com mungkin dapat membantu.  

Mylivesignature.com adalah satu site yang menyediakan perkidmatan membina signature secara percuma dan mudah. Tanpa perlu anda membuat pendaftaran.

Untuk mencubanya, sila klik di sini dan kemudian, ikut beberapa langkah yang di tunjukkan di bawah.

Langkah 1

Masukkan nickname yang akan di ubah kepada bentuk signature. seterusknya klik pada Next Step.

Langkah 2

Pilih jenis font yang bersesuaian. Setelah berpuas hati dengan jenis font yang di pilih, klik pada Next Step.

Langkah 3

Pilih saiz font yang bersesuaian. Setelah berpuas hati dengan saiz font yang di pilih, klik pada Next Step.

Langkah 4

Pilih warna signature dan juga warna background yang besesuaian dengan template blog anda. Sebaik-baiknya, warna background signature mestilah sama dengan warna background pada post. Setelah berpuas hati dengan warna font dan warna background yang di pilih, klik pada Next Step.

Langkah 5

Pilih paparan yang di rasakan sesuai pada bahagian Slope. Setelah berpuas hati dengan Slope yang di pilih, klik pada Next Step.

Langkah 6

Akhir sekali,dengan menggunakan mouse, klik kiri pada paparan signature yang telah siap itu. Seterusnya, salin URL bagi signature tersebut.

Contoh URL: http://www.mylivesignature.com/signatures/54488/74/541908D44D27E9E4659AA9FF42941015.png

Langkah 7

Paste URL signature (rujuk langkah 6) pada teks masukkan URL signature di sini pada kod berwarna biru di bawah.

<img src="masukkan signature disini" />

Contoh:

<img src="http://www.mylivesignature.com/signatures/54488/74/541908D44D27E9E4659AA9FF42941015.png" />

Langkah 8

Log in Blog => Dashboard => Layout => Edit HTML. seterusnya tick pada Expand Widget Templates.

Langkah 9

Dengan menggunakan keyboard, tekan kekunci Ctrl + F dan paste atau taip kod <data:post.body/> pada ruang Find. Seterusnya tekan kekunci Enter.

Langkah 10

Paste kod signature yang telah siap di edit (rujuk langkah 7) dan paste kod tersebut di bawah atau selepas kod <data:post.body/>

Akhir sekali, klik Preview dan jika tiada mesej Error terpapar, klik saja Save

Read More

Cara hilangkan line border gambar pada post

Untuk template yang tertentu terutamanya classic template, terdapat satu garisan border yang akan muncul setiap kali kita mengupload image atau gambar pada post. Contoh line border tersebut boleh anda lihat pada gambar di atas.

Untuk menghilangkan atau memadam garisan border tersebut, hanya perlu ikut beberapa langkah di bawah.

p/s: Sila save script template anda.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya tick pada kotak Expand Widget Templates.

Langkah 2

Dengan menggunakan keyboard tekan kekunci Ctrl + F dan taip atau paste kod .post img { atau .post-body img { .

Langkah 3

Edit angka pada kod border seperti yang di tunjukkan di bawah.

Contoh:

.post img {
padding: 1px;
margin: 0px 10px 10px 0px;

border: 1px solid #000000;

}

Ubah angka 1 pada border kepada 0.

Contoh selepas di edit:

.post img {
padding: 1px;
margin: 0px 15px 15px 0px;

border: 0px solid #000000;

}

Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Read More

Cara besarkan saiz image pada posting

Apabila kita mengupload gambar atau image pada post, saiz asal gambar akan di ubah kepada default setting yang di tetapkan oleh blogger.com. Walaupun kadangkala saiz gambar yang kita upload itu besar, tetapi apabila di view pada post, saiznya bertukar menjadi kecil.

Terdapat satu trik yang mudah untuk mengekalkan saiz asal gambar atau image yang kita upload itu.

Apa yang perlu anda lakukan adalah dengan mengubah kod gambar atau image yang telah di upload itu.

Contoh:

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigUtPo-T4Djharpw7uysAW1ILcYx23JdU17MV5UGSKld87eGyAyW5uDPVq5XTa8F8NYXmGgVj3vXo0kHRn3f2og5oQdum1KcQB5XifapgHUuPLGqRmACH0Bhg1XoYMy1YYwryW27brJjo/s1600-h/linkbox.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigUtPo-T4Djharpw7uysAW1ILcYx23JdU17MV5UGSKld87eGyAyW5uDPVq5XTa8F8NYXmGgVj3vXo0kHRn3f2og5oQdum1KcQB5XifapgHUuPLGqRmACH0Bhg1XoYMy1YYwryW27brJjo/s320/linkbox.jpg" /></a></div>

Ubah kod s320 yang di bold dengan menjadi s800 atau s1600

Contoh:

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigUtPo-T4Djharpw7uysAW1ILcYx23JdU17MV5UGSKld87eGyAyW5uDPVq5XTa8F8NYXmGgVj3vXo0kHRn3f2og5oQdum1KcQB5XifapgHUuPLGqRmACH0Bhg1XoYMy1YYwryW27brJjo/s1600-h/linkbox.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigUtPo-T4Djharpw7uysAW1ILcYx23JdU17MV5UGSKld87eGyAyW5uDPVq5XTa8F8NYXmGgVj3vXo0kHRn3f2og5oQdum1KcQB5XifapgHUuPLGqRmACH0Bhg1XoYMy1YYwryW27brJjo/s1600/linkbox.jpg" /></a></div>

Read More