Object: account_code_blocks

Usage & Structure

Creates blocks that contain code snippets. Code blocks created by your app are injected into the HTML of all Hubs in the account where the app is installed. The functionality is the same as the Custom Code feature in the Uberflip app, with the exception that code blocks created with this object will not be visible in to end users in the Uberflip application.

The code injected must be HTML, CSS, or JavaScript. Other types of code, or web applications, must be hosted externally: to integrate these with Uberflip, use the hub_sidenav_items object to iframe them into the Uberflip application.

Code snippets are placed in the content property of the object. They are static by default, but you can also dynamically populate user-entered values in the code by referencing configuration fields. Configuration fields are created using the config_fields object, and allow you to expose fields in the Uberflip application that accept user inputs. You can reference any configuration field's name value in your code between double curly brackets (e.g. {{config_field_name}}) to insert the field's user-defined value in that location. For more details, see the section on the config_fields object.

Consists of one or more account_code_block objects that each contain the properties listed below.

📘

Note

Configuration fields are Liquid template variables, so you can also use them with other functionality of the Liquid template language. You can find documentation for Liquid here.

Properties

• code string / required: The unique name used to reference the code block.
  • Create a new code block by prefacing value with an underscore ("_").
  • Existing code blocks can not be referenced.
• name string / required / max: 100: The display name of the code block (will only be visible in Uberflip's internal systems).
• content string / required: The full code snippet to be injected.
  • May be HTML, CSS (in <style> tags), or JavaScript (in <script> tags).
  • Reference configuration fields by enclosing the target configuration field's name with double curly braces, e.g. {{config_field_name}}. This must match the value of config_fields.config_field.name for the target configuration field.
• placement_code string / required: The placement of the code snippet within the HTML of the page.
  • Value must be one of: HEAD, BODY_TOP, BODY_BOTTOM, BELOW_FOOTER.
  • See here for descriptions of the placements and guidelines for choosing an appropriate placement for your code snippet.
• description string / optional / max: 200: A brief description of the code block's purpose.
• functionality_code string / optional: The Privacy Group functionality that this code block will be associated with. The code in this code block will be rendered only if the specified functionality is assigned to a Privacy Group and a Hub visitor has opted in to that Privacy Group.
  • Value must match value of functionalities.functionality.code.

Sample Manifest

"account_code_blocks" : [
    {
      "code": "_EXAMPLE_CODE_BLOCK",
      "name": "Example App Code Block",
      "content": "<style> color: #{{fontcolor}} </style>",
      "placement_code": "BODY_BOTTOM",
      "description" : "User-defined font color for Example App"
    } 
  ]

👍

Note

In this sample manifest, the code snippet references a configuration field with the name fontcolor. To function, this would also require a config_fields object in the same manifest which contains a name object with the value fontcolor (i.e. a "Font Color" configuration field must also exist).

Referencing

Code blocks created with this object can not be referenced in any other objects.