Drawers

Applies to: Split 5.1.0 and later. Added in: Split 1.0.0. Last checked: 2026-10-13 against Split 5.1.0.

A drawer is a panel that slides in from the right side of the screen over the page. Split uses five drawers: the menu, the cart, search, filters and store pickup. They share one set of colors and have no section of their own: each drawer's content comes from the setting or block that opens it.

Where to find it: there is no Drawers section. The colors are in Theme settings → Colors → Sidebar; each drawer below names the setting that controls it.

How drawers workCopy Anchor Link

• A drawer is 480 px wide, 374 px wide on screens 640 px and narrower, and 320 px wide on screens 374 px and narrower.
• The page behind it is dimmed. Customers close the drawer with the close icon or the Esc key, or by clicking the dimmed page.
• Every drawer uses the same Sidebar colors, so the menu, cart and search look alike.

Menu drawerCopy Anchor Link

The menu drawer opens from the menu icon in the header. It shows the collections menu and the main menu, the language and country selectors when they are on, the promotion block, your social icons and the copyright line.

• On phones and tablets, up to 1024 px wide, the main menu is always in the menu drawer.
• On larger screens, the header uses the menu drawer when Desktop menu style is Drawer, or when the classic menu is too wide to fit.
• Links with child links open in place inside the drawer. Collection images of the collections menu are not shown in the drawer.

Settings: Header group → Header. See Header section and Header menus. The social icons come from Social theme settings.

Cart drawerCopy Anchor Link

The cart drawer opens from the cart icon and after a product is added to the cart, when Theme settings → Cart → Cart type is Drawer (the default). It lists the cart items, the subtotal, the notes and discount fields, the free shipping notice and product recommendations, with buttons to the cart page and the checkout.

• With Cart type set to Page, there is no cart drawer: the cart icon and Add to cart go to the cart page.
• The cart page itself never opens the cart drawer.

Settings: Theme settings → Cart. See Cart theme settings.

Search drawerCopy Anchor Link

The search drawer opens from the search icon in the header. Results appear while the customer types: suggested searches, products, collections, articles and pages. Pressing Enter opens the full search page.

• On the search page, the search icon links to the search page instead of opening the drawer.
• What the results match (SKU, barcode, tags) is set in Theme settings → Predictive search. See Predictive search theme settings.

Filter drawerCopy Anchor Link

The filter drawer opens from the Filter and sort button on collection pages and on the search page, on every screen size. Its title is "Refine results". It holds the filters you set up in Shopify's Search & Discovery app and the sort order.

Settings: the Collection page and Search page templates (Enable filtering, Enable sorting). See Collection page and Search page.

Store pickup drawerCopy Anchor Link

The store pickup drawer opens from the Pickup availability block on the product page, with the Check availability at other stores or View store information link. It lists your pickup locations, whether the selected variant is available at each one and the store addresses.

Store pickup is a Shopify feature: the block shows only for products stocked at a location with local pickup turned on in Shopify admin → Settings → Shipping and delivery. See Product page.

Sidebar colors and scrollbarCopy Anchor Link

• Theme settings → Colors → Sidebar → Background and Text paint every drawer: background, text, icons, borders and form fields.
• When a Sidebar color is the same as the matching Body color, the drawers use the body colors.
• Theme settings → SEO & performance → Show drawers scrollbar (on desktop) shows a thin scrollbar inside the drawers. It is off by default, so long drawers scroll without a visible scrollbar.

See Colors theme settings and SEO and performance theme settings.

Why does my cart not open in a drawer?Copy Anchor Link

Because Cart type is set to Page, or because you are on the cart page. Open Theme settings → Cart and set Cart type to Drawer. On the cart page itself the cart is already on screen, so the cart icon does nothing extra there.

Can I make a drawer open from the left?Copy Anchor Link

No. Split opens every drawer from the right side of the screen (from the left in right-to-left languages such as Arabic or Hebrew), and no setting changes the side or the width. A different side or width is custom work. See Custom work and code changes.

Related pagesCopy Anchor Link

• Header section: the icons that open the menu, search and cart drawers.
• Colors theme settings: the Sidebar colors of all drawers.
• Cart theme settings: what the cart drawer shows.
• Predictive search theme settings: what the search drawer finds.