YooTheme PDF DJ-Flipbook element

YooTheme PDF DJ-Flipbook element

This element allows rendering PDF files on your website!

It is necessary to enable jQuery support in the advanced settings of Yootheme
Go to Setings / Advenced enable  jQuery and save.



After installation the DJ-Flipbook element is visible    in elements library  under DJ-Extensions tab:


Example



Settings

This plugin comes with several options that are based on the YooTheme Grid element.



Grid

  1. masonry - enable the masonry effect,
  2. parallax - set the value for parallax effect,
  3. column gap - choose gap for columns,
  4. row gap - choose gap for rows,
  5. divider - show/hide dividers for each grid item,
  6. alignment -  center columns / center rows.

Columns

  1. phone portrait - select columns for phone screen resolution,
  2. phone landscape - select columns for phone landscape screen resolution,
  3. tablet landscape - select columns for tablet landscape screen resolution,
  4. desktop - select columns for desktop screen resolution,
  5. large screens - select columns for large screens resolution.
  1. lightbox - if this option is selected, pdf file will be loaded only in the lightbox,
  2. image width/height - select width/height for a lightbox,
  3. image orientation - check to allow mixed image orientations.


Panel

  1. style - select card style for each panel,
  2. padding - select padding for panel element,
  3. max width - select max width for each panel.

Title

  1. style - select a style for a title field,
  2. link - if the link is selected, the pdf file will be loaded on title click,
  3. hover style - select a style for the hover,
  4. decoration - select title's decoration,
  5. font family - select font family for the title,
  6. color - select color for the title,
  7. HTML element - select what HTML element title should be,
  8. alignment - select alignment for the title,
  9. grid width - select grid width. This option is available when title alignment is left,
  10. grid column gap - select column gap. This option is available when title alignment is left,
  11. grid row gap - select grid row gap. This option is available when the title alignment is left,
  12. grid breakpoint -  select grid breakpoint. This option is available when the title alignment is left,
  13. margin top - select a top margin for title field.

Meta

  1. style - select style for meta,
  2. color - select color for meta,
  3. alignment - select meta's alignment,
  4. HTML element - select what HTML element meta should be,
  5. margin top - select margin top for meta field.

Content

  1. style - select style for the content field,
  2. alignment - select alignment for the content field,
  3. drop cap - enable drop cap feature,
  4. columns - select columns for content,
  5. columns breakpoint - select columns breakpoint. Available when columns are selected,
  6. margin top - select margin-top for the content field.

Image

  1. width/height - select width/height for the image,
  2. border - select border for the image
  3. box shadow - select box-shadow,
  4. box decoration - select box decoration,
  5. link - link the image. When the image is linked, the pdf file will be shown on image click,
  6. hover transition - select hover transition,
  7. hover box shadow -select box-shadow on hover,
  8. icon width - select icon width,
  9. icon color - select icon color,
  10. alignment - select image alignment
  11. grid width - select grid width. This option is available when image alignment is set to left or right,
  12. grid column gap - select grid column gap. This option is available when image alignment is set to left or right,
  13. grid row gap - select grid row gap. This option is available when image alignment is set to left or right,
  14. grid breakpoint - select grid breakpoint. This option is available when image alignment is set to left or right,
  15. vertical alignment - select vertical alignment. This option is available when image alignment is set to left, right, between or bottom,
  16. margin top - select margin top for image field,
  17. inline svg - make svg stylable with css
  18. SVG color - select svg color. This option is available when inline svg option is selected.

Grid

Grid options are based on YooTheme's grid element's options.

Content

The content tab contains 8 available fields that can be set.

  1. Title - provide title for the item,
  2. Meta - provide meta for the item,
  3. content - provide content for the item,

  1. image - provide an image for the item. Available when icon field is empty,
  2. image alt - provide the image's alt,
  3. icon - provide an icon. Available when image field is empty,
  4. link - provide a link for PDF file,
  5. tags - provide tags for this item.

Example content



      • Related Articles

      • Additional Elements for YooTheme

        DJ-Catalog2-YooTheme integration plugin comes with additional elements that can be useful for building an e-commerce website. Compare products - this element renders compare button for product list, Extended products grid - this element is a grid ...
      • Yootheme template pages extension

        DJC2-YooTheme-Integration plugin comes with a pages extension for templates. To create a new template with DJ-Catalog2 context navigate to Templates: Click the "New Template" button. Available pages will be displayed on the page select element: ...
      • Logman -DJ-Classifieds plugin

        This integration of DJ-Classifieds with  LogMan from JoomlaTools lets you record the changes in DJ-Classifieds. With LogMan you can easily keep track of the changes on your website and what users have done.  The plugin logs adding, editing, deleting, ...
      • EasySocial integration for DJ-Classifieds

        In this tutorial, I’ll show you how to install both Joomla plugin and EasySocial application. I will also show a basic configuration that can help you display ads on your community stream and social profile. This plugin comes free with the ...
      • How to use DJ-Classifieds - YooTheme Integrator Plugin

        What is our integrator DJ-Classifieds - YooTheme Integrator is a special plugin that provides the ability to generate views of the DJ-Classifieds component using the Yootheme PRO builder Thanks to the different content types available in the plugin - ...