⚠️ Since the Summernote Editor creates only inline elements, you'll probably create the paragraph first and then the link from it and then the button by applying apropriate classes to created link.

<p><a href="https://materialize-wcms.m00n.link" target="_self" class="btn-small">Button</a></p>

CSS classes

  • btn
  • btn-small
  • btn-large
  • disabled ⚠️ this is separate class ‼️
  • flat
  • pulse
  • btn-margin-bottom  ⚠️ when buttons are one below the other but NOT in single paragraphs and in a longer (3 or 4) series next to each other





btn disabled


btn pulse


⚠️ You can add more than one class, such as: btn-small disabled or btn-large btn-flat and so on.

Summernote Editor (also Lite version)

Summernote does not allow you to add buttons using its standard tools. To add a button, create a link and then turn it into a button by adding the appropriate CSS class or classes using the editor's Code View tool.