Sekarang kita mulai trik blogger membuat tab view dalam blog :
- Login dulu ke account blogger kamu
- Pilih tab Tata Letak --> Edit HTML.
- Copy kode berikut dan pastekan di atas kode ]]></b:skin>
div.TabView div.Tabs {
width:350px;
height: 24px;
overflow: hidden; }
div.TabView div.Tabs a {
float: left;
display: block;
width:90px;
text-align: center;
height: 24px
margin-left:3px;
padding-top: 3px;
vertical-align: middle;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-left-radius:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border: 1px solid #666666;
border-bottom-width: 0;
text-decoration: none;
font: 12px "Arial", Times New Roman, Serif;
color: #000;
font-weight: 900; }
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active { background-color: #DDDDDD; }
div.TabView div.Pages {
width:350px;
height: 250px;
clear: both;
background-color: #FFFFFF;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border: 1px solid #666666;
overflow: hidden; }
div.TabView div.Pages div.Page {
height: 100%;
padding: 0;
overflow: hidden; }
div.TabView div.Pages div.Page div.Pad { padding: 3px 5px; }
Catatan :width:
height: 24px;
overflow: hidden; }
div.TabView div.Tabs a {
float: left;
display: block;
width:
text-align: center;
height: 24px
margin-left:3px;
padding-top: 3px;
vertical-align: middle;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-left-radius:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border: 1px solid #666666;
border-bottom-width: 0;
text-decoration: none;
font: 12px "Arial", Times New Roman, Serif;
color: #000;
font-weight: 900; }
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active { background-color: #DDDDDD; }
div.TabView div.Pages {
width:
height: 250px;
clear: both;
background-color: #FFFFFF;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border: 1px solid #666666;
overflow: hidden; }
div.TabView div.Pages div.Page {
height: 100%;
padding: 0;
overflow: hidden; }
div.TabView div.Pages div.Page div.Pad { padding: 3px 5px; }
- Kode berwarna hijau merupakan ukuran Tab-view, rekomendasi: usahakan ukuran
width
yang berwarna hijau sama. - Kode yang berwarna merah bisa diganti dan sesuaikan dengan template blog kamu.
- Silakan kamu edit kode di atas (ditambah atau dikurangi) dan berkreasi dengan atribut lain, atau kalau kamu merasa sudah sesuai biarkan apa adanya.
- Untuk pemilihan warna, kamu dapat melihatnya di kode warna ini.
- Copy kembali kode berikut di atas kode </head>
<script type='text/javascript'>
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>
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>
- Simpan template kamu.
- Kemudian pilih tab Elemen Halaman --> Tambah Gadget.
- Jendela Tambahkan Gadget akan muncul --> HTML/JavaScript.
- Copy dan paste kode di bawah ini.
<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>
<div class="Pages">
<div class="Page">
<div class="Pad">
<ul>
<li>View 1.1</li>
<li>View 1.2</li>
<li>View 1.3</li>
</ul>
</div>
</div>
<div class="Page">
<div class="Pad">
Kamu bisa memasukkan script<br />
Kamu bisa memasukkan image<br />
Kamu bisa memasukkan numbered list/bullent list/<br />
Apalagi memasukkan teks atau link jelas bisa/<br />
</div>
</div>
<div class="Page">
<div class="Pad">
View 3.1<br />
View 3.2<br />
View 3.3<br />
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
<div class="TabView" id="TabView">
<div class="Tabs">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>
<div class="Pages">
<div class="Page">
<div class="Pad">
<ul>
<li>View 1.1</li>
<li>View 1.2</li>
<li>View 1.3</li>
</ul>
</div>
</div>
<div class="Page">
<div class="Pad">
Kamu bisa memasukkan script<br />
Kamu bisa memasukkan image<br />
Kamu bisa memasukkan numbered list/bullent list/<br />
Apalagi memasukkan teks atau link jelas bisa/<br />
</div>
</div>
<div class="Page">
<div class="Pad">
View 3.1<br />
View 3.2<br />
View 3.3<br />
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
- Sekarang lihat tab view dalam blog kamu
Catatan :
- Kode yang berwarna merah merupakan teks yang letaknya dalam Tab.
- Kode yang berwarna biru adalah tampilan teks yang akan muncul dalam halaman view sesuai dengan Tab terpilih.
Selamat membuat tab view...
Aku udah pasang, tapi kadang tab viewnya kalau mau diklik ndak berfungsi. punya solusinya.
BalasHapusMungkin kamu pakai kode pemanggilan script js lain (ex:http://geocities/123/tabview.js), coba pakai/copy full kode javascript yang ada di postingan ini. Semoga berhasil...
BalasHapuswah rumit banget kang ,... ternyata ada yang lebih muda dari poenya moe
BalasHapuswaduh mas..tulunk dibantu dunk..cara masukkan kelompk tulisannya piye?
BalasHapusMas yang aku mah kagak jadi. malah jadinya cuman kayak gini
BalasHapusTab1.1
Tab1.2
Tab1.3
Tab2.1
Tab2.2
Tab2.3
Tab3.1
Tab3.2
Tab3.3
Trims infonya, sangat menarik.... :)
BalasHapusto Ihsan Tutorial: berarti ada kode yang ketinggalan, coba sekali lagi dan bener2 dilihat kodenya. Kebetulan postingan ini telah diupdate. Thanks.. :D
BalasHapusthanks mas...
BalasHapusana sukses!!!!!!!
wah mas,,
BalasHapuspNya Qw kok gak sma kya pNya Mas??
klo mau di buat judul trus diklik bisa masuk ke artikelnya itu gimana caranya mas???
solusinya ya Mas, please GpL......:)
to Awy_x'z: Ganti aja kode yang berwarna hijau seperti kode di bawah ini.
BalasHapus<ul><li><a href="http://link kamu">Tab1.1</a></li>
<li><a href="http://ink kamu">Tab1.2</a></li>
<li><a href="http://ink kamu">Tab1.2</a></li></ul>
ingat tanpa <br/> dan ganti teks Tab 1.1, Tab 1.2, Tab 1.3 dengan teks Awy.
mas OB,klo membuat tab viewnya tanpa warna backgroud putihnya gimana?
BalasHapussoalnya kayanya warnanya ga masuk ma warna blog saya..
to f3hry: cukup dengan mengganti kode warna dalam kode background (background-color)dengan kode warna yang sesuai dengan template blog
BalasHapusWah saya Pratek dulu mas OB. .
BalasHapussama kasusnya seperti ihsan tutorial yang keluar hanya
BalasHapusTab1.1
Tab1.2
dst
udah dicoba berulang2 masih tetap hasilnya, tolooooongg... mas OB
terimakasih mas OB,. ne q coba dl,. sukses sll bwt mas OB :D
BalasHapussalam kenal dari saya, script-nya oke dan sudah saya coba hasilnya siiip bgt !!! cuma klo mau nambahain garis dotted/putus-putus dibawahnya, svriptnya ditambahi apa ya? biar ada pembatas antara judul satu dengan lainnya
BalasHapusMas OB,, aq masih bingung (maklum orang gaptek)kasusnya sma kyak kudel413 sma ihsan... Tlong ya :D
BalasHapusthanx...bgt ya, jd bagusan dikit ne blog ane...he3x...
BalasHapusbtw mo naya ne, klo ngrubah bentuk kotaknya bs ga ya..??, coz sepertinya kaku gt ya klo dipandang...
tolong pencerahannya ya...thanx...
Udah capek di obrak abrik tapi menu tabnya ngak bisa berfungsi semuanya udah benar tuh jadi bertamabah peting saya...??? solusinya dunk ya...????
BalasHapusto pras: Agar tampilannya mirip dengan blog ini, tambahkan kode css dalam Tab View (sebelum ]]></b:skin> sebagai berikut :
BalasHapusdiv.Pad ul li {
padding:0 0 0 5px;
border-right:2px solid #b3b3b3;
border-bottom:2px solid #b3b3b3;
margin-bottom:5px;
background:#ffffff;
color:#000000; }
to Anton: Klo bikin garis bawah saja cukup dengan menambahkan kode CSS sebelum ]]></b:skin>
BalasHapusdiv.Pad ul li {
border-bottom:1px dotted #b3b3b3; }
silakan ganti warna garis (#b3b3b3) sesuai blog mas Anton.
to all: yang belum berhasil membuat tab view, tolong perhatikan kembali kodenya. Karena dari beberapa sobat OB telah berhasil meng-aplikasi-kannya dalam blog. thanks
triknya bagus, tapi saya mau tanya tentang pembuatan link dalam postingan yang ditampilkan di tabview. saya sering salah caranya sehingga tabview ndak bisa di klik. Apa postingan yang kita masukkan di tabview berisi arsip-arsip tulisan yang sudah diposting? kalau belum diposting, cara buat linknya gimana?. Inti pertanyaan saya adalah bagaimana sebenarnya cara buat link yang benar untuk bahan tabview....,trims. kalau bisa hubungi saya di swwahyudi@gmail.com
BalasHapusKALAU DI HTMLNYA GAK ADA BACA ]] bskin,,,itu di searching panya??makasi mas OB,,,
BalasHapusto s.wahyudi: Link yang benar merupakan tautan yang memiliki alamat unik tertentu. Jd semua link yang mempunyai alamat yg jelas,sdh barang tentu merupakan link yg benar. Sedangkan cara memasukkannya, coba perhatikan kode warna hijau (ex: Tab 1.1) adalah <a href="http://cunz14.blogspot.com/" target="_blank">Tulis teks kamu disini</a>
BalasHapusKhusus untuk target="_blank" artinya membuka link jika diklik di tab baru, kalau ingin membuka di halaman yg sama, hapus saja kode target="_blank"
to ALUMNI SMA NEGERI 1 BANGKO: coba cari kode --></style> kemudian copy kode CSS di atasnya
maaf bang OB saya kurang jelas, maksud saya buat link yang benar untuk bahan tabview gmn?, ketika saya buat link postingnya ketika di klik tertulis begini: maaf laman tidak ditemukan di blog anda.mohon penjelasannya sekali lagi
BalasHapusmantab sob ilmunya..thanks, salam kenal ya
BalasHapusmakasih,.,. mas.,., atas info nya,.,. share yaahh.,.,
BalasHapusboleh juga infonya . makasih, ini yang saya cari2 dari dulu. cape2 beli buku. eh, ada di trik ini. salam sobat
BalasHapuswalah hebat mas artikelnya bagus makasihnya
BalasHapusBusyet, Baik banget, Ilmunya udah di share disini,
BalasHapusmoga bermanfaat...
thanks bro...
saya sudah coba pasang tapi cuma bisa nampung 3 column, untuk nambah columnnya gimana mas, juga sekalian cara nambah fungsi scrollnya , mohon bimbinganya...
BalasHapusbro artikelnya keren boleh di coba!!!!!!!
BalasHapusthank's....
BalasHapusthanks aku pasang dulu
BalasHapusgk nambah ilmu saya mas....
BalasHapusmas kx yang keluar cm 1??? sy kn bkn 2 cnth'a gini
BalasHapusmas kx yang keluar cm 1??? sy kn bkn 2 cnth'a gini
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 75px;" class="Tabs">
<a>LAGU</a>
<a>AIBY BAND</a>
</div>
<div style="width: 180px; height: 250px;" class="Pages">
<div class="Page">
<div class="Pad">
<li><a href="http://www.ziddu.com/download/7343223/SembilanBand-Sesal.mp3.html" target="new">SESAL-9band </a> </li>
<li><a href="http://www.ziddu.com/download/7343222/Sembilan_Band_-_Hafizah.mp3.html" target="new">HAFIZAH-9band </a></li>
<li><a href="http://www.ziddu.com/download/7343221/SembilanBand-Cemara.mp3.html" target="new">CEMARA_9band </a></li>
<li><a href="http://www.ziddu.com/download/7343119/SembilanBandBerharapKauKembali.mp3.html" target="new">BERHARAP KAU KEMBALI-9band </a></li> <br/>
</div>
</div>
<div class="Page">
<div class="Pad">
<a href="http://www.ziddu.com/download/7226353/MAAFKANAKU.mp3.html" target="new">MAAFKAN AKU </a>
<a href="http://www.ziddu.com/download/7212341/CERITAKITA.mp3.html" target="new">CERITA KITA </a>
<a href="http://www.ziddu.com/download/7065469/Tanpaarti.mp3.html" target="new">TANPA ARTI </a>
<a href="http://www.ziddu.com/download/7343409/Mlpknmu.mp3.html" target="new">MELUPAKANMU </a>
<a href="http://www.ziddu.com/download/7343409/Mlpknmu.mp3.html" target="new">MELUPAKANMU</a>
<a href="http://www.ziddu.com/download/7343410/Harapanku_aiby.mp3.html" target="new">HARAPANKU </a>
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
Terima kasih kasih infonya euy.... Berguna banget... Mau tak coba ah....
BalasHapusMaju terus kang... Posting informasi Yang berguna...
SUKSES...!!!
trims banyak mas ilmunya..manfaat sekali
BalasHapusMANTAPZZZ Dari SEkian Tips yang aku coba cuman ini yang berhasil!!!
BalasHapus:)):)):)):)):))
Tapi Kok Kalo aku Pasang Malah Tampilan Situsku Jadi Amburadul
BalasHapusSip...
BalasHapusArtikel yang sangat bermanfaat.
Ok, lanjutkan terus
heh ohm. kenapa posisi menu utamanya selalu di kanan atas ya. ga bisa diubah tu....??? help me fast...
BalasHapussome body help me... menu utamanya pindahnya gimana. punya ohm bisa ada di bawah. itu bawaan CSSNya kan yg diotak-atik.... help ohm help.........
BalasHapusOKE BROO RTHANKS TIPS NYA NIH UDAH BISA BROO..
BalasHapusMas OB...
BalasHapusKenapa isinya(hasilnya) terlalu ke bawah ya...
thanks :((
Makasih 10000000% Mas! saya sudah berhasil melakukan yang saya inginkan dari dulu!
BalasHapus:D :)
Walaupun sebelumnya saya agak bingung... ~x(
Thx ya dah ku coba di blog ku, ternyata sukses.
BalasHapusterima kasih atas informasinya.. visite back... ^_^
BalasHapusduh bang OB kalo mw bikin tab tapi beda model gimana???
BalasHapusmaksudnya ga kotak aja gitu,, paling ga kaya gini ni,,,
[IMG]http://i709.photobucket.com/albums/ww99/d_must/tab.png[/IMG]
http://i709.photobucket.com/albums/ww99/d_must/tab.png
thanks y........
wah pusing nich....:(( ~x(
BalasHapusBoleh gun di pasang lagi cari-cari artikel ini, tks
BalasHapusJust reminder shoutmix lagi trouble ya link-nya gak keluar, coba aja cbox thanks gun
BalasHapusmas OB,, kalo mau buat 2 tab view gimana?? aku udah berhasil buat satu,, tapi waktu mau buat lagi satu kok ga berhasil?? apa harus copy code lagi di edit HTML?? ato cuma langsung add widget?? aku langsung pake add widget,, tapi waktu disimpen itu gamau,,
BalasHapusterima kasih .
BalasHapusDengan memberikan tab view, blog kita terlihat lebih rapi. Tutorial yang sangat bermanfat
BalasHapusthx bgt infonya... saya bisa kok..
BalasHapusmasa yg laen gag bisa..??
Terima kasih atas ilmunya
BalasHapusseep
BalasHapushamdalah..dah bisa tnggl di edit dkit,, matursuwun yoh kang.. sukses bwt nte
BalasHapusmas kok punya saya gag ada scrollnya ya
BalasHapuskang OB aku mau tanya nuie biyar tab view nya di bawah kaya di blog kang OB gmana truz koq bisa nyatu sama info blog nya kang OB yang kaya Trafik Page Rank dan sebagainya ...gimna donk kang tolong solusinya ya...jagn lupa di bales ya kang ...
BalasHapusthankssss...
Thank's...
BalasHapus@admin
BalasHapusdi mana mas tempatnya?
makasih infonya om
BalasHapusmantap
BalasHapusMakasih bro..bisa..liat di imm-saintek.blogspot.com
BalasHapusliat bener ya bro..pokoknya g bakalan nyesel
BalasHapusmakasih mas... sukses..... :D
BalasHapus@OB
BalasHapuskang sudah saya coba kok g bosa bagai ma caranya bisa lo di kasih 1 contoh......thenk
saya sangat mengharapkan blsanya .....GPL bls di perjuanganulamadahulu.blgspot.com .......saya tunggu blsanya
BalasHapus@IBNUYAHYA Ini salah satu blog demo penerapan tab view Blog Uji Coba tanpa merubah satu pun kode dari "Tab View".
BalasHapusyang di kanan bawah itu hasilnya y? mksi, mau saya coba dulu
BalasHapuskerennnnnn...mampir baliki ya....:-p
BalasHapusOHM kalow di tab dikasih script widget bisa ga ya???
BalasHapuslike this...sudah bisa, tp apakah bisa bentuk kotak menu itu agar berbentuk tumpul ..? kan kalo seperti ini agak kaku rasanya. Tolong ya mas penjelasannya.
BalasHapus@na-raka : lawannya sur-ga :)) becanfa, mas. Jawabnya "bisa"
BalasHapus@Anak Sosial : Kalau mas ingin kotak tab view-nya berbentuk tumpul (rounder corner), tambahkan kode CSS berikut di bawah kode div.TabView div.Tabs :
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
Sedangkan untuk tabs a-nya saja (Tips SEO, Trik Blogger, ...), letakkan kode di atas pada kode div.TabView div.Tabs a.
Catatan :
*Untuk kode di atas bisa dilihat rounder corner dengan menggunakan browser FF, Flock, dan safari.
*Kode CSS di atas bisa diedit dengan menambah atribut tertentu, seperti; -moz-border-radius-topleft (rounder di kiri-atas), ...-topright (atas-kanan), ...-bottomleft (kiri-bawah), ...-bottomright (kanan-bawah).
@OBsalam kenal mas... saya tertarik dengan tulisan anda.... mungkin bayak orang yg tidak tau HTML. tlong masa pas saat tulis artikel lebih ditel lg mas. oh iya mas mkasi info y.
BalasHapuslike this bro...:)
BalasHapusbaru mau coba mas.mogamoga bisa berhasil.nice tutor lah:D
BalasHapusAskum
BalasHapusmas bs bntuin aq gak??aq gi buat blog tp gk tw buta tu kotak2 gk tw tu nmanya ap
yg ad tisan home,musickyq gitu lohh
mhon bntuannya
@Muhammad arfans : Wa'alaikum salam
BalasHapusmungkin yang dimaksud, kk arfans adalah horizontal navigasi, triknya sudah ada disini kk. coba kk ketik di kotak pencarian (kanan atas blog ini) tentang "horizontal navigasi"
kang OB..
BalasHapustrik simple dan menarik..
saya juga udah sukses membuatnya nie mas..
tapi ketika pake IE knp gak jalan ya pas kita klik tab view-nya ?
hal ini saya juga temui di semua tutor, dan jg tab view selain punya mas..
tapi versi punya mas ini yang paling catchy dan simple, heheh..
tanks infonya om,, tab view model yang ini bagus, loadingnya juga cepat..
BalasHapusudah kulilingan eh nemu juga...matur tanks'u a'...
BalasHapusAgak bingung nih isinya kode-kode HTML smua. Tapi akan saya coba deh
BalasHapusOh ya, silakan mampir ke blog saya ya kalau sempat
mskasih tutorialnya
BalasHapussaya mau nanya ni...
BalasHapussaya sudah berhasil mengaplikasikan tab nya, tapi ukuran kotak isinya kurang cocok diblog saya...
yang dirubah apa ya biar kotaknya lebih lebar ?
thx
pengen tau cara masukin gambar kedalam tab ya gimna ya.. saya masih bingung..
BalasHapussekalian pengen tau cara ngebuat blog serapi om OB tu gimna..
tolong info ya..
makasih.
kang OB, bisa ga tab view nya di isi recent artikel gt,, jadi ga usah repot masukin link baru kalo ada postingan baru,,, dah otomatis keisi gt.....thx kang :)
BalasHapusok, trims triknya.....
BalasHapusjangan lupa kunjung balik ya....
mantap tutornya mas..uda diterapkan juga :)
BalasHapusgaris pembatas bisa ditambahin gak gan??
BalasHapusmantap infonya,blogwallking, kunjung jg gan ke http://motorheroes.blogspot.com
BalasHapusOK mas udah di coba
BalasHapusCuman mau tanya
Gimana ya caranya supaya bisa nampilin
blog archives atau recent cooment
di tab view
misal tab 1 jadi blog archives
tab 2 jadi recent komment
Thanks mas buat ilmunnya..
thanks infonya
BalasHapusMas Suram Neh Otak Gwa....
BalasHapusNumpang Tanya...
Menu q Koq Kaga' Bisa Di Klcik ya....????
MOHON PENCERAHAN
makasih but infonya gan
BalasHapuskalo buat Tabview yg sperti di Footer punya Agan dmna ya ??
BalasHapusbalas ke cayun182@yahoo.com
thanks
@cayun:Kalau dijabarkan secara detail, panjang ceritanya, gan.
BalasHapusIntinya kita perlu mengkostumasi atribut width dan height dalam kode CSS, sehingga sesuai dengan blog kita.
Langkah selanjutnya, baru kita melakukan beberapa penyesuaian pada margin, padding, dan lainnya
masih bingung sob, dengan cara ganti ukuran tinggi sama lebarnya kotak, biar bisa disesuaikan dengan blog aku... thx
BalasHapusaku udah pasang tabnya tapi di atas jumlah tabnya cuma 3 bisa nambah lagi g???caranya kayak gimana??
BalasHapuskunjungi newbie blog q ya di oret-oretankecil.blogspot.com
@raf king Saya sudah berkunjung keblognya tapi saya tidak melihat adanya tabview disitu?
BalasHapusKalau ingin tahu caranya coba baca-baca komentar terdahulu diatas postingan ini ataupun postingan yang terkait dengan judul ini.
Terima kasih.
@raf king:
BalasHapusHanya saran saja, gan. Kalau tab view digunakan untuk full posting, rasanya sangat janggal. Tab view biasanya digunakan untuk menampilkan widget, bukan posting, gan. Cara nambahnya:
<div class="Tabs">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
…nambah tab di sini…
</div>
tambahkan pula:
<div class="Page">
<div class="Pad">
…isi halaman tab…
</div>
</div>
Sesuai dengan posisinya masing-masing. Dan jangan lupa, sesuaikan pula dengan ukuran lebarnya.
@Rudy:
Saya kira juga ngga ada, mas Rudi. Rupanya agan raf king membuat tab-view yang isinya full posting per-label. Mirip dengan fungsi navigasi horizontal menu.