Cara Embed PDF pada HTML

Umumnya, hyperlink digunakan untuk menghubungkan dokumen PDF yang akan ditampilkan di browser. Anchor link HTML (tag <a>) adalah cara termudah untuk menampilkan file PDF pada browser. Tapi jika ingin menampilkan dokumen PDF secara langsung di halaman web, file PDF perlu disematkan di HTML. Tag HTML <embed> adalah tag yang paling tepat digunakan untuk menampilkan dokumen PDF di halaman web. Dalam tutorial ini, saya akan menunjukkan cara menampilkan file PDF di halaman web menggunakan tag HTML <embed>.

Tag <embed> HTML memiliki fungsi utama, yaitu untuk memuat atau menampilkan konten eksternal. Parameter berikut dapat ditentukan dalam tag <embed>.

    src - Menentukan jalur file eksternal untuk disematkan.
    type - Menentukan jenis media konten yang disematkan.
    width - Menentukan lebar konten yang disematkan.
    height - Menentukan tinggi konten yang disematkan.

Selanjutnya kuta akan coba menampilkan sebuah file PDF pada halaman website. Gunakan kode berikut untuk menanamkan file PDF di halaman web HTML.

<embed src = "folder/majalah.pdf" type = "application / pdf" width = "100%" height = "600px" />

Sekarang kita akan mencoba mengatur tampilan dokumen PDF di halaman web. Dengan menggunakan parameter di URL, Kita dapat menentukan dengan tepat apa yang akan ditampilkan dan bagaimana hasil tampilan dokumen PDF.

Parameter berikut biasanya digunakan untuk embed file PDF dalam HTML atau terbuka di browser.

    page = pagenum - Menentukan nomor (integer) halaman dalam dokumen. Halaman pertama dokumen memiliki nilai pagenum 1.
    zoom = scale - Mengatur faktor zoom dan scroll, menggunakan nilai float atau integer. Misalnya, nilai skala 100 menunjukkan nilai pembesaran 100%.
    view = Fit - Mengatur tampilan halaman yang ditampilkan.
    scrollbar = 1 | 0 - Mengaktifkan atau menonaktifkan scrollbar.
    toolbar = 1 | 0 - Mengaktifkan dan menonaktifkan toolbar.
    statusbar = 1 | 0 - Mengaktifkan atau menonaktifkan status bar.
    navpanes = 1 | 0 - Menghidupkan dan mematikan panel navigasi dan tab.

Menentukan Parameter di URL

Anda dapat menentukan beberapa parameter dalam URL. Setiap parameter harus dipisahkan dengan karakter ampersand (&) atau pound (#). Tindakan yang dilakukan dari kiri ke kanan dan tindakan selanjutnya akan menggantikan tindakan sebelumnya.

URL dengan parameter terlihat seperti berikut.

http://dumetschool.com/doc.pdf#Chapter5
http://dumetschool.com/doc.pdf#page=5
http://dumetschool.com/doc.pdf#page=3&zoom=200,250,100
http://dumetschool.com/doc.pdf#zoom=100
http://dumetschool.com/doc.pdf#page=72&view=fitH,100

Nonaktifkan dan Sembunyikan Toolbar di Penampil Web PDF

Contoh ini menunjukkan cara menyembunyikan atau menghapus toolbar, navpanes, dan scrollbar file PDF yang dibuka di HTML <embed> dengan menggunakan parameter di URL.
Gunakan kode berikut untuk menanamkan dokumen PDF di halaman web dan hapus atau sembunyikan toolbar dari PDF yang ada.

<embed src="folder/majalah.pdf#toolbar=0&navpanes=0&scrollbar=0" type="application/pdf" width="100%" height="600px" />

Baiklah teman-temandiatas adalah sedikit penjelasan tentang bagaimana cara

14 November 2017

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat