ASMAN COUNTER: December 2010

Archive for December 2010

Membuat Menu Tab View Tiga Kolom

Setelah kemarin kita belajar MEMBUAT ARTIKEL TERKAIT DI SIDEBAR Sekarang kita akan mempercantik blog kita dengan penambahan TAB VIEW. Untuk membuat TAB VIEW ini sedikit sulit jika kita menggunakan edit HTML jadi sekarang kita akan lansung membuat TAB VIEW tanpa menggunakan EDIT HTML .

LANGKAH LANGKAH MUDAH MEMBUAT TAB VIEW

1. Seperti biasa login dulu ke blogger.

2. Masuk ke Elemen Halaman.

3. Klik Tambah Gadget lalu pilih HTML/Java Script

4. Tambahkan Kode Script Menu Tab Viewnya dibawah ini :

<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>

6. Untuk lebar menu, font, dan tinggi menu, sobat sesuaikan saja dengan lebar sidebar sobat.

0 komentar

Artikel Terkait Tampil di Side Bar

Setelah kemarin kita belaja membuat MENGEMBALIKAN KODE CSS YANG BERANTAKAN kali ini kita akan membuat artikel terkait yang terletak di side bar terinspirasi dari blognya O Om. Dan biasanya artikel ini diletakkan dibawah postingan.

LANGKAH LANGKAH MEMBUAT ARTIKEL TERKAIT DI SIDE BAR

1. Seperti biasa login dulu ke blogger.

2. Masuk ke Elemen Halaman.

3. Kemudian Tuju Edit HTML.

4. Klik Expand Template Widget.

5. Letakkan kode berikut ini sebelum kode </head>

<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>

6. Kemudian cari kode seperti dibawah ini :

<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>

7. Lalu sisipkan kode yang berwarna merah, sehingga hasilnya menjadi seperti berikut :

<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=10"' type='text/javascript'/>
</b:if> </b:loop>
</b:if>

8. Simpan Template, sampai disini proses Edit HTML sudah selesai.

9. Sekarang kita menuju Tata Letak, kemudian klik Tambah Gadget pada sidebar.

10. Pilih yang HTML/Javascript, kemudian masukkan kode berikut :

<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>

11. Jangan lupa beri judul, lalu klik Simpan.Contoh punya saya judulnya : ARTIKEL MENARIK LAINNYA

Sampai disini sudah selesai pembuatan artikel terkait di sidebar. Namun permasalahannya artikel terkait akan selalu muncul di halaman depan blog kita, untuk membuat artikel terkait hanya muncul pada halaman postingan saja, maka kita harus mengubah beberapa kode lagi

12. Klik Edit HTML.

13. Klik Expand Template Widget.

14. Cari kode yang seperti ini, dan sisipkan kode yang berwarna merah :

<b:widget id='HTML11' locked='false' title='ARTIKEL MENARIK LAINNYA' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

15. Kemudian klik Simpan Template.

16. Untuk tulisan HTML 11 dan ARTIKEL MENARIK LAINNYA Hanya mengambil dari template saya, silahkan sobat sesuaikan dengan template dan judul artikel terkait yang tadi sudah sobat buat.

Sumber : miscah.blogger

0 komentar

Kembalikan Kode CSS yang berantakan

Ternyata sulitnya mempelajari format style pada kode CSS yang susunannya tidak beraturan itu, Sekalipun yang sudah mengerti apalagi saya, pasti dibuat pusing untuk menganalisanya ulang. Ditambah lagi menggunakan mode style CSS terkompresi pasti ribet sekali, jika harus mempelajari dengan menelusuri kode CSS nya satu-persatu.

Contoh Kode CSS yang tidak berantakan :

#navbar-iframe{display:none !important;}body{background: #fff;margin:0;color:#222;font:13px trebuchet ms;text-align:center;}
a.ts{position:absolute;right:0px;top:0px;cursor:default;}a:link{color:#3aa705;text-decoration:none;}a:visited{color:#3aa705;text-decoration:none;}a:hover{color:#0000ff;text-decoration:none;}a img{border-width:0;}

Contoh Kode CSS yang telah dirapikan :

#navbar-iframe { display: none !important; }

body {
    background: #fff;
    margin: 0;
    color: #222;
    font: 13px trebuchet ms;
    text-align: center; }

a.ts {
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: default; }

a:link {
    color: #3aa705;
    text-decoration: none; }

a:visited {
    color: #3aa705;
    text-decoration: none; }

a:hover {
    color: #0000ff;
    text-decoration: none; }

a img { border-width: 0; }

Nah kalo kodenya seperti ini akan lebih mudah diedit atau pun di modifikasi kode cssnya, yang sebelumnya acak acakan menjadi lebih teratur dan lebih tertata rapi. saya sarankan coba saja gunakan layanan dari Styleneat.

inspirasi o-om

0 komentar

Cara Mudah Mengupgrade Memory Ram

Setelah kita mengetahui PERBEDAAN MEMORY RAM DDR, DDR2 dan DDR3 SDRAM sekarang kita akan belajar menambah atau upgrade Memoy Ram.

Penambahan Memory akan meningkatkan performa komputer secara sifnifikan tetapi jumlah penambahan yang terlalu besar biasanya tidak banyak berpengaruh. Misalnya Jika RAM sudah diatas 4 GB, biasanya peningkatan tidak akan terlihat

Sebagai contoh Windows 7 biasanya memerlukan paling tidak 2 GB memory, sehingga bagi yang kurang harus di upgrade agar mendapatkan performa yang bagus.

Sebenatnya untuk menambah (upgrade) RAM relatif mudah, kita tinggal mengetahui jenis RAM yang digunakan dan memeriksan apakah masih ada slot kosong untuk memasang RAM.

Yang Perlu Diperhatikan adalah ::

KESAMAAN JENIS MEMORY RAM karena DDR1 tidak akan cocok dengan DDR2, dan DDR2 tidak cocok dengan DDR3. Diperlukan jenis yang sama ketika akan mengupgrade RAM.
JENIS MEMORY RAM biasanya mempunyai tipe yang bermacam-macam, misalnya DDR3-6400, DDR3-8500, DDR3-10600 dan lainnya ( semakin tinggi, transfer ratenya juga semakin besar). Meskipun untuk tipe yang berbeda masih kompatibel, tetapi RAM akan berjalan dengan tipe yang lebih rendah. Misalnya DDR3-10600 2 GB di gabung dengan DDR3-8500 2GB, jumlah RAM akan bertambah menjadi 4 GB, tetapi kinerja akan menyesuaikan yang terendah ( DDR3-8500 ).
JUMLAH MAKSIMAL MEMORY RAM tergantung pada Motherboard dan juga Sistem Operasi yang digunakan. Untuk sistem operasi 32-bit biasanya tidak mendukung RAM diatas 4GB, sedangkan untuk sistem 64-bit, secara teori dapat mendukung sampai 192 GB RAM (Windows 7 ultimate). Selain itu kadang jumlah maksimal juga dibatasi oleh Motherboard, Misalnya hanya mendukung maksimal 16 GB RAM. Demikianlah semoga bermanfat.

http://ebsoft.web.i d

0 komentar

Perbedaan Memory Ram

Kali ini kita akan mengenal sedikit PERBEDAAN MEMORY RAM DDR, DDR2 dan DDR3 SDRAM, dan bagaimana jika ingin mengupgrade MEMORY RAM.

Seperti namanya, MEMORY RAM merupakan perangkat untuk tempat menyimpan data yang diakses oleh Processor (CPU – Central Processing Unit), Jadi dengan adanya MEMORY RAM data di hardsik bisa diakses lebih cepat,

PERBEDAAN MEMORY RAM DDR, DDR2 dan DDR3 SDRAM

DDR2 SDRAM bisa lebih cepat 40 sampai 100 kali dibanding jika lansung diakses ke hardisk

DDR3 bisa 100 sampai 300 kali lebih cepat dibanding akses ke hardisk

Sebagai Gambaran ::

Hardisk SATA dalam dunia nyata mengkases data sekitar 80-100 MB/s sedangkan USB 2.0 antara 10MB/s sampai 20 MB/s.

Sebelum tahun 2002, Banyak komputer yang menggunakan memory jenis Single Data Rate (SDR) SDRAM.

Setelah tahun 2002, Digantikan Double Data Rate (DDR), Mulai dari :

DDR (DDR1),

DDR2

Sekarang yang banyak beredar adalah DDR3 yang mampu melakukan transfer rate 2X lebih cepat daripada SDRAM.

Masing-masing jenis merupakan pengembangan dari sebelumnya dan versi terbaru umumnya mempunyai data rate yang lebih tinggi dan memerlukan daya yang lebih rendah, dan Memory Ram tersebut tidak saling kompatibel dan didesign dengan slot yang berbeda. Dan untuk mengetahui bagaiman cara mengupgrade Memory kita ke yang baru silahkan KLIK DISINI

http://ebsoft.web.id

0 komentar

Buku Tamu Tampil Tersembunyi

Kemarin kita belajar MEMBUAT RECENT POST DENGAN JQUERY sekarang saatnya kita belajar menampilkan buku tamu yang tersembunyi selain karena bosan dengan penampilan buku tamu ini jadi tidak kelihatan kalau buku tamu kita jarang di isi.

Buku tamu ini akan disembunyikan dibagian samping halaman blog kita, dan akan muncul ketika kita mengklik tombol buku tamu atau sebaliknya akan tutup jika kita mengklik tombolnya kembali.

LANGKAH LANGKAH MUDAH MEMBUAT BUKU TAMU TERSEMBUNYI

1. Login ke blogger

2. Klik tata letak

3. Tambahkan Gadjet pada elemen halaman

4. Pilih HTML JavaScript

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjvWYX8CMeNMoAZQEB969Epni4zrdUdjl3-vkiJF2Ba4QZT_QYQddoUtJBuSuG85uRVjYQMuqGdphES9Mu8hIFzYtl5Oc_bdVFMbqi7b_cKd54qPjX1tGpRVmBxRR0dW03p7p-fdksuFE9/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">



<br/>
Mau punya buku tamu seperti ini?<br/>
Klik di
<a href="http://asmancounter.blogspot.com/">
sini (Info Blog)
</a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

5. Ganti kode yang berwarna merah dengan kode chat box kita atau buku Tamu kita.
Selamat Mencoba dan lihat hasilnya.

Sumber@blogtrikdantips.blogspot

0 komentar

Puitis Hari AIDS Sedunia 2010

Pengidap AIDS

Ada yang menangis di kegelapan, Sendirian, dalam kesedihan dan kesakitan

Dan niat bunuh diri, kian

B E R L I N T A S A N

Di depan kaca, berkaca, mengaca,

Bayang-bayang menepuk - nepuk pipi, gugur rambut, mengelupas kulit

M E M U N G U T I L A G I

M E M O R I K E T I K A D I R I _ T E R H I N A T E R C A C I

H I D U P P A D A W A K T U Y A N G D I P I N J A M K A N

Tersuruk di balik kutuk penyakit

B i l a S a h a b a t D e k a t M e n j a u h J a r a k

S a a t i t u K a u T e m u k a n A l a s a n

K E N A P A H I D U P M E S T I D I P E R T A H A N K A N!!!

Mengerti seharusnya kita mengerti, saat maut bukan lagi sebuah rahasia

Dan detak jam semakin menghentak....

MEMPERINGATI HARI AIDS SEDUNIA 1/12/2010

0 komentar

ASMAN COUNTER

Vestibulum quis diam velit, vitae euismod ipsum

Archive for December 2010

Membuat Menu Tab View Tiga Kolom

Artikel Terkait Tampil di Side Bar

Kembalikan Kode CSS yang berantakan

Cara Mudah Mengupgrade Memory Ram

Perbedaan Memory Ram

Buku Tamu Tampil Tersembunyi

Recent Post ldengan Jquery

Puitis Hari AIDS Sedunia 2010

Recent Post

Followers

Sponsors

About Me

Popular Posts

Labels

Blog Archive

Category

Category

Category

Mampir Komen