Create Websites with CHEETAH

The most important design elements at a glance (16)

Embedding pdf files

There are various methods for embedding pdf documents in a web page. In any case, such a file must of course be stored in a location from which it can also be accessed from the website. Online platforms such as "Yumpu" or various cloud storages such as "Onedrive" or "Backup-Sync" from Google are suitable here. In this example, we will explicitly use "Yumpu", which can be used free of charge with only minor restrictions and also provides embedding code for document display on the website via a special wizard.
 

 

After you have uploaded your pdf file to the platform and entered the corresponding metadata in the mask provided, you can use the "Embed" function to create the embed code in the dialog:

Clicking on the button marked in the screenshot will give you access to a special wizard ("Set embedding options") where you can make various settings regarding the pdf viewer that will later be visible on your website. These include the style, size and number of pages of the start page as well as the activation of various control elements (however, some functions are only available in the paid version). Each setting simultaneously modifies the embed code displayed in the upper part of the wizard. At the end you only have to copy this embed code to the clipboard and then assign it to the inline / HTML element on your web page:

Note that you should choose the size of the embed area as close as possible to the size of the embed window specified in the embed code (here 940x846 pixels), which you then enlarge a tiny bit until the scroll bars disappear. The result could look like this, for example:

In the mobile view, however, it is usually better to embed the pdf file directly via iFrame. To do this, you only need to exchange the access path to the pdf file (shown in red) with your pdf file in the code listed below (which explicitly uses the "Google Viewer"):

< iFrame style="width: 260px; height: 420px;" src= "https://docs.google.com/gview? url= {URL zur PDF} &embedded=true" height="240" width="320" frameborder="0"> < /iFrame >
 

Note: Of course, you have to hide the two variants alternately, so that the first variant is displayed only in the desktop view and the second variant only in the smartphone view.
 

Embedding magazines created with the Digital Magazine Editor

The Builderall PREMIUM plan includes the "Builderall Unlimited Magazine Builder", which allows you to create high-quality pdf - magazines with little effort. These magazines can be saved as pdf - files (and thus of course also printed out) as well as embedded in web pages, whereby the embedding code is generated directly in the editor. Here is also a small example:

TB Amazon