[Original] Building a Digital Experience/Old

Embed Tagboard directly on your website or within your mobile app.

Christine Chalk avatar
Written by Christine Chalk
Updated over a week ago

Getting started

From your account dashboard click on My Embeds. Here you'll be able to manage your existing embeds, or create new ones.

Customizing your embed

In the embed builder, you can customize the look and feel of your digital experience to match your brand. As you update your settings, you will see the changes reflected in the preview on the right side, using template content. Don't forget to select a Tagboard to funnel your own featured content into your story!

Embed type

To display individual pieces of real-time social content, choose between grid, waterfall, and a slideshow-style carousel embed. To embed a Smart Panel in a digital experience, select the Panel option.

Layouts

Depending on the embed type you selected, you will see different layout options.

Grid, basic layout settings

  • Grow Vertically: Adds a 'Load More' button at the bottom of the embed, viewers can click the button to load more content and the embed will extend down

  • Slider: Adds arrows to the sides of the embed, viewers can click the arrows to slide horizontally through new content

  • Cycle posts: Fixed number of grid tiles that randomly cycle through the most recent 100 featured posts

Grid, advanced layout settings

  • Normal grid: All tiles are the same size and create a uniform grid

  • Advanced grid: Tiles are sized differently creating a mosaic

  • Columns: Embed will scale responsively to maintain your selected number of columns when the embed when it is 641px wide or larger

  • Columns (mobile): Embed will scale responsively to maintain your selected number of columns when the embed when it is 640px wide or smaller

  • Rows: Embed will scale responsively to maintain your selected number of rows when the embed when it is 641px wide or larger

  • Rows (mobile): Embed will scale responsively to maintain your selected number of rows when the embed when it is 640px wide or smaller

Waterfall

  • Initial post count: Number of posts that will initially load when the embed is launched

  • Columns: Embed will scale responsively to maintain your selected number of columns when the embed when it is 641px wide or larger

  • Columns (mobile): Embed will scale responsively to maintain your selected number of columns when the embed when it is 640px wide or smaller

Carousel

  • Maximum post count: Choose the maximum number of posts for this embed to display (will always show the most recently featured content)

Styles

General

  • Post color theme: Choose from one of our preset themes, or create your own custom color theme

  • Post social icon style: Choose our classic look for the social post icons, or a simplified look

  • Embed Font: Choose the font that you'd like the text in the social posts to use

Header

  • Show call to action (CTA): Toggle on CTA to set and customize a custom call to action in the header of your embed

  • Show header social icons: Toggle on to show and customize social network icons in the header of your embed

  • Show network filters: Toggle on to allow users to filter posts by social network

Advanced

  • Tagboard badge style: Choose the style that you'd like the Tagboard badge to be displayed in the footer of your embed

  • Gutter size: Controls the spacing between posts

  • "Load More" text: Customize the text on the 'Load More' button

  • "Show Load More" icon: Change the Load More button to display a simple arrow or a chevron

  • Show only media posts: Embed will only show posts that have media attached (photo, video) if this is toggled on and text posts that have been featured will not show in the embed

  • Show post detail modals: Clicking on a post opens a modal that shows more details about the post. When this is turned off, clicking on a post will open the original content on the source network in a new tab.

Animation

  • Load in new content; When applicable if this option is turned on, newly featured content from the linked tagboard will be loaded in automatically without a need to refresh the page

  • Auto-advance: When turned on, embed will automatically advance to the next post based on your cycle speed

  • Cycle Speed: When applicable, this determines the interval between the cycling of posts NOTE: This applies to grid embeds set to cycle posts, and any embeds that are set to a slide animation with auto-advance enabled

  • Animation: Choose how posts animate into view on initial load and transitions

Embed Info

  • Title: Give your embed a name

  • Description: Give your embed a description

  • Embed code: This is where you can access your embed code. You can also access your embed codes(s) on the 'My embeds' tab of your account dashboard.

Tagboards

Last but certainly not least, add your tagboard(s) to choose which featured content you want to display in your digital experience. You can choose up to 4 tagboards to display in one embed.

Embedding a Smart Panel

Select the 'Panel' Type in the left side of the builder. Instead of seeing customization options, you will see a 'Select Panel' button.

Select the pre-built Smart Panel you want to embed on your website or mobile app.

If you haven't built a Smart Panel yet, we'll walk you through getting started here. Smart Panels are dynamic visuals that allow you to expand your storytelling capabilities with graphic and data-driven visualizations, including Polls, Leaderboards, and Hashtag Meters.

Click "Save" to save your embed and generate the embed code. To make things simpler for you, we made sure this embed code will never change. When you make any changes in the embed builder, we automatically update the embed code on our end so you do NOT need to update your website.

Need more assistance? Contact your Account Manager directly or email Support@tagboard.com.

Did this answer your question?