Tuesday, July 6, 2010

Adding other websites into your blog

4 comments
 
Salam,

Aku telah menerima beberapa permintaan untuk aku mengajar bagaimana untuk meletakkan website luar ke dalam blog kita. Mungkin anda telah mengetahui cara-caranya atau telah membaca mengenainya di blog-blog lain. Well, kalau anda telahpun tahu...ignore sahaja post ini. Bagi anda yang masih tidak tahu dan ingin tahu caranya, silakan terus membaca...

Aku bukannya terrer sangat sampai boleh dipanggil sifu...hehehe.


Aku cuma ingin menolong dan menyampaikan pengetahuan aku yang tidak seberapa ini kepada mereka yang memerlukannya dan khasnya untuk blogger yang menggelar dirinya oldtraffods yang tercari-cari bagaimanakah caranya untuk meletakkan website luar ke dalam blog anda.

Aku tunjukkan sample di bawah ini. Cuba klik butang "Securiforce" dan website syarikat aku itu akan dipaparkan:



((Color Code)) ((Securiforce))





Bagaimanakah caranya:

Salin kod html di bawah dan paste dalam "Notepad" untuk rujukan anda di masa hadapan..hehehe





<b style="color: red;">((</b><a href="javascript:jumpto('http://4.bp.blogspot.com/_1U52pHniOTw/TB3cx1lGQ6I/AAAAAAAAAO8/_8X3UMX-Z7Y/s1600/kucing1.jpg')">Cover up</a><b><span style="color: red;">))</span></b>
<b><span style="color: red;">((</span></b><a href="javascript:jumpto('http://2.bp.blogspot.com/_1U52pHniOTw/TCxgRBA3WjI/AAAAAAAAASc/X2-qnFK8m8U/s1600/Luna+And+Ariel.JPG
')">Gambar Betul</a><b><span style="color: red;">))</span></b>

<script language="javascript">
<!--


//Specify display mode (0 or 1)
//0 causes document to be displayed in an inline frame, while 1 in a new browser window
var displaymode=0
//if displaymode=0, configure inline frame attributes (ie: dimensions, intial document shown
var iframecode='<iframe id="external" style="width:50%;height:350px" src="http://4.bp.blogspot.com/_1U52pHniOTw/TB3cx1lGQ6I/AAAAAAAAAO8/_8X3UMX-Z7Y/s1600/kucing1.jpg"></iframe>'

/////NO NEED TO EDIT BELOW HERE////////////

if (displaymode==0)
document.write(iframecode)

function jumpto(inputurl){
if (document.getElementById&&displaymode==0)
document.getElementById("external").src=inputurl
else if (document.all&&displaymode==0)
document.all.external.src=inputurl
else{
if (!window.win2||win2.closed)
win2=window.open(inputurl)
//else if win2 already exists
else{
win2.location=inputurl
win2.focus()
}
}
}
//-->
</script>



Link-link yang tertera di situ anda boleh ubah ke link laman web atau url gambar anda. Angka 50% dan 350px juga anda boleh ubah mengikut kehendak hati anda dan kesesuaian ruang posting di blog anda itu.

Kemudian anda pergi ke Dashboard blog anda dan terus ke "Edit Post". Sebelum anda paste kod html yang anda telah copy dan edit, anda mesti klik "Edit HTML" terlebih dahulu. Selepas itu, barulah anda paste kod html tadi di mana-mana bahagian yang anda suka di dalam post tersebut.

Jika anda ingin melihat hasilnya setelah kod html tersebut ditampal, sila lihat post aku yang lepas di http://abanglongonline.blogspot.com/2010/07/gambar-luna-ariel.html.

Bagaimana pula jika hanya ingin meletakkan satu laman web sahaja?

Anda copy sahaja contoh kod html di bawah ini...Jangan lupa untuk simpannya untuk kegunaan anda di masa hadapan...hehehe.





<iframe src="http://www.cssdrive.com/index.php/main/csscompressor/" width="98%" height="400" border="1"></iframe>


Anda boleh mengubah atau edit link dan data-data untuk "width" dan "height".

Sepertimana yang aku coretkan di atas, kemudiannya anda pergi ke Dashboard blog anda dan terus ke "Edit Post". Sebelum anda paste kod html yang anda telah copy, anda mesti klik "Edit HTML" terlebih dahulu dan barulah anda paste kod html tadi di mana-mana bahagian yang anda suka di dalam post tersebut.

Hasilnya adalah seperti yang dipaparkan di bawah:



Sebenarnya, anda boleh bermain dengan kod-kod html seperti contoh-contoh di atas mengikut daya kreativiti anda. Yang pentingnya anda cuma perlu tahu apakah kod-kod asas yang sepatutnya digunakan.

Apa-apa sekalipun, sebelum anda publish, lebih baik preview dahulu mana tahu hasilnya mengarut.

Amacam? Ingin mencuba? Cubalah....hehehe.


Sekian.

4 Responses so far.

  1. Thanx Faiz..harap html tu berguna utk blog anda

  2. terbaek ini~
    tgh try2 jgk nk wat cmni~ uhuhu. follow anda~

  3. Something wrong with the comment form. numbers of comments didn't appear..

My Pings and Backlinks
Blogged.my Free Auto Backlinks From 1Malaysia Free Auto Malaysia Backlinks
Free SEO Tools My Ping in TotalPing.com