diff --git a/docs/best-practices.md b/docs/best-practices.md
index 5403119f937..fd7d073c8c3 100644
--- a/docs/best-practices.md
+++ b/docs/best-practices.md
@@ -52,7 +52,7 @@ Markdown will be translated as whole pages of content, so no specific action is
- _tl;dr Each individual JSON entry should be a complete phrase by itself_
-- This is done using the `Translation` component. However there is an alternative method for regular JS: `gatsby-theme-i18n` with `/src/utils/translations.ts`
+- This is done using the `Translation` component. However there is an alternative method for regular JS: using the `t` function from `gatsby-plugin-react-i18next`
- **Method one: `` component (preferred if only needed in JSX)**
@@ -63,19 +63,18 @@ Markdown will be translated as whole pages of content, so no specific action is
;
```
- - **Method two: `translateMessageId()`**
+ - **Method two: `t()`**
```tsx
- import { useIntl } from "react-intl"
- import { translateMessageId } from "src/utils/translations"
+ import { useTranslation } from "gatsby-plugin-react-i18next"
// Utilize anywhere in JS using
- const intl = useIntl()
- translateMessageId("language-json-key", intl)
+ const { t } = useTranslation()
+ t("language-json-key")
```
```tsx
- const siteTitle = translateMessageId("site-title", intl)
+ const siteTitle = t("site-title")
```
## React Hooks