Recipe base

Find delicious recipes to cook when you are hungry.

search icon
Recipe not found!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Copy & Paste 💜

Add script to your page

<script src="https://cdn.jsdelivr.net/gh/videsigns/webflow-tools@latest/cms-search.js" </script>

Copy this component into your Webflow project

Disclaimer:
This does not copy anything inside the CMS item since Webflow unbinds  CMS fields when copy-pasting cross-site. 🥹

This will have attributes 01 , 02 and 04 added.
Copy Component

{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee4","type":"Section","tag":"div","classes":["ad6ca94d-1490-5b74-f94f-f065bf0ecbee"],"children":["a87e9933-aa15-2110-be54-5fa356c74ee5","a87e9933-aa15-2110-be54-5fa356c74ee6","a87e9933-aa15-2110-be54-5fa356c74f21","a87e9933-aa15-2110-be54-5fa356c74f24"],"data":{"grid":{"type":"section"},"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee5","type":"Image","tag":"img","classes":["e1fcbc5f-8698-221e-7f18-0c58551e0446"],"children":[],"data":{"attr":{"src":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ed10060e99ef13c8dd7074_62df73e49f892418b667b53c_glow-collaborate.svg","loading":"lazy","width":"auto","height":"auto","id":""},"img":{"id":"62ed10060e99ef13c8dd7074"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee6","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74ee7"],"data":{"tag":"div","text":false,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee7","type":"Block","tag":"div","classes":["9341cc6e-9294-a4bc-51f3-86c3e2594ef4"],"children":["a87e9933-aa15-2110-be54-5fa356c74ee8","a87e9933-aa15-2110-be54-5fa356c74eea","a87e9933-aa15-2110-be54-5fa356c74eec","a87e9933-aa15-2110-be54-5fa356c74f16"],"data":{"tag":"div","text":false,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee8","type":"Heading","tag":"h1","classes":["5db75515-eacf-2ee8-dd9b-5e0231fe9656"],"children":["a87e9933-aa15-2110-be54-5fa356c74ee9"],"data":{"tag":"h1","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ee9","text":true,"v":"Recipe base"},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eea","type":"Paragraph","tag":"p","classes":["49e328ab-b908-b7ff-2d9c-ed3625d8ebe6"],"children":["a87e9933-aa15-2110-be54-5fa356c74eeb"],"data":{"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eeb","text":true,"v":"Find delicious recipes to cook when you are hungry."},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eec","type":"Block","tag":"div","classes":["95dc789b-67c8-b54a-0172-5eb304cd25e9"],"children":["a87e9933-aa15-2110-be54-5fa356c74eed"],"data":{"tag":"div","text":false,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eed","type":"FormWrapper","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74eee","a87e9933-aa15-2110-be54-5fa356c74f10","a87e9933-aa15-2110-be54-5fa356c74f13"],"data":{"form":{"type":"wrapper"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eee","type":"FormForm","tag":"form","classes":["fda338eb-196e-353b-879c-e16575a3e31f"],"children":["a87e9933-aa15-2110-be54-5fa356c74eef","a87e9933-aa15-2110-be54-5fa356c74ef2"],"data":{"Source":{"tag":"Default form","val":{}},"form":{"type":"form","name":"Email Form"},"attr":{"method":"get","name":"email-form","data-name":"Email Form","redirect":"","data-redirect":"","action":"","id":"email-form"},"xattr":[{"name":"data-type","value":"form"}]}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74eef","type":"Block","tag":"div","classes":["9341cc6e-9294-a4bc-51f3-86c3e2594eef"],"children":["a87e9933-aa15-2110-be54-5fa356c74ef0","a87e9933-aa15-2110-be54-5fa356c74ef1"],"data":{"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false,"tag":"div"}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef0","type":"Image","tag":"img","classes":["9341cc6e-9294-a4bc-51f3-86c3e2594eeb"],"children":[],"data":{"attr":{"id":"","width":21,"height":"auto","src":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ebd3c6dcb6b54e1a5d8d26_Vector.svg","loading":"lazy"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"img":{"id":"62ebd3c6dcb6b54e1a5d8d26"}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef1","type":"FormTextInput","tag":"input","classes":["9341cc6e-9294-a4bc-51f3-86c3e2594ef1"],"children":[],"data":{"form":{"name":"Auto Input 2","type":"input","passwordPage":false},"attr":{"autofocus":true,"maxlength":256,"name":"autoInput-2","data-name":"Auto Input 2","placeholder":"Search recipes names, prep-time or meal types","type":"text","id":"autoInput-2","disabled":false,"required":true},"xattr":[{"name":"data-input","value":"search-1"}]}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef2","type":"Block","tag":"div","classes":["06e4bdcd-1b66-dce5-4d9b-9f51316df58c"],"children":["a87e9933-aa15-2110-be54-5fa356c74ef3","a87e9933-aa15-2110-be54-5fa356c74f0b"],"data":{"search":{"exclude":false},"visibility":{"conditions":[]},"text":false,"tag":"div","xattr":[{"name":"cms-slug","value":"recipes"}],"attr":{"id":""}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef3","type":"DynamoWrapper","tag":"div","classes":["9341cc6e-9294-a4bc-51f3-86c3e2594ee9"],"children":["a87e9933-aa15-2110-be54-5fa356c74ef4","a87e9933-aa15-2110-be54-5fa356c74f08"],"data":{"search":{"exclude":false},"xattr":[],"attr":{"id":""},"visibility":{"conditions":[]},"dyn":{"type":"wrapper"},"tag":"div"}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef4","type":"DynamoList","tag":"div","classes":["adc6e31c-3b82-29f1-f374-5eff426ce42f"],"children":["a87e9933-aa15-2110-be54-5fa356c74ef5"],"data":{"tag":"div","dyn":{"type":"list"},"attr":{"id":""},"search":{"exclude":false},"visibility":{"conditions":[]},"xattr":[]}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74ef5","type":"DynamoItem","tag":"div","classes":["69190b30-1fb8-a65e-6aa4-0afc0333f975"],"children":[],"data":{"dyn":{"type":"item","grid":12},"attr":{"id":""},"xattr":[{"name":"data-search","value":"cms-item-1"}],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f08","type":"DynamoEmpty","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f09"],"data":{"tag":"div","dyn":{"type":"empty"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f09","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f0a"],"data":{"tag":"div","text":true,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0a","text":true,"v":"No items found."},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0b","type":"Block","tag":"div","classes":["f18c979d-363a-506c-29f6-24e9fd0f64ab"],"children":["a87e9933-aa15-2110-be54-5fa356c74f0c"],"data":{"tag":"div","xattr":[{"name":"data-div","value":"noResult-1"}],"attr":{"id":""},"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0c","type":"Block","tag":"div","classes":["c88e32f4-78b2-dfb2-dfac-2adb10c23d89"],"children":["a87e9933-aa15-2110-be54-5fa356c74f0d","a87e9933-aa15-2110-be54-5fa356c74f0e"],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0d","type":"Image","tag":"img","classes":["942d0ca6-95ea-4fbf-b13d-0d86250b76dc"],"children":[],"data":{"attr":{"src":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ecf2f5ff77297cc96f63bb_face-with-head-bandage_1f915.png","loading":"lazy","width":"auto","height":"auto","id":""},"img":{"id":"62ecf2f5ff77297cc96f63bb","sizes":[{"max":10000,"size":"100vw"}]},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0e","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f0f"],"data":{"text":true,"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f0f","text":true,"v":"Recipe not found!"},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f10","type":"FormSuccessMessage","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f11"],"data":{"form":{"type":"msg-done"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f11","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f12"],"data":{"tag":"div","text":true,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f12","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f13","type":"FormErrorMessage","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f14"],"data":{"form":{"type":"msg-fail"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f14","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f15"],"data":{"tag":"div","text":true,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f15","text":true,"v":"Oops! Something went wrong while submitting the form."},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f16","type":"Block","tag":"div","classes":["1263f5e8-8578-ab8b-a663-71d123e47601"],"children":["a87e9933-aa15-2110-be54-5fa356c74f17","a87e9933-aa15-2110-be54-5fa356c74f19"],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f17","type":"Paragraph","tag":"p","classes":["976f6dff-c733-41fd-c7d4-d33883eb38de"],"children":["a87e9933-aa15-2110-be54-5fa356c74f18"],"data":{"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f18","text":true,"v":"Recipes that are rated ⭐⭐⭐⭐⭐"},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f19","type":"DynamoWrapper","tag":"div","classes":["1c6b8381-57a8-fdab-a6f5-a2b132d30418"],"children":["a87e9933-aa15-2110-be54-5fa356c74f1a","a87e9933-aa15-2110-be54-5fa356c74f1e"],"data":{"search":{"exclude":false},"xattr":[],"attr":{"id":""},"visibility":{"conditions":[]},"dyn":{"type":"wrapper"},"tag":"div"}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f1a","type":"DynamoList","tag":"div","classes":["daca691b-d937-5851-2136-026e81179c31"],"children":["a87e9933-aa15-2110-be54-5fa356c74f1b"],"data":{"tag":"div","dyn":{"type":"list"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f1b","type":"DynamoItem","tag":"div","classes":["17dc131c-00b5-2c0e-f644-ea0c4741bec3"],"children":[],"data":{"dyn":{"type":"item","grid":12},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f1e","type":"DynamoEmpty","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f1f"],"data":{"tag":"div","dyn":{"type":"empty"},"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f1f","type":"Block","tag":"div","classes":[],"children":["a87e9933-aa15-2110-be54-5fa356c74f20"],"data":{"tag":"div","text":true,"attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f20","text":true,"v":"No items found."},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f21","type":"Block","tag":"div","classes":["b3461c2f-13cc-57a2-1fff-37ab2fd73d0a"],"children":["a87e9933-aa15-2110-be54-5fa356c74f22","a87e9933-aa15-2110-be54-5fa356c74f23"],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f22","type":"Block","tag":"div","classes":["3c494b19-92de-f607-c139-76385a2f2e44"],"children":[],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f23","type":"Block","tag":"div","classes":["4fca4288-1baa-8fcf-df04-9183ba0aaaf7"],"children":[],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f24","type":"Block","tag":"div","classes":["c1d44fd3-f1b4-98b2-e3bf-161bef069da6"],"children":["a87e9933-aa15-2110-be54-5fa356c74f25","a87e9933-aa15-2110-be54-5fa356c74f26"],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f25","type":"Block","tag":"div","classes":["8901928e-7543-6871-d34a-969b4b0bbb1f"],"children":[],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}},{"_id":"a87e9933-aa15-2110-be54-5fa356c74f26","type":"Block","tag":"div","classes":["6f0ff309-5965-3543-8f2e-98527b86fc45"],"children":[],"data":{"tag":"div","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"text":false}}],"styles":[{"_id":"1c6b8381-57a8-fdab-a6f5-a2b132d30418","fake":false,"type":"class","name":"featured-recipe-wrapper","namespace":"","comb":"","styleLess":"width: 100%;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"9341cc6e-9294-a4bc-51f3-86c3e2594eeb","fake":false,"type":"class","name":"search icon","namespace":"","comb":"","styleLess":"position: absolute; left: 2%; top: 35%; right: auto; bottom: auto; z-index: 0; width: 20px; height: 20px; opacity: 0.26;","variants":{"tiny":{"styleLess":"left: 3%; top: 30%; width: 17px;"},"medium":{"styleLess":"left: 3%;"}},"children":[],"selector":null},{"_id":"6f0ff309-5965-3543-8f2e-98527b86fc45","fake":false,"type":"class","name":"square-2","namespace":"","comb":"","styleLess":"position: relative; z-index: 1; width: 40px; height: 40px; margin-top: -24px; margin-left: 11px; background-color: hsla(220, 96.94%, 68.76%, 1.00); filter: blur(5px); mix-blend-mode: difference;","variants":{"tiny":{"styleLess":"left: 11%; bottom: 4%;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"ad6ca94d-1490-5b74-f94f-f065bf0ecbee","fake":false,"type":"class","name":"recipe-hero-section","namespace":"","comb":"","styleLess":"position: relative; z-index: 1; display: flex; overflow: hidden; height: 70vh; min-height: 780px; padding-bottom: 0px; flex-direction: column; justify-content: center; align-items: stretch; background-color: hsla(253.23529411764707, 77.27%, 17.25%, 1.00); color: hsla(253, 0.00%, 100.00%, 1.00);","variants":{"tiny":{"styleLess":"height: auto; min-height: 100vh;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"b3461c2f-13cc-57a2-1fff-37ab2fd73d0a","fake":false,"type":"class","name":"square-1-wrapper","namespace":"","comb":"","styleLess":"position: absolute; left: auto; top: 24%; right: 17%; bottom: auto;","variants":{"medium":{"styleLess":"top: 17%; right: 9%;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"9341cc6e-9294-a4bc-51f3-86c3e2594ef1","fake":false,"type":"class","name":"search-input","namespace":"","comb":"","styleLess":"height: 55px; margin-bottom: 0px; padding-right: 0px; padding-left: 42px; border-top-style: none; border-top-width: 0px; border-top-color: black; border-right-style: none; border-right-width: 0px; border-right-color: black; border-bottom-style: none; border-bottom-width: 0px; border-bottom-color: black; border-left-style: none; border-left-width: 0px; border-left-color: black; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;","variants":{"medium":{"styleLess":"height: 50px; padding-left: 40px;"},"small":{"styleLess":"width: 100%;"},"main_focus":{"styleLess":"border-top-style: none; border-top-width: 0px; border-right-style: none; border-right-width: 0px; border-bottom-style: none; border-bottom-width: 0px; border-left-style: none; border-left-width: 0px;"},"tiny":{"styleLess":"padding-left: 33px; font-size: 16px;"},"tiny_placeholder":{"styleLess":"font-size: 12px;"}},"children":[],"selector":null},{"_id":"9341cc6e-9294-a4bc-51f3-86c3e2594ef4","fake":false,"type":"class","name":"container","namespace":"","comb":"","styleLess":"position: relative; display: flex; width: 95%; height: 100%; max-width: 1300px; margin-right: auto; margin-left: auto; flex-direction: column; justify-content: center; align-items: center;","variants":{"tiny":{"styleLess":"padding-right: 15px; padding-left: 15px;"}},"children":[],"selector":null},{"_id":"4fca4288-1baa-8fcf-df04-9183ba0aaaf7","fake":false,"type":"class","name":"square-3","namespace":"","comb":"","styleLess":"width: 60px; height: 60px; margin-top: -37px; margin-left: -27px; background-color: hsla(247, 0.00%, 100.00%, 1.00); filter: blur(5px); mix-blend-mode: overlay;","variants":{"tiny":{"styleLess":"right: 17%;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"95dc789b-67c8-b54a-0172-5eb304cd25e9","fake":false,"type":"class","name":"hero-search-item","namespace":"","comb":"","styleLess":"display: flex; width: 50%; min-width: 570px; margin-top: 41px; flex-direction: column; align-items: stretch;","variants":{"tiny":{"styleLess":"width: 100%; min-width: auto;"},"small":{"styleLess":"width: 100%; min-width: auto;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"3c494b19-92de-f607-c139-76385a2f2e44","fake":false,"type":"class","name":"square-4","namespace":"","comb":"","styleLess":"width: 60px; height: 60px; background-color: hsla(359, 100.00%, 50.00%, 1.00); filter: blur(5px); mix-blend-mode: exclusion;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"c88e32f4-78b2-dfb2-dfac-2adb10c23d89","fake":false,"type":"class","name":"no-results-content","namespace":"","comb":"","styleLess":"display: flex; flex-direction: column; justify-content: center; align-items: center;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"fda338eb-196e-353b-879c-e16575a3e31f","fake":false,"type":"class","name":"search-form","namespace":"","comb":"","styleLess":"position: relative;","variants":{"tiny":{"styleLess":"margin-bottom: 0px;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"c1d44fd3-f1b4-98b2-e3bf-161bef069da6","fake":false,"type":"class","name":"square-2-wrapper","namespace":"","comb":"","styleLess":"position: absolute; left: 17%; top: auto; right: auto; bottom: 22%; z-index: 1;","variants":{"medium":{"styleLess":"bottom: 11%;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"69190b30-1fb8-a65e-6aa4-0afc0333f975","fake":false,"type":"class","name":"search-cms-item","namespace":"","comb":"","styleLess":"display: none; width: 100%; flex-grow: 0; flex-shrink: 0; flex-basis: auto;","variants":{"tiny":{"styleLess":"display: flex;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"1263f5e8-8578-ab8b-a663-71d123e47601","fake":false,"type":"class","name":"featured-recipes-wrapper","namespace":"","comb":"","styleLess":"display: flex; margin-top: 31px; flex-direction: column; justify-content: center; align-items: center; font-size: 13px;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"06e4bdcd-1b66-dce5-4d9b-9f51316df58c","fake":false,"type":"class","name":"search-cms-wrapper","namespace":"","comb":"","styleLess":"position: absolute; display: block; overflow: auto; width: 100%; max-height: 230px; margin-right: auto; margin-left: auto; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; color: hsla(0, 0.00%, 100.00%, 1.00);","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"976f6dff-c733-41fd-c7d4-d33883eb38de","fake":false,"type":"class","name":"call-caps-text","namespace":"","comb":"","styleLess":"font-size: 12px; line-height: 1.4; font-weight: 700; letter-spacing: 0.55px; text-transform: uppercase;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"17dc131c-00b5-2c0e-f644-ea0c4741bec3","fake":false,"type":"class","name":"featured-recipe-item","namespace":"","comb":"","styleLess":"","variants":{"tiny":{"styleLess":"margin-bottom: 7px;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"8901928e-7543-6871-d34a-969b4b0bbb1f","fake":false,"type":"class","name":"square-1","namespace":"","comb":"","styleLess":"position: relative; z-index: -2; width: 40px; height: 40px; background-color: hsla(73, 71.98%, 53.60%, 1.00); filter: blur(4px);","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"f18c979d-363a-506c-29f6-24e9fd0f64ab","fake":false,"type":"class","name":"no-results","namespace":"","comb":"","styleLess":"display: none; width: 100%; margin-bottom: 0px; padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; flex-direction: column; justify-content: center; align-items: center; grid-column-gap: 20px; grid-row-gap: 20px; border-top-style: solid; border-top-width: 1px; border-top-color: hsla(0, 0.00%, 100.00%, 0.19); border-right-style: solid; border-right-width: 1px; border-right-color: hsla(0, 0.00%, 100.00%, 0.19); border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: hsla(0, 0.00%, 100.00%, 0.19); border-left-style: solid; border-left-width: 1px; border-left-color: hsla(0, 0.00%, 100.00%, 0.19); background-color: hsla(223.44827586206898, 73.64%, 20.94%, 0.52); backdrop-filter: blur(7px); transition-property: background-color; transition-duration: 325ms; transition-timing-function: ease-out; color: hsla(246.53061224489798, 0.00%, 100.00%, 1.00); font-size: 16px; line-height: 1.1; font-weight: 800; text-align: left; text-decoration: none;","variants":{"main_hover":{"styleLess":"text-decoration: none;"},"tiny":{"styleLess":"display: none;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"5db75515-eacf-2ee8-dd9b-5e0231fe9656","fake":false,"type":"class","name":"hero-heading","namespace":"","comb":"","styleLess":"margin-top: 0px; margin-right: 0px; margin-bottom: 17px; margin-left: 0px; transform: perspective(1451px); font-size: 5rem; line-height: 1.1; text-align: center; letter-spacing: -4px;","variants":{"tiny":{"styleLess":"font-size: 3.5rem;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"e1fcbc5f-8698-221e-7f18-0c58551e0446","fake":false,"type":"class","name":"bg-blur","namespace":"","comb":"","styleLess":"position: absolute; left: auto; top: auto; right: -15%; bottom: -19%; z-index: -1; width: 70%; height: 100%; opacity: 0.45;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"9341cc6e-9294-a4bc-51f3-86c3e2594ee9","fake":false,"type":"class","name":"seach-cms","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"62d6df0ceeffa810e480a954","selector":null},{"_id":"adc6e31c-3b82-29f1-f374-5eff426ce42f","fake":false,"type":"class","name":"search-cms-list","namespace":"","comb":"","styleLess":"display: flex; flex-wrap: wrap; grid-auto-columns: 1fr; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto auto;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"942d0ca6-95ea-4fbf-b13d-0d86250b76dc","fake":false,"type":"class","name":"no-result-emoji","namespace":"","comb":"","styleLess":"display: flex; width: 60px; margin-bottom: 6px; flex-direction: column;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"daca691b-d937-5851-2136-026e81179c31","fake":false,"type":"class","name":"featured-recipe-list","namespace":"","comb":"","styleLess":"display: flex; justify-content: center; align-items: center; grid-column-gap: 10px; grid-row-gap: 10px;","variants":{"tiny":{"styleLess":"flex-wrap: wrap;"},"small":{"styleLess":"flex-wrap: wrap;"}},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null},{"_id":"9341cc6e-9294-a4bc-51f3-86c3e2594eef","fake":false,"type":"class","name":"search-input-wrapper","namespace":"","comb":"","styleLess":"position: relative; display: flex; margin-right: auto; margin-left: auto; justify-content: center; align-items: stretch; border-top-style: none; border-top-width: 1px; border-top-color: black; border-right-style: none; border-right-width: 1px; border-right-color: black; border-bottom-style: none; border-bottom-width: 1px; border-bottom-color: black; border-left-style: none; border-left-width: 1px; border-left-color: black;","variants":{"small":{"styleLess":"width: 100%; margin-bottom: 25px;"},"tiny":{"styleLess":"margin-bottom: 0px;"}},"children":[],"selector":null},{"_id":"49e328ab-b908-b7ff-2d9c-ed3625d8ebe6","fake":false,"type":"class","name":"hero-paragraph","namespace":"","comb":"","styleLess":"margin-bottom: 0px; font-size: 18px; text-align: center;","variants":{},"children":[],"createdBy":"5e9be5f24c5ff9f8b4c2a621","selector":null}],"assets":[{"cdnUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ed10060e99ef13c8dd7074_62df73e49f892418b667b53c_glow-collaborate.svg","siteId":"62ebd3a7498e924d71c099b6","width":1895,"isHD":false,"height":1839,"fileName":"62ed10060e99ef13c8dd7074_62df73e49f892418b667b53c_glow-collaborate.svg","createdOn":"2022-08-05T12:41:42.067Z","origFileName":"62df73e49f892418b667b53c_glow-collaborate.svg","fileHash":"59ab7f45c16849517c44f46ecce39d15","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/62ebd3a7498e924d71c099b6/62ed10060e99ef13c8dd7074_62df73e49f892418b667b53c_glow-collaborate.svg","thumbUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ed10060e99ef13c8dd7074_62df73e49f892418b667b53c_glow-collaborate.svg","_id":"62ed10060e99ef13c8dd7074","updatedOn":"2022-08-07T21:23:47.250Z","fileSize":1944},{"cdnUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ebd3c6dcb6b54e1a5d8d26_Vector.svg","siteId":"62ebd3a7498e924d71c099b6","width":23,"isHD":false,"height":23,"fileName":"62ebd3c6dcb6b54e1a5d8d26_Vector.svg","createdOn":"2022-08-04T14:12:22.447Z","origFileName":"Vector.svg","alt":"search icon\n","fileHash":"9b2b98058a313b7d103210ed08926602","variants":[],"mimeType":"image/svg+xml","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/62ebd3a7498e924d71c099b6/62ebd3c6dcb6b54e1a5d8d26_Vector.svg","thumbUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ebd3c6dcb6b54e1a5d8d26_Vector.svg","_id":"62ebd3c6dcb6b54e1a5d8d26","updatedOn":"2022-08-04T14:12:22.784Z","markedAsDeleted":false,"fileSize":564},{"cdnUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ecf2f5ff77297cc96f63bb_face-with-head-bandage_1f915.png","siteId":"62ebd3a7498e924d71c099b6","width":144,"isHD":false,"height":144,"fileName":"62ecf2f5ff77297cc96f63bb_face-with-head-bandage_1f915.png","createdOn":"2022-08-05T10:37:41.514Z","origFileName":"face-with-head-bandage_1f915.png","fileHash":"3423ffceb433349ebd7b89e0ac185a66","variants":[],"mimeType":"image/png","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/62ebd3a7498e924d71c099b6/62ecf2f5ff77297cc96f63bb_face-with-head-bandage_1f915.png","thumbUrl":"https://assets.website-files.com/62ebd3a7498e924d71c099b6/62ecf2f5ff77297cc96f63bb_face-with-head-bandage_1f915-p-130x130q80.png","_id":"62ecf2f5ff77297cc96f63bb","updatedOn":"2022-08-05T10:42:24.994Z","fileSize":22327}],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":2,"paginationRemovedCount":2}}

1 script & 4 attributes 🔥

Add script to your page

<script src="https://cdn.jsdelivr.net/gh/videsigns/webflow-tools@latest/cms-search.js" </script>
01

Attribute for search input

data-input
=
search-input-1
02

Attribute for CMS item

data-search
=
cms-item-1
03

Attribute for search parameter

data-text
=
search-1
04

Attribute for no result div

data-div
=
noresult-1

Things to note:

You do not need to hide the CMS wrapper or any of its children. It will be automatically hidden on the published site.

But if you do want to hide it, hide the CMS Item. Do not use a combo class or a global class to hide it.

Powerups ⚡️

01

Need multiple instances?

data-input
=
search-input-n
data-text
=
search-n
data-search
=
cms-item-n
data-div
=
noresult-n
n represents the instance value
n = number starting with 1
02

Need to add URL params?

Add this attribute to the search input element.
data-url
=
true
This will add your search query to your URL which you can share. This will pre-fill the search bar with the search query.
yourwebsite.com/?search=searchquery
03

Need to search multiple keywords from the CMS?

1.  Add a div inside the CMS item.
2. Add all the search keywords you want to be searchable
3. Hide this div
4. Give this attribute to the div block
data-text
=
search-n
n represents the instance value
n = number starting with 1

This will take all the items inside the div as searchable data.

04

Need to combine multiple CMS into one search?

Add this attribute to any CMS item you want to include in the search results.
CMS #1
data-search
=
cms-item-1
CMS #2
data-search
=
cms-item-1

Make sure each CMS instance that you want to combine has the same n value.

Like what you see here?

Recipe base

Find delicious recipes to cook when you are hungry.

search icon
This is some text inside of a div block.
Recipe not found!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.