So Confused with PDF HTML Embed for Website - Help Please :)

New Here ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Wanting to embed HTML code for PDF into website. 

 

Can do Google Docs, but trying to figure out Adobe.

 

Got the API set up and credentials for our website.

 

BUT - we don't see a way to upload a document in adobe.io - and we don't see any different options where our PDFs exist that are already uploaded in the document cloud.

 

Can anybody clarify how to take a document from the document cloud and use the API to generate the embed code? 

 

Very confused - Thanks!!

Views

171

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Can anybody clarify how to take a document from the document cloud and use the API to generate the embed code? 

 

You can't. Embed API needs either a direct link to the PDF or a Promise the resolves to a ByteArray for the file to be displayed. The Adobe Document Cloud provides neither. The link to a PDF in DC is not a direct link to a PDF, it is a link to a PDF viewing experience much like Embed API itself.

However, if you need to host your files on something other than your own web site, you can store your files in Dropbox and use Embed API to display them. You can see that in action at this CodePen.

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Thank you - so can we use the Embed API to embed on our website? Confused still.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Yes - Embed API is a client-side JavaScript that you can use from any web site to present PDF files in a way that overrides the default browser experience. That way, the view of the PDF and its behavior will be consistent across browsers, operating systems, and devices.

If you are already using Document Cloud to share PDF files, you don't really need Embed API. If you'd rather host your PDF files on your own servers, you can use Embed API to control the experience.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Thank you - but still confused. 

 

When we go into the embed API, how do we "tell it" what the PDF is and where it is? There's no upload there.

 

Or maybe I'm catching it - we need to "host" the PDF at DB or Google Docs and then use the API code and put the link to the file inside of Adobe's HTML code?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

What exactly are you trying to accomplish with Embed API? You may be misunderstanding its purpose.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Embed a PDF on our website - and have it "look better" than we can do with google docs.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

I thought this would be easier - so can keep with google docs for now. It works. Plain and simple. Thanks for help!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 25, 2020 Aug 25, 2020

Copy link to clipboard

Copied

Well that is the purpose of Embed API and with some basic JavaScript skills it is pretty easy to implement but it's not as easy as just uploading a file to a repository.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Aug 26, 2020 Aug 26, 2020

Copy link to clipboard

Copied

Thank you for evaluating Adobe Embed APIs. You can still keep your files on G Drive and use Embed APIs. But, you will have to write a small application through which you can use G Drive APIs to download the file and then pass the file blob to Adobe embed APIs. It's well documented. Please refer to the public documentation of Embed APIs here - https://www.adobe.io/apis/documentcloud/dcsdk/docs.html

 

You should find "Passing file content" subsection under "PDF Embed API basics" section.

 

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Sep 06, 2020 Sep 06, 2020

Copy link to clipboard

Copied

LATEST

Hi, kevind55123760.

>> we need to "host" the PDF at DB or Google Docs

You need to host the PDF file anywhere that you can get a direct link to it. This could be your own website. For example, let's say your website has the following simple path structure:

  • /html/myPdfViewer.html
  • /files/myPdfFile.pdf

The HTML file will have just a few lines of content as described in the documentation my colleague linked to. In particular, for the path structure above, the snippet that refers to the PDF file might look something like this:

adobeDCView.previewFile(
{
   content:   {location: {url: "/files/myPdfFile.pdf"}},
   metaData: {fileName: "myPdfFile.pdf"}
});

Typically you would upload a PDF file to your site the same way you would upload an HTML file, using the site content management tools available to you. Is that something that you can try?

Thanks.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines