--- title: How to add cmd-k search shortcut to your Framer site description: Framer's built-in Search component lacks support for the popular cmd-k/ctrl-k keyboard shortcut. A workaround wraps the Search component in a uniquely named... canonical: https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7 twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: How to add cmd-k search shortcut to your Framer site | daily.dev og:description: Framer's built-in Search component lacks support for the popular cmd-k/ctrl-k keyboard shortcut. A workaround wraps the Search component in a uniquely named... og:url: https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7 og:image: https://api.daily.dev/og/posts/qC9Nt1uO7.png og:image:alt: How to add cmd-k search shortcut to your Framer site og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # How to add cmd-k search shortcut to your Framer site **[Motion](https://daily.dev/sources/motion)** · 2 min read · 0 upvotes · 0 comments ## Summary Framer's built-in Search component lacks support for the popular cmd-k/ctrl-k keyboard shortcut. A workaround wraps the Search component in a uniquely named layer, then adds a small JavaScript snippet in Framer's Custom Code settings that listens for the keydown event and simulates a click on the search button, effectively enabling cmd-k to open search on a Framer site. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### How do I make cmd-k or ctrl-k open the search box on a Framer site? Wrap the Framer Search component in a layer with a unique name like 'Search Container', then add a script to the site's Custom Code section (End of body tag) that listens for the keydown event, checks for metaKey and the 'k' key, prevents the default browser action, and simulates a click on the button inside that named container using its data-framer-name attribute selector. _Developers wiring up custom UX hacks like this compare notes and workarounds on daily.dev._ ## Similar posts on daily.dev - [How did CMD-K come to be the standard shortcut for both adding a hyperlink and opening a command palette?](https://daily.dev/posts/how-did-cmd-k-come-to-be-the-standard-shortcut-for-both-adding-a-hyperlink-and-opening-a-command-pal-c612bufsc) · Lobsters · 0 upvotes · 0 comments - [Ruby.org Gets Command Palette Search with Cmd/Ctrl\+K](https://daily.dev/posts/ruby-org-gets-command-palette-search-with-cmd-ctrl-k-fxgo1hzsi) · Ruby Flow · 0 upvotes · 0 comments - [Show keystrokes on a website with the custom element](https://daily.dev/posts/show-keystrokes-on-a-website-with-the-show-keystrokes-custom-element-nwr24wrlz) · Bram.us · 2 upvotes · 0 comments - [Keyboard Shortcuts That Display The Correct Modifier Key per OS – Master.dev Blog](https://daily.dev/posts/keyboard-shortcuts-that-display-the-correct-modifier-key-per-os-master-dev-blog-dzveifmsr) · Frontend Masters · 2 upvotes · 1 comments --- Tags: [#webdev](https://daily.dev/tags/webdev), [#javascript](https://daily.dev/tags/javascript), [#framer](https://daily.dev/tags/framer) [View this post on daily.dev](https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"How to add cmd-k search shortcut to your Framer site","url":"https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7"},"datePublished":"2026-08-23T12:21:09.123Z","dateModified":"2026-08-23T12:36:04.621Z","description":"Framer's built-in Search component lacks support for the popular cmd-k/ctrl-k keyboard shortcut. A workaround wraps the Search component in a uniquely named...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/63e4cabd4872890cde2b92a73f48430f?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/63e4cabd4872890cde2b92a73f48430f?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Motion","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Motion","logo":"https://media.daily.dev/image/upload/s--3YxvsrZb--/f_auto,q_auto/v1787487450/logos/motion?_a=BAMAMicg0","url":"https://daily.dev/sources/motion"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"webdev,javascript,framer","timeRequired":"PT2M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Motion","item":"https://daily.dev/sources/motion"},{"@type":"ListItem","position":3,"name":"How to add cmd-k search shortcut to your Framer site"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/how-to-add-cmd-k-search-shortcut-to-your-framer-site-qc9nt1uo7#faq","mainEntity":[{"@type":"Question","name":"How do I make cmd-k or ctrl-k open the search box on a Framer site?","acceptedAnswer":{"@type":"Answer","text":"Wrap the Framer Search component in a layer with a unique name like 'Search Container', then add a script to the site's Custom Code section (End of body tag) that listens for the keydown event, checks for metaKey and the 'k' key, prevents the default browser action, and simulates a click on the button inside that named container using its data-framer-name attribute selector. Developers wiring up custom UX hacks like this compare notes and workarounds on daily.dev."}}]} ```