Multiple Upload Gambar Dengan PHP MySQLi oleh - seputarcoronaxdk.xyz

Halo sahabat selamat datang di website seputarcoronaxdk.xyz, pada kesempatan hari ini kita akan membahas seputar Menampilkan File PDF Di HTML Dengan Mudah, kami sudah mempersiapkan artikel tersebut dengan informatif dan akurat, silahkan membaca

Menampilkan File PDF Di HTML – Selamat datang kembali di website malasngoding.com. pada tutorial ini kita akan belajar tentang cara menampilkan file PDF di HTML atau di Website.

Seperti yang kita ketahui, bahwa biasanya file pdf hanya bisa dibuka dengan menggunakan software seperti nitro pdf, adobe reader dan lainnya.

Namun pada tutorial ini kita akan belajar cara menampilkan file pdf di HTML atau website.

Karena terkadang kita ingin menampilkan file PDF pada halaman website kita, entah itu pada website pribadi, website kampus, sekolah atau website lain nya.

Untuk menampilkan file pdf yang bisa langsung di download oleh pengunjung. seperti file jurnal, arsip, laporan dan berkas lainnya.

Atau mungkin teman-teman sedang mengerjakan sebuah aplikasi yang mengharuskan adanya fitur untuk menampilkan isi file pdf pada halaman website. tentunya tanpa menggunakan javascript.

Menampilkan File PDF Di HTML

Pada HTML sendiri sudah disediakan beberapa tag yang bisa kita gunakan untuk menampilkan file PDF di HTML atau pada website.

Yaitu kita bisa menggunakan tag :

• embed
• object
• iframe.

Baca Juga : Cara membuat cetak print laporan dari database dengan PHP

Sebelumnya, untuk lebih jelas, saya akan menjelaskan dulu persiapan apa saja yang diperlukan untuk mengikuti tutorial ini.

Persiapan

Persiapan untuk contoh menampilkan pdf di html tidak rumit. kita hanya butuh 2 file berikut.

• File pdf ( contoh.pdf )
• File HTML atau PHP ( index.html )

Pertama, silahkan siapkan sebuah file pdf.

Ya tentu kita harus punya file PDF nya dong, kalau gak mau nampilin apa? hehe ..

Di sini saya sudah memililki sebuah file pdf untuk contoh percobaan kita. dan saya beri nama dengan file contoh.pdf.

Kedua kita butuh file HTML atau PHP, terserah teman-teman. karena ini hanya contoh, saya membuat sebuah file baru HTML dengan nama index.html.

persiapan menampilkan pdf di html

Setelah persiapan selesai, selanjutnya langsung saja kita mulai dengan cara yang pertama.

Yaitu cara menampilkan file pdf di HTML dengan menggunakan tag embed.

Tag Embed

Untuk menampilkan PDF dengan tag embed kita bisa menggunakan tag yang sudah disediakan di HTML, yaitu tag .. .

Index.html

<h4>Contoh menampilkan file pdf dengan tag embed</h4> <embed type="application/pdf" src="contoh.pdf" width="600" height="400"></embed>

1 2	<h4>Contoh menampilkan file pdf dengan tag embed</h4> <embed type="application/pdf" src="contoh.pdf" width="600" height="400"></embed>

Perhatikan contoh di atas. di sini kita bisa menampilkan file pdf dengan menggunakan tag .. .

Penjelasan Atribut

Dengan beberapa atribut seperti berikut :

• type
  pada atribut type isi dengan "application/pdf" untuk memberitahukan bahwa yang ditampilkan pada tag embed ini adalah file pdf.
• src
  isi dengan nama dan lokasi dari file pdf yang ingin ditampilkan. karena pada contoh ini file pdf dan file html berada pada 1 direktori yang sama, maka langsung saja kita tulis namanya filenya dengan "contoh.pdf".
• width
  isi lebar dari embed yang teman-teman inginkan pada atribut width. di sini saya buat dengan lebar 600.
• height
  isi tinggi dari embed yang teman-teman inginkan pada atribut height. di sini saya buat dengan tinggi 400.

Sekarang kita jalankan untuk melihat hasilnya.

menampilkan file pdf di html

Seperti yang terlihat pada gambar contoh di atas, kita sudah berhasil menampilkan file PDF dengan menggunakan tag html.

Tag Object

Cara kedua, kita juga bisa gunakan tag yang sudah disediakan di HTML.

Kita bisa langsung gunakan seperti cara sebelumnya.

index.html

<h4>Contoh menampilkan file pdf dengan tag object</h4> <object data="contoh.pdf" width="600" height="400"></object>

1 2	<h4>Contoh menampilkan file pdf dengan tag object</h4> <object data="contoh.pdf" width="600" height="400"></object>

Perhatikan contoh di atas. di sini kita bisa menampilkan file pdf dengan menggunakan tag .

Penjelasan Atribut

Dengan beberapa atribut seperti berikut :

• data
  isi dengan nama dan lokasi dari file pdf yang ingin ditampilkan.
  di contoh ini langsung kita isi dengan "contoh.pdf". sesuai dengan nama file pdf nya.
• type
  isi dengan "application/pdf" untuk memberitahukan bahwa yang ditampilkan adalah file pdf.
• width
  isi pengaturan lebar yang diinginkan
• height
  isi pengaturan tinggi yang diinginkan

Sekarang kita jalankan untuk melihat hasilnya.

menampilkan file pdf dengan tag object

Seperti yang terlihat pada gambar contoh di atas, kita sudah berhasil menampilkan file PDF dengan menggunakan tag