In addition to showing the leaderboard inside your campaign pop-up, you can also embed it as a standalone element directly on your website. This is a great way to showcase a live ranking table on a blog post, a community page, or next to an embedded campaign to foster competition.
Step-by-Step Guide
The process involves adding two pieces of code to your website in two different locations.
Step 1: Get Your Embed Code
- In your campaign editor, navigate to the Integrations tab.
- Select the "Show only the campaign leaderboard anywhere on your site" option.
- You will see a panel with the two code snippets you need.
Step 2: Add the Code to Your Website
Add the Script Tag to Your Site's <head>
The first snippet is a <script> tag. This script powers all embeds from our platform.
Action: Copy the <script> tag and paste it anywhere before the closing </head> tag in your website's HTML. You only need to do this once per website, even if you embed multiple campaigns or leaderboards.
Add the Leaderboard Div Tag
The second snippet is a specific <div> tag for the leaderboard.
Action: Copy the following <div> tag and paste it into the body of your webpage exactly where you want the standalone leaderboard to appear.
<div id="adact-leaderboard"></div>
Unlike the full campaign embed, this `div` tag is the same for all your leaderboards; the script knows which leaderboard to show based on the page it's on or other context.