Search Bar Block

The Search Bar block allows you to add a very customizable search form into Gutenberg. You can change the colors, icons, width and text of your search bar.

How to add a Search Bar block

You can create a search textbox on by clicking the Search Bar button in the PublishPress Blocks category.

Settings for the Search Bar block

You can adjust the Search Bar settings on the right panel.

  • Styles: there are 2 predefined styles: Default and Classic
  • Search Bar State
    • Full width: On/Off
    • Width
  • Search Icon Settings
    • Search icon on the right: On/Off
    • Search icon
  • Search Input Settings
    • Search placeholder
    • Input Color: Background and Text color
  • Search Button Settings
    • Show submit button: On/Off
    • Search button on the left: On/Off
    • Background and Text color
    • Border radius
  • Hover Colors: Background, Text and Shadow color
  • Hover Shadow: Opacity, Transition speed and Shadow (H (horizontal) offset, V (vertical) offset, blur, spread)

Professional publishing plugins for WordPress! Get PublishPress