20.1.12
36

Cara memasang facebook like pada post blogspot otomatis

post kang bagas96 5:24 AM
20 januari 2012 wah tidak terasa sudah hampir berlalu bulan pertama di tahun 2012 rasanya sangatlah cepat waktu berlalu (read: apa saya yang lelet yak ahehe) sampe-sampe eh salah ejaan kayaknya sampai-sampai kang bagas belum pernah menerbitkan 1 postingpun di blog dot wapinfo dot us pada bulan januari (read: padahal sudah jadi kebiasaan post sebulan sekali) saking lamanya tidak update banyak sohib-sohib juga yang menanyakan perihal tersebut, dan penjelasan saya sama maleeeeeeeeesss (tanya: wah ko bisa males kang?) jawabannya karena pertengahan januari kang bagas sudah tidak menikmati internet gratis lagi jadi rada-rada itung-itungan antara broswing di internet sama broswing di real buat nyari napkah tentunya hehehe.. Kembali ke paketpun rasanya tidak berkecukupan semua serba tersendat (read: maklum blogger tidak punya modal ngandelin gratisan ahehe) jadi buat sobat yang mungkin punya gratisan internet tsel 20 januari 2012 via operamini agar di share supaya kang bagas bisa bernapas dengan lega lagi hehe... (read: heum itung-itung setor kata kunci buat mbah google ahehe dan yang masuk nanya mbah google pasti kesel kecewa marah karena tidak mendapatkan info yang di cari malah artikel sampah ini hehe) Eh ko yang di judul cara menampilkan facebook like ko malah ngomongin internet gratis hehe kayaknya tidak nyambung banget dengan judul artikel hehe ya sudah sekarang ke pokok pembahasan menampilkan button like facebook pada posting blog, seperti biasanya kang bagas hanya memberi info secara garis besarnya saja (read: biasa tidak pandai merangkai kata gan hehehe) langkah pertama siapkan secangkir kopi+ roko dan roti bakar kalau ada (ini untuk bloggerboy) kalau untuk bloggergirl cukup siapkan kompresan saja karena biasanya kalau membahas script jawabannya Pusing lihatnya hehe tapi tenang saja yang ini sangat sederhana saja tadi cuman lebai saja soalnya kang bagas benar-benar pengen iseng hehe sedikit penjelasan tentang pungsi facebook like yang akan kang bagas share yaitu Memasang facebook like di posting blog yang nantinya dapat menjadi tolok ukur bagi blogger untuk mengetahui respon pengunjung selain dari comment (itutuh tiap di klick ada jumlah angkanya kalau gada yang klick ya klik sendiri aja he). Selain itu memasang ataumembuat tombol facebook like secara otomatis juga akan mengirim url yang disukai pengunjung ke dinding facebook nya. Ini juga menjadi keuntungan tersendiri, karena publikasi artikel posting dapat menjangkau area yang lebih luas. Hack widget ini akan memunculkan Facebook Like Button di setiap posting Blog Blogger sobat . Ada beberapa jenis Facebook like button dan juga pungsinya. Di antaranya ketika mengklick (read: aduh tidak enak banget kalimatnya tapi ini yang paking pas he) lanutan ketika mengklik pada saat membuka posting maka pada saat membuka posting lain tampilan facebook like masih sama jumlahnya alias 1 klik untuk semua artikel dan hasil pada dinding facebookpun contoh bagas sembilan enam menyukai www.blog.wapinfo.us rasanya kurang sempurna karena kita tidak tahu post yang mana yang paling di sukai tapi tenang aja itu hanya berlaku untuk button like standar yang di sediakan facebook kali ini kang bagas akan share fb like yang sudah di sesuaikan untuk blogger jadi tiap di klik jumlah di tiap postnya akan berbeda begitupn hasil share ke dinding akan menampilkan uraian judul post dan ketika di kunjungi langsung mengarah ke link post blog.. Untuk kodenya silahkan copy yang ini menampilkan fb like layout standar/ tampilan penuh dengan menampilkan nama-nama yang melike post:
<b:if cond='data:blog.pageType == &quot;item&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=standard&amp; show_faces=false&amp;width=90&amp; action=like&amp;font=arial&amp; colorscheme=light&amp;height=25&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:145px; height:55px;'/> </b:if>
Copy paste script yang ini menampilkan fb like layout button count/ tampilan hanya button like + jumlah klik saja:
<b:if cond='data:blog.pageType == &quot;item&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=button_count&amp; show_faces=false&amp;width=90&amp; action=like&amp;font=arial&amp; colorscheme=light&amp;height=25&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:145px; height:55px;'/> </b:if>
Copy paste script dan untuk meletakan kodenya sobat bisa memasang di bawah kode <data:post.body/> dan selanjutnya save template dan silahkan untuk mencoba tutorial di atas jika ada galat atau parse kode yang salah saat upload template tuliskan komentar agar saya cepat-cepat memperbaikinya terimakasih
22.8.11
47

Memasang logo blog menggunakan images atau gambar pada header

post kang bagas96 1:49 AM
Posting lagi yuk, berhubung kang bagas96 lagi ada waktu luang jadi sempet nih buat nulis artikel dan kali ini saya akan memberi info ringan cara mengganti header text menjadi header bergambar/ logo blog images yang sempat di rekues sobat kang bagas dan kali ini saya share cara yang sederhana saja

Dan untuk caranya biasa edit css pada bagian html template dan cari kode berikut

#header-wrapper {
margin:0 auto;
color:#090;
background-color: #070;
font-weight:normal;
line-height:30px;
}

#header-inner {
background-position: left;
margin-left: auto;
margin-right: auto;
}

#header {
text-align: left;
color:$pagetitlecolor;
}

#header h1 {
margin:3px 3px 0;
padding:3px 5px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font-weight:normal;
display:none;
color:#ff0;}

#header a {
color:#ff0;
text-decoration:none;
}

#header a:hover {
color:$pagetitlecolor;
}

#header .description {
margin:0 3px 3px;
padding:0 5px 3px;
text-transform:normal;
letter-spacing:.2em;
line-height: 1em;
font: $descriptionfont;
color: #fff;
}

Cari kode yang berwarna merah yaitu
#header h1 dan #header .description
jika sudah ketemu tambahkan kode ini display: none
contoh

#header {
text-align: left;
color:$pagetitlecolor;
}

#header h1 {
margin:3px 3px 0;
padding:3px 5px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font-weight:normal;
color:#ff0;
display:none;}

#header a {
color:#ff0;
text-decoration:none;
}

#header a:hover {
color:$pagetitlecolor;
}

#header .description {
margin:0 3px 3px;
padding:0 5px 3px;
text-transform:normal;
letter-spacing:.2em;
line-height: 1em;
font: $descriptionfont;
color: #fff;
display:none; }


jika sudah tinggal save dan upload ulang sementara nanti hasilnya pada header tidak nampak judul dan descripsi blog dan langkah terakhir yaitu menambahkan logo gambar pada header

1. Login blog
2. Masuk rancangan/tataletak
3. Pada bagian rancangan lihat ada gadget header misal 'kang bagas96 (header)' dan pada sisi kanannya ada link EDIT
klik link tersebut dan akan ada menu unggah/upload gambar bisa langsung upload dari drive mmc sobat atau lewat url

tinggal sobat pilih saja jika tidak memiliki url gambar sebelumnya saya sarankan untuk memilih yang upload saja

jika sudah di upload akan muncul gambar yang sobat pilih dan terakhir simpan maka proses pembuatan logo blog header menggunakan gambar sudah berhasil dan tinggal sobat lihat hasilnya

21.8.11
30

Cara merubah menu navigasi part 1

post kang bagas96 4:15 AM
Untuk kali ini kang bagas96 menulis tutorial cara merubah navigasi blog mobile autowindow part 1 di karenakan banyak tutorialnya untuk menegtahui kode css dan html sebuah navigasi blog (itutuh yang setelah header kaya beranda, blog dan lain-lain)

Langsung saja untuk template autowindow cari kode css ini

.navigasi {background:transparent; width:100%;margin:0 auto; padding-top:-1px;}

.menunavigasi{ height:20px; background-color: #ff9;
color: #000;max-width: 100%; border-bottom:4px solid #33C;}

.menunavigasi ul{
margin: 0; padding-left:0px;
font: normal 12px Arial;color:#cccccc;text-transform:none;
list-style-type: none; letter-spacing:.01em;
}

.menunavigasi li{
display: inline; margin: 0;
}

.menunavigasi li a{
font-size:12px;
float: left;
display: block;
text-decoration:none;
padding: 4px 4px;
color: #111;
}

.menunavigasi li a:visited{color:#fff;
background:#33C;
font-size:10px;
font-weight: bold;}

.menunavigasi li a:hover { color:#111;text-decoration:none; /*Background Setelah Pointer Diarahkan */
}

.menunavigasi li.selected a {-moz-border- radius-topleft:6px;
font:normal 12px Segoe UI;text-transform: uppercase;
color: #000; text-decoration:none;
}

jika sudah ketemu silahkan ganti background dan color untuk merubah tampilan navigasi pada mobile template autowindow v1.

Dan untuk penjelasan mendetail tunggu saja post berikutnya soalnya tidak enak sama kang agus yang sudah menunggu lama tidak saya buatkan tutor nya mudah-mudahan saja bisa di maklumi :D

16.8.11
34

Memasang buka tutup pratayang smiley kommentar

post kang bagas96 4:04 AM
Met sore kawan-kawan gimana kabarnya sore ini mudah-mudahan pada sehat walapiat ea amiinn..
Dan gimana puasanya mudah-mudahan pada lancar aja dan gak kerasa udah 16 hari kita menjalankan puasa :D..

Sambil ngabuburit kang bagas96 mau membagi tips memasang pratayang smiley comentar pada blog tampilan hape terutama bagi sobat yang sudah menggunakan template mobile blog..

Dan kali ini saya memberi info tentang memasang contoh smiley yang bisa di show dan hide / di tampilkan dan di sembunyikan caranya sederhana saja karena pada template mobile sudah di pasang js smiley commentar jadi hanya tinggal memasang kode contoh smileynya karena sebelumnya tidak kang bagas96 tampilkan karena sedikit berat dan membuat lama loading ketika membuka artikel

dan langsung saja ke caranya
seperti biasa edit template dan cari kode berikut

<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>

jika sudah ketemu letakan javascript ini di bawahnya
<script language="JavaScript" src="http://hell.yn.lt/js/blog/smiley.txt"></script>

contoh:

<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>

<script language="JavaScript" src="http://hell.yn.lt/js/blog/smiley.txt"></script>


dan langkah terakhir tinggal save untuk contoh kurang lebih seperti ini



copy paste javascript:


bagi yang berminat silahkan di coba laporkan jika ada kesalahan/script tidak bekerja :D

26.7.11
31

Cara melihat tampilan penuh template mobile via opmin

post kang bagas96 9:19 PM
Berbagi pengalaman lagi nih buat kawan-kawan blog mobile karena sebuah pertanyaan datang dari seorang kawan tapi mohon maaf mungkin telat reply karena biasalah kang bagas tidak punya jadwal tetap updat artikel hehe.... Dan ini jawaban untuk pertanyaan sobat 'Bagaimana akang membuat template autowindow menggunakan hp sedangkan untuk melihat tampilan pc nya gimana?' Wah pasti sobat juga berpikir bagaimana bisa menyesuaikan tampilan full hanya menggunakan hp mungkin pemikiran sobat merasa tidak mungkin/ kang bagas hanya melebih-lebihkan .. Okedeh sebenarnya selama ini saya menggunakan javascript fram untuk mendapatkan tampilan full (meski tidak 100% menyerupai pc tetapi setidaknya kita mendapatkan gambaran tentang penyesuaian lebar template pada resolusi layar monitor lebih lebar)dan pasti sobat juga sudah mengenal javascript ini langsung saja copy script di bawah ini javascript:finderonly= location.href;opmin= prompt('silahkan masukan alamat wap/blog anda', finderonly);browser=prompt ('apa anda tetap ingin melanjutkan? klik ok untuk melajutkan',opmin);if (opmin& &browser) {F1nd='<frameset%20cols= \'*,*\'><frame%20src=\ ''+opmin+'\'/>';F1nd+='' ;F1nd+='</ frameset>';with(document) {write(F1nd);void(close())}} else{void(null) } copy code html Dan cara menggunakannya masuk ke blog yang mau sobat lihat dalam halaman lebar (kususnya untuk template mobile blog) kemudian masukan script di atas di adres bar/ yang biasanya untuk menulis url yang mau kita kunjungi Nantinya akan muncul alert dan isi urlnya dengan url yang mau sobat kunjungi dan tekan ok maka nantinya akan muncul tampilan blog dalam tampilan lebar (fuul sesuai ukuran blog) Namun dengan menggunakan script ini belum sempurna untuk melihat blog dalam tampilan penuh via opmin Langkah ke2 masukan kata 'about:config' ini pada adres bar (bukan adres google search) tanpa tanda kutip / about:config setelah muncul halaman pengaturan cari menu ini 'fit text to screen' jika pada kolom di sampingnya pada posisi yes maka ubah menjadi no Sementara untuk apa guna pengaturan ini? Karena text pada layar ponsel menyesuaikan dengan ukuran layar jadi meski menggunakan javascript di ataspun kurang sempurna karena text post tidak memenuhi bagian main post blog sehingga kurang mirip dengan tampilan pc pada umumnya yang tulisannya menyesuaikan lebar main post.... Jika sudah di setting seperti di atas maka nantinya text tidak lagi menyesuaikan dengan layar ponsel jadi bisa mengukur pas pada saat di buka via ponsel dan pas juga saat di buka via pc jika ingin mengembalikan tinggal atur kembali menjadi yes setelah pengaturan opmin di lakukan ulangi kembali cara pertama dengan mengcopy javascript di atas dan meletakannya di adres bar atau melakukan repres :) Semoga tips ini bisa bermanpaat..
16

Cara mengatur template berada pada posisi tengah

post kang bagas96 8:04 PM
Posting kali ini coba menuliskan tentang cara mengatur letak template agar berada di tengah, berhubung ada sobat yang bertanya karena memang pada beberapa template mobile blog yang saya edit posisinya tidak semua di tengah,

Sebenarnya caranya sangat sederhana hanya menambahkan beberapa kode pada css template agar posisi template ada di bagian tengah kususnya saat blog di akses menggunakan komputer maka terlihat posisi template ada di posisi mana,

Langsung saja ke cara merubah css template agar berada pada bagian tengah ..
Langkah pertama edit template dan cari kode berikut pada bagian css

Body {
jika sudah ketemu tambahkan ini :

margin: 0 auto 0;

Contoh untuk membuat template Orange mobile blog berada pada posisi tengah

body {
max-width:650px;
color : #7a7a7a;
font-size : 12px;
font-family : tahoma;
background-color : #fff;
margin : 0 auto 0;}

Jika sudah selesai pengeditan tinggal save dan upload kembali (jika edit template secara offline) maka tinggal lihat hasilnya apakah keseluruhan template sobat letaknya berada di tengah..

:) Silahkan untuk mencoba bagi yang membutuhkan tutor ini

30.3.11
67

Cara memasang penghitung jumlah posting yang di baca

post kang bagas96 3:35 AM
Sore kawan-kawan blog bagaimana kabarnya?
Setelah lama tidak update mudah mudahan kabar sahabat masih pada sehat (read: kalau kantong sehat tidak sehat yang penting dapur ngebul hehe )
19.3.11
36

Menerima jasa pembuatan wap atau blog

post kang bagas96 3:10 AM
Menerima jasa pembuatan wap/ blog dengan cara kirim sms ke no +6281395127593 dengan persyaratan mudah dan untuk pormat pengiriman smsnya sebagai berikut:
1. Nama anda
2. Lokasi anda
3. Nama domain yang ingin di daptarkan
3.3.11
89

Cara membuat text rata kanan rata kiri rata tengah

post kang bagas96 6:31 AM
Posting untuk malam ini biasa saja artikel singkat tentang kode dasar html
Dan sekarang saya pengen share bagaimana cara membuat text rata kanan, rata kiri, dan rata tengah
19.2.11
44

Membuat hurup awal lebih besar atau capslock pada posting

post kang bagas96 2:38 AM
Jam 16:15 nampak di layar hp 5 jam sudah terkapar di cicalengka gara-gara kendaraan mogok..
:@ huahh panas nya cuaca menambah rasa jengkel di hati rasanya seperti ada di atas penggorengan dengan
15.2.11
25

Cara edit post blockquote dan cara memasangnya pada artikel

post kang bagas96 3:40 AM
Blockquote mungkin ada gunanya juga untuk membedakan post kusus /di anggap penting biasanya di gunakan untuk menampilkan tulisan yang ingin di tonjolkan
7.2.11
34

Kenapa template mobile tidak bisa di download?

post kang bagas96 5:31 PM
Heum beberapa hari ini saya tidak mengecek url download untuk template mobile karena memang biasanya tidak bermasalah....
Terkadang ada pengunjung blog yang sedikit
3.2.11
31

Cara memasang follow blog/pengikut menggunakan html kode

post kang bagas96 9:28 PM
Apa sebenernya pungsi follow blog? :y menurut saya ada keuntungan antara pengikut dan yang di ikuti :D , kenapa begituh :t hehe soalnya jika kita mengikuti sebuah blog maka akan muncul posting blog yang kita ikuti pada saat kita masuk dasbord blog milik kita sendiri, heum lumayan kita bisa dapat info tanpa harus berkunjung setiap saat :~

Sementara bagi pemilik gadget pollow terlihat lebih propesional dengan jumlah pengikut cukup banyak

Tapi ada 1 hal yang menurut saya kurang bagus yaitu dengan menampilkan gadget pollowers terlihat kurang menarik karena munculnya pic dari para pengikut dan ujung-ujungnya menambah ukuran file pada index heum cukup membuat bt saat harus menunggu pic poto muncul / sempurna membentuk gambar.... :(

Tapi jangan kawatir hal itu hanya berlaku jika kita memasang gadget google langsung yaitu lewat rancangan > tambah gadget > dan pilih pollow gadget kemudian simpan :#
dengan menu gadget harus tampil pada menu index jadi tidak bisa di sembunyikan / click window open

kalau mau buat pengikut yang bisa di tempatkan di mana saja jangan ikuti langkah di atas tetapi Tipsnya cukup kita buat dahulu gadget pollow di google friend

1. Pastikan kamu dalam keaadaan login/sigin blog. Agar langsung bisa masuk untuk membuat gadget html

2. Masuk ke alamat di bawah ini
membuat Gadgget html google friend

3. Kalau sudah masuk nanti akan di tanya apakah setuju dengan semua kebijakan google friend dan pada bagian bawahnya ada menu Saya setuju dengan persyaratan layanan pengembang jalinan teman
kamu klick jika memang setuju untuk membuat widget

4. Jika sudah masuk kamu lihat di sebelah kiri ada nama/judul blog yang kamu kelola yang nantinya akan di pasang gadget

5. Jika sudah masuk ke halaman berikutnya pilih tambahkan gadget anggota

6. Nanti akan muncul menu pengaturan tampilan gadget dari mulai warna dan ukuran width gadget

7. Jika sudah menyesuaikan tampilan gadget lihat di bagian bawah ada menu
kurang lebihnya seperti ini

kemudian kamu klick

8. Nah nanti akan muncul html kode pengikut blog yang bisa di copy dan langsung pasang di blog kamu

contoh script jadi:


Biasanya tiap blog beda nomor pada id dan site jadi jangan copy kode di atas

gimana Mudah bukan? :p
meski ini trick bukan hal baru tetapi masih ada yang ingin tahu dan agar lain kali ada yang bertanya tinggal kasih link ini :S hehe

Hatur nuhun manawi bahan katampi :$


44

Cara menampilkan smiley pada post atau artikel blog

post kang bagas96 9:30 AM
Iseng-iseng buka arsip lama :z dan nemuin javascript smiley post meskipun bukan hal baru, tapi jarang saya gunakan di template-template sebelumnya karena memang menambah beban load (read: pada template blog versi normal web :D )

Tapi saat saya coba pasang di mobile template ternyata cukup pas juga :@ ya tujuannya biar sedikit memberi kehidupan pada artikel dan menggambarkan suasana si penulis :)

Okeh langsung saja ke cara pemasangannya
1. Edit template dan Cari kode ini </b:skin> pada template

kalau sudah ketemu pasang javascript tepat di bawahnya

<script src='http://js4u.jw.lt/js/bagas96/postsmiley.txt' type='text/javascript'/>

contoh:

</b:skin>

<script src='http://js4u.jw.lt/js/bagas96/ postsmiley.txt' type='text/ javascript'/>

copy code javascript
2. Save template dan langsung upload Untuk menampilkan smiley pada posting anda tinggal mengetikan kode smiley di bawah ini copy code smiley Sedangkan hasil smiley jadi seperti ini: :) :p :~ :L ;) :s :$ :y :( :t :O :o :D :r :k :v :@ :d :# :f :x :c :z Nb: Waktu menulis jangan lupa memberi spasi antara smiley dan text posting Ok dan jangan pasang tanda = karena hanya sebagai pemisah pada contoh saja . Met nyoba saja bagi yang berminat

Hatur nuhun manawi bahan katampi :#


1.2.11
29

Preview mobile template classic v1 4 blog

post kang bagas96 4:02 AM
Duh bingung juga nih sama template classic v1 karena udah di ubek-ubek masih ada rasanya yang belum cocok :@

Tapi makin di edit malah tidak nemu pinalnya hehe
jadi ya kelamaan untuk segera di share

mungkin buat sobat yang mau sedikit memberi penilaian tentang mobile template classic v1
lihat contoh template di mobile template

Dan di tunggu tanggapannya apakah template ini cukup layak memberi kenyamanan bagi pengguna template ini :D

pasilitas template:
1. auto readmore
2. reply comment
3. admin author
3. tab menu
4. Post Smiley kode
untuk reply comment tinggal ubah id blog menggunakan id blog sobat

Sok atuh buruan di cek ;) dan di tunggu tanggapan lewat commentarnya :~

20

Merubah ukuran font judul dan tex post part 2

post kang bagas96 2:43 AM
Yups posting lagi nih topiknya masih sama bedah template ;) seperti tips sebelumnya sudah pernah saya post cara merubah judul post bergambar dan text artikel :D

Kalau ada yang belum baca cek DISINI
kalau sudah baca tidak usah di baca :p

sok langsung ke css template
1. Cara menghilangkan text shadow pada judul post dan merubah ukuran menjadi tebal

cari kode ini


.post-title { color : #999999; text-shadow : #cccccc 1px 1px 2px;
margin-top : 1px; margin-bottom : 1px;
padding : 0px;
border-top : 1px solid #99ccff;
border-bottom: 1px solid #99ccff;
text-align:left;}

keterangan:
pada class .post-title {
ada color : #999999; text-shadow : #cccccc 1px 1px 2px;
atau cari yang mirip ini kalau menggunakan template lain, jika sudah ketemu hapus text-shadow : #cccccc 1px 1px 2px; untuk menghilangkan text shadow contoh jadi seperti ini


.post-title {
color : #999999;
margin-top : 1px; margin-bottom : 1px;
padding : 0px;
border-top : 1px solid #99ccff;
border-bottom: 1px solid #99ccff;
text-align:left;}

dengan menghapus text-shadow maka tidak akan muncul lagi shadow pada judul posting :x ,

:@ yah matanya sipit hehe :D sabar broth masih ada dikit lagi he..

Sementara untuk merubah ukuran hurupnya sisipkan kode ini:

font-size:12px;
font-weight:bold;
keterangan: font-size:12px;
untuk mengatur ukuran/ tinggi text tinggal ganti angka px untuk memperkecil/ memperbesar hurup

sementara font-weight:bold;
untuk mengatur ketebalan hurup bisa di ubah sesuai kemauan
font-weight:bold; tebal
font-weight:normal; standar
font-weight:small; kecil
font-weight:strong; tebal dan besar
tapi menurut saya gunakan saja yang bold dan atur pada font-size untuk memperbesar :s

contoh jadinya seperti ini:


.post-title { font-size:12px;
font-weight:bold;
color : #999999;
margin-top : 1px; margin-bottom : 1px;
padding : 0px;
border-top : 1px solid #99ccff;
border-bottom: 1px solid #99ccff;
text-align:left;}

2. Merubah warna tex posting untuk merubah warna cari kode css ini:
.post {

jika sudah ketemu cari kode ini color:#111

contoh:

.post {
padding:1px;
font-size:11px; text-align:left;
color:#111;
border-bottom:1px solid #eee;
margin-bottom:-1px;}

kalau sudah ketemu ganti kode warna untuk merubah warnanya misal color:#ff0000 dst, namun jika ingin mempertebal text sama saja caranya seperti di atas dengan menempatkan kode
font-size:12px;
font-weight:bold;

contoh:


.post {font-size:10px;
font-weight:bold;
padding:1px;
font-size:11px; text-align:left;
color:#111;
border-bottom:1px solid #eee;
margin-bottom:-1px;}

:( udah dulu yah hapenya sudah mulai berat nih kalau kepanjangan :D

Di simak saja kalau masih ada yang kurang di pahami silahkan postkan di komentar saja :L
nanti di sambung lagi :$

Hatur nuhun manawi bahan katampi ;)


31.1.11
27

Memasang gambar atau background pada header

post kang bagas96 12:10 AM
Posting lagi ah :D berhubung ada kawan-kawan yang masih menyempatkan waktu berkunjung ke blog dan menyisipkan komentar :s hehe :D


Dan oke deh langsung saja (read: biasa posting kilat dan sederhana :p )

cari kode ini pada bagian css template
#header {

kalau sudah ketemu sisipkan kode di bawah ini

background-image : url(http://01.wen.ru/wap/images/ilusiku.png);
background-repeat : no-repeat;


cotoh jadinya seperti ini:

#header {
background-color:#ffffff; background-image : url(http://01.wen.ru/wap/images/ilusiku.png);
background-repeat : no-repeat;

background-position : 100% bottom;margin-right:2px 2px;
margin-top:1px; padding-bottom:1px; padding:2px;
text-align:left;
height:50px;
border-right:2px solid #fff;border-bottom:1px solid #fff;border-top:1px solid #a6deee;}

keterangan: kode background-image : url(http://01.wen.ru/wap/images/ilusiku.png);
background-repeat : no-repeat;

untuk menampilkan logo/gambar maka pada bagian background-repeat : di isi dengan no-repeat; agar gambar muncul hanya 1

jika ingin memasang untuk background header/keseluruhan tinggal ubah kode no-repeat menjadi repeat contoh

background-image : url(http://01.wen.ru/wap/images/ilusiku.png);
background-repeat :
repeat;

nantinya gambar akan memenuhi keseluruhan header
copy html


:O gimanah mudah bukan :p

udah dulu yah langsung di praktekin saja untuk melihat hasilnya :v

hatur nuhun manawi bahan katampi ;)

30.1.11
7

Cara merubah warna header template mobile

post kang bagas96 6:39 AM
Bedah template part2 yaitu cara merubah bagian header (read: itutuh yang paling atas walau di template lain ada yang di bawah he)

untuk merubahnya cari kode ini pada css template mobile


#header {
background-color:#000000; margin-top:1px; margin-bottom:1px; padding:2px; }
#header h1 {
text-align:left; text-shadow:#555555 2px 2px 2px; color:#ffffff; font-weight:bold; line-height:14px;
padding-left:1px;}
#header h1 {font-size:20px; padding-top:10px; }
header h1 a { color: #84C503; }
#header h1 a:visited { color: #84C503; }
#header h1 a:hover { color: #84C503; }
.header span {color: #84C503; font-size:12px;}
header .description {
color:#ff0000
;text-align:left; font: normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
font-size: 12px; padding-bottom:5px;padding-left:4px;}

keterangan:
untuk merubah warna header ubah pada #header {
background-color:#000000

untuk merubah judul header(read: itutuh yang buat nama blog kaya Simple Trick etc)
ubah kode warna pada bagian ini
header h1 a { color: #84C503; }

untuk merubah warna description / keterangan blog ubah kode warna ini
header .description {
color:#ff0000


Gimana simple kan hehe bagi pengguna template lain (read: bukan template editan saya) maka cari saya yang hampir mirip dengan kode di atas yang penting classnya saja misal
#header {
#header h1{
#heder.description{

sok atuh langsung di coba saja

Hatur nuhun manawi bahan katampi

29.1.11
12

Cara merubah warna background body template mobile

post kang bagas96 6:07 AM
Beberapa hari ini saya jarang update post karena memang agak-agak kurat mod heu, tapi itu kemaren hehe pada kesempatan ini ijinkan saya share tentang bedah template dan kita urut saja dari paling atas he
yang paling atas apah?
Body yup kita coba ubah warna latar/ background body pungsinya untuk memberi warna keseluruhan background

okay langsung ke css template dan cari kode ini:


body {
color:#cccccc; font-size:11px; font-family:tahoma; background-color:#000000; position: center;
padding:0;
border:1 solid #000000;
margin: 0 auto 0;
max-width:650px; }

keterangan: ini css di ambil dari template black mobile v1 untuk template lainnya tak perlu memperhatikan yang lainnya misal padding/ margin karena tiap template beda css perhatikan saja pada bagian background-color:#000000 karena kode ini yang menentukan warna background tinggal ubah warna #000000 (hitam) untuk menyesuaikan warna yang sahabat sukai

hup mudah bukan?
Sekian dulu tutor part 1 tunggu sambungan berikutnya pasti di kupas tuntas met berkreasi aja sob

Hatur nuhun manawi bahan katampi

28.1.11
23

Menampilkan gambar pada posting blog atau wap

post kang bagas96 8:25 AM
Gambar juga salah satu kebutuhan yang cukup penting untuk menambah keindahan blog baik itu untuk memasang poto atau memberi contoh saat menjelaskan tutorial

Dan posting kali ini coba menjelaskan sedikit tutorial membuat images / gambar pada post artikel

memang banyak ragamnya memasang gambar pada posting namun menjawab pertanyaan bagaimana memasang gambar dan merubah ukuran gambar

Oke deh langsung saja ke kode html untuk memasang poto

1. Script pertama menampilkan gambar dengan script pertama


<img src="http://bagas96. jw.lt/me.jpg ">

copy kode html



2. Kode html berikutnya menampilkan gambar dengan menentukan ukuran

<img src=" http://bagas96.jw.lt/ me.jpg" border="0" width="75px" height="60px" align="left"/>



keterangan:
1. width untuk mengatur lebar gambar tinggal ganti angka untuk menyesuaiakan
2. height untuk mengatur tinggi gambar
3. Align untuk menaruh posisi gambar bisa pilih
1/3 align="left" posisi gambar sebelah kiri post
2/3 align="right" posisi gambar sebelah kanan post
3/3 align="center" posisi gambar ada di tengah post

Tinggal kamu sesuaikan tergantung selera kamu

Namun bagaimana membuat images yang bisa di klick?

Caranya sama saja hanya di padukan dengan url saja, baik url gambar itu sendiri atau di gabungkan dengan url download/ halaman blog/wap

yups adapun kode html yang langsung dari google adalah


<a onblur="try {parent.deselectBlogger ImageGracefully ();} catch(e) {}" href="http:// bagas96.jw.lt/ me.jpg">
<img src="http:// bagas96.jw.lt/ me.jpg" border="0" width="75px" height="60px" align="left"/></a>

copy kode html


sementara yang biasa di pergunakan dengan url sederhana


<a href="url tujuan"> b </a>

menjadi
<a href="url tujuan"> <img src="http://bagas96.jw.lt/me.jpg">
</a>
copy code html


Sekian dulu artikel untuk kali ini soalnya dah pegel banget ini jari hehe

About blog | Feedback | Rss
Copyright 2009 - 2012 Hak cipta di lindungi UUD
Naik