Customizing GravityBoard translations

GravityBoard uses WordPress's built-in @wordpress/i18n system for all translatable text. You can customize any label in the interface using standard WordPress JavaScript translation hooks — no custom plugin APIs needed.

This guide shows how to rename "cards" to "jobs", "lanes" to "departments", or any other terminology that fits your use case.

Where to Put Your Code

Before adding any custom code, you need to decide where to place it. There are two recommended approaches:

Option 1: Code Snippets Plugin (Recommended)

The safest way to add custom code is using the Code Snippets WordPress plugin. This method is recommended by GravityKit's documentation because:

Safer: If something goes wrong, you won't break your website
Theme-independent: Your customizations won't be lost when you update your theme
Easy to manage: You can easily enable/disable code snippets

After installing the Code Snippets plugin:

Go to Snippets > Add New in your WordPress admin
Give your snippet a descriptive title like "GravityBoard Custom Translations"
Paste your code in the editor (without <?php tags)
Set the snippet to run "Run Everywhere"
Click Save Changes and Activate

Option 2: Theme's functions.php File

You can also add the code to your active theme's functions.php file. For detailed instructions, see GravityKit's guide on where to put code samples.

Method 1: Exact Phrase Overrides

The simplest approach — override specific strings with exact replacements. This is best when you know the exact text you want to change.

/**
 * Override specific GravityBoard text labels.
 *
 * Each key must match the exact English string used in the interface.
 * The value is an array with the replacement string as the first element.
 */
add_action( 'wp_enqueue_scripts', function() {
    wp_add_inline_script( 'gravityboard-app', "
        if ( typeof wp !== 'undefined' && wp.i18n && wp.i18n.setLocaleData ) {
            wp.i18n.setLocaleData( {
                'Add a card':    ['Add a job'],
                'Add card':      ['Add job'],
                'Edit card':     ['Edit job'],
                'Delete card':   ['Remove job'],
                'Move card':     ['Move job'],
                'Card Title':    ['Job Title'],
                'Card options':  ['Job options'],
                'New Card':      ['New Job'],
                'Card: %s':      ['Job: %s'],
                'Cards in %s':   ['Jobs in %s'],
                'Add Lane':      ['Add Department'],
                'Edit Lane':     ['Edit Department'],
                'Lane Title':    ['Department Title'],
                'Move lane left':  ['Move department left'],
                'Move lane right': ['Move department right'],
                'Add a card':    ['Post a job'],
                'Add card to %s': ['Post job to %s'],
                'Close card details': ['Close job details'],
                'Move all cards in this lane': ['Move all jobs in this department'],
                'Search cards, assignees, labels, and more.': ['Search jobs, hiring managers, labels, and more.']
            }, 'gk-gravityboard' );
        }
    ", 'before' );
});

Important: Each key must match the exact English string used in GravityBoard. For example, 'Add a card' will override the "Add a card" button text, but 'card' alone will not change "Add a card" — it would only affect places where the word "card" appears by itself.

How to Find the Exact Strings

To find the exact string to override:

Open your browser's Developer Tools (F12 or right-click → Inspect)
Right-click on the text you want to change
Look at the text content — that's the string you need to match exactly (including capitalization)

Method 2: Word-Level Replacement (Automatic)

If you want to replace a word everywhere it appears — across all strings, including ones you haven't listed — use WordPress's i18n.gettext filter. This performs word-boundary replacement on every translatable string automatically.

/**
 * Replace words throughout GravityBoard using WordPress i18n hooks.
 *
 * This automatically replaces "card" with "job" in ALL strings:
 * "Add a card" becomes "Add a job", "Edit card" becomes "Edit job", etc.
 */
add_action( 'wp_enqueue_scripts', function() {
    wp_add_inline_script( 'gravityboard-app', "
        if ( typeof wp !== 'undefined' && wp.hooks && wp.hooks.addFilter ) {
            wp.hooks.addFilter(
                'i18n.gettext_gk-gravityboard',
                'my-custom-translations',
                function( translation, text ) {
                    return text
                        .replace( /\\bcard\\b/g, 'job' )
                        .replace( /\\bCard\\b/g, 'Job' )
                        .replace( /\\bcards\\b/g, 'jobs' )
                        .replace( /\\bCards\\b/g, 'Jobs' )
                        .replace( /\\blane\\b/g, 'department' )
                        .replace( /\\bLane\\b/g, 'Department' )
                        .replace( /\\blanes\\b/g, 'departments' )
                        .replace( /\\bLanes\\b/g, 'Departments' );
                }
            );
        }
    ", 'before' );
});

The \b in the regex means "word boundary", so card matches the word "card" but not "cards" or "postcard". Each replacement is case-sensitive, so you need separate lines for card/Card/cards/Cards.

Combining Both Methods

You can combine exact phrase overrides with word-level replacement. Exact overrides are applied first, so they take precedence. This is useful when word replacement produces awkward grammar:

add_action( 'wp_enqueue_scripts', function() {
    // First: exact overrides for phrases that need custom grammar.
    wp_add_inline_script( 'gravityboard-app', "
        if ( typeof wp !== 'undefined' && wp.i18n && wp.i18n.setLocaleData ) {
            wp.i18n.setLocaleData( {
                'Add a card': ['Post a job opening'],
                'New Card':   ['New Job Posting']
            }, 'gk-gravityboard' );
        }
    ", 'before' );

    // Second: word-level replacement for everything else.
    wp_add_inline_script( 'gravityboard-app', "
        if ( typeof wp !== 'undefined' && wp.hooks && wp.hooks.addFilter ) {
            wp.hooks.addFilter(
                'i18n.gettext_gk-gravityboard',
                'my-custom-translations',
                function( translation, text ) {
                    // If setLocaleData already translated this, use that.
                    if ( translation !== text ) {
                        return translation;
                    }
                    return text
                        .replace( /\\bcard\\b/g, 'job' )
                        .replace( /\\bCard\\b/g, 'Job' )
                        .replace( /\\bcards\\b/g, 'jobs' )
                        .replace( /\\bCards\\b/g, 'Jobs' );
                }
            );
        }
    ", 'before' );
});

In this example, "Add a card" becomes "Post a job opening" (exact override), while "Edit card" becomes "Edit job" (word replacement), and "Delete card" becomes "Delete job" (word replacement).

Feed-Specific Translations

If you have multiple boards and want different terminology for each, you can scope your overrides by feed ID. The feed ID is shown in the [gravityboard id="123"] shortcode.

/**
 * Apply different translations per GravityBoard feed.
 */
add_action( 'wp_enqueue_scripts', function() {
    // Only run on the frontend, not admin.
    if ( is_admin() ) {
        return;
    }

    wp_add_inline_script( 'gravityboard-app', "
        if ( typeof wp !== 'undefined' && wp.hooks && wp.hooks.addFilter ) {
            wp.hooks.addFilter(
                'i18n.gettext_gk-gravityboard',
                'my-feed-translations',
                function( translation, text ) {
                    var feedId = window.gravityBoardSettings
                        && window.gravityBoardSettings.current_feed_id;

                    if ( feedId == 123 ) {
                        // HR Job Board
                        return text
                            .replace( /\\bcard\\b/g, 'applicant' )
                            .replace( /\\bCard\\b/g, 'Applicant' )
                            .replace( /\\bcards\\b/g, 'applicants' )
                            .replace( /\\bCards\\b/g, 'Applicants' )
                            .replace( /\\blane\\b/g, 'status' )
                            .replace( /\\bLane\\b/g, 'Status' )
                            .replace( /\\blanes\\b/g, 'statuses' )
                            .replace( /\\bLanes\\b/g, 'Statuses' );
                    }

                    if ( feedId == 456 ) {
                        // Customer Support
                        return text
                            .replace( /\\bcard\\b/g, 'ticket' )
                            .replace( /\\bCard\\b/g, 'Ticket' )
                            .replace( /\\bcards\\b/g, 'tickets' )
                            .replace( /\\bCards\\b/g, 'Tickets' )
                            .replace( /\\blane\\b/g, 'status' )
                            .replace( /\\bLane\\b/g, 'Status' )
                            .replace( /\\blanes\\b/g, 'statuses' )
                            .replace( /\\bLanes\\b/g, 'Statuses' );
                    }

                    // All other boards: no changes.
                    return translation;
                }
            );
        }
    ", 'before' );
});

Note: Replace 123 and 456 with your actual feed IDs from your shortcodes.

Troubleshooting

Translations Not Appearing

Clear any caching plugins (page cache, object cache, CDN)
Make sure the Code Snippets snippet is set to "Run Everywhere" (not "Only Admin")
Open your browser's Developer Tools console and check for JavaScript errors
Verify the text domain is exactly 'gk-gravityboard' (not 'gravityboard')

Some Strings Not Changing

Using exact overrides? The key must match the exact English string, including capitalization. Use Method 2 (word-level replacement) if you want to catch all variations automatically.
Using word replacement? Make sure you include all case variants (card, Card, cards, Cards).
Some text may come from Gravity Forms itself (like field labels) — those are not controlled by GravityBoard translations.

Feed-Specific Overrides Not Working

Check that window.gravityBoardSettings.current_feed_id matches the ID in your shortcode. You can verify by opening your browser console and typing gravityBoardSettings.current_feed_id.
Use == (not ===) for comparison since the feed ID may be a string.

Common Translatable Strings

Here are the most commonly overridden strings for reference:

Original String	Where It Appears
`Add a card`	Button at the bottom of each lane
`Card Title`	Placeholder text in the card title field
`Edit card`	Card context menu
`Delete card`	Card context menu
`Move card`	Card context menu / modal title
`New Card`	Default title for new cards
`Add Lane`	Button to add a new lane
`Edit Lane`	Lane context menu
`Lane Title`	Lane name input placeholder
`Cards in %s`	Lane accessibility label (%s = lane name)
`Add card to %s`	Add button accessibility label (%s = lane name)
`Move all cards in this lane`	Lane context menu
`Search cards, assignees, labels, and more.`	Filter search placeholder
`Close card details`	Card modal close button
`Card options`	Card menu button accessibility label
`Move lane left` / `Move lane right`	Lane context menu
`Keyboard Shortcuts`	Help modal title