Buat Folder Seperti Δ Smad-Lock Δ

Jumat, 03 Desember 2010

cara membuat folder yang fungsinya mirip Δ Smad-Lock Δ

folder ini sebagai folder untuk melindungi data anda dari virus, ada sih beberapa kelemahan dari Δ Smad-Lock Δ tapi tidak ada kan perlindungan yang 100%, folder yang akan kita buat ini juga ga 100% seperti Δ Smad-Lock Δ, mungkin dari Δ Smad-Lock Δ ada kode tertentu yang di desain untuk meningkatkan security nya.

cara membuatnya :

1. buka command prompt dengan cara masuk ke RUN tulis cmd. ENTER

2. kita tentukan direktori mana yang akan kita buat folder nya

3. kita buat folder baru dengan command mkdir (make directory), mkdir pantang_virus

4. kita bisa cek folder yang kita buat dengan command dir
5. untuk membuat folder seperti smad lock kita harus memakai karakter khusus yang tidak biasa dipakai. kita rename folder pantang_virus tersebut dengan command ren, tulis ( ren pantang_virus ß_pantang_virus_ß ) karakter ” ß ” adalah karakter khusus tersebut, dan masih banyak karakter laen contohnya ada folder smad lock yang memakai karakter segitiga ” Δ “, untuk mendapatkan karakter tersebut ” ß ” kita tekan ” ALT+2+2+5 ” (tekan angka pada numlock).
5. silahkan cek di windows explorer pasti folder anti virus anda sudah jadi.
walaupun ga mirip persis dengan smad lock, tp fungsi folder ini sama. yaitu sebagai pelindung dari virus, karena folder ini di lindungi oleh karakter khusus.

Read Post | komentar

Contoh Conditional Tag pada Blogspot

Rabu, 10 November 2010

Conditional Tag pada Blogspot digunakan untuk pengaturan element / widget atau kode tertentu kapan akan digunakan berdasarkan kondisi yang ditentukan, Misalhnya element/widget A akan muncul pada halaman home/depan tapi tidak muncul pada halaman postingan atau juga sebaliknya. Conditional Tag pada Blogspot biasa digunakan untuk mengatur widget atau element sehingga nampak pada kondisi tertentu.
Ada beberapa contoh Conditional Tag yang sering digunakan oleh para Blogger:

1.<b:if cond="data:blog.url == data:blog.homepageUrl"> ... </b:if>
Adalah Conditional Tag yang hanya ditampilkan pada halaman depan home/depan,
Contoh : Headline Pada Blog ini.

2.<b:if cond="data:blog.pageType != &quot;item&quot;"> ... </b:if>
Untuk menampilkan kode hanya pada halaman Depan, kategori / label,
Contoh : Readmore, yang tak muncul pada halam postingan.

3. <b:if cond='data:blog.pageType == &quot;item&quot;'> ... </b:if>
Kode yang digunakan untuk menjalankan kode hanya ada pada halaman postingan;
Contoh : Kolom komentar.

4.<b:if cond='data:blog.url != data:blog.homepageUrl'> ... </b:if>
Untuk menjalankan kode selain pada halaman depan / home.

5.<b:if cond='data:blog.url == &quot;url postingnya disini&quot;'> ... </b:if>
Untuk menjalankan kode hanya pada alamat url tertentu, misal daftar isi.

7. <b:if cond='data:blog.pageType == &quot;static_page&quot;'>... </b:if>
Menjalankan kode hanya pada halaman page.

8. <b:if cond='data:blog.pageType == &quot;archive&quot;'>...</b:if>
Menampilkan kode hanya pada halam archive

Read Post | komentar

Modifikasi Tampilan Judul Posting Sebuah Label

Kamis, 04 November 2010

Setelah memposting "judul post pada sebuah tabel", namun tampilan judul posting tersebut mengikuti default background dalam kode CSS "main" untuk memodifikasinya seperti ini :



berikut caranya :
Login ke account blogger kamu.
Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

Cari kode di bawah ini.

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

Catatan :
Kode HTML di atas akan terlihat dalam blog kamu setelah kamu melakukan trik klik label yang tampil judul posting saja.

Ganti kode yang berwarna merah dengan kode berikut.

<div style='padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#ffffff;color:#000000;'>
<data:post.title/></div></a>

Catatan :
Silakan rubah kode yang berwarna hijau dengan kode warna yang sesuai dengan blog kamu.

Cara menambahkan image panah biru di depan title post adalah dengan trik menyisipkan kode berwarna biru di bawah ini, ke dalam kode yang baru ditambahkan sebelumnya. Kode selengkapnya :

<div style='padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#ffffff;color:#000000;'>
<img alt='>>>' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk0uVbve6q4tbY4pqHYoyxMZ1aMGep_girgPo5a3zEcmKcqe9ZWZjr-xW2kIbvD7onfrglD1UV0nr_ayM3Zw_5hbilY1xOrDYiWY5eg5bjHfdxQPLBdIM4mrwRaU0imlkdp-S-2pZeEuE/s144/Arrobblue.png'/>
<data:post.title/></div></a>

Simpan template dan lihat hasilnya...
selamat berkreasi...
sumber : http://optimasi-blog.blogspot.com

Read Post | komentar

Judul Post Pada Sebuah Tabel

Menampilkan judul posting saja ketika pengunjung meng-klik sebuah label :

Caranya :
Login dulu ke account blogger kamu.
Pilih tab Tata Letak --> Edit HTML --> centang "Expand Template Widget".

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

Cari kode di bawah ini :

<!-- posts -->
<div class='blog-posts hfeed'>
<b:include data='top' name='status-message'/>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>

Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan timbul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

Ganti semua kode yang berwarna merah dengan kode berikut :

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Simpan template dan lihat hasilnya... :)
selamat berkreasi...

Read Post | komentar

Buat Garis Pinggir Pada Postingan

Untul menambah garis pinggir kiri kanan atas dan bawah pada sebuah postingan seperti ini :

Caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
cari code .post-body { biar cepet kamu bisa pakai ctrl+f.
Copy kode berikut :

Padding:15px; /* Jarak text post dengan garis pinggir */

Border-top: 2px solid #000000; /* warna garis pinggir atas */

Border-bottom: 2px solid #000000; /* warna garis pinggir bawah */

Border-left: 2px solid #000000; /* warna garis pinggir kiri */

Border-right: 2px solid #000000; /* warna garis pinggir kanan */

Margin-bottom: 30px; /* jarak antara post yang satu dengan yang lainnya */

dan pastekan dibawah Kode .post-body { yang kita cari tadi...
Simpan template... dan lihat hasilnya...
edit warna dan tebal garis sesuai selera...
Selamat berkreasi...

Read Post | komentar

Membuat Background Warna Dalam Post

Untuk membuat Background warna di dalam sebuah postingan yang perlu kamu lakukan hanya menambah kan kode seperti ini :

<div style="background:#FCDFFF;">tulis postingan kamu disini
</div>

hasilnya seperti ini :

tulis postingan kamu disini

untuk ubah warnanya kamu edit kode warna ( #FCDFF = warna pink )sesuai keinginan kamu...
kode warna yang lain dapat kamu lihat disini...

Read Post | komentar

Membuat Page Navigation Blogger

Membuat page navigasi seperti ini :



Caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
copy kode ini :

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

lalu pastekan diatas kode :

]]></b:skin>

Kemudian cari kode di bawah ini

</body>

dan ganti kode tadi dengan kode dibawah ini

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&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://woxwox.googlecode.com/files/blogger-page-navi.wox.js'
type='text/javascript'/>
</b:if>
<!--Page Navigation Ends-->
</body>

klik simpan template...
Lihat hasilnya
Selamat berkreasi...

Read Post | komentar

Recent Post Blog dengan gambar thumbnails

Selasa, 02 November 2010

Untuk membuat Recent posts blogger dengan thumbnails
seperti gambar



Caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
copy kode ini :

#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

lalu pastekan diatas kode :

]]></b:skin>

klik simpan template...


Lalu tambahkan gadget :


kodenya:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='JavaScript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://www.woxwox.info/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://woxwox.googlecode.com/files/relatedthumbs21.js' type='text/javascript'></script>
</div>

Ganti url woxwox.info warna merah dengan url alamat blog kamu...



simpan dan lihatlah hasilnya... :)

Read Post | komentar

Ubah Ukuran Kotak Komentar Blog

Senin, 01 November 2010

Untuk merubah Ukuran Kotak Komentar pada Blog seperti ini :



berikut caranya...

Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
cari kode :

<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<h3><data:postCommentMsg/></h3>
<p><data:blogCommentMessage/></p>
<iframe allowtransparency='true' expr:src='data:post.commentFormIframeSrc' frameborder='0' height='275' id='comment-editor' scrolling='auto' width='100%'/>
</div>
</b:includable>

Lalu hapus dan ganti dengan kode berikut :

<b:includable id='comment-form' var='post'>
<div class='comment-form-block'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor'
scrolling='auto' src='' width='100%'/>
<data:post.iframeColorizer/>
</div>
</b:includable>

Selanjutnya copy kode CSS berikut :

div.comment-form-block{
width: 420px; /* Untuk merubah ukuran sesuai keinginan */
margin: 0 auto;
}
div.comment-form-block p{
color: #000;
font-family: 'Georgia';
font-size: 14px;
text-align: left;
}

dan paste-kan diatas kode :

]] > </b:skin>

Ganti angka yang berwarna orange dengan angka atau ukuran yang kamu inginkan...
Simpan tempalte dan lihat hasilnya kotak komentar kamu sudah berubah ukurannya.

Read Post | komentar

buat artikel terkait dengan gambar

Rabu, 20 Oktober 2010

Seperti pihak ketiga LinkWithin kita juga bisa membuat artikel terkait dengan gambar tanpa embel-embel LinkWithin di pojok...



berikut caranya...
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Cari kode </head> sudah ketemu ganti kode tersebut dengan Kode berikut:

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://woxwox.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>

Kemudian copy kode ini:

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://woxwox.blogspot.com/2010/10/buat-artikel-terkait-dengan-gambar.html' style='display:none;'>Artikel Terkait dengan gambar</a><a href='http://woxwox.blogspot.com' style='display:none;'>blogger widgets</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults="5";
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Dan pastekan di atas kode:

<div class='post-footer-line post-footer-line-1'>

Simpan template... dan lihat hasilnya...
selamat berkreasi... :)

Read Post | komentar

membuat image hover

Selasa, 19 Oktober 2010

membuat image hover seperti ini (Arahkan mouse ke gambar) :



Caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
copy kode ini :

a.pic .image2{display:none}
a.pic:hover .image1 {display:none}
a.pic:hover .image2 {display:inline}

pastekan diatas kode :

]]></b:skin>

klik simpan template...

untuk menerapkkan kode CSS diatas. Untuk menerapkkannya ganti kode HTML image Anda dengan kode HTML dibawah ini :

<a class="pic" href="LINK YANG AKAN DITUJU">
<img class="image1" src="URL IMAGE ASLI DISINI"/>
<img class="image2" src="URL IMAGE HOVER DISINI"/></a>

selamat berkreasi... :)

Read Post | komentar

text area dalam post

text area bisa dipakai untuk menyimpan text atau kode HTML yang tidak bisa di tulis langsung ke dalam postingan pada blog. Jadi fungsi dari text area ini kurang lebih untuk memudahkan pengunjung mengcopy seluruh isi text.

kodenya seperti ini :

<p align="center"><textarea name="code" rows="2" cols="15"> Tulis text atau kode HTML kamu disini </textarea></p>

maka hasilnya :

Tulis text atau kode HTML kamu disini Tulis text atau kode HTML kamu disini

Selamat berkreasi... :)

Read Post | komentar

judul post saja dalam pencarian

Pada template standard, jika kita melakukan pencarian, maka yang akan kita temukan adalah judul postingan berserta urainnya yang panjang lebar moler-moler, sehingga hasilnya kurang efisien dan memakan tempat.Berikut cara menampilkan judul post saja dalam pencarian seperti gambar berikut search "mp3" maka hasilnya hanya judulnya saja :



caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Cari kode ini :

<b:include data='post' name='post'/>

lalu hapus dan ganti dengan kode ini :

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><hr align='left' color='#CCCCCC' size='1' style='border-style: dotted; border-width=1'/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

simpan template dan lihat hasilnya...
coba kamu search di kolom search...
selamat berkreasi... :)

Read Post | komentar

simple tab view tanpa edit html

Membuat tab view seperti ini:



ikuti langkah-langkah berikut:
Buka Layout (Tata Letak) » Page Elements (Elemen Laman).
Klik Add a Gadget (Tambah gadget).



Pilih gadget HTML/JavaScript.


Copy-paste script berikut ke dalam gadget tadi.

<style type="text/css">
div.TabView div.Tabs
{height: 30px;overflow: hidden}
div.TabView div.Tabs a {float:left; display:block; width: 98px; /* Lebar Menu Utama Atas */
text-align:center ; height: 30px; /* Tinggi Menu Utama Atas */
padding-top:8px; vertical-align:middle; border:1px solid #BDBDBD; /* Warna border Menu Atas */
border-bottom-width:0; text-decoration: none; font-family: "Verdana", Serif; /* Font Menu Utama Atas */
font-weight:bold; color:#000; /* Warna Font Menu Utama Atas */ -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #E6E6E6; /* Warna background Menu Utama Atas */ }
div.TabView div.Pages {clear:both; border:1px solid #BDBDBD; /* Warna border Kotak Utama */ overflow:hidden; background-color:#E6E6E6; /* Warna background Kotak Utama */ }
div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden}
div.TabView div.Pages div.Page div.Pad {padding: 5px 5px}
</style>
<script type='text/javascript'>
//<![CDATA[
function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);
// ----- Tabs -----
var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;
var Tab = Tabs.firstChild;
var i = 0;
do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);
// ----- Pages -----
var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;
var Page = Pages.firstChild;
var i = 0;
do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}
// ----- Functions -------------------------------------------------------------
function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }
function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
//]]>
</script>
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 300px;" class="Tabs">
<a>Judul 1</a>
<a>Judul 2</a>
<a>Judul 3</a>
</div>
<div style="width:300px; height:250px; " class="Pages">
<div class="Page">
<div class="Pad">
Isi menu tab view 1
</div>
</div>
<div class="Page">
<div class="Pad">
Isi menu tab view 2
</div>
</div>
<div class="Page">
<div class="Pad">
Isi menu tab view 3
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>

klik simpan...

Read Post | komentar

cara hidden navbar otomatis

Menyembunyikan navbar otomatis jika di klik navbar akan keluar...



Berikut tutorialnya :

Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Backup terlebih dahulu template kamu, klik pada tulisan Download Template Lengkap untuk berjaga-jaga jika terjadi kesalahan.

Copy kode ini :

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

dan paste-kan di atas kode :

body {

simpan template...

selamat berkreasi... :)

Read Post | komentar

Atur Jumlah Judul Postingan Pada Label

Rabu, 13 Oktober 2010

Untuk mengatur jumlah poostingan pada sebuah label seperti ini :



Berikut caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Backup terlebih dahulu template kamu, klik pada tulisan Download Template Lengkap untuk berjaga-jaga jika terjadi kesalahan.

Cari kode berikut :

<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>

Ganti kode diatas dengan kode :

<a expr:dir='data:blog.languageDirection' expr:href='data:label.url + &quot;?max-results=5&quot;'>

Max result adalah jumlah maksimal judul post yang akan ditampilkan pada sebuah label kamu bisa mengganti angka atau jumlah "5" sesuai keinginan kamu.

Selamat berkreasi... :)

Read Post | komentar

Background Judul artikel Pada Label

Untuk menambah background pada judul artikel pada sebuah label jika label di klik seperti ini :



Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Backup terlebih dahulu template kamu, klik pada tulisan Download Template Lengkap untuk berjaga-jaga jika terjadi kesalahan.

Cari kode berikut ini :

<b:if cond='data:blog.homepageUrl !=data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a>

Ganti kode yang berwarna merah dengan kode berikut :

<div style='padding:2px 0 2px 2px;border-right:1px solid #000;border-bottom:1px solid #000;margin-bottom:2px;background:#CDCDCD;color:#000000;'>
<data:post.title/></div></a>

untuk memberi icon disamping link judul artikel caranya :
Tambahkan kode berikut :

<img alt='>>>' border='0' src='URL icon Anda'/>

diatas kode :

<data:post.title/></div></a>

Selamat berkreasi... :)

Read Post | komentar

Efek Bayangan Blur atau Shadow Pada Gambar

Untuk membuat efek bayangan blur atau shadow pada sebuah gambar seperti ini :



Berikut caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget

Copy kode berikut :

.shadow2{
box-shadow: 7px 7px 8px #818181;
-webkit-box-shadow: 7px 7px 8px #818181;
-moz-box-shadow: 7px 7px 8px #818181;
}

dan paste-kan di atas kode :

]]></b:skin>

Etz belum selesai untuk memberi efek bayangan blur atau shadow kita cukup menambahkan elemen "class" di dalam syntax.
contoh untuk gambar diatas tambahkan kode [ class="shadow2" ] dibelakang [img] seperti ini :

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6cTQW_7Yrr6TcdmK1fBlY1XttFOm5vYCPcTE8Em8IWXapvxX4ZRTYDqlR7JORMsJcbJYBPG8sNg4KAW1746WPLvLScymUVaxTE5m4gLfHFjJDBvZdp_WXNeHc974GXMBs5ID51W3Xo6U/s1600/wox.png"><img class="shadow2" style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 244px; height: 94px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6cTQW_7Yrr6TcdmK1fBlY1XttFOm5vYCPcTE8Em8IWXapvxX4ZRTYDqlR7JORMsJcbJYBPG8sNg4KAW1746WPLvLScymUVaxTE5m4gLfHFjJDBvZdp_WXNeHc974GXMBs5ID51W3Xo6U/s320/wox.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5527519166916349890" /></a>

Sekarang lihat hasilnya gambar ini :




Menjadi seperti ini ada efek blurnya :



COPAS
COba dan PASang
Selamat berkreasi... :)

Read Post | komentar

Hapus Posting Lebih Baru , Beranda, Posting Lama

Untuk menghapus
Link Posting Lebih Baru
Link Beranda ,dan
Link Posting Lama
Seperti gambar berikut :


Caranya seperti berikut :

Cari kode ini dan hapus/delete :

<data:newerpagetitle>

Untuk menghilangkan Link Posting Lebih baru

Cari kode ini dan hapus/delete :

<data:homeMsg/>

Untuk menghilangkan Link Beranda

Cari kode ini dan hapus/delete :

<data:olderpagetitle>

Untuk menghilangkan Link Posting Lama

COPAS
COba dan PASang
Selamat berkreasi... :)

Read Post | komentar

Hapus Tulisan Menampilkan Entri Terbaru dengan Label

Masuk ke Rancangan > Edit HTML > centang Expand Template Widget
Cari kode ini :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

ganti kode diatas dengan kode ini :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Klik Simpan Template...

COPAS
COba dan PASang...
Selamat berkreasi... :)

Read Post | komentar