📙
Documentation
PDF (Developer)

PDF (Developer)

Type Name
Pdf
Usage
This block is used to display a PDF to be downloaded.
Icon
Screenshots
Type
Content
Content Category
Documents

About the PDF

The PDF block is used to host file(s) that the attendees are able to download. They can be PDF, Image Files or Links.

Creating a PDF Block

To create a PDF block, in the Venue Editor, click on "Add Blocks" button in the settings panel on the left, then choose "PDF" under the Documents category.

image

Block Settings

The main setting of the PDF block is the Add Item setting where you can insert your files/links, select the preferred icon and add CTA Text.

If you do not wish to display item icon and item CTA and PDF bookmarking, you can simply toggle off. In addition, the CTA Color is in Hex color code and it can be changed as well.

image

JSON Config

Attributes

🗃️
Block Attributes

NameTypeDescriptionCommon to All
backgroundCoverImage
String
The cover image that you would want to set as default for the block. Eg: “https://files-myxp.s3-ap-southeast-1.amazonaws.com/livestream/default_background/Light_BG_1.png”
Yes
backgroundCoverImageDisablePopup
Boolean
Does not allow popup to occur when this field is true.
Yes
backgroundCoverImageDistortion
Object
Refer here.
Yes
backgroundCoverImageVisibility
Boolean
Only render background image when this field is true.
Yes
blockHeight
String
Sets the height of the block, only useful when fitHeightToContent is false. Eg: “200px”, “2rem”Units can be: px, em, rem, %.
Yes
blockVisibility
Boolean
Determines if the block visibility should be rendered by default.
Yes
blockWidth
String
Only needs to be specified when widthType is “custom”. Eg: “100%”Units can be: px, em, rem, %.
Yes
boundingBox
Boolean
Value of true would result in the block being wrapped with a white background.
Yes
breakpoints
Object
Refer here.
Yes
contentMargin
Array
[“0”, “0”, “0”, “0”, “px”]Last index can be: “px”, “rem”, “em”, “%”, “”.
Yes
contentPadding
String
[“0”, “0”, “0”, “0”, “px”] Last index can be: “px”, “rem”, “em”, “%”, “”.
Yes
ctaColor
String
“#212121” Must be in hex css format
No
enableItemCTA
Boolean
true
No
enableItemIcon
Boolean
true
No
fitHeightToContent
Boolean
Setting this field to true would result in blockHeight to have a predetermined value.
Yes
heading
String
“heading”
Yes
headingAlignment
Enum
"center" | "left"
Yes
headingVisibility
Boolean
true
Yes
order
Integer
1
Yes
resources
Array
Refer here.
No
widthType
Enum
Renders the block width styling based on the value selected. Only when “custom” is selected, blockWidth needs to be specified. Eg: “full” | “half” | “custom” | “fit-content”
Yes

Sample

"resources-block": {
  "type": "Resources",
  "title": "Resources",
  "data": {
      "heading": "Resources",
      "title": "Resources",
      "headingVisibility": true,
      "headingAlignment": "left",
      "ctaColor": "#e50072",
      "enableItemCTA": true,
      "enableItemIcon": true,
      "resources": [
          {
              "link": "https://venues-sdk.gevme.com/assets/sample.pdf",
              "openInNewWindow": true,
              "type": "pdf",
              "label": "Resource file name 1",
              "labelVisibility": true,
              "ctaIcon": "https://venues-sdk.gevme.com/assets/resources-pdf-icon.svg",
              "ctaText": "Download"
          },
          {
              "link": "https://venues-sdk.gevme.com/assets/sample.pdf",
              "openInNewWindow": true,
              "type": "pdf",
              "label": "Resource file name 2",
              "labelVisibility": true,
              "ctaIcon": "https://venues-sdk.gevme.com/assets/resources-pdf-icon.svg",
              "ctaText": "Download"
          },
          {
              "link": "https://venues-sdk.gevme.com/assets/sample.pdf",
              "openInNewWindow": true,
              "type": "pdf",
              "label": "Resource file name 3",
              "labelVisibility": true,
              "ctaIcon": "https://venues-sdk.gevme.com/assets/resources-pdf-icon.svg",
              "ctaText": "Download"
          }
      ],
      "order": 3,
      "alignment": "left",
      "blockWidth": "50%",
      "blockHeight": "340px",
      "widthType": "half",
      "fitHeightToContent": false,
      "boundingBox": true,
      "contentPadding": ["24", "24", "24", "24", "px"],
      "contentMargin": ["16", "0", "0", "0", "px"],
      "breakpoints": {
          "tablet": {
              "blockWidth": "50%",
              "blockHeight": "340px",
              "widthType": "half",
              "fitHeightToContent": false
          },
          "mobile": {
              "blockWidth": "100%",
              "blockHeight": "fit-content",
              "widthType": "full",
              "fitHeightToContent": true
          }
      }
  }
}