Skip to content

Instantly share code, notes, and snippets.

@zgordon

zgordon/gutenberg-tooltip-example.jsx

Last active October 12, 2018 10:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save zgordon/6be6e59767254687811d4deda57dec22 to your computer and use it in GitHub Desktop.
Save zgordon/6be6e59767254687811d4deda57dec22 to your computer and use it in GitHub Desktop.
Download ZIP
An example of how to use the Tooltip component in Gutenberg. Place the code inside of your block edit setting.
Raw
gutenberg-tooltip-example.jsx
const {
Button,
Dashicon,
Tooltip,
} = wp.components;
// Wrap the Tooltip component around whatever you want to activate the tooltip on hover
<Tooltip
text={ __( 'Add Tooltip Text Here' ) }
>
<Button>
// Change icon to desired dashicon icon or replace component with SVG
<Dashicon icon="edit" />
</Button>
</Tooltip>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment