WPShortcode

flowpaper Shortcode

Below, you’ll find a detailed guide on how to add the flowpaper Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the flowpaper Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the flowpaper Plugin and the shortcodes it provides:

Plugin Icon
flowpaper

"Flowpaper is a dynamic WordPress plugin that transforms your PDFs into interactive flipbooks. With Flowpaper-lite-pdf-flipbook, bring your content to life effortlessly."

★★★✩✩ (34) Active Installs: 20000+ Tested with: 6.4 PHP Version: false
Included Shortcodes:
  • [flipbook]

flowpaper [flipbook] Shortcode

The FlowPaper Lite PDF Flipbook shortcode embeds a PDF viewer in your WordPress site. It allows customization of viewer attributes like width, height, and theme. It also supports lightbox display and iframe embedding.

Shortcode: [flipbook]

Parameters

Here is a list of all possible flipbook shortcode parameters and attributes:

  • width – sets the width of the flipbook
  • height – sets the height of the flipbook
  • scrolling – enables or disables scrolling
  • class – applies a CSS class to the flipbook
  • frameborder – defines the border of the flipbook
  • allowFullScreen – allows the flipbook to be viewed in full screen
  • pdf – link to the source PDF file
  • lightbox – enables or disables lightbox feature
  • theme – sets a theme for the flipbook
  • header – sets a header for the flipbook
  • title – sets a title for the flipbook
  • singlepage – sets the flipbook to single page view
  • cover – sets the cover image for the flipbook
  • id – unique identifier of the flipbook
  • same_height_as – sets the flipbook’s height to match another element

Examples and Usage

Basic example – Display a PDF flipbook with default settings. The ‘pdf’ attribute is used to provide the URL of the PDF file.

[flipbook pdf='http://example.com/path-to-your-pdf.pdf' /]

Advanced examples

Display a PDF flipbook with custom width, height, and a class for styling. The ‘width’ and ‘height’ attributes are used to set the dimensions of the flipbook, while the ‘class’ attribute is used to apply custom CSS styles.

[flipbook pdf='http://example.com/path-to-your-pdf.pdf' width='80%' height='600' class='my-custom-class' /]

Display a PDF flipbook in a lightbox with a custom theme. The ‘lightbox’ attribute is used to enable the lightbox feature, while the ‘theme’ attribute is used to apply a custom theme to the flipbook.

[flipbook pdf='http://example.com/path-to-your-pdf.pdf' lightbox='true' theme='dark' /]

Display a PDF flipbook with custom title, header, and single-page view. The ‘title’ and ‘header’ attributes are used to set the title and header of the flipbook, while the ‘singlepage’ attribute is used to enable the single-page view.

[flipbook pdf='http://example.com/path-to-your-pdf.pdf' title='My PDF Title' header='My PDF Header' singlepage='true' /]

PHP Function Code

In case you have difficulties debugging what causing issues with [flipbook] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'flipbook', 'flowpaper_plugin_add_shortcode_cb' );

Shortcode PHP function:

function flowpaper_plugin_add_shortcode_cb( $atts, $content="" ) {
  $atts = shortcode_atts(
		array(
			'width' => '100%',
			'height' => '500',
      'scrolling' => 'no',
      'class' => 'flowpaper-class',
      'frameborder' => '0',
      'allowFullScreen' => 'true',
      'pdf' => '',
      'lightbox' => 'false',
      'theme' => '',
      'header' => '',
      'title' => '',
      'singlepage' => '',
      'cover' => '',
      'id' => '',
      'same_height_as' => ''
		), $atts, 'flipbook' );

    // Check if we're embedding through a link or iframe
    $linkEmbed = false;
    foreach( $atts as $attr => $value ) {
        if(strtolower($attr) == 'lightbox' && $value == 'true'){
            $linkEmbed = true;
        }
    }

    $html           = "\n".'<!-- FlowPaper PDF flipbook plugin v.'.FLOWPAPER_PLUGIN_VERSION.' wordpress.org/plugins/flowpaper/ -->'."\n";

    if($linkEmbed){
        // add lightbox css styles
        wp_enqueue_style('lity-css', plugins_url( '/assets/lity/lity.min.css', __FILE__ ), false, NULL, 'all');

        $title          = "";
        $cover          = "";
        $pdfUrl         = "";
        $theme          = "";
        $singlepage     = "auto";
        $thumbs         = true;
        $title          = "";
        $header         = "";
        $cloudhosted    = false;

        foreach( $atts as $attr => $value ) {
            if ( strtolower($attr) != 'same_height_as' AND strtolower($attr) != 'onload'
                AND strtolower($attr) != 'onpageshow' AND strtolower($attr) != 'onclick') { // remove some attributes

                if(strtolower($attr) == 'pdf'){ // append url at the end of the base url
                
                  $flowpaper_matches = [];
                  try {
                    if(strpos($value,'.flowpaper.com') && strpos($value,'http')==0){
                      preg_match('/^(?:([^\.]+)\.)?flowpaper\.com$/',parse_url($value)['host'],$flowpaper_matches);
                    }
                  }catch (Exception $ssx) {}

                  if(count($flowpaper_matches)==2 || strpos($value,'publ.flowpaper.com') > 0 || strpos($value,'online.flowpaper.com') > 0 || !strpos(strtolower($value),'.pdf')){
                      $pdfUrl = esc_attr( $value );
                      $cloudhosted = true;

                      // make sure we're using https if the website that has embedded the viewer is using https
                      if(!empty($_SERVER['HTTPS'])){
                          $pdfUrl = str_replace("http://","https://",$pdfUrl);
                      }
                  }else{
                      $pdfUrl = 'http://flowpaper.com/flipbook/?pdf=' . esc_attr( $value ) . (strpos(esc_attr($value),WP_CONTENT_URL)===0?"?wp-hosted=1":"");

                      if(!empty($_SERVER['HTTPS'])){ // use https if PDF is on a https url
                          $pdfUrl = 'https://flowpaper.com/flipbook/?pdf=' . esc_attr( $value ) . (strpos(esc_attr($value),WP_CONTENT_URL)===0?"?wp-hosted=1":"");
                      }
                  }
                }else if(strtolower($attr) == 'theme'){
                  $theme = sanitize_text_field(esc_attr( $value ));
                }else if(strtolower($attr) == 'title'){
                  $title = sanitize_title(esc_attr( $value ));
                }else if(strtolower($attr) == 'cover'){
                  $cover = sanitize_text_field(esc_attr( $value ));
                }else if(strtolower($attr) == 'singlepage'){
                  $singlepage = sanitize_text_field(esc_attr( $value ));
                }
            }
        }

        $html          .= '<a data-lity href="' . sanitize_url($pdfUrl . (!$cloudhosted?('&title=' . $title . '&header=' . $header . '&theme=' . $theme . '&singlepage=' . $singlepage . '&thumbs=' . $thumbs . '&modified=' . get_the_modified_date('ymdgi')):'')) . '">';
        if(strlen($cover) == 0 && strlen($title) > 0){
            $html      .= sanitize_title($title);
        }else if(strlen($cover) > 0){
            $html      .= '<img src="' . sanitize_url($cover) . '" class="aligncenter">';
        }else{
            $html      .= sanitize_url($pdfUrl);
        }
        $html          .= '</a>';
    }else{
        $html          .= '<iframe title="FlowPaper website pdf viewer"';
        $pdfUrl         = "";
        $theme          = "";
        $singlepage     = "auto";
        $thumbs         = true;
        $title          = "";
        $header         = "";
        $cloudhosted    = false;

        foreach( $atts as $attr => $value ) {
            if ( strtolower($attr) != 'same_height_as' AND strtolower($attr) != 'onload'
                AND strtolower($attr) != 'onpageshow' AND strtolower($attr) != 'onclick') { // remove some attributes

                if(strtolower($attr) == 'pdf'){ // append url at the end of the base url
                    
                    $flowpaper_matches = [];
                    try {
                      if(strpos($value,'.flowpaper.com') && strpos($value,'http')==0){
                        preg_match('/^(?:([^\.]+)\.)?flowpaper\.com$/',parse_url($value)['host'],$flowpaper_matches);
                      }
                    }catch (Exception $ssx) {}

                    if(count($flowpaper_matches)==2 || strpos($value,'publ.flowpaper.com') > 0 || strpos($value,'online.flowpaper.com') > 0 || !strpos(strtolower($value),'.pdf')){
                        $pdfUrl = esc_attr( $value );
                        $cloudhosted = true;

                        // make sure we're using https if the website that has embedded the viewer is using https
                        if(!empty($_SERVER['HTTPS'])){
                            $pdfUrl = str_replace("http://","https://",$pdfUrl);
                        }
                    }else{
                        $pdfUrl = 'http://flowpaper.com/flipbook/?pdf=' . esc_attr( $value ) . (strpos(esc_attr($value),WP_CONTENT_URL)===0?"?wp-hosted=1":"");

                        if(!empty($_SERVER['HTTPS'])){ // use https if PDF is on a https url
                            $pdfUrl = 'https://flowpaper.com/flipbook/?pdf=' . esc_attr( $value ) . (strpos(esc_attr($value),WP_CONTENT_URL)===0?"?wp-hosted=1":"");
                        }
                    }
                }else if(strtolower($attr) == 'theme'){
                      $theme = sanitize_text_field(esc_attr( $value ));
                }else if(strtolower($attr) == 'title'){
                      $title = sanitize_title(esc_attr( $value ));
                }else if(strtolower($attr) == 'header'){
                      $header = sanitize_text_field(esc_attr( $value ));
                }else if(strtolower($attr) == 'singlepage'){
                      $singlepage = sanitize_text_field(esc_attr( $value ));
                }else if(strtolower($attr) == 'thumbs'){
                      $thumbs = sanitize_text_field(esc_attr( $value ));
                } else if ( $value != '' ) { // adding all attributes
                      $html .= ' ' .sanitize_text_field(esc_attr( $attr )) . '="' . sanitize_text_field(esc_attr( $value )) . '"';
                } else { // adding empty attributes
                      $html .= ' ' . sanitize_text_field(esc_attr( $attr ));
                }
            }
        }

        $html .= ' src = "' . sanitize_url($pdfUrl . (!$cloudhosted?('&title=' . $title . '&header=' . $header . '&theme=' . $theme . '&singlepage=' . $singlepage . '&thumbs=' . $thumbs . '&modified=' . get_the_modified_date('ymdgi')):'')) . '"';
        $html .= ' seamless="seamless" style="margin-bottom:0;display:block;">Your browser does not seem to support iframes. <a href="' . sanitize_url($pdfUrl) . '" target="_blank">Click here to read this PDF</a>.</iframe>'."\n";

        if(!$cloudhosted){
            $publicationType = 'Convert your PDF to digital flipbook';
            $publicationTypeLink = '/flipbook-maker/';

            if(strpos($pdfUrl,'broch') !== false){
                $publicationType = 'Convert a PDF to digital brochure';
                $publicationTypeLink = '/brochure-maker/';
            }

            if(strpos($pdfUrl,'catalog') !== false){
              $publicationType = 'Convert your PDF to online catalog';
              $publicationTypeLink = '/catalog-maker/';
            }

            if(strpos($pdfUrl,'mag') !== false){
              $publicationType = 'Convert your PDF to online magazine';
              $publicationTypeLink = '/online-magazine-maker/';
            }

            $html  = '<div style="display:block">' . $html;
            $html .= '<div id="flowpaper-logo-bottom" class="flowpaper-logo-bg" style="background:linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 200px);width:100%;height:19px; padding-bottom: 1px; padding-left: 5px; padding-right: 10px; display: flex; align-items: center;z-index:9999">';
            $html .= '<span style="height: 37px; padding-left: 6px;width:90%"> <a id="flowpaper-link" style="fill: #fff" alt="FlowPaper logotype" title="FlowPaper logotype" href="https://flowpaper.com" target="_blank"> <img alt="Publish PDF flipbooks online" style="height:17px;width:auto;margin-top:11px;" src="' . plugins_url( '/assets/flowpaper-logo.png', __FILE__ ) . '" border="0"> </a> </span>';
            $html .= '<span style=" float: right; right: 0; font-size: 10px; white-space: nowrap; opacity:0.8"><a href="https://flowpaper.com' . $publicationTypeLink .'" target="_new" style="text-decoration:none;border-bottom:none;">' . $publicationType . ' &#8599;</a></span>';
            $html .= '</div></div>';
        }

        if ( isset( $atts["same_height_as"] ) ) {
            $html .= '
                <script>
                document.addEventListener("DOMContentLoaded", function(){
                    var target_element, iframe_element;
                    iframe_element = document.querySelector("iframe.' . sanitize_text_field(esc_attr( $atts["class"] )) . '");
                    target_element = document.querySelector("' . sanitize_text_field(esc_attr( $atts["same_height_as"] )) . '");
                    iframe_element.style.height = target_element.offsetHeight + "px";
                });
                </script>
            ';
        }
    }
	return $html;
}

Code file location:

flowpaper-lite-pdf-flipbook/flowpaper-lite-pdf-flipbook/flowpaper.php

Conclusion

Now that you’ve learned how to embed the flowpaper Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.

Related Shortcodes

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *