Quick Start - The Anime Community

Embed Code

Place this div where the comment section should be.

<div id="anime-community-comment-section"></div>

Execute this code to populate the comment section.

<script>
    window.theAnimeCommunityConfig = {
        MAL_ID: 'EXAMPLE',
        AniList_ID: 'EXAMPLE',
        episodeChapterNumber: 'EXAMPLE',
        mediaType: 'EXAMPLE'
    };
</script>

<script 
    src="https://theanimecommunity.com/embed.js"
    id="anime-community-script"
    defer
></script>

React Code

Place this div where the comment section should be.

<div id="anime-community-comment-section" />

Include this code to populate the comment section.

useEffect(() => {
    window.theAnimeCommunityConfig = {
        MAL_ID: malId,
        AniList_ID: aniListId,
        episodeChapterNumber: episodeNumber,
        mediaType: mediaType
    };

    const scriptId = "anime-community-script";
    
    let script = document.getElementById(scriptId);
    
    if (!script) {
        script = document.createElement("script");
        script.src = "https://theanimecommunity.com/embed.js"; 
        script.id = scriptId;
        script.async = true; 
        
        document.head.appendChild(script);
    }

    return () => {
        if (script) {
            script.remove();
        }
    };
}, [malId, aniListId, episodeNumber, mediaType]);

Configuration Variables

Minimally, the MyAnimeList/AniList ID and episode series must be included in the configuration object. mediaType defaults to “anime.” Example”

MAL_ID="1"
episodeChapterNumber="1"
mediaType="anime" // or "manga"