/sfmc-contentbuilder-customcontentblock-Giphy

Primary LanguageJavaScript

Content Builder SDK - Giphy Selector 9000

App Overview

  • This SDK app provides a way search giphy for an image, take additional input from the block, and render the image in the email.

Code Overview

  • The application was written in Node.js. Express is used as the framework with EJS as the view engine. Leveraged Salesforce Lightning Design System for the User Interface, Giphy Core SDK for JS for interacting with Giphy API, and Salesforce Marketing Cloud Block SDK for interacting with Content Builder.
  • 3 Total Routes - 1 View
    • index - home page for app that provides the interface the user will engage with.
    • getTrending - retrieves the most recent trending gifs as the block initializes.
    • getSearch - retrieves the gifs based on the user's search.

Install In Your Environment

Read this bullets to understand what will happen and then click on the button Deploy to Heroku to proceed.

The variables apiKey, limit, rating, language, and sort will be created automacally after click on the button. The variable imageSourceDomain need to be added manualy after you create the Heroku App.

  • Must have a working Heroku Account to host app

  • Select the Deploy to Heroku button below

  • Fill out the environment variables

    • apikey - use key from creating a new Giphy app.
    • limit - Number of results to return, maximum 100
    • rating - Limit results to those rated (g, pg, pg-13 or r)
    • language - Default country for regional content; format is 2-letter ISO 639-1 country code
    • sort - Sort order of the results returned (recent | relevant)

  • Create an Installed Package and add a component type of Custom Content Block. Use the Heroku app URL as the Endpoint URL when configuring this component.

Deploy

Assets to Update before deploy

  • public/javascripts/main.js
    • Search for deployedAppDomain and update the value for your app URL
  • app.json
    • Change the app domain URL for logo var