Posts

Showing posts from January, 2016

Cara menghilangkan margin-left 1em pada postingan blog

Image
setiap postingan blog yang kita beri gambar otomatis akan terdapat: <a href='URL_Gambar' style="margin-left: 1em; margin-right: 1em;"/> <img src=''> </a> jika ukuran gambar kita seting x-large, bisa bikin tampilan ga,bar kadang-kadang nyebrang laman postingan, sampe ke sidebar, nah untuk mengakalinya berikan kode ini di dalam/ di atas  ]]></b:skin> .post-body img { max-width:100%; height:auto; margin-left: -1em; } alhasil setelah beri kode tsb, maka gambar akan fix sesuai dengan lebar laman posting

Cara Mengilangkan iframe style google form

Image
STEP 1. Sign up for a  Google Docs  account if you haven’t already done so. STEP 2. Log into your new  Google Docs  account. STEP 3. Click  New  and choose  Form  from the drop down menu. STEP 4. Create your form using Google’s straight forward tools. STEP 5. When you have finished compiling your form, click the link at the bottom of the page titled:  ‘You can view the published form here’ Here’s an example of what it should look like: http://spreadsheets.google.com/viewform?key=pqbhTz7PIHum_4qKEdbUWVg STEP 6. Right click anywhere on the page and click  View Source  to look at the code behind the form. STEP 7. Copy all the code between  <form>  and  </form>  tags and paste it into the new form page on your web site. Click here for an example STEP 8. Now you’re ready to style your form! Insert your own stylesheet  between the <head> tags. I’ve prepared a version which takes Morning Copy website as it’s starting point. Click

Mengatasi Gambar Salah (Tidak Muncul) Saat Posting Share ke Facebook

Image
Untuk memunculkan gambar, foto, atau image posting yang benar di Facebook, lakukan hal ini: 1. Pastikan gambar yang diupload berukuran minimal 200x200 Pixel atau lebih besar. 2. Tambahkan kode meta tag "Open Graph Image Property" berikut ini ke dalam template Anda. 3. Copas kode berikut ini bagian kode <head> di bawah  kode <b:include data ='blog' name ='all-head-content'/>  <b:if cond='data:blog.postImageUrl'> <meta expr:content='data:blog.postImageUrl' property='og:image'/> <b:else/> <meta content='URL Alternate Image' property='og:image'/> </b:if> 4. Ganti URL Alternate Image dengan link gambar yang akan muncul jika postingan tidak ada gambarnya. Ingat, ukuran gambarnya juga minimal 200px X 200px. 5. Save! Tunggulah sekitar ±24jam, Facebook butuh waktu untuk mengenali perubahan itu di blog Anda. Jiika anda ingin cepat maka gunakanlah  Facebook's Open

Tolong di perhatikan, Etika menggunakan lampu berkendara!

Image
Setelah baca tulisan dari blog sebelah tentang hal baik yang seharusnya dilakukan di tempat umum, saya rasa masih sangat banyak contoh lain yang harus dilakukan. Terutama dalam berlalu-lintas. Kali ini tentang lampu jauh. Kita tahu kalau di setiap kendaraan bermotor terdapat berbagai macam lampu di depan. Mulai dari "lampu sore", "lampu pendek", dan "lampu jauh". Bahkan tidak jarang mobil masa kini banyak yang dilengkapi "foglamp". Sekarang kita bahas lampu jauh saja. Matikan lampu jauh setiap kali ada orang di seberang ataupun di depan Anda. Kenapa? Lampu jauh kan lebih terang? Seharusnya dengan lampu jauh lebih aman dong? Jawabannya tidak lebih aman. Lampu jauh, atau lampu yang di panel berindikator gambar lampu berwarna biru hanya didesain untuk digunakan di daerah yang mengalami kegelapan benar-benar pekat (tidak ada lampu jalan, tidak ada kendaraan di depan yang menerangi jalan) sehingga tidak memungkinkan pengguna ke

Cara Menambah Dua Kolom Widget di Bawah atau Atas Post Body

Image
Cara Menambah Dua Kolom Widget di Bawah atau di Atas Post Bodypada halaman depan blog Anda. Jika halaman depan ( homepage) blog Anda terasa "monoton", maka jadikan ia menarik dengan menambah dua kolom widget baru di bawah atau di atas blog posts (daftar posting terbaru) halaman depan. Dua kolom itu bisa diisi posting terbaru per label (kategori), posting terpopuler, gambar, atau apa saja sebagamana halnya widget/gadget blog. Ini caranya: 1. Template > Edit HTML 2. Cari (Ctrl + F) kode ]]></b:skin> 3. Copy + Paste kode berikut ini di atas kode  ]]></b:skin> tadi: #Spicy Column h2{ font-size:13px; font-weight:bold; color:#B8002E; border-bottom:2px solid #000000; padding-left:5px; } #Spicy Column{ width:600px; /*Change width */ } #Spiceleft{ width:295px; /*width of the left column*/ float:left; margin:4px; } #Spiceright{ width:295px; /*width of the right column*/ float:right; margin:4px; } Save Template! Tahap pertama selesai. Tahap be

Membuat Tampilan video responsive / elastic Video untuk Youtube dan vimeo

Image
Elastis Video HTML5 demo Dengan HTML5, Anda dapat dengan mudah membuat elastis video dengan trik "max-width: 100%" (lihat demo elastis video HTML5). Trik ini tidak bekerja jika kode embed menggunakan iframe atau objek tag yang umum digunakan oleh sebagian besar situs berbagi video seperti YouTube dan Vimeo. video { max-width: 100%; height: auto; } Elastis Objek dan Iframe Embedded Videos demo Caranya sangat sederhana. Anda hanya perlu memasukkan kode embed dengan <div> kontainer dan menentukan 50% sampai 60% didalam padding. Kemudian tentukan sub-elemen (iframe, objek embed) lebar 100%, tinggi 100%, dengan posisi absolut. Hal ini akan memaksa elemen embed untuk memperluas Fullwidth otomatis. css .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; he

Membuat Top navigasi Posisi Fix

Image
Menunya kaya gini nih: menu yang paling atas, kalo di scroll ke bawah menunya akan tetap di situ terus nggak kemana-mana kecuali halamn nya di tutup 1.masuk css (diatas ]]> </b:skin> / didalam <style type='text/css'> dan apalah namanya)  template masukin kode ini /* Top navigation */ #dani-nav{ font-weight:bold; background:#9e200b; height:28px; width:100%; min-width:400px; position:fixed; top:0;left:0; overflow:hidden; z-index:9999; } #dani-nav ul{ margin:0 auto; width:970px } #dani-nav ul li{ float:left; margin:0 0 0 0; list-style-type:none; } #dani-nav ul li a{ line-height:28px; padding:0 15px; color:#fff; font-size:13px; display:block; text-decoration:none; } #dani-nav ul li a:hover{ background:rgba(0,0,0,0.1) !important; } #dani-nav bisa dei ganti suka² ente yang penting sama dengan aturan penulisan css spt ini kalo yang pake tanda "#" itu untuk selector "class" kalo pake