Apakah anda pernah mengharapkan agar anda bisa mengirimkan tampilan yang lebih besar via Blogger ?
Saya menemukan trik rapi dari seorang pembaca, Miranda. Ini memerlukan blogger kerangka dengan ekstra lebar di bagian gambar oleh sebab itu akan menunjukkan tampilan yang lebih besar.
Upload gambar kamu dengan cara :
Klik Dashboard | Posting | Create | Add Image icon.
kemudia tunggu beberapa saat sampai loadingnya berhenti.
Setelah itu klik edit html dan lihat code-codenya kira-kira seperti ini :
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi92X91UBcUBfRK_n6ZlVDaBwwAS7uvSNuPDpDlmZb_jnu9zo0FQF0bLUeGF8QllW6feUYzSgVFfIKWzo8Dt7sVupWcuoAIScWUWEjaBa25DL45vAMuDvUhpTAovvYxCurt7hfAYvWrMu2u/s1600-h/DSC_2693.JPG"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi92X91UBcUBfRK_n6ZlVDaBwwAS7uvSNuPDpDlmZb_jnu9zo0FQF0bLUeGF8QllW6feUYzSgVFfIKWzo8Dt7sVupWcuoAIScWUWEjaBa25DL45vAMuDvUhpTAovvYxCurt7hfAYvWrMu2u/s400/DSC_2693.JPG" alt="" id="BLOGGER_PHOTO_ID_5237868380194789154" border="0" /></a>
Dari semua kode diatas coba kalian lihat code yang saya warnai nah disitulah triknya.
Sekarang coba kalian ganti code yang saya warnai diatas dengan code ini s800
Selesai deh...
Silahkan kalian coba..
Mungkin teman-teman masih pada bingung apa yang dimaksud dengan side menu,dari pada teman-teman pada bingung coba kalian lihat contohnya disini. SIde menu merupakan menu yang ada di sebelah kiri blog tadi yang menunya turun-naik turun-naik. ok deh dari pada kalian bingung langsung di coba aja ya??saya ambil kode ini dari website ini http://www.dynamicdrive.com/
1. Sign in Blogger
2. Layout
3. Edit HTML
4. Jangan lupa berikan tanda centang pada Expand Widget Templates
5. Kemudian copy kode di bawah ini dan paste di notepad :
//Static Slide Menu 6.5 © MaXimuS 2000-2001, All Rights Reserved.
//Site: http://www.absolutegb.com/maximus
//Script featured on Dynamic Drive (http://www.dynamicdrive.com)
NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
tempBar='';barBuilt=0;ssmItems=new Array();
function truebody(){
return (document.compatMode!="BackCompat")? document.documentElement : document.body
}
moving=setTimeout('null',1)
function moveOut() {
if ((NS6||NS)&&parseInt(ssm.left)<0 || IE && ssm.pixelLeft<0) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6||NS) && parseInt(ssm.left)>(-menuWidth) || IE && ssm.pixelLeft>(-menuWidth)) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);slideMenu(-10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}}
function slideMenu(num){
if (IE) {ssm.pixelLeft += num;}
if (NS6) {ssm.left = parseInt(ssm.left)+num+"px";}
if (NS) {ssm.left = parseInt(ssm.left)+num; bssm.clip.right+=num;bssm2.clip.right+=num;}}
function makeStatic() {
if (NS||NS6) {winY = window.pageYOffset;}
if (IE) {winY = truebody().scrollTop;}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - (YOffset-(YOffset-winY)));}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (IE) bssm.pixelTop+=smooth;
if (NS6) bssm.top=parseInt(bssm.top)+smooth+"px"
if (NS) bssm.top=parseInt(bssm.top)+smooth
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}
function buildBar() {
if(barText.indexOf('<IMG')>-1) {tempBar=barText}
else{for (b=0;b<barText.length;b++) {tempBar+=barText.charAt(b)+"<BR>"}}
document.write('<td align="center" rowspan="90" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD>')}
function initSlide() {
if (NS6){ssm=document.getElementById("thessm").style;bssm=document.getElementById("basessm").style;
bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";}
else if (IE) {ssm=document.all("thessm").style;bssm=document.all("basessm").style
bssm.clip="rect(0 "+thessm.offsetWidth+" "+thessm.offsetHeight+" 0)";bssm.visibility = "visible";}
else if (NS) {bssm=document.layers["basessm1"];
bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
bssm2.clip.left=0;ssm.visibility = "show";}
if (menuIsStatic=="yes") makeStatic();}
function buildMenu() {
if (IE||NS6) {document.write('<DIV ID="basessm" style="visibility:hidden;Position : Absolute ;Left : '+XOffset+'px ;Top : '+YOffset+'px ;Z-Index : 20;width:'+(menuWidth+barWidth+10)+'px"><DIV ID="thessm" style="Position : Absolute ;Left : '+(-menuWidth)+'px ;Top : 0 ;Z-Index : 20;" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER name="basessm1" top="'+YOffset+'" LEFT='+XOffset+' visibility="show"><ILAYER name="basessm2"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'"><TR><TD>')}
document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'">');
for(i=0;i<ssmItems.length;i++) {
if(!ssmItems[i][3]){ssmItems[i][3]=menuCols;ssmItems[i][5]=menuWidth-1}
else if(ssmItems[i][3]!=menuCols)ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
if(ssmItems[i-1]&&ssmItems[i-1][4]!="no"){document.write('<TR>')}
if(!ssmItems[i][1]){
document.write('<td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'px" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+ssmItems[i][0]+'</b></font></td>')}
else {if(!ssmItems[i][2])ssmItems[i][2]=linkTarget;
document.write('<TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+ssmItems[i][5]+'px" COLSPAN="'+ssmItems[i][3]+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+ssmItems[i][1]+'" target="'+ssmItems[i][2]+'" CLASS="ssmItems">'+ssmItems[i][0]+'</DIV></LAYER></ILAYER></TD>')}
if(ssmItems[i][4]!="no"&&barBuilt==0){buildBar();barBuilt=1}
if(ssmItems[i][4]!="no"){document.write('</TR>')}}
document.write('</table>')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV></DIV>')}
if (NS) {document.write('</LAYER></ILAYER></LAYER>')}
theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1)}
6. Save file tadi dengan nama ssm.js
7. lalu copy kode di bawah ini dan paste di notepad lagi :
YOffset=200; // no quotes!!
XOffset=0;
staticYOffset=150; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="#d1d8ec";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
menuWidth=180; // Must be a multiple of 10! no quotes!!
menuCols=2;
hdrFontFamily="verdana";
hdrFontSize="2";
hdrFontColor="#000000";
hdrBGColor="#ffffff";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="360";
barBGColor="#86629f";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="#ffffff";
barVAlign="center";
barWidth=15; // no quotes!!
barText="Hubungi saya";
ssmItems[0]=["<center><img src=http://img395.imageshack.us/img395/4389/1787644503lpj2.jpg><br>Jika Ada Pertanyaan silahkan kirim email ke <br><img src=http://img168.imageshack.us/img168/5003/yudhipv7.png> "]
buildMenu();
8. Save file yang tadi dibuat dengan nama ssmitems.js
9. Cari kode di bawah ini :
</head>
10. Kemudian ganti 2 URL di bawah ini dengan URL file yang kalian upload :
<script src='http://yudhi.890m.com/file/js/ssm.js' type='text/javascript'>
<script src='http://yudhi.iskandar.googlepages.com/ssmitems2.js' type='text/javascript'>
setelah itu kalian taruh kedua kode diatas di bawah kode </head>
11. Save dan lihat hasilnya.
Selamat mencoba....
Catatan : Upload file tadi di web hosting seperti googlepages.com atau hostingan gratis kalian.Terus ganti tulisan berwarna merah diatas dengan URL gambar kalian.
Nah akhirnya aku dapat menulis lagi di blog qu yang satu ini.Kali ini saya akan memberikan tutorial bagaimana memasang kode supaya blog kita tidak dapat di copy-paste tapi kalau kalian tidak mau dibilang pelit sama teman-teman kalian yah ga usah lah pasang kode ini.
he....
ok deh lanjut..mau tahu caranya ??
1. Sign in BLogger
2. Pilih Layout
3. Klik "add gadget / add page elemen"
4. Silahkan pilih elemen html / javascript
5. Masukkan kode di bawah ini :
<script language="JavaScript">
<!-- http://www.spacegun.co.uk -->
var message = "BLOG juga karya cipta, belajarlah untuk tidak meng-COPY PASTE";
function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }
document.onmousedown = rtclickcheck;
</script>
6. Save dan lihat hasislnya.
note : ganti tulisan warna merah diatas dengan kata-kata sesuai dengan keinginan kalian sciprt ini juga bisa berguna buat di Friendster dan yang lain loh...
Tutorial kali ini saya akan membahas bagaimana cara membuat Tab Menu Horizontal yang lebih mudah dan tidak sulit dan juga membuat ruang Blog atau Website menjadi lebih besar. Kalu masih pada penasaran silahkan kalian coba saja ya??
1. Sign in Blogger
2. Layout
3. Edit HTML
4. Jangan lupa berikan tanda centang pada Expand Widget Templates
5. Cari kode di bawah ini :
]]></b:skin>
6. Tambahkan kode ini diatasnya :
#navigation{
height:2.2em;
line-height:2.2em;
margin:0 1px;
background:#AF7817;
color:#ffffff;
}
#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #ffffff;
white-space:nowrap;
}
#navigation li a{
display:block;
padding:0 10px;
font-size:0.8em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}
* html #navigation a {width:1%;}
#navigation .selected,#navigation a:hover{
background:#000;
color:#ffffff;
text-decoration:none;
}
7. Kemudian cari kode di bawah ini :
<div id='content-wrapper'>
8. Tambahkan kode ini diatasnya :
<div id='navigation'>
<ul>
<li class='selected'><a href='Alamat Link 1'>Home</a></li>
<li><a href='Alamat Link 2'>Tukaran Link</a></li>
<li><a href='Alamat Link 3'>Sumbangan</a></li>
<li><a href='Alamat Link 4'>Lain-lain</a></li>
<li><a href='http://klinik-tutorial.blogspot.com/'>klinik-tutorial</a></li>
</ul>
</div>
9. Save dan lihat hasilnya.
Note : Silahkan ganti tulisan yang berwarna hijau dengan URL yang kalian inginkan.
Banyak sekali tips dan trik yang terdapat pada blogger ini salah satunya yang terbaru adalah memberikan nomor pada kolom kotak komentar seperti contoh diatas :
Kali ini saya akan memberikan cara bagaimana memberikan nomor pada kolom kotak komentar :
1. Sign in Blogger
2. Layout
3. Edit HTML
4. Jangan lupa berikan tanda centang pada Expand Widget Templates
5. Cari kode ini :
]]></b:skin>
6. Tambahkan kode ini diatasnya :
.numberingcomments{
float: right;
display: block;
width: 50px;
margin-right: 5px;
margin-top: -35px; /*comments-counter position*/
text-align: right;
font-family: ‘Century Gothic’,'Lucida Grande’,Arial,Helvetica,Sans-Serif;
font-size: 30px;
font-weight: normal;
}
.numberingcomments a:link, .numberingcomments a:visited {color: #445566 !important; text-decoration: none !important;}
.numberingcomments a:hover, .numberingcomments a:active {color: #FF9933 !important; text-decoration: none !important;}
Silahkan ganti tulisan yang berwarna hijau dengan warna yang kalian sukai.
7. Tambahkan kode merah di bawah ini diantara kode-kode di bawah :
<dl id='comments-block'>
<script type='text/javascript'>var CommentsCounter=0;</script>
<b:loop values='data:post.comments' var='comment'>
<div class='' expr:id='data:comment.id'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
<span class='numberingcomments'>
<a expr:href='"#comment-" + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</div>
</b:loop>
</dl>
8. Save dan lihat hasilnya.
Keep Blogging...
