Popular Posts

Erlan_xp. Powered by Blogger.
Showing posts with label tutorial blog. Show all posts
Showing posts with label tutorial blog. Show all posts

Cara Mencegah Copy Paste Pada Blog

Written By mohamad erlan efarda on Friday, 5 April 2013 | 09:18


English


This time I just share a little of your blog post is about how to prevent copy and paste in the blog, if my opinion does not really matter this is, is a distinct advantage when our article in Copas (copy and paste), what if my friend is willing Copas include the source of the article, it could add a back link, an advantage


But for my friend who felt that the article my friend is very important and is not willing to copy and paste, this might be quite useful to do. but how is not fully protect your blog content, stidaknya enough to make people who intend to copy and paste a little confused when she was a newbie, because there's actually another way to be able to copy and paste blog article is protected even if the script anti Copas.

Without length, this time to protect blog on blogger (blogspot) away from the copy paste is disable right click, or better known as the deadly right-click. Here's a tutorial how to turn off right click on blogspot.

     Login to Blogger.com
     From the Dashboard page, please buddy go to Layout> Edit HTML
     Then look for the code <body> or <body (with aid press Ctrl + F or F3)
     Add the following code into the code <body> or <body before, or could also replace all


<body oncontextmenu='return false' onmousedown='return false' onselectstart='return false' onkeypress='return false'>

Buddy also could use some extra code only, or all of them may well, it's up to your needs.

Here's an explanation of the above code:

oncontextmenu = 'return false' (to turn off the right click mouse)
onmousedown = "return false '(click on a block to turn it down)
onselectstart = 'return false' (to turn off the block selection)
onkeypress = 'return false' (to turn off the keyboard)

If so, the Save Template blog

Indonesia


kali ini saya hanya sedikit share dari postingan blog sahabat yaitu tentang cara mencegah copy paste pada blog, kalau menurut saya sih hal ini tidak terlalu penting, merupakan satu keuntungan tersendiri bila artikel kita di copas (copy paste), apa lagi bila sobat yang copas mau mencantumkan sumber dari artikel tersebut, bisa menambah back link kan, merupakan keuntungan tersendirikan.

Namun bagi sobat yang merasa bahwa artikel sobat sangat penting dan tidak rela untuk di copy paste, mungkin hal ini cukup berguna untuk dilakukan. akan tetapi cara tersebut tidak melindungi content blog sobat sepenuhnya, stidaknya cukup membuat orang yang berniat copas sedikit bingung apabila dia seorang newbie, karena sebenarnya ada jalan lain untuk bisa meng-copas artikel blog sekalipun sudah dilindungi dengan script anti copas.

Tanpa panjang lebar, kali ini untuk melindungi blog di blogger (blogspot) dari dari copy paste adalah dengan mendisable right click, atau lebih dikenal dengan mematikan klik kanan. Berikut tutorial cara mematikan klik kanan pada blogspot.


  • Login terlebih dahulu ke Blogger.com
  • Dari halaman Dashboard, silahkan Sobat menuju ke Tata Letak > Edit HTML
  • Lalu cari kode <body> atau <body (dengan bantuan tekan Ctrl+F atau F3)
  • Tambahkan kode dibawah ini ke dalam kode <body> atau <body tadi, atau bisa juga di ganti sekalian

<body oncontextmenu='return false' onmousedown='return false' onselectstart='return false' onkeypress='return false'>

Sobat juga bisa menggunakan beberapa tambahan kode saja, atau semuanya juga boleh, terserah kebutuhan anda.

Berikut penjelasan dari kode-kode diatas:

oncontextmenu='return false' (untuk mematikan klik kanan mouse)
onmousedown='return false' (untuk mematikan klik blok ke bawah)
onselectstart='return false' (untuk mematikan seleksi blok)
onkeypress='return false' (untuk mematikan tombol keyboard)


Jika sudah, Simpan Template blog Sobat.
09:18 | 0 comments | Read More

Membuat Efek Daun Berguguran di Blog

Written By mohamad erlan efarda on Thursday, 21 March 2013 | 19:32



 Selalu saja ada berbagai macam efek menarik yang bisa kita tampilkan di blog, salah satunya yaitu membuat efek daun berguguran.
Efek ini tentunya berbeda dari efek-efek sebelumnya karena pola jatuhnya daun berayun-ayun. Cara membuat efek ini sangat mudah, ikuti saja langkahnya dibawah ini:

1. Login ke blogger
2. Masuk ke Rancangan -- Elemen Laman
3. Tambahkan gadjet lalu pilih HTML Javascript
4. Masukkan kode dibawah ini:

<script src='http://blogtrikdantips-blogspot.googlecode.com/files/daun.js'/></script>
5. Simpan gadjet lalu lihat hasilnya

Selamat mencobanya! Good Luck!


19:32 | 0 comments | Read More

Cara Mengganti Tanggal Posting dg Icon Calender


Yang pertama harus kita lakukan yaitu mengganti setting tanggal dulu, caranya seperti biasa Login dulu ke blogger terus pilih Settings --> Formatting, ganti "date header format" atau "format tanggal menjadi (mm.dd.yyyy)
nha yang masih pemula pasti bingung maksudnya kan? itu lho disebelah tulisan "date header format" kan ada kotak yang ada tanggalnya, trus kamu klik dan pilih yang formatnya bulan.tangal.tahun contohnya 1.13.2008 terus simpan

Langkah yang kedua pilih menu Layout --> Edit HTML . Trus beri tanda centang pada kotak Expand Widget Templates,

1. Cari kode ini <TITLE><data:blog.pageTitle/></TITLE> (tempatnya dibagian atas) kalo dah ketemu taruh script berikut ini dibawahnya persis

<SCRIPT type='text/javascript'>
//<![CDATA[
function date_replace(date) {
var da = date.split('.');
var day = da[1], mon = da[0], year = da[2];
var month =
['0','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
document.write("<div class='month'>"+month[mon]+"</div> <div class='day'>"+day+"</div>");
}
//]]>
</SCRIPT>



2. kalo udah cari kode ini:
.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}

kalo ggak ada coba cari yang ini
h2.date-header {
margin:1.5em 0 .5em;
}


3. Kalo dah ketemu taruh script berikut dibawahnya
.dateblock {
background: url("http://img600.imageshack.us/img600/3576/bluecalend.gif")
no-repeat;
width: 55px;
margin: 0;
font-weight: bold;
height: 50px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}

.month {
font-size: 11px;
width: 37px;
margin: 0 5px;
text-transform: uppercase;
color: #fff;
}

.day {
color:#3366CC;
font-size: 19px;
width: 37px;
margin: 0 5px;

}


Kode http://img600.imageshack.us/img600/3576/bluecalend.gifadalah gambar icon kalender. kamu bisa menggantinya dengan gambar-gambar dibawah ini caranya ganti kode gambar tersebut dengan kode gambar berikut ini, misalnya kamu pingin kelender yang berwarna merah, maka ganti kode tersebut jadi http://img837.imageshack.us/img837/9199/redcalend.gif


http://i246.photobucket.com/albums/gg91/elu_isme/blackcalend.gifhttp://img805.imageshack.us/img805/9918/blue2calend.gifhttp://img600.imageshack.us/img600/3576/bluecalend.gif
http://img837.imageshack.us/img837/4311/greencalend.gifhttp://img137.imageshack.us/img137/3329/orangecalend.gifhttp://img196.imageshack.us/img196/8339/pinkcalend.gif
http://img837.imageshack.us/img837/9199/redcalend.gifhttp://img220.imageshack.us/img220/3262/ungucalend.gifhttp://img818.imageshack.us/img818/1760/yellowcalend.gif


Trus kode color:#3366CC; adalah kode warna
tanggal, kamu bisa menggantinya dengan warna yang lain. Kamu bisa lihat kode2 warnanya DISINI.

4. langkah selanjutnya yaitu kamu cari kode ini
<data:post.dateHeader/>
, cara nyarinya biar gampang copy kode tersebut,

terus tekan Ctrl-f dan paste di dalam kotak yang disediakan, nha langsung
ketemu kan. kalo udah ketemu ganti kode tersebut dengan script dibawah ini.


<DIV class='dateblock'>
<SCRIPT>date_replace('<data:post.dateHeader/>');</SCRIPT></DIV>


5. Simpan Template kamu dan lihat hasilnya. Berhasil nggak ya? :t

Kalo misalnya tulisan bulan dan tanggalnya terlalu keatas coba tambahkan kode ini padding: 4px 0px 0px 0px; dibawah kode .month { dan juga dibawah kode .day {

NB: Kalo Tanggalnya berubah menjadi tulisan "Undefine" itu pasti kamu tidak memperhatikan tutorial ini dari awal. Coba lihat lagi tutorial ini dari awal dan baca baik-baik perintahnya. :D

Selamat mencobaaaaaaaaaa!!!!!!!........
19:27 | 0 comments | Read More

Tutorial Blog Membuat Back To Top dengan Efek Smooth Scroll

Written By mohamad erlan efarda on Saturday, 16 March 2013 | 08:28


 "Back to Top" adalah salah satu fasilitas yang dapat digunakan pada blog untuk memudahkan pengunjung menavigasi halaman pada blog anda.
Fungsi dari Back To Top yaitu mengantarkan kembali pengujung anda ke halaman paling atas. Penggunaan JQuery dengan fungsi ini dapat memberikan hasil scroll yang lebih baik, dalam hal ini scroll menjadi lebih smooth atau halus. Jika anda udah gak sabaran pengen membuatnya langsung aja dipraktekin...

1. Login ke blogger.
2. Pilih Rancangan -- Edit HTML
3. Masukan script jquery berikut ini diatas </head>

<script src='http://code.jquery.com/jquery-1.6.1.min.js' type='text/javascript'/>
<script src='http://blogtrikdantips-blogspot.googlecode.com/files/sed_back_to_top.js' type='text/javascript'/>
<script src='http://vianjb.googlecode.com/files/to%20top.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
/*
var defaults = {
containerID: &#39;moccaUItoTop&#39;, // fading element id
containerHoverClass: &#39;moccaUIhover&#39;, // fading element hover class
scrollSpeed: 1200,
easingType: &#39;linear&#39;
};
*/
$().UItoTop({ easingType: &#39;easeOutQuart&#39; });
});
</script>
5. Letakkan kode dibawah ini diatas kode ]]></b:skin>
#toTop {
display:none;
text-decoration:none;
position:fixed;
bottom:10px;
right:10px;
overflow:hidden;
width:51px;
height:51px;
border:none;
text-indent:-999px;
background:url(http://1.bp.blogspot.com/-jl2zCOaMrgc/T8R3jjBc44I/AAAAAAAADUo/fhv5oCrzd7E/s400/ui.totop.png) no-repeat left top;
}
#toTopHover {
background:url(http://1.bp.blogspot.com/-jl2zCOaMrgc/T8R3jjBc44I/AAAAAAAADUo/fhv5oCrzd7E/s400/ui.totop.png) no-repeat left -51px;
width:51px;
height:51px;
display:block;
overflow:hidden;
float:left;
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
}
#toTop:active, #toTop:focus {
outline:none;
7. Simpan template sobat dan lihat hasilnya.
08:28 | 0 comments | Read More

Tutorial Blog Cara Membuat Efek Banjir di Blog



Sobat sudah pernah belum ngalamin rasanya banjir ditempat sobat tinggal. Banjir pasti sangat menggangu aktivitas yang sobat ingin lakukan. Namun kali ini,akan membahas cara membuat efek banjir di blog. Ingin tau caranya, langsung saja ikuti langkahnya dibawah ini:

1. Login ke blogger
2. Pilih Tata Letak / Rancangan
3. Tambahkan gadjet
4. Pilih HTML/Javascript 
5. Masukan kode berikut ini:
<script language="javascript">
nd_mode="flood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="https://blogtrikdantips-blogspot.googlecode.com/files/efek_banjir.js"></script>
6. Simpan gadget

Sekarang sobat sudah bisa melihat hasilnya. Efek ini akan membuat blog anda tenggelam akibat banjir. Akan muncul ikan dan gelembung udara di screen blog anda. Menarik bukan? Selamat mancobanya!!
08:19 | 0 comments | Read More

Tutorial Blog Cara Mengganti "Older Posts" Dengan Angka




Secara umum, navigasi untuk pindah halaman di blogspot biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru)". Beda dengan wordpress yang navigasinya bisa berbentuk angka sehingga bisa memudahkan untuk loncat beberapa halaman ke postingan yang lama maupun baru.

Nha trik kali ini akan menjelaskan bagaimana cara mengganti link "Older Posts (posting lama)" dan "Newer Posts (posting baru)" menjadi angka seperti gambar di bawah ini


1. Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML"
2. setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum kode tersebut

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}


3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->


Kalau sudah silahkan dilihat hasilnya.
08:04 | 0 comments | Read More

Cara Mengetahui Harga Blog

Written By mohamad erlan efarda on Tuesday, 12 March 2013 | 19:39


 Setelah sekian lama nge-blog, akhirnya tiba saatnya memberanikan diri membuat postingan tentang tutorial seputar blog. Kali ini yang ingin saya sharing adalah cara mengetahui harga sebuah blog / website sekaligus mengecek skor SEO blog.
Jadi selain mengetahui harga blog, kita juga bisa mengetahui apa saja yang perlu dibenahi pada blog kita agar lebih SEO friendly.



Caranya :
  • Pada kolomnya diisi dengan alamat url blog anda.
  •  Contoh : http://airlandzz.blogspot.com/
  • Segera deh hasilnya muncul seperti ini ^_^


Jika anda scroll ke bawah lagi, di situ akan disebutkan hal-hal yang perlu dibenahi dari blog anda dan juga hal-hal yang perlu diperhatikan lainnya untuk meningkatkan skor SEO blog anda.

Selamat mencoba ^_^
19:39 | 1 comments | Read More

Cara Membuat Tag Cloud Cumulus, Label Berputar pada Blogger

Written By mohamad erlan efarda on Wednesday, 13 February 2013 | 19:28

Cara Membuat Tag Cloud Cumulus, Label Berputar pada Blogger |
Setelah nyari sana-sini akhirnya nemu juga tutorial cara membuat tag cloud berputar di blog, atau label berputar. Kamu bisa lihat hasil cara membuat label berputar pada blog punyaku ini.


CATATAN : Tidak semua template dapat mendukung untuk dikasih tag cloud. Dan sebelum kamu nyoba bikin label berputar, mending kamu download template punyamu dulu.
Berikut caranya: |



1. Login ke  blogspot
2.  Klik Design/Rancangan >> Edit HTML >> Centang Expand Templates Widget,
3. Cari kode : <b:section class='sidebar' id='sidebar' preferred='yes'>
( kalau mau lebih cepat nyarinya pakai F3 aja)
4. Lalu copy paste kode di bawah ini tepat berada di bawah kode tadi,

 <b:widget id='Label99' locked='false' title='Tag Cloud Comulus Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>


 5. Sebelum kamu save, alangkah baiknya kamu priview dulu, kalau dah berhasil , baru kamu save .

CATATAN
1. Warna Merah : Ganti untuk merubah ukuran tag cloud
2. Warna Hijau : Ganti untuk merubah warna background tag cloud
3. Warna Hitam : Ganti untuk merubah ukuran font
4. Tag Cloud akan berjalan apabila komputer sudah terinstal adobe flash player.
5. Bila tidak bisa di copas dengan klik kanan !! Silahkan anda block kode HTML lalu CTRL+C
19:28 | 0 comments | Read More
Related Posts Plugin for WordPress, Blogger...