Deniz Özkan | HTML Sayfaya PDF Yerleştirme
15384
post-template-default,single,single-post,postid-15384,single-format-standard,ajax_fade,page_not_loaded,,footer_responsive_adv,qode-theme-ver-14.2,qode-theme-bridge,disabled_footer_top,wpb-js-composer js-comp-ver-5.4.7,vc_responsive

HTML Sayfaya PDF Yerleştirme

HTML Sayfaya PDF Yerleştirme

Merhaba Arkadaşlar,

Normalde her yerde rahatlıkla bulunan konuları yazarak zaman kaybetmek istemiyordum. Fakat stajyerlerimin araştırma konusunda sorun yaşadığını görmem nedeniyle, zaman zaman stajyerlerime verdiğim ödevlerde kullanmaları gereken kod parçalarını da burada paylaşacağım.

Bu kapsamda, HTML sayfamızın içerisinde, aynı Youtube videolarımızı görüntüleyebildiğimiz gibi, PDF dosyalarını görüntüleyebilmek için şu kodu kullanmamız gerekiyor:

<embed src="http://www.siteismi.com/klasor/deneme.pdf" width="600" height="400">

Burada dikkat etmemiz gereken konu öncelikle dosyamızın yolu… Benim stajyerlerimden istediğim, localdeki “Deniz” klasörü içerisindeki “deneme.pdf” pdf dosyalasını görüntülemeleriydi. Bu işlem için kullanmaları gereken kod,

<embed src="/Deniz/deneme.pdf" width="600" height="400">

Yani, src tagine yerel bir dosya yolu yazabileceğimiz gibi bir link de ekleyebiliriz.

Daha sonra dikkat etmemiz gereken konu ise görüntüleme alanımızın boyutları…  Width (genişlik) ve Height (yükseklik) değerlerini değiştirerek, görüntüleme alanının boyutunu düzenleyebiliriz.

Aslında pdf görüntüleme işlemini yapmak için tek yol bu kod parçası değil. Frame içerisine de yerleştirebiliriz, ya da <object> tagini kullanarak da aynı sonuca varabiliriz. Diğer iki kullanım için de örnekleri aşağıda bulabilirsiniz.

Object Tag’iyle Kullanım:

<object width="400" height="500" type="application/pdf" data="/my_pdf.pdf" id="pdf_content"> 
<p>Pdf dokümanı yüklenemediğinde verilecek hata mesajı...</p> </object>

Frame İçerisinde Gösterme

<iframe width="300" height="150" style="width: 100%; height: 700px;" src="http://docs.google.com/gview?url=LİNK BURAYA GELİCEK&amp;embedded=true" frameborder="0">
</iframe>

Bu seçeneklerden birini kullanarak HTML sayfalarınızın içerisinde PDF dosyalarınızı görüntüleyebilirsiniz. Umarım konuyla ilgili bilgi arayanlara yardımcı olmuştur.

Henüz yorum yok

Yorum yapmak ister misiniz?