PDF-file display

PDF-file display

If someone's likely to be challenged with the necessity to have the attached PDF document displayed on the content view page, this article will stand you in good stead. In fact, you don't need to be a cool web developer to fulfill this task. All you need to do is to insert a fragment of the code into the spot best suited for the output:

<object width="100%" height="500px" type="application/pdf" data="path_to_pdf_file" ></object> 

The width and height areas should be set up in accordance to the page parameters.

<object width="100%" height="800px" type="application/pdf" data="path_to_pdf_file">
<a href="path_to_pdf_file">Download PDF file</a></object>

If PDF view plugin is not installed in the browser, display function will not be available. In order to let the user see the attached file, it's necessary to add a link to the file in the middle of the object tag and the link will only get displayed when the view is not possible.

For the output of such a region to be performed, it takes to write a simple module on the basis of Field API which will create new format of display for the field data type. The format choice is made in Manage Display of content type section.

We'll need 4 hooks for that:

  • hook_field_formatter_info() - identifies the new format;
  • hook_field_formatter_settings_form() - creates the form for setting to be done;
  • hook_field_formatter_settings_summary() - the indicated settings' display;
  • hook_field_formatter_view() - the field output on the content page.

First of all we'll create a new format. We'll specify that it will be available for the file data type, and it will also contain 3 parameters for setting - the region's width and height and the text that will be displayed as a link to the file downloading:

 * Implements hook_field_formatter_info().
function field_pdfdisplay_field_formatter_info() {
  return array(
    'pdf_formatter' => array(
      'label'       => t('Display PDF'),
      'field types' => array('file'),
      'settings'    => array(
        'pdf_width'  => '100%',
        'pdf_height' => '450',
        'pdf_alt'    => t('Download PDF file'),

Then we'll create the form elements that are necessary to identify and change the above-mentioned parameters:

 * Implements hook_field_formatter_settings_form().
function field_pdfdisplay_field_formatter_settings_form($field, $instance, $view_mode, $form, &$form_state) {
  $display = $instance['display'][$view_mode];
  $settings = $display['settings'];
  $element = array();
  $element['pdf_width'] = array(
    '#type'           => 'textfield',
    '#title'          => t('Object width'),
    '#description'    => t('Specify the width of the field to display a pdf file (use % or px)'),
    '#default_value'  => $settings['pdf_width'],
    '#required'       => TRUE,
  $element['pdf_height'] = array(
    '#type'           => 'textfield',
    '#title'          => t('Object height'),
    '#description'    => t('Specify the height of the field to display a pdf file (use % or px)'),
    '#default_value'  => $settings['pdf_height'],
    '#required'       => TRUE,
  $element['pdf_alt'] = array(
    '#type'           => 'textfield',
    '#title'          => t('Text for download'),
    '#description'    => t('Specify the text that will appear to download the file'),
    '#default_value'  => $settings['pdf_alt'],
    '#required'       => TRUE,
  return $element;

Next we will output the message which gives the information about our parameters:

 * Implements hook_field_formatter_settings_summary().
function field_pdfdisplay_field_formatter_settings_summary($field, $instance, $view_mode) {
  $display  = $instance['display'][$view_mode];
  $settings = $display['settings'];
  $summary  = t('Region of @width to @height, and text at download link - "@alt"', array(
    '@width'  => $settings['pdf_width'],
    '@height' => $settings['pdf_height'],
    '@alt'    => $settings['pdf_alt'],
  return $summary;

And finally, we'll proceed to the most important thing - generation of file output:

 * Implements hook_field_formatter_view().
function field_pdfdisplay_field_formatter_view($entity_type, $entity, $field, $instance, $langcode, $items, $display) {
  global $base_url;  
  $settings = $display['settings'];
  $element  = array();
  $width    = $settings['pdf_width'];
  $height   = $settings['pdf_height'];
  $alt      = $settings['pdf_alt'];
  $path     = $base_url . '/' . variable_get('file_public_path') . substr($items[0]['uri'], 8);
  $object   = '

  $element[0]['#markup'] = $object;
  return $element;

After that, we'll have the new view format that will display the PDF file as a whole. The region display parameters can well be configured which will allow for "adjusting" it to the required page size.

For convenience purpose, a ready-to-use module for completion of such task is attached.

6 votes, Rating: 5

Read also


Sometimes there is a need to create autocomplete field in order to enhance usability. As worked examples of such fields w...


The use of batch operations ebables forms processing to be performed in the...


In this article I'm going to describe how to operate the main hooks of Fields API entity.

Fields API is one of the entities of Drupal 7 API that allow us:

to create customizeable...


Fast page upload onto the user's browser is a key factor of your site's popularity. If page load time appears to be tiresomely long, it decreases visitor/user engagement and may even induce a user...


SSH is a network protocol of session layer that allows remote control of operating system and tunneling of TCP-connection (e.g. for files exchange).

Subscribe to our blog updates