diff --git a/packages/block-editor/src/components/link-control/constants.js b/packages/block-editor/src/components/link-control/constants.js
index eaf07aea73703..6a7322a7f3d2e 100644
--- a/packages/block-editor/src/components/link-control/constants.js
+++ b/packages/block-editor/src/components/link-control/constants.js
@@ -24,4 +24,10 @@ export const DEFAULT_LINK_SETTINGS = [
id: 'opensInNewTab',
title: __( 'Open in new tab' ),
},
+ {
+ id: 'markAsNoFollow',
+ title: __(
+ 'Search engines should ignore this link (mark as nofollow)'
+ ),
+ },
];
diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 142ffd6db1e50..89b6529abffe4 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -28,11 +28,14 @@ import { DEFAULT_LINK_SETTINGS } from './constants';
*
* @typedef WPLinkControlDefaultValue
*
- * @property {string} url Link URL.
- * @property {string=} title Link title.
- * @property {boolean=} opensInNewTab Whether link should open in a new browser
- * tab. This value is only assigned if not
- * providing a custom `settings` prop.
+ * @property {string} url Link URL.
+ * @property {string=} title Link title.
+ * @property {boolean=} opensInNewTab Whether link should open in a new browser
+ * tab. This value is only assigned if not
+ * providing a custom `settings` prop.
+ * @property {boolean=} markAsNoFollow Whether link should be marked as
+ * `nofollow`. This value is only assigned
+ * if not providing a custom `settings` prop.
*/
/* eslint-disable jsdoc/valid-types */
diff --git a/packages/block-editor/src/components/link-control/use-internal-input-value.js b/packages/block-editor/src/components/link-control/use-internal-input-value.js
index a4d9a1a7bca11..c35f9783ccb69 100644
--- a/packages/block-editor/src/components/link-control/use-internal-input-value.js
+++ b/packages/block-editor/src/components/link-control/use-internal-input-value.js
@@ -16,7 +16,7 @@ export default function useInternalInputValue( value ) {
if ( value && value !== internalInputValue ) {
setInternalInputValue( value );
}
- }, [ value ] );
+ }, [ internalInputValue, value ] );
return [ internalInputValue, setInternalInputValue ];
}
diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index 9419b7a547f71..46c25a0789c8a 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -70,6 +70,7 @@ function InlineLinkUI( {
type: activeAttributes.type,
id: activeAttributes.id,
opensInNewTab: activeAttributes.target === '_blank',
+ markAsNoFollow: activeAttributes.rel?.includes( 'nofollow' ),
title: richTextText,
...nextLinkValue,
};
@@ -118,6 +119,7 @@ function InlineLinkUI( {
? String( nextValue.id )
: undefined,
opensInNewWindow: nextValue.opensInNewTab,
+ markAsNoFollow: nextValue.markAsNoFollow,
} );
const newText = nextValue.title || newUrl;
diff --git a/packages/format-library/src/link/modal-screens/link-settings-screen.native.js b/packages/format-library/src/link/modal-screens/link-settings-screen.native.js
index 3bb003643ac1e..23109ffaed789 100644
--- a/packages/format-library/src/link/modal-screens/link-settings-screen.native.js
+++ b/packages/format-library/src/link/modal-screens/link-settings-screen.native.js
@@ -42,6 +42,9 @@ const LinkSettingsScreen = ( {
const [ opensInNewWindow, setOpensInNewWindows ] = useState(
activeAttributes.target === '_blank'
);
+ const [ markedAsNoFollow, setMarkedAsNoFollow ] = useState(
+ ( activeAttributes.rel = 'nofollow' )
+ );
const [ linkValues, setLinkValues ] = useState( {
isActiveLink: isActive,
isRemovingLink: false,
@@ -64,7 +67,7 @@ const LinkSettingsScreen = ( {
onHandleClosingBottomSheet( () => {
submit( inputValue, { skipStateUpdates: true } );
} );
- }, [ inputValue, opensInNewWindow, text ] );
+ }, [ inputValue, opensInNewWindow, markedAsNoFollow, text ] );
useEffect( () => {
const { isActiveLink, isRemovingLink } = linkValues;
@@ -99,6 +102,7 @@ const LinkSettingsScreen = ( {
const format = createLinkFormat( {
url,
opensInNewWindow,
+ markedAsNoFollow,
text: linkText,
} );
let newAttributes;
@@ -213,6 +217,15 @@ const LinkSettingsScreen = ( {
onValueChange={ setOpensInNewWindows }
separatorType={ 'fullWidth' }
/>
+