You are on page 1of 7

<!

DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>PDFObject: Code Generator</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Peralta" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Slab
:300,700" />
<link rel="stylesheet" href="/css/prism.css" />
<link rel="stylesheet" href="/css/site.min.css" />
<link rel="stylesheet" href="/css/generator.min.css" />
<!-- begin favicon madness -->
<link rel="apple-touch-icon" sizes="57x57" href="/favicons/apple-touch-icon-57x5
7.png">
<link rel="apple-touch-icon" sizes="60x60" href="/favicons/apple-touch-icon-60x6
0.png">
<link rel="apple-touch-icon" sizes="72x72" href="/favicons/apple-touch-icon-72x7
2.png">
<link rel="apple-touch-icon" sizes="76x76" href="/favicons/apple-touch-icon-76x7
6.png">
<link rel="apple-touch-icon" sizes="114x114" href="/favicons/apple-touch-icon-11
4x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/favicons/apple-touch-icon-12
0x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/favicons/apple-touch-icon-14
4x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/favicons/apple-touch-icon-15
2x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon-18
0x180.png">
<link rel="icon" type="image/png" href="/favicons/favicon-32x32.png" sizes="32x3
2">
<link rel="icon" type="image/png" href="/favicons/android-chrome-192x192.png" si
zes="192x192">
<link rel="icon" type="image/png" href="/favicons/favicon-96x96.png" sizes="96x9
6">
<link rel="icon" type="image/png" href="/favicons/favicon-16x16.png" sizes="16x1
6">
<link rel="manifest" href="/favicons/manifest.json">
<link rel="mask-icon" href="/favicons/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-TileImage" content="/favicons/mstile-144x144.png">
<meta name="theme-color" content="#ffffff">
<!-- end favicon madness -->
</head>
<body>
<header>
<h1>PDFObject</h1>
<p class="tagline">An open-source standards-friendly JavaScript utility for
embedding PDF files into HTML documents.</p>
<nav>
<ul>
<li><a href="/">&lt; Back to main page</a></li>
</ul>
</nav>
</header>
<main>
<div class="adspace">
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-9087092298794970"
data-ad-slot="3771249590"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<h2>PDFObject Code Generator</h2>
<p>This code generator can generate two kinds of PDF embedding code: pure standa
rds-compliant HTML markup, or JavaScript-based PDFObject code. The generator als
o makes it easy to customize your embed code using Adobe's optional PDF Open par
ameters.</p>
<p class="notes">Disclaimer: This service is provided free, as-is with no implie
d guarantees, and without support. The hope is that you will find the service us
eful and helpful, but should you encounter issues with the code generated on thi
s site, you'll need to handle them yourself.</p>
<div id="generatedCode"></div>
<form id="pdfCodeGeneratorForm" class="pure-form">
<div class="form-element-wrapper">
<label for="embedtype"> Type of code to generate:</label>
<select id="embedtype">
<option value="javascript">PDFObject (uses JavaScript)</option>
<option value="markup">Standard markup (no JavaScript)</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="pdfURL"> URL of the PDF file:</label>
<input id="pdfURL" required />
</div>
<div class="form-element-wrapper">
<label for="targetElement">CSS selector of target element:</label>
<input id="targetElement" />
<span class="hint">Leave blank if you intend to make the PDF fill the browse
r window.</span>
</div>
<div class="form-element-wrapper">
<label for="pdfAltContent">Fallback HTML:</label>
<textarea id="pdfAltContent">&lt;p>This browser does not support inline PDFs
. Please download the PDF to view it: &lt;a href="[url]">Download PDF&lt;/a>&lt;
/p></textarea>
<span class="hint">Any string entered here will be inserted into the target
element when the browser doesn't support inline PDFs. HTML is supported. Use the
shortcode [url] to insert the URL of the PDF.</span>
</div>
<!-- div class="form-element-wrapper">
<label>Size:</label>
<span class="coordinates">
<label for="pdfWidth">Width:</label> <input id="pdfWidth" placeholder="1
00%" />
<label for="pdfHeight">Height:</label> <input id="pdfHeight" placeholder
="100%" />
</span>
<span class="hint">The width defaults to 100%, which means the PDF will expa
nd to fill the element that contains it, whether the element is a <code>&lt;div&
gt;</code> or <code>&lt;body&gt;</code>. The width and height are specified via
CSS, which means you can enter any CSS-copatible unit of measurement, including
<code>px</code>, <code>%</code>, <code>em</code>, <code>rem</code>, etc.</span>
</div -->
<div id="pdfopenoptions">
<fieldset>
<legend>Optional PDF Open Parameters</legend>
<p>PDF Open parameters allow you to customize the way a PDF file opens in Adobe
Reader. You can show/hide toolbars, specify a page number, change the display si
ze, and more. <a href="http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat
/pdfs/pdf_open_parameters.pdf">Read Adobe's specifications</a> to learn more. <b
>These parameters are not well-supported outside of Adobe Reader &mdash; most PD
F readers will ignore the parameters, including the built-in PDF readers in Chro
me, Internet Explorer, and Safari.</b></p>
<fieldset>
<legend>Show/hide various controllers</legend>
<div class="form-element-wrapper">
<label for="scrollbar">Scrollbars</label>
<select id="scrollbar">
<option value="">No preference</option>
<option value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="toolbar">Toolbar</label>
<select id="toolbar" data-has-relationship="true">
<option value="">No preference</option>
<option value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="statusbar">Status bar</label>
<select id="statusbar">
<option value="">No preference</option>
<option value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="messages">Document messages bar</label>
<select id="messages">
<option value="">No preference</option>
<option value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="navpanes">Navigation panes and tabs</label>
<select id="navpanes">
<option value="">No preference</option>
<option value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
<div class="form-element-wrapper">
<label for="pagemode">Page mode:</label>
<select id="pagemode">
<option value="">No preference</option>
<option value="none">none (default)</option>
<option value="bookmarks">bookmarks</option>
<option value="thumbs">thumbnails</option>
</select>
<span class="hint">Page mode cannot be used if toolbar is set to 'hide'. This
feature is also supported by PDF.js.</span>
</div>
</fieldset><!-- end fieldset 'show/hide controllers' -->

<fieldset>
<legend>Jump to a location in the document</legend>
<p class="muted">Please select one method; you cannot use <em>named destination<
/em> and <em>page</em> at the same time.</p>
<div class="form-element-wrapper">
<label for="nameddest">Jump to a named destination:</label>
<input id="nameddest" data-has-relationship="true" />
<span class="hint">This feature is also supported by PDF.js.</span>
</div>
<div class="form-element-wrapper">
<label for="page">Jump to page #:</label>
<input id="page" data-has-relationship="true" type="number" placeholder="1" />
<span class="hint"><b>Supported by most PDF readers.</b> This feature is also
supported by PDF.js.</span>
</div>
</fieldset><!-- end fieldset 'Jump to a location' -->

<fieldset>
<legend>Display size and scroll location of document</legend>
<p class="muted">Please select one method; you cannot use <em>zoom</em>, <em>vie
w</em> and <em>view rectangle</em> at the same time.</p>
<div class="form-element-wrapper">
<label>Zoom:</label>
<span class="coordinates">
<label for="zoom_percent">%:</label> <input id="zoom_percent" type="number
" data-has-relationship="true" />
<label for="zoom_x">x:</label> <input id="zoom_x" type="number" data-has-r
elationship="true" />
<label for="zoom_y">y:</label> <input id="zoom_y" type="number" data-has-r
elationship="true" />
</span>
<span class="hint"><strong>X/Y coordinates are optional.</strong> Adobe Reader
will zoom in using the %, and scroll to the x/y coordinates specified (in pixel
s). Also supported by PDF.js.</span>
</div>
<div class="form-element-wrapper">
<label for="view">View:</label>
<span class="coordinates">
<select id="view" data-has-relationship="true">
<option value="">No preference</option>
<option value="Fit">Fit page</option>
<option value="FitH">Fit page width</option>
<option value="FitV">Fit page height</option>
<option value="FitB">Fit bounding box</option>
<option value="FitBH">Fit bounding box width</option>
<option value="FitBV">Fit bounding box height</option>
</select>
<label for="view_offset">Offset:</label> <input id="view_offset" type="num
ber" />
</span>
<span class="hint"><strong>Offset coordinate is optional.</strong> Adobe Reade
r will scroll to the coordinate specified (in pixels).</span>
</div>
<div class="form-element-wrapper">
<label>View rectangle:</label>
<span class="coordinates">
<label for="viewrect_w">w:</label> <input id="viewrect_w" type="number" data
-has-relationship="true" />
<label for="viewrect_h">h:</label> <input id="viewrect_h" type="number" data
-has-relationship="true" />
<label for="viewrect_x">x:</label> <input id="viewrect_x" type="number" data
-has-relationship="true" />
<label for="viewrect_y">y:</label> <input id="viewrect_y" type="number" data
-has-relationship="true" />
</span>
<span class="hint">Adobe Reader will zoom in using width/height sizes, then sc
roll to the x/y coordinates specified (in pixels). This will override any settin
gs specified in the &quot;zoom&quot; or &quot;view&quot; options.</span>
</div>
</fieldset><!-- end fieldset 'size and scroll' -->

<fieldset>
<legend>Highlighting</legend>
<div class="form-element-wrapper">
<label for="search">Words to highlight:</label>
<input id="search" />
<span class="hint">Adobe Reader can highlight search terms. <strong>Separate
words with a space</strong>. This feature only searches for single words and do
es not work for phrases. Do not use apostrophes('), quotes (&quot;), ampersands
(&amp;), an equal sign (=) or a hash (#).</span>
</div>
<div class="form-element-wrapper">
<label>Draw highlight box:</label>
<span class="coordinates">
<label for="highlight_w">w:</label> <input id="highlight_w" type="number" />
<label for="highlight_h">h:</label> <input id="highlight_h" type="number" />
<label for="highlight_x">x:</label> <input id="highlight_x" type="number" />
<label for="highlight_y">y:</label> <input id="highlight_y" type="number" />
</span>
<span class="hint">Adobe Reader will draw a highlight box using the dimensions
specified (in pixels).</span>
</div>
</fieldset><!-- end fieldset 'highlighting' -->

<fieldset>
<legend>Other</legend>
<div class="form-element-wrapper">
<label for="comment">Comment:</label>
<input id="comment" />
<span class="hint">Specifies a comment on a given page in the PDF document. Yo
u must specify a comment ID, such as <code>452fde0e-fd22-457c-84aa-2cf5bed5a349<
/code></span>
</div>
<div class="form-element-wrapper">
<label for="fdf">URL of FDF file:</label>
<input id="fdf" />
<span class="hint">Adobe Reader uses FDF files to auto-populate form fields in
the PDF.</span>
</div>
</fieldset><!-- end fieldset 'other' -->
</fieldset><!-- end fieldset 'Optional PDF Open Parameters' -->
</div><!-- end pdfopenoptions -->
<div class="form-element-wrapper">
<input id="submit" type="submit" class="pure-button pure-button-primary button-l
arge" value="Generate code" />&nbsp;&nbsp;
<input id="reset" type="reset" class="pure-button" value="Reset"/>
</div>
</form>
<div class="adspace">
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-9087092298794970"
data-ad-slot="3771249590"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</main>in.css" />
<link rel="stylesheet" href="/css/generator.min.css" />
<!-- begin favicon madness -->
<link rel="apple-touch-icon" sizes="57x57" href="/favicons/apple-touch-icon-57x5
7.png">
<link rel="apple-touch-icon" sizes="60x60" href="/favicons/apple-touch-icon-60x6
0.png">
<link rel="apple-touch-icon" sizes="72x72" href="/favicons/apple-touch-icon-72x7
2.png">
<link rel="apple-touch-icon" sizes="76x76" href="/favicons/apple-touch-icon-76x7
6.png">
<link rel="apple-touch-icon" sizes="114x114" href="/favicons/apple-touch-icon-11
4x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/favicons/apple-touch-icon-12
0x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/favicons/apple-touch-icon-14
4x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/favicons/apple-touch-icon-15
2x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon-18
0x180.png">
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga'
);
ga('create', 'UA-1394306-6', 'auto');
ga('send', 'pageview');
</script>
<script src="/js/adblockchecker.min.js"></script>
</body>
</html>

You might also like