Introduction

This article explains the new features of the dynamic embed script. By omitting the data-article-ids attribute, you can automatically fetch all configured H2 section mappings.

This eliminates the need to manage article IDs on the media website side, and all mappings configured in the admin dashboard are automatically applied.

Key Features and Benefits

Main Advantages:

• Simple Implementation: No need to manage article IDs
• Flexibility: Changes reflected just by updating settings in admin dashboard
• Auto-matching: Automatic insertion based on H2 element IDs
• Backward Compatibility: Traditional article ID specification still works

How to Use

Step 1: Configure external element IDs in admin dashboard

1. Open article detail page
2. Enter external element ID for each H2 section (e.g., heading-intro)
3. Save

Step 2: Add IDs to H2 elements on media website

<h2 id="heading-intro">Heading Text</h2>

Step 3: Add embed script

<script src="http://localhost:8000/embed.js"></script>

Technical Details

The script works as follows:

1. Script is loaded
2. Check for data-article-ids attribute
3. If no attribute: GET /api/embed/config (fetch all mappings)
4. If attribute present: GET /api/embed/config?article_ids=xxx
5. Search for H2 elements on the page
6. Insert iframes below matching H2 elements

Conclusion

The all mappings fetch mode makes embed script implementation even simpler. Media websites just need to add the script tag, and all expert comments configured in the admin dashboard are automatically displayed.

Open the console (F12) to see the script in action!