The PublishPress 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 PublishPress Search Bar block #

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

Settings for the PublishPress Search Bar block #

You can adjust the PublishPress 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)