Offcanvas

Offcanvas block is a collapsible sidebar or menu. You can use the latest GutenKit Offcanvas block and create a user-friendly and space-saving way to organize and present additional content on your website easily.

Let’s learn how Offcanvas block works.

How can you use offcanvas block? #

Access to your WordPress dashboard –

  • Find Pages/Posts > Add New Page/Post or start editing an existing page with the block editor.
  • Look for the “+” icon at the right side or top of the editor screen. Click it.
  • A block menu will appear, search for “Offcanvas”.
  • When you see it, click it or drag & drop it on the block editor screen.

Editing content part #

  • Overlay Color – Here, you can change color, select Hamburger or Closed style.
  • Menu Type – The types are, Icon, Text, and Icon with Text. Depending on the type you’ get options to choose icon, and write text .
  • Disable Scroll – You can disable body scrolling, it only works for frontend.

Editing style #

  • Offcanvas – You can choose Hamburger or Closed style. Then, you will see the options of setting Icon Size, Color, Background Type, Border, Border Radius, Alignment, and Box shadow.
  • Offcanvas Panel With this option you can adjust Width, Background Type, Position, and Padding.
Styling offcanvas with GutenKit Offcanvas block
What are your feelings
Updated on March 13, 2024