These options are located in the Theme Options > Responsive Layout tab.

Responsive Layout options are responsive web design controls that allow you to apply different Design Options for different types of devices and windows or screen sizes.

Sonnet includes 3 responsive layout breakpoint options. (Fig. 1) The ability to change the Header, Sidebars and Footer Widgets Responsive Breakpoint. Continue reading below to learn what a responsive breakpoint is, and what these 4 options do.

What is a Responsive Breakpoint?

A Response Breakpoint is a specific pixel value of the screen width that changes the desktop layout to mobile layout. For example, if you set the value of the ‘Header Responsive Breakpoint’ option to 960px, the desktop header will changes to the mobile header if the width of the screen is 960px and under.

Responsive Layout options

Responsive Layout options Screenshot.
Fig. 1. Responsive Layout options Screenshot.

 

Responsive Design – Illustrated as A.  Turn on to use the responsive design features. If set to OFF, the fixed layout is used.

Header Responsive Breakpoint – Illustrated as B. Controls the width of the screen when the desktop header changes to the mobile header. This option is available only if you are turn on Responsive Design.

Sidebars Responsive Breakpoint – Illustrated as C. Controls the width of the screen when the desktop sidebars layout changes to the mobile sidebars layout. This option is available only if you are turn on Responsive Design.

Footer Widgets Responsive Breakpoint – Illustrated as D. Controls the width of the screen when the desktop footer widegets layout changes to the mobile footer widgets layout. This option is available only if you are turn on Responsive Design.