SILAHKAN BACA DAN AMBIL YANG BERMANFAAT BAGI ANDA
Tampilkan postingan dengan label Otak atik Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Otak atik Blog. Tampilkan semua postingan

Selasa, 03 Juni 2014

Cara daftar dan pasang iklan kumpulbloger

Untuk keterangan apa itu kumpul blooger bisa cari in for masi terlebih dahulu
dan utuk daftar ya bisa klik di http://kumpulblogger.com
dan akan di bawa ke halaman
silahkan login kalo yag sudah puya acciunt loginya dan silahkan daftar bagi yang belom dan ikutin langkah2nya


kemudia di dalam aka da pilihan seperti ini
pilih salah satu yang ad di dalam kotak merah dan klik tilisan
scrip yang ada di baris pertama pada PPC text atau PPC mini baner
untuk tampilan mini baner
dan untuku tampilan text seperti di bawah ini,tapi sebenarya ada beberapa bilihan yang di sajikan
utnuk tampilan PPC text ini
kurang lebih tampilan nya seperti itu untuk scripnya silahkan daftar di ling yang sudah di sediakan
monggo



Tampilan iklan kumpul blogger

Untuk daftar bisa klik di http://kumpulblogger.com/


 

Sabtu, 25 Agustus 2012

Edit counter flag yang telah terpasang di widget blog

Untuk mengedit counter flag yang telah terpasng di widget blog kita kadang pertama kita seting colum 2 dan mau dirubah 3 atau mau rubah background atau juga jumlah flagnya langsung aja simak di bawah



flag counter
  1. Login ke blogger
  2. Masuk ke rancangan
  3. Edit gadget flag counter

<a href="http://s09.flagcounter.com/more/0Kf"><img src="http://s09.flagcounter.com/count/0Kf/bg_F0FFFF/txt_000000/border_CCCCCC/columns_4/maxflags_20/viewers_0/labels_0/pageviews_1/flags_0/" alt="free counters" border="0" /></a>
  • Nilai 15 menunjukkan jumlah bendera, ubahlah sesuai keinginan anda. Contoh : maxflags=20 menjadi maxflags=40
  • Anda juga dapat mengubah jumlah kolom dengan mengubah nilai kode yang berwarna hijau. Contoh : columns=4 menjadi columns=6
  • Dan untuk mengganti background ganti tulisan warna biru ( bg=F0FFFF ) sesuaikan dengan kode warna yang di ingin kan
sekian mudah-mudahan bermanfaat..

Membuat tulisan atau kode HTML widgate dalam scroll

Dengan adanya scroll kita bisa menghemat luas halaman yang kita buat untuk sebuah artikel berikut cara membuat artikel berada di dalam scroll
1.kita login keblog kita dengan username dan pasword masing-masing
2.pilih new artikel dan silakan masukan artikel yang akan dika kasih di dalam scroll
3.klao udah selesai rubah dari compose ke HTMAL



4. Setelah berbah ke HTML   copi scrip di bawah ini dan taruh di paling atas artikel

<div style="border: 0px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 280px; height: 150px; background-color: #003300;"> 

KET:


  1. rubah tinggi dan lebar, juga backgroundnya. Silahkan rubah pada bagian kode ini:
    width: 280px; height: 150px; background-color: #003300 untuk back ground transparan tinggal delet angka 003300 sisakan # dan ;
  2. Akhiri dengan </div>
  3. Untuk kode warna klik di SIN

selesai silahkan mencoba ..

Jumat, 06 Juli 2012

Cara memasang iklan adsenseCamp di blog



Di bawah ini adalah cara memasang iklan yang harus dilakukan oleh seorang Advertisers :

1. Silakan lakukan pendaftaran terlebih dahulu dengan mengklik tulisan "Create Publisher Account"
seperti yang terlihat pada gambar di bawah ini :

pendaftaran



2. Lakukan registrasi dengan mengisikan data diri Anda seperti yang terlihat pada gambar di bawah ini :

registrasi

Setelah registrasi sukses, AdsenseCamp akan mengirimkan email aktivasi
ke alamat email yang Anda daftarkan

registrasi berhasil


Kamis, 05 Juli 2012

Cara memasang status pengunjung online di blogspot radalurl.com

Cara memasang status online pengunjung di blog dengan radalurl.com untuk lebih singkatnya kita langsung aja ok
1.masung ke http://radarurl.com/
2.
-untuk no.1 isi dengan URL blognya
-untuk no.2 Klik untuk meneruskan ke tahap selanjutnya

3.
Klik generate widget kode

4.
copas kode tersebut ke widget di blognya,untuk caya masang di widget saya rasa sudah pada tahu
login blog--->tataletak--->add widget--->HTML/JAVA scrip dan paste kemudian  save dan lihat hasilnya ok semoga bermanpaat

Membuat Efek Pada Tulisan Berjalan (Marquee) di blogspot


1 Membuat teks berhenti jika mouse berada pada tulisan/teks berjalan

caranya : anda hanya menambahkann kode yang berwarna merah pada jenis kode yang anda inginkan contohnya kode teks berjalan dari kanan ke kiri:
<marquee onmouseover="this.stop()" onmouseout="this.start()" direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>


Hasilnya : ( arahkan mouse pada tulisan )

Contoh Tulisan Berjalan
Fungsi <b> ............... </b> untuk menebalkan tulisan.


2. Memasukkan link pada teks/tulisan berjalan

Caranya : merubah tulisan/teks dengan link.
Contoh :
<marquee onmouseover="this.stop()" onmouseout="this.start()"  direction="up" scrollamount="2" align="center">
<a href="http://komputergadet.blogspot.com/2012/06/membuat-efek-pada-tulisan-berjalan.html">Membuat Efect Tulisan Berjalan</a>
<br/>
<br/>
<a href="http://komputergadet.blogspot.com/2012/06/unlock-limit-ram-di-windows-7-32-bit.html">UnLock Limit RAM di Windows 7 32 Bit Hingga 64 Gb</a>
<br/>
<br/>
<a href="http://komputergadet.blogspot.com/2012/06/download-degung-sunda.html">Download Degung sunda</a><br/>
<br/>
<a href="http://komputergadet.blogspot.com/2012/06/daftar-sma-n-jakarta-selatan.html">DAFTAR SMA N JAKARTA SELATAN</a>
<br/>
<br/>
<a href="http://komputergadet.blogspot.com/2012/06/daftar-sekolah-sma-n-di-jakarta-timur.html">DAFTAR SEKOLAH SMA N DI JAKARTA TIMUR</a>
<br/>
</marquee>

Hasil :
Membuat Efect Tulisan Berjalan

UnLock Limit RAM di Windows 7 32 Bit Hingga 64 Gb

Download Degung sunda

DAFTAR SMA N JAKARTA SELATAN

DAFTAR SEKOLAH SMA N DI JAKARTA TIMUR

dari beberapa efek contoh diatas anda dapat membuat variasi sendiri dari tulisan berjalan. selamat berkreasi..
NB:
unutk tulisan yang berwarna hitam adalah URL target dan yang berwarna merah adalah judul linknya efek ini bisa di gabung dengan efek melayang di blog tinggal pareasi nya aja jd tar ling berjalan ke atas dan melayang di blog....selamat bersenang-senang.

Membuat iklan,gambardan scrip lain melayang di blo

langsung aja ke inti permasalan aja, ane pusing kalo bertele2 terserah mau di gunain buat iklan atau apa aja
1.login ke blognya masing2
2.add  gadget
3.editHTML/JAVA scrip

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


.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
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.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

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

<div class="gbcontent">

<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.
</a>
</div>
<center>

TULISAN WARNA MERAH

</center>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></div></div>
 4. copy scrip di atas
mohon di baca
dan untuk tulisan warna merah ganti dengan scrip atau gambar yang mau di kasih efec.
yoi kelar cepat dan mudah kan tadinya sich ane mau dongeng dulu di awal biar keliatan panjang gitu..ya sudah lah jangan lupa cuyy..di save  baru lihatlah hasilnya..

Jumat, 29 Juni 2012

Membuat scroll new post di blogspot

membuat scroll post
ini scripnya tinggal di copy aja dan simpan di widget posisinya terserah anada ini sasya dapat ketika keliling cuma saya lupa onernya siapa kalo cara masang di widget udah pada bisakan ya udah langsung aja
ini scripnya

<style type="text/css">
    #rp_plus_img{height:377px;}
    #rp_plus_img li {height:60px;padding:5px;list-style:none;
    background-color:#ffffff;
    border:solid 1px #000000;}
    #rp_plus_img a{color:#00000;}
    #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
    text-align:justify;
    -moz-border-radius: 5px;}
    #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
  
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
    var speed = 1500;
    var pause = 3500;
    $(document).ready(function(){
    rpnewsticker();
    interval = setInterval(rpnewsticker, pause);
    });
  
</script>
<ul id="rp_plus_img"><script>
    var numposts = 5;
    var numchars = 0;
  
</script>     <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script>     </ul>
<small><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-recent-post-berjalan-di.html" target="_blank">get this widget here</a></small>

untuk mengubah berapa jumlah post ayang akan di tampilakan cari tulisan yg berwarna merah var numposts = 5  ganti angkanya denga jumlah post yang di inginkan
contoh hasil nya seperti yg terpasa di blog ini

contoh
 

get this widget here

Mendaftar kan blog ke yahoo,google,bing


Mendaftar kan blog ke yahoo,google,bing

Mendaftar / Mempromosikan blog ke search engine Yahoo :
  1. Klik https://siteexplorer.search.yahoo.com/submite
  2. Pada form url masukan alamat blog Anda dan klik submite URL.

Mendaftar / Mempromosikan blog ke search engine google :
  1. Klik http://google.com/addurl
  2. Pada form url masukan alamat blog Anda, comment isikan deskripsi blog dan masukkan code pengaman sesuai gambar.
Jika langkah Anda di atas benar kira-kira 2 minggu blog Anda akan terdaftar di search engine google

1. Pertama silahkan masuk ke http://www.bing.com/toolbox/webmaster


2. Silahkan masuk dengan mengklik "Webmaster Tools Sign In" jika sudah memiliki Akun kamu juga bisa masuk dengan Akun Windows Live, Email Hotmail dan juga Live.com jika pernah membuatnya. Jika belum punya akun silahkan daftar dulu dengan mengklik "Sign up with Windows LiveID"


3. Kalau sudah masuk akan di arahkan otomatis ke Halaman Bing Webmasters Tools

4. Klik Add Site dan akan muncul Sebuah Jendela baru


5. Masukkan alamat blog kamu pada form yang ada misalhnya http://blogkamu.blogspot.com / www.blogkamu.com kemudian klik "Submit"


6. Tunggu sebentar dan akan muncul halaman seperti dibawah ini :

 - Klik / Pilih  : Option 2: Copy and paste a tag in your default webpage
 - Silahkan Salin Kode Verifikasi yang kamu lihat seperti ini contohnya seperti dibawah ini :
contoh :
<meta name="msvalidate.01" content="D7vr3E8047jj411BEBdsfv7097B3D9FC" />

8. Jangan tutup halaman Bing terlebih dahulu, langkah selanjutnya yaitu memverifikasi kepemilikan blog.
9. Sekarang Login ke Blogger dan pilih blog yang kamu daftarkan tadi
10. Lalu masuk ke Page Elements >> Edit HTML
11. Letakkan kode Meta Tag Verifikasi yang tadi kamu salin tepat di bawah <head> (kode ini terletak dibagian atas)

Contoh peletakan seperti dibawah ini :
<head>
<meta name="msvalidate.01" content="D7vr3E8047jj411BEBdsfv7097B3D9FC" />
12. Dan Simpan Template kamu
13. Sekarang kembali lagi ke Halaman Bing Webmasters Tools dan Klik "Verify"
14. Akan diarahkan pada halaman Akun Blog kamu yang baru saja didaftarkan, namun belum memiliki laporan kinerja dari blog tersebut. laporan kinerja bisa dilihat sekitar 1 minggu.

Mengirimkan Feed / Sitemap
Agar index blog lebih Optimal sebaiknya kirim juga Sitemap atau Url Feed blog kamu caranya berikut ini :
Tetap pada halaman Bing Webmasters Tools :
1. Klik Crawl >> Sitemaps (XML, Atom, RSS) dan Klik Add Feed

2.  Muncul jendela baru seperti dibawah ini

- Kamu hanya perlu menambahkan teks atom.xml saja pada kolom terakhir tanpa tambahan apapun.
3. Terakhir Klik Submit dan selesai.
by :http://u-sup.blogspot.com

Minggu, 27 Mei 2012

Membuat energi saving di blog

Energi saving,ketika tidak ada pergerakan kursor atau apapun dalam jangka waktu yang sudah di tentukan maka layar kan blank hitam untuk langkah-langkahnya ada di bawah ini
  1. Log in ke blogger anda 
  2. Pada halaman dashboard > rancangan >Edit HTML 
  3. Centang Expand Template Widget 
  4. Cari kode </head> tag, gunakan fasilitas pencarian dengan menekan tombol CTRL+F
  5. Copy kode dibawah dan pasang sebelum kode </head>
<script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'/>
  1. Simpan pekerjaan anda atau Save template 
  2. Kalau sudah tersimpan, kembali lagi kehalaman Dashboard anda 
  3. Setelah klik Rancangan > Design --&-- Page Elements. 
  4. Klik “tambah Gadget” pada salah satu sidebar. 
  5. Pilih ‘HTML/Javascript” dan tambahkan kode dibawah:
<script language="javascript" type="text/javascript" src="http://www.onlineleaf.com/savetheenvironment.js?time=60"></script>
NB:
Ganti yang ditandai biru yaitu ?time=60 dengan waktu yang sesuai dengan keinginan anda, 60 berarti setelah 60 seconds atau 1menit, tanpa aktivitas di blog anda, Energy saving mode akan bekerja.ada baiknya dan ada buruknya juga buruknya pas pengunjung lg enak baca tiba-tiba waktu tanpa pergerakan nya habis maka akan blank dan pengunjung mesti menggerakan mousenya untuk menormalkan nya lagi,,,ok 

Jumat, 06 April 2012

Memasalng animsi salam di blogspot

Memasalng animsi salam di blogspot
biasakan hidup dengan salam copy scrip di bawah dan pasang pada blog anda
aduh saya bingung mesti jelasin kaya gimana langsung ajalah ikutin caranya

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMzI5Mzc5NDQ3MDEmcHQ9MTMzMjkzNzk1NTI4OCZwPTIzODk4MSZkPUlzbGFtaWMlMjBXaWRnZXQlM2ElMjB3ZWxj/b21lLW1lc3NhZ2Utc2FsYW*mZz*xJm89ZDVhMWM1NjhjOTU2NDAyNjllNzc2ZDdiMzI*NTNjYjkmb2Y9MA==.gif" /><div style="margin:0px auto;text-align:center;width:250px;height:60px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Salam-Welcome-Message-4252-8192_134217728.widget?__install_id=1332937904883&amp;__view=expanded" width="250" height="60" flashvars="colframe=3366ff&colsalam=33cc00&col1=ff6600&text1=Peace%20be%20upon%20you&col2=33cc00&text2=Welcome%20to%20my%20site&gig_lt=1332937944701&gig_pt=1332937955288&gig_g=1" swliveconnect="true" quality="autohigh" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>
atau scrip di bawah ini 

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.11NXC/bT*xJmx*PTEzMzI5Mzg5MzI4NDMmcHQ9MTMzMjkzODkzNTk5OCZwPTIzODk4MSZkPUlzbGFtaWMlMjBXaWRnZXQlM2ElMjBzYWxh/bS1vcm5hbWVudC*wMSZnPTEmb2Y9MA==.gif" /><div style="margin:0px auto;text-align:center;width:460px;height:130px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Salam-Welcome-Message-Ornament-4877-8192_134217728.widget?__install_id=1332938865250&amp;__view=expanded" width="460" height="130" flashvars="colframe=3366ff&colsalam=33cc00&col1=ff6600&text1=Peace%20be%20upon%20you&col2=33cc00&text2=Welcome%20to%20my%20site&gig_lt=1332938932843&gig_pt=1332938935998&gig_g=1" swliveconnect="true" quality="autohigh" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

contoh  hasil tulisan asalamualaikum di lanjutkan dengan text




 cara pasang di blog
1.login to blog
2.tataletak
3.add new gadget
4.pilih HTML/JAVA scrip
jangan lupa save
dan lihat hasilnya

Cara menghilangkan Peringatan Konten pada blog



Teman-teman yang sebagai blogger pemula, kali ini aku akan menuliskan tips bagaimana menghilangkan peringatan konten pada blog, karena pastinya setiap teman yang mau buka blog mesti ada peringatan konten jadi ,,, agak risih lah.

Caranya gampang
1.buka blognya
2.pilih “pengaturan atau setelan”
3.disitu ada pilihan “Konten Dewasa?”
4.Pilihan “ya” nya di ganti dengan “tidak” !
5.simpan perubahannya.. 


contoh gamabar 
1.


2.

Jumat, 30 Maret 2012

Memuncul kan komentar di gadget


Ini adalah scrip buat memunculkan komentar di gadet jadi kita tahu artkikel kita yg mana yang di komen pengunjung jd kita bisa cepat berinteraktip dengan pengunjung untuk komen-komenan atau debat atau saling tegur sapa atau apa aja terserah..
1.Login to blog
2.tata letak
3.tambah gadget
4.pilih HTML/java scrip
5.copy scrip ini

<script style="”text/javascript”" src="https://sites.google.com/site/vikrymadzblogspotcom/vikrymadz/recentcomments.js">
</script>
<script style="text/javascript">
var numcomments = 10;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://ngiring.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script>


 NB : 
text yang berwarna biru adalah jumlah banyak komentar yang akan tampil pada widget tersebut
text yang berwarna merah adalah alamat blog, jadi jangan lupa ganti dengan alamat blog sobat.
 ni scrip g asalh copas tapi udah ane coba and berhasil thank to vikrymadz.blogspot.com untuk scripnya..buat yg lain silahkan mecoba good luck

Membuat tulisan dalam scroll

Dengan adanya scroll kita bisa menghemat luas halaman yang kita buat untuk sebuah artikel berikut cara membuat artikel berada di dalam scroll
1.kita login keblog kita dengan username dan pasword masing-masing
2.pilih new artikel dan silakan masukan artikel yang akan dika kasih di dalam scroll
3.klao udah selesai rubah dari compose ke HTMAL



4. Setelah berbah ke HTML   copi scrip di bawah ini dan taruh di paling atas artikel

<div style="border: 0px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 280px; height: 150px; background-color: #003300;">

KET:


  1. rubah tinggi dan lebar, juga backgroundnya. Silahkan rubah pada bagian kode ini:
    width: 280px; height: 150px; background-color: #003300
  2. Akhiri dengan </div>
  3. Untuk kode warna klik di SIN

selesai silahkan mencoba ..

Rabu, 28 Maret 2012

Memuncul kan komentar di gadget

Memuncul kan komentar di gadget

Ini adalah scrip buat memunculkan komentar di gadet jadi kita tahu artkikel kita yg mana yang di komen pengunjung jd kita bisa cepat berinteraktip dengan pengunjung untuk komen-komenan atau debat atau saling tegur sapa atau apa aja terserah..
1.Login to blog
2.tata letak
3.tambah gadget
4.pilih HTML/java scrip
5.copy scrip ini

<script style="”text/javascript”" src="https://sites.google.com/site/vikrymadzblogspotcom/vikrymadz/recentcomments.js">
</script>
<script style="text/javascript">
var numcomments = 10;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://cimamut.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script>

 NB : 
text yang berwarna biru adalah jumlah banyak komentar yang akan tampil pada widget tersebut
text yang berwarna merah adalah alamat blog, jadi jangan lupa ganti dengan alamat blog sobat.
 ni scrip g asalh copas tapi udah ane coba and berhasil thank to vikrymadz.blogspot.com untuk scripnya..buat yg lain silahkan mecoba good luck

Sabtu, 10 Maret 2012

Cara memasang Visitor Flag Counter di blogger




Cara memasang Visitor Flag Counter di blogger - Untuk memasang counter flag di blogspot sangat mudah ikuti saja langkah-langkah berikut :




1. Kunjungi situs ini SINI
2. isi bagian-bagian :

  • maximum flag to show : jumlah bendara yang akan ditampilkan
  • columns of flag : jumlah kolom bendera
  • label on top of counter : nama dari counter flag
  • Background color : warna latar dari counter flag
  • text color : warna tulisan
  • Border color : warna garis tepi dari counter flag
  • show country flag : untuk menampilkan kode negara
  • show pageview : untuk menampilkan jumlah halaman yang dikunjungi
3. lihat di bagian bawah ada "Example Flag Counter with your choices" itu adalah hasilnya, jika sudah sesuai keinginan klik "get your flag counter"
4.
copy code yang berada di "Code for website: dan paste kan ke dashbor anda pada widget html dan javascript kemudian simpan.

selamat mencoba....

Tutorial Cara Mudah Membuat Multi Tab Widget

1. Login ke Blogger, langsung meluncur ke Page Element (layout)
2. Pilih HTML / Javascript Widget
3. Kosongkan saja judulnya
4. Copy code dibawah ini


<style type="text/css">
.tabber {
padding: 0px !important;
border: 0 solid #bbb;
}
.tabber h2 {
float: left;
margin: 0 1px 0 0;
font-size: 12px;
padding: 3px 5px;
border: 1px solid #bbb;
margin-bottom: -1px; /*--Pull tab down 1px--*/
overflow: hidden;
position: relative;
background: #e0e0e0;
cursor:pointer;
-moz-border-radius:5px 5px 0 0;
border-radius:5px 5px 0 0;
}
html .tabber h2.active {
background: #fff;
border-bottom: 1px solid #fff; /*--"Connect" active tab to its content--*/
}
.tabber .widget-content {
border: 1px solid #bbb;
padding: 10px;
background: #fff;
clear:both;
margin:0;
}
.codewidget, #codeholder {
display:none;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#codeholder').bloggerTabber ({
tabCount : 3
});
});
</script>

<!-- jangan dihapus bagian bawah ini, krn akan menyebabkan script tidak jalan -->
<div id='codeholder'><p>Get this <a href="http://andretauladan.blogspot.com/2012/01/tutorial-membuat-multi-tab-widget.html" target="_blank">widget</a> or <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">click here</a></p></div>

4. Save, tempatkan widget ini di atas widget lain yang akan di-tab kan. Dengan begitu widget yang ada dibawahnya akan terbagi dalam tab.
  tabbed contents view elements
Untuk mengganti jumlah widget yang akan di-tab kan, ganti angka yang saya beri warna biru. Untuk mengganti background tab yang defaultnya putih, ganti code yang saya beri warna merah, dengan code warna yang diinginkan.
Tips ini saya ambil dari www.blogsentral.com, disusun dengan kalimat sedemikian rupa agar lebih mudah dimengerti.

Menghilangkan attribut pada blogspot

Hiden attribut pada blogspot 
Berikut caranya:
Masuk ke Blogger > Pilih Blog Anda > Masuk ke Template

Klik Edit HTML Templates

Gunakan Ctrl + F atau klik F3 pada browser Anda untuk mencari tag ini :
]]>

Jika sudah ketemu, copy kode di bawah ini dan paste di atas kode]]> tadi :
#Attribution1 {
height:0px;
visibility:hidden;
display:none
}

Simpan template Anda dan silahkan lihat hasilnya.

Sekarang, attibution di Blogger sudah tidak ada lagi . Dan selanjutnya klik edit pada gadget attribution dan  klik HAPUS.

Minggu, 04 Maret 2012

Cara membuat Menu Multi Kolom di blogspot

Cara membuatnya sangatlah mudah, Beginilah Cara membuat Menu MultiTab View Sidebar di Blogspot tersebut

Ikuti langkah-langkah berikut:

  • Login ke akun Blogger Sobat
  • Masuk ke rancangan / design
  • Pilih Tata Letak
  • Pilih Add New Widget / Tambah Gadget / Element
  • klik HTML/Javascript.
  • Kemudian copy paste kode dibawah ini:
<style type="text/css">
div.TabView div.Tabs a
{
float: left;
display: block;
width: 80px; /* Lebar Kotak Tab */
height: 22px; /* Tinggi Menu Utama Atas */
text-align: center; /* Posisi Teks Menu Tab */
margin: 5px 0px 0px 3px; /* Posisi Kotak Tab */
background-color: #222222; /* Warna background Kotak Tab */
padding-top: 2px; /* Spasi Atas */
border: 1px solid #ffffff; /* Warna border kotak Tab */
border-bottom: 1px solid #ccc; /*Warna border bawah kotak tab */
font-family: "Arial, Helvetica, sans-serif", Arial; /* Font Kotak Tab */
font-weight: 900; /* Ketebalan Teks kotak tab */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #736F6E; /* Warna background utama kotak tab */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #cccccc; /* Warna border Kotak Konten */
overflow: hidden;
background-color: #ffffff; /* Warna background Kotak konten */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 5px; /* Jarak teks dalam kotak content */
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}
</style>
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 385px;" class="Tabs">
<a><span >TAB 1</span></a>
<a><span style="color:white">TAB 2</span></a>
<a><span >TAB 3</span></a>
</div>
<div style="width: 252px; height: 180px;" class="Pages">
<div class="Page">
<div class="Pad">

Disini Kode HTML Content Widget YANG INGIN SOBAT TAMPILKAN PADA TAB 1

</div>
</div>

<div class="Page">
<div class="Pad">

Disini Kode HTML Content Widget YANG INGIN SOBAT TAMPILKAN PADA TAB 2

</div>
</div>

<div class="Page">
<div class="Pad">

Disini Kode HTML Content Widget YANG INGIN SOBAT TAMPILKAN PADA TAB 3

</div>
</div>
</div></div></form>

<script style="text/javascript" src="http://projectloss.googlecode.com/files/tab_view.js"></script>
<script type="text/javascript">tabview_initialize('TabView');
</script>
Jangan lupa klik Simpan, Silahkan edit warna, ukuran menurut selera Sobat
atau

  • Login ke dashboard blog kamu.
  • Pilih Rancangan »» Edit HTML
  • Download template lengkap dulu untuk berjaga-jaga kalau terjadi kesalahan.
  • tandai pada Expand widget template.
  • kemudian tempatkan script berikut sebelum kode ]]></b:skin>
    div.TabView div.Tabs { height:24px; overflow:hidden;}
    div.TabView div.Tabs a { float:left; display:block; width:90px; text-align:center; height:24px; padding-top:3px; vertical-align:middle; border:1px solid #ddd; border-bottom-width:0; text-decoration:none; font-family:verdana,arial,sans-serif; font-weight:bold; color:#000;}
    div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color:#fff;}
    div.TabView div.Pages {clear:both; border:1px solid #ddd; overflow:hidden; background-color:#fff;}
    div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden;}
    div.TabView div.Pages div.Page div.Pad {padding:3px 5px;}

    Sesuaikan kode warnanya dg blog kamu, untuk melihat kode warna bisa di lihat pada postingan tentang Kode-kode warna HTML
  • masukan script pemanggil berikut sebelum kode </head>
    <script src='http://blogtegal.googlecode.com/files/tabview.js' type='text/javascript'/>
  • Terakhir klik SIMPAN
Kemudian langkah berikutnya yakni menambahkan widgetnya pada sidebar blog. Pada Rancangan element klik ''Tambah Gadget'' dan pilih widget ''HTML/Javascript'' dan masukan kode berikut kedalamnya:
<form action="tabview.html" method="get"> <div class="TabView" id="TabView"> <div class="Tabs" style="width:350px;"> <a>Sub judul 1 </a> <a>Sub judul 2 </a> <a>Sub judul 3 </a> </div> <div class="Pages" style="width:350px; height:260px;"> <div class="Page"> <div class="Pad"> Link 1 di menu 1 Link 2 di menu 1 Link 3 di menu 1 </div> </div> <div class="Page"> <div class="Pad"> Link 1 di menu 2 Link 2 di menu 2 Link 3 di menu 2 </div> </div> <div class="Page"> <div class="Pad"> Link 1 di menu 3 Link 2 di menu 3 Link 3 di menu 3 </div> </div> </div> </div> </form> <script type="text/javascript"> tabview_initialize ('TabView'); </script>



  • Terakhir klik SIMPAN.Selamat berexperimen untuk membuat menu multi kolom atau menu multi tab
  • info lebih lanjut klik di SINI 
  • FB like