Category : Labels: Blog Tutorial, Iseng- iseng, Template, Tips Trik
Menampilkan situs lain di blog kita, maksudnya?
kayaknya judulnya sudah jelas deh. Tapi bukan Copy Paste Lowh.
Untuk bahasan sharing kali ini tak banyak cakap, biar tidak bingung silahkan lihat contoh seperti di bawah ini.
kayaknya judulnya sudah jelas deh. Tapi bukan Copy Paste Lowh. Untuk bahasan sharing kali ini tak banyak cakap, biar tidak bingung silahkan lihat contoh seperti di bawah ini.Judul Google :
Sudah dilihat dan dicoba digunakan? Hihi 
kayak ngintip yach
. Apakah Ingin tau cara membuatnya? baik kita mulai saja. Kali ini kita bisa menggunakan bagian mana saja dari blog kita, tapi jangan ditempatkan di tempat yang aneh - aneh. Umumnya hal seperti ini diletakkan di bagian Posting, Sidebar, Footer. Yang saya tahu ada yang meletakkannya di sidebar karena mungkin bisa digunakan sebagai alternatif dari gadget pada umumnya. Tapi dalam hal ini saya meletakkannya di bagian posting karena mempunyai space yang lebih besar jadi lebih kelihatan lega...hehehe.... Dan saya juga menggabungkannya atau memasukkannya di dalam spoiler agar lebih bisa menghemat ruang lagi. Kita mulai langkah pertama..
kayak ngintip yach. Apakah Ingin tau cara membuatnya? baik kita mulai saja. Kali ini kita bisa menggunakan bagian mana saja dari blog kita, tapi jangan ditempatkan di tempat yang aneh - aneh. Umumnya hal seperti ini diletakkan di bagian Posting, Sidebar, Footer. Yang saya tahu ada yang meletakkannya di sidebar karena mungkin bisa digunakan sebagai alternatif dari gadget pada umumnya. Tapi dalam hal ini saya meletakkannya di bagian posting karena mempunyai space yang lebih besar jadi lebih kelihatan lega...hehehe.... Dan saya juga menggabungkannya atau memasukkannya di dalam spoiler agar lebih bisa menghemat ruang lagi. Kita mulai langkah pertama..1. Login ke account Blogger sobat
2. Buat Postingan baru → klik Edit HTML
3. Paste kode di bawah ini di bagian Edit HTML Posting
<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;"><b>Judul <em> Google</em></b> : <input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"> </div><br /><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"><div style="display:none;"> <iframe name="cwindow" style="border:5px groove green" width=500 height=200 src="http://www.google.com"></iframe> </div></div></div>
4. Dan coba di lihat hasil previewnya dengan meng-klik Compose. Kalau belum kelihatan hasilnya, bisa langsung di publish ( Terbitkan ) untuk melihat hasilnya sesuai dengan yang diinginkan atau tidak.
Kalau belum sesuai dengan yang sobat inginkan, sobat bisa mengedit bagian kode yang ditulis merah. dan keterangannya ada di bawah ini.
- Judul : Bagian ini merupakan judul dari spoiler. Sobat bisa menggantinya dengan yang sobat inginkan ( Tulisannya Maksudnya ).
- Google : Ini sebenarnya juga judul tapi yang kedua dan miring lagi. Bisa diganti juga.
- style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;
Untuk kode yang di atas itu untuk tampilan dari button atau tombol spoiler. Tapi sebaiknya jangan di utak-atik aja dech. Untuk sekedar tahu saja.
- style="margin: 0px; padding: 6px; border: 1px inset;
Kalau untuk yang ini untuk tampilan dari spoiler. inset menandakan jenis dari salah satu border
- <iframe name="cwindow" style="border:5px groove green" width=500 height=200 src="http://www.google.com"></iframe>
Nah sebenarnya bagian kode ini yang terpenting. Karena kalau tidak ada kode ini tidak akan ada bahasan ini. hehehe . Ini kode yang bertugas munculin situs di blog kita ( Bener gak ya ?)
. Bisa mengedit lebar di widht, tinggi di height. Semua dalam pixel. Bentuk border di border. Untuk jenis - jenis bentuk border akan di bahas di artikel selanjutnya.
Sobat dapat mengganti Alamat situs/ URL yang berwarna hijau dengan URL site pilihan sobat. Sekian sampai di sini dulu bahasan sharing kita kali ini. Sudah ngantuk. Hoaahmm..hehehe... . Bisa mengedit lebar di widht, tinggi di height. Semua dalam pixel. Bentuk border di border. Untuk jenis - jenis bentuk border akan di bahas di artikel selanjutnya.
Kalau masih belum jelas atau ada yang perlu diperbaiki dari bahasan di atas silahkan di lontarkan di kotak komentar. Catatan :
Sobat bisa membuat seperti contoh di atas tanpa spoiler dengan hanya meletakkan kode<iframe name="cwindow" style="border:5px groove green" width=500 height=200 src="http://www.google.com"></iframe>
di bagian manapun. Tentunya akan sangat berguna sebagai tambahan gadget di sidebar bila tanpa spoiler.
Happy Blogging..!!!
wah keren nih sob :D thanks infonya ya sob :D