Interface Config

interface Config {
    apiVersion: string;
    avatarURLBuilder?: ((comment: CommentData) => string);
    beforeSubmit?: ((editor: Editor, next: (() => void)) => void);
    countEl: string;
    darkMode: boolean | "auto";
    dateFormatter?: ((date: Date) => string);
    editorTravel: boolean;
    el: string | HTMLElement;
    emoticons:
        | string
        | false
        | object
        | any[];
    fetchCommentsOnInit: boolean;
    flatMode: boolean | "auto";
    gravatar: {
        mirror: string;
        params: string;
    };
    heightLimit: {
        children: number;
        content: number;
        scrollable: boolean;
    };
    imgLazyLoad: false | "native" | "data-src";
    imgUpload: boolean;
    imgUploader?: ((file: File) => Promise<string>);
    listFetchParamsModifier?: ((params: any) => void);
    listSort: boolean;
    listUnreadHighlight: boolean;
    locale: string | {
        accountMergeConfirm: string;
        accountMergeNotice: string;
        accountMergeSelectOne: string;
        actionConfirm: string;
        admin: string;
        adminCheck: string;
        approved: string;
        cancel: string;
        captchaCheck: string;
        changePassword: string;
        client: string;
        closeComment: string;
        collapse: string;
        collapsed: string;
        collapsedMsg: string;
        commentFail: string;
        confirm: string;
        confirmPassword: string;
        counter: string;
        ctrlCenter: string;
        currentVersion: string;
        days: string;
        delete: string;
        deleteConfirm: string;
        deleteFail: string;
        deleting: string;
        dismiss: string;
        edit: string;
        editCancel: string;
        editFail: string;
        editing: string;
        email: string;
        emailVerified: string;
        emoticon: string;
        expand: string;
        forgetPassword: string;
        haveAccountPrompt: string;
        hours: string;
        ignore: string;
        link: string;
        listLoadFailMsg: string;
        listRetry: string;
        loadFail: string;
        loading: string;
        loadMore: string;
        logoutConfirm: string;
        merge: string;
        minutes: string;
        msgCenter: string;
        nextStep: string;
        nick: string;
        noAccountPrompt: string;
        noComment: string;
        now: string;
        onlyAdminCanReply: string;
        open: string;
        openComment: string;
        openName: string;
        password: string;
        passwordMismatch: string;
        pending: string;
        pendingMsg: string;
        pin: string;
        placeholder: string;
        preview: string;
        readMore: string;
        reply: string;
        reqAborted: string;
        reqGot: string;
        resetPassword: string;
        restoredMsg: string;
        save: string;
        seconds: string;
        send: string;
        server: string;
        signIn: string;
        signUp: string;
        skipVerify: string;
        sortAuthor: string;
        sortBest: string;
        sortLatest: string;
        sortOldest: string;
        unpin: string;
        updateMsg: string;
        uploadFail: string;
        uploadImage: string;
        uploadLoginMsg: string;
        username: string;
        userProfile: string;
        verificationCode: string;
        verifyResend: string;
        verifySend: string;
        voteDown: string;
        voteFail: string;
        voteUp: string;
        waitSeconds: string;
    };
    markedOptions?: MarkedOptions;
    markedReplacers?: ((raw: string) => string)[];
    nestMax: number;
    nestSort: "DATE_ASC" | "DATE_DESC";
    noComment: string;
    pageKey: string;
    pageTitle: string;
    pageVote: boolean | {
        activeClass: string;
        downBtnEl: string;
        downCountEl: string;
        upBtnEl: string;
        upCountEl: string;
    };
    pagination: {
        autoLoad: boolean;
        pageSize: number;
        readMore: boolean;
    };
    placeholder: string;
    pluginURLs?: string[];
    preferRemoteConf: boolean;
    preview: boolean;
    pvAdd: boolean;
    pvEl: string;
    reqTimeout: number;
    scrollRelativeTo?: (() => HTMLElement);
    sendBtn: string;
    server: string;
    site: string;
    statPageKeyAttr: string;
    uaBadge: boolean;
    useBackendConf: boolean;
    versionCheck: boolean;
    vote: boolean;
    voteDown: boolean;
}

Properties

apiVersion avatarURLBuilder? beforeSubmit? countEl darkMode dateFormatter? editorTravel el emoticons fetchCommentsOnInit flatMode gravatar heightLimit imgLazyLoad imgUpload imgUploader? listFetchParamsModifier? listSort listUnreadHighlight locale markedOptions? markedReplacers? nestMax nestSort noComment pageKey pageTitle pageVote pagination placeholder pluginURLs? preferRemoteConf preview pvAdd pvEl reqTimeout scrollRelativeTo? sendBtn server site statPageKeyAttr uaBadge useBackendConf versionCheck vote voteDown

Properties

apiVersion

apiVersion: string

Backend API version (system data, not allowed for user modification)

OptionalavatarURLBuilder

avatarURLBuilder?: ((comment: CommentData) => string)

Avatar URL generator function

OptionalbeforeSubmit

beforeSubmit?: ((editor: Editor, next: (() => void)) => void)

Callback before submitting a comment

countEl

countEl: string

Selector for the element binding to the comment count

darkMode

darkMode: boolean | "auto"

Dark mode settings

OptionaldateFormatter

dateFormatter?: ((date: Date) => string)

Custom date formatter

Type declaration

    • (date): string

    • Parameters

      • date: Date

        The Date object to format

      Returns string

      Formatted date string

editorTravel

editorTravel: boolean

Movable comment box (display below the comment to be replied)

el

el: string | HTMLElement

Element selector or Element to mount the Artalk

emoticons

emoticons:
    | string
    | false
    | object
    | any[]

Emoticons settings

fetchCommentsOnInit

fetchCommentsOnInit: boolean

Immediately fetch comments when Artalk instance is initialized

flatMode

flatMode: boolean | "auto"

Flat mode for comment display

gravatar

gravatar: {
    mirror: string;
    params: string;
}

Gravatar avatar settings

Type declaration

  • mirror: string

    API endpoint

  • params: string

    API parameters

heightLimit

heightLimit: {
    children: number;
    content: number;
    scrollable: boolean;
}

Height limit configuration

Type declaration

  • children: number

    Maximum height for child comments

  • content: number

    Maximum height for comment content

  • scrollable: boolean

    Whether the content is scrollable

imgLazyLoad

imgLazyLoad: false | "native" | "data-src"

Image lazy load mode

imgUpload

imgUpload: boolean

Enable image upload feature

OptionalimgUploader

imgUploader?: ((file: File) => Promise<string>)

Image uploader function

OptionallistFetchParamsModifier

listFetchParamsModifier?: ((params: any) => void)

Modifier for list fetch request parameters

listSort

listSort: boolean

Show sorting dropdown for comment list

listUnreadHighlight

listUnreadHighlight: boolean

List unread highlight (enable by default in artalk-sidebar)

locale

locale: string | {
    accountMergeConfirm: string;
    accountMergeNotice: string;
    accountMergeSelectOne: string;
    actionConfirm: string;
    admin: string;
    adminCheck: string;
    approved: string;
    cancel: string;
    captchaCheck: string;
    changePassword: string;
    client: string;
    closeComment: string;
    collapse: string;
    collapsed: string;
    collapsedMsg: string;
    commentFail: string;
    confirm: string;
    confirmPassword: string;
    counter: string;
    ctrlCenter: string;
    currentVersion: string;
    days: string;
    delete: string;
    deleteConfirm: string;
    deleteFail: string;
    deleting: string;
    dismiss: string;
    edit: string;
    editCancel: string;
    editFail: string;
    editing: string;
    email: string;
    emailVerified: string;
    emoticon: string;
    expand: string;
    forgetPassword: string;
    haveAccountPrompt: string;
    hours: string;
    ignore: string;
    link: string;
    listLoadFailMsg: string;
    listRetry: string;
    loadFail: string;
    loading: string;
    loadMore: string;
    logoutConfirm: string;
    merge: string;
    minutes: string;
    msgCenter: string;
    nextStep: string;
    nick: string;
    noAccountPrompt: string;
    noComment: string;
    now: string;
    onlyAdminCanReply: string;
    open: string;
    openComment: string;
    openName: string;
    password: string;
    passwordMismatch: string;
    pending: string;
    pendingMsg: string;
    pin: string;
    placeholder: string;
    preview: string;
    readMore: string;
    reply: string;
    reqAborted: string;
    reqGot: string;
    resetPassword: string;
    restoredMsg: string;
    save: string;
    seconds: string;
    send: string;
    server: string;
    signIn: string;
    signUp: string;
    skipVerify: string;
    sortAuthor: string;
    sortBest: string;
    sortLatest: string;
    sortOldest: string;
    unpin: string;
    updateMsg: string;
    uploadFail: string;
    uploadImage: string;
    uploadLoginMsg: string;
    username: string;
    userProfile: string;
    verificationCode: string;
    verifyResend: string;
    verifySend: string;
    voteDown: string;
    voteFail: string;
    voteUp: string;
    waitSeconds: string;
}

Localization settings

OptionalmarkedOptions

markedOptions?: MarkedOptions

Options for the marked (Markdown parser)

OptionalmarkedReplacers

markedReplacers?: ((raw: string) => string)[]

Replacers for the marked (Markdown parser)

nestMax

nestMax: number

Maximum number of levels for nested comments

nestSort

nestSort: "DATE_ASC" | "DATE_DESC"

Sorting order for nested comments

noComment

noComment: string

Text to display when there are no comments

pageKey

pageKey: string

Unique page identifier

pageTitle

pageTitle: string

Title of the page

pageVote

pageVote: boolean | {
    activeClass: string;
    downBtnEl: string;
    downCountEl: string;
    upBtnEl: string;
    upCountEl: string;
}

Page Vote Widget

Type declaration

  • activeClass: string

    Active class name if the vote is already cast

  • downBtnEl: string

    Down Vote Button Selector

  • downCountEl: string

    Down Vote Count Selector

  • upBtnEl: string

    Up Vote Button Selector

  • upCountEl: string

    Up Vote Count Selector

pagination

pagination: {
    autoLoad: boolean;
    pageSize: number;
    readMore: boolean;
}

Pagination settings

Type declaration

  • autoLoad: boolean

    Automatically load more comments when scrolled to the bottom

  • pageSize: number

    Number of comments to fetch per request

  • readMore: boolean

    "Read more" mode

placeholder

placeholder: string

Placeholder text for the comment input box

OptionalpluginURLs

pluginURLs?: string[]

URLs for plugin scripts

preferRemoteConf

preferRemoteConf: boolean

Prefer to use the local configuration if available

Note

If true, the local config will be used as a fallback (remote config first).

If false, the local config will override the remote config (local config first).

Default

false

preview

preview: boolean

Preview feature for comments

pvAdd

pvAdd: boolean

Page view increment when comment list is loaded

pvEl

pvEl: string

Selector for the element binding to the page views (PV) count

reqTimeout

reqTimeout: number

Request timeout (in seconds)

OptionalscrollRelativeTo

scrollRelativeTo?: (() => HTMLElement)

The relative element for scrolling (useful if artalk is in a scrollable container)

sendBtn

sendBtn: string

Text for the send button

server

server: string

Server address

site

site: string

Site name

statPageKeyAttr

statPageKeyAttr: string

Attribute name for the PageKey in statistics components

uaBadge

uaBadge: boolean

Display UA badge (user agent badge)

useBackendConf

useBackendConf: boolean

Use remote configuration (from the backend server)

Deprecated

The useBackendConf is always true and planned to be removed in the future.

Please use preferRemoteConf to control the priority of the remote and local configuration.

Default

true

versionCheck

versionCheck: boolean

Enable version check

vote

vote: boolean

Voting feature for comments

voteDown

voteDown: boolean

Downvote button for comments

Settings

Member Visibility

On This Page

Properties