[{"data":1,"prerenderedAt":635},["ShallowReactive",2],{"guide-\u002Fen\u002Fguides\u002Feditor\u002Fsections":3,"guide-navigation-guides_en":459,"guide-surround-\u002Fen\u002Fguides\u002Feditor\u002Fsections":630},{"id":4,"title":5,"body":6,"description":450,"extension":451,"meta":452,"navigation":453,"path":455,"seo":456,"stem":457,"__hash__":458},"guides_en\u002Fen\u002Fguides\u002F2.editor\u002F2.sections.md","Blocks and layouts",{"type":7,"value":8,"toc":439},"minimark",[9,18,23,30,173,182,186,196,212,215,226,233,250,256,270,280,284,290,297,304,310,322,326,342,348,374,380,385,389,395,399,406,413,421,425],[10,11,12,13,17],"p",{},"Your page is made of ",[14,15,16],"strong",{},"blocks"," stacked on top of each other: a hero at the top, then about, services, a gallery, a contact form and so on. Each block is a section of the page. You build your page by adding blocks, putting them in order and choosing the right layout for each one.",[19,20,22],"h2",{"id":21},"which-blocks-are-there","Which blocks are there",[10,24,25,26,29],{},"The blocks are grouped into six categories in the ",[14,27,28],{},"Add block"," panel:",[31,32,33,46],"table",{},[34,35,36],"thead",{},[37,38,39,43],"tr",{},[40,41,42],"th",{},"Category",[40,44,45],{},"Blocks",[47,48,49,67,97,113,135,152],"tbody",{},[37,50,51,57],{},[52,53,54],"td",{},[14,55,56],{},"Intro",[52,58,59,62,63,66],{},[14,60,61],{},"Hero"," (the big headline and button at the top of the page), ",[14,64,65],{},"Call to action"," (a highlighted box that asks visitors to take one action)",[37,68,69,74],{},[52,70,71],{},[14,72,73],{},"Content",[52,75,76,79,80,83,84,79,87,79,90,79,93,96],{},[14,77,78],{},"About",", ",[14,81,82],{},"Text"," (free text), ",[14,85,86],{},"Services",[14,88,89],{},"Process steps",[14,91,92],{},"Numbers",[14,94,95],{},"List"," (blog posts or a collection's pages)",[37,98,99,104],{},[52,100,101],{},[14,102,103],{},"Images & video",[52,105,106,79,109,112],{},[14,107,108],{},"Gallery",[14,110,111],{},"Video"," (YouTube or Vimeo)",[37,114,115,120],{},[52,116,117],{},[14,118,119],{},"Trust",[52,121,122,79,125,79,128,79,131,134],{},[14,123,124],{},"Testimonials",[14,126,127],{},"Google reviews",[14,129,130],{},"Team",[14,132,133],{},"Logos"," (brands you work with)",[37,136,137,142],{},[52,138,139],{},[14,140,141],{},"Prices",[52,143,144,147,148,151],{},[14,145,146],{},"Pricing"," (compare 2–4 plans side by side), ",[14,149,150],{},"Price list"," (service or product prices)",[37,153,154,159],{},[52,155,156],{},[14,157,158],{},"Contact",[52,160,161,163,164,79,167,79,170],{},[14,162,158],{}," (form, phone, WhatsApp, map), ",[14,165,166],{},"Opening hours",[14,168,169],{},"Appointment",[14,171,172],{},"FAQ",[10,174,175,176,181],{},"The header (the menu at the top of the page) and the footer aren't blocks; they look the same on every page and are edited in their own panels. See ",[177,178,180],"a",{"href":179},"\u002Fen\u002Fguides\u002Feditor\u002Fheader-and-footer","Header and footer",".",[19,183,185],{"id":184},"add-a-block","Add a block",[10,187,188,189,192,193,195],{},"The ",[14,190,191],{},"+"," button on the left rail opens the ",[14,194,28],{}," panel. You can add a block in two ways:",[197,198,199,206],"ul",{},[200,201,202,205],"li",{},[14,203,204],{},"Click it:"," The block is added at the end of the page.",[200,207,208,211],{},[14,209,210],{},"Drag it:"," Drag the block to wherever you want on the page. A line shows where it will land.",[10,213,214],{},"The editor scrolls to the new block and highlights it briefly.",[10,216,217],{},[218,219],"video",{"src":220,"poster":221,"controls":222,"muted":222,"playsInline":222,"preload":223,"width":224,"height":225},"https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002Fadd-section.mp4","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002Fadd-section-poster.webp",true,"metadata",1600,1000,[10,227,228],{},[229,230],"img",{"alt":231,"src":232},"The Add block panel: the Intro and Content categories","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F01-library.webp",[10,234,235,236,79,239,79,242,245,246,249],{},"A new block arrives empty: faint placeholders tell you what goes in each field (",[14,237,238],{},"Title",[14,240,241],{},"Description",[14,243,244],{},"Question"," and so on). Click a placeholder and start typing. In blocks with lists (questions, service cards, photos), press ",[14,247,248],{},"Add item"," to add another one.",[10,251,252],{},[229,253],{"alt":254,"src":255},"A newly added FAQ block: empty title and question fields","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F02-new-faq-block.webp",[257,258,259],"warning",{},[10,260,261,262,265,266,181],{},"A block with empty required fields stops the page from being published; the button in the top right turns into a red ",[14,263,264],{},"Can't publish",". Fill in the empty fields or delete the block. Details in ",[177,267,269],{"href":268},"\u002Fen\u002Fguides\u002Feditor\u002Fpublishing#if-it-says-cant-publish","Publishing",[271,272,273],"tip",{},[10,274,275,276,181],{},"You don't have to build the page block by block. If you ask the assistant something like \"Add an FAQ section about delivery, ordering and our gluten-free options\", it adds the block with its content. See ",[177,277,279],{"href":278},"\u002Fen\u002Fguides\u002Feditor\u002Fai-assistant","AI assistant",[19,281,283],{"id":282},"change-the-layout","Change the layout",[10,285,286,287,289],{},"Most blocks have several layouts: the same content, arranged differently. For example, the ",[14,288,86],{}," block can be shown as cards, an icon list, numbered rows or glowing cards on a dark background. Your text and images stay the same when the layout changes.",[10,291,292,293,296],{},"Hover over the block and press ",[14,294,295],{},"Layout"," in the bar that appears in the top left. The options are shown as small sketches; press one and the block switches to it right away. The window stays open so you can try the options one by one and compare.",[10,298,299],{},[229,300],{"alt":301,"src":302,"width":303},"Layout options for the Services block","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F03-layout-picker.webp",560,[10,305,306],{},[218,307],{"src":308,"poster":309,"controls":222,"muted":222,"playsInline":222,"preload":223,"width":224,"height":225},"https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002Fchange-layout.mp4","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002Fchange-layout-poster.webp",[10,311,312,313,317,318,321],{},"To go back from a layout you don't like, pick the first option again or undo (",[314,315],"kbd",{"value":316},"meta"," ",[314,319],{"value":320},"Z",").",[19,323,325],{"id":324},"the-blocks-panel","The Blocks panel",[10,327,328,329,331,332,79,335,79,338,341],{},"The second button on the left rail opens the ",[14,330,45],{}," panel. It lists every block on the page in order, with the layout it uses under its name (",[14,333,334],{},"Full-screen image",[14,336,337],{},"Cards",[14,339,340],{},"Grid","…).",[10,343,344],{},[229,345],{"alt":346,"src":347},"The Blocks panel: the blocks on the page and their layouts","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F04-blocks-panel.webp",[197,349,350,356,362,368],{},[200,351,352,355],{},[14,353,354],{},"Click a row:"," The page scrolls to that block. On long pages, this is the quickest way to find a section.",[200,357,358,361],{},[14,359,360],{},"Click the layout name:"," The layout options open under the row and change the page live.",[200,363,364,367],{},[14,365,366],{},"Drag a row:"," Changes the block's position.",[200,369,370,373],{},[14,371,372],{},"Hover over a row:"," Use the up and down arrows to move the block one step, or the trash can to delete it.",[10,375,376],{},[229,377],{"alt":378,"src":379},"Move and delete buttons that appear when hovering over a row in the Blocks panel","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F05-blocks-row-hover.webp",[10,381,382,384],{},[14,383,28],{}," at the bottom also opens the library.",[19,386,388],{"id":387},"move-blocks","Move blocks",[10,390,391,392,394],{},"You can also change the order on the page itself. Grab the name in the block's bar (for example ",[14,393,61],{},") and drag it, or press the up and down arrows in the bar.",[19,396,398],{"id":397},"delete-a-block","Delete a block",[10,400,401,402,405],{},"Press the trash can in the block's bar or in the Blocks panel. When you press ",[14,403,404],{},"Delete"," in the confirmation window, the block and the text inside it are deleted.",[10,407,408],{},[229,409],{"alt":410,"src":411,"width":412},"The Delete block confirmation window","https:\u002F\u002Fmedia.bunnyrain.com\u002Fguides\u002Fen\u002Fsections\u002F06-delete-confirm.webp",536,[10,414,415,416,317,418,420],{},"If you deleted something by mistake, undo right away (",[314,417],{"value":316},[314,419],{"value":320},"). Deleting is saved to the draft like any other change; the block stays on the live site until you publish.",[19,422,424],{"id":423},"block-settings","Block settings",[10,426,427,428,431,432,434,435,181],{},"Some blocks have settings beyond their text and layout. These blocks show a ",[14,429,430],{},"Settings"," button in their bar. For example, in the ",[14,433,95],{}," block you choose which collection to list, how many cards to show and whether to split them into pages. See ",[177,436,438],{"href":437},"\u002Fen\u002Fguides\u002Fcontent\u002Fcollections","Collections",{"title":440,"searchDepth":441,"depth":441,"links":442},"",2,[443,444,445,446,447,448,449],{"id":21,"depth":441,"text":22},{"id":184,"depth":441,"text":185},{"id":282,"depth":441,"text":283},{"id":324,"depth":441,"text":325},{"id":387,"depth":441,"text":388},{"id":397,"depth":441,"text":398},{"id":423,"depth":441,"text":424},"Add blocks to your page, change their order and layout, and delete the ones you don't need.","md",{},{"icon":454},"i-ph-stack-plus","\u002Fen\u002Fguides\u002Feditor\u002Fsections",{"title":5,"description":450},"en\u002Fguides\u002F2.editor\u002F2.sections","Ol3fXB32gRWuLC6Gr0gP_dztBL60rxH9DY6qRiy0TGQ",[460],{"title":461,"path":462,"stem":463,"children":464,"page":492},"En","\u002Fen","en",[465],{"title":466,"icon":467,"path":468,"stem":469,"children":470,"page":492},"User guide","i-ph-book-open","\u002Fen\u002Fguides","en\u002Fguides",[471,493,536,554,575,600,616],{"title":472,"icon":473,"path":474,"stem":475,"children":476,"page":492},"Getting started","i-ph-rocket-launch","\u002Fen\u002Fguides\u002Fgetting-started","en\u002Fguides\u002F1.getting-started",[477,482,487],{"title":478,"path":479,"stem":480,"icon":481},"Create your first site","\u002Fen\u002Fguides\u002Fgetting-started\u002Fcreate-your-site","en\u002Fguides\u002F1.getting-started\u002F1.create-your-site","i-ph-globe",{"title":483,"path":484,"stem":485,"icon":486},"Dashboard tour","\u002Fen\u002Fguides\u002Fgetting-started\u002Fpanel-tour","en\u002Fguides\u002F1.getting-started\u002F2.panel-tour","i-ph-compass",{"title":488,"path":489,"stem":490,"icon":491},"Your account","\u002Fen\u002Fguides\u002Fgetting-started\u002Faccount","en\u002Fguides\u002F1.getting-started\u002F3.account","i-ph-user-circle",false,{"title":494,"icon":495,"path":496,"stem":497,"children":498,"page":492},"Editor","i-ph-pencil-simple","\u002Fen\u002Fguides\u002Feditor","en\u002Fguides\u002F2.editor",[499,504,505,510,515,518,523,526,531],{"title":500,"path":501,"stem":502,"icon":503},"Editor tour","\u002Fen\u002Fguides\u002Feditor\u002Feditor-tour","en\u002Fguides\u002F2.editor\u002F1.editor-tour","i-ph-layout",{"title":5,"path":455,"stem":457,"icon":454},{"title":506,"path":507,"stem":508,"icon":509},"Editing text and images","\u002Fen\u002Fguides\u002Feditor\u002Ftext-and-images","en\u002Fguides\u002F2.editor\u002F3.text-and-images","i-ph-text-aa",{"title":511,"path":512,"stem":513,"icon":514},"Pages","\u002Fen\u002Fguides\u002Feditor\u002Fpages","en\u002Fguides\u002F2.editor\u002F4.pages","i-ph-files",{"title":279,"path":278,"stem":516,"icon":517},"en\u002Fguides\u002F2.editor\u002F5.ai-assistant","i-ph-sparkle",{"title":519,"path":520,"stem":521,"icon":522},"Theme","\u002Fen\u002Fguides\u002Feditor\u002Ftheme","en\u002Fguides\u002F2.editor\u002F6.theme","i-ph-palette",{"title":180,"path":179,"stem":524,"icon":525},"en\u002Fguides\u002F2.editor\u002F7.header-and-footer","i-ph-browser",{"title":527,"path":528,"stem":529,"icon":530},"Publishing and publish history","\u002Fen\u002Fguides\u002Feditor\u002Fpublishing","en\u002Fguides\u002F2.editor\u002F8.publishing","i-ph-rocket",{"title":532,"path":533,"stem":534,"icon":535},"Multiple languages","\u002Fen\u002Fguides\u002Feditor\u002Flanguages","en\u002Fguides\u002F2.editor\u002F9.languages","i-ph-translate",{"title":73,"icon":537,"path":538,"stem":539,"children":540,"page":492},"i-ph-stack","\u002Fen\u002Fguides\u002Fcontent","en\u002Fguides\u002F3.content",[541,544,549],{"title":438,"path":437,"stem":542,"icon":543},"en\u002Fguides\u002F3.content\u002F1.collections","i-ph-squares-four",{"title":545,"path":546,"stem":547,"icon":548},"Blog","\u002Fen\u002Fguides\u002Fcontent\u002Fblog","en\u002Fguides\u002F3.content\u002F2.blog","i-ph-article",{"title":550,"path":551,"stem":552,"icon":553},"Media","\u002Fen\u002Fguides\u002Fcontent\u002Fmedia","en\u002Fguides\u002F3.content\u002F3.media","i-ph-images",{"title":555,"icon":556,"path":557,"stem":558,"children":559,"page":492},"Customers","i-ph-users-three","\u002Fen\u002Fguides\u002Fcustomers","en\u002Fguides\u002F4.customers",[560,565,570],{"title":561,"path":562,"stem":563,"icon":564},"Inbox","\u002Fen\u002Fguides\u002Fcustomers\u002Finbox","en\u002Fguides\u002F4.customers\u002F1.inbox","i-ph-tray",{"title":566,"path":567,"stem":568,"icon":569},"Appointments","\u002Fen\u002Fguides\u002Fcustomers\u002Fappointments","en\u002Fguides\u002F4.customers\u002F2.appointments","i-ph-calendar-check",{"title":571,"path":572,"stem":573,"icon":574},"Google business","\u002Fen\u002Fguides\u002Fcustomers\u002Fgoogle-business","en\u002Fguides\u002F4.customers\u002F3.google-business","i-ph-google-logo",{"title":576,"icon":577,"path":578,"stem":579,"children":580,"page":492},"Site management","i-ph-gear-six","\u002Fen\u002Fguides\u002Fsite-management","en\u002Fguides\u002F5.site-management",[581,586,591,596],{"title":582,"path":583,"stem":584,"icon":585},"Overview","\u002Fen\u002Fguides\u002Fsite-management\u002Foverview","en\u002Fguides\u002F5.site-management\u002F1.overview","i-ph-house",{"title":587,"path":588,"stem":589,"icon":590},"Site analytics","\u002Fen\u002Fguides\u002Fsite-management\u002Fanalytics","en\u002Fguides\u002F5.site-management\u002F2.analytics","i-ph-chart-line-up",{"title":592,"path":593,"stem":594,"icon":595},"Connect your own domain","\u002Fen\u002Fguides\u002Fsite-management\u002Fcustom-domain","en\u002Fguides\u002F5.site-management\u002F3.custom-domain","i-ph-globe-hemisphere-west",{"title":597,"path":598,"stem":599,"icon":577},"Site settings","\u002Fen\u002Fguides\u002Fsite-management\u002Fsite-settings","en\u002Fguides\u002F5.site-management\u002F4.site-settings",{"title":601,"icon":602,"path":603,"stem":604,"children":605,"page":492},"Cards and QR menus","i-ph-qr-code","\u002Fen\u002Fguides\u002Fcards-and-menus","en\u002Fguides\u002F6.cards-and-menus",[606,611],{"title":607,"path":608,"stem":609,"icon":610},"Digital business card","\u002Fen\u002Fguides\u002Fcards-and-menus\u002Fcards","en\u002Fguides\u002F6.cards-and-menus\u002F1.cards","i-ph-identification-card",{"title":612,"path":613,"stem":614,"icon":615},"QR menu","\u002Fen\u002Fguides\u002Fcards-and-menus\u002Fmenus","en\u002Fguides\u002F6.cards-and-menus\u002F2.menus","i-ph-fork-knife",{"title":617,"icon":618,"path":619,"stem":620,"children":621,"page":492},"Team and organization","i-ph-buildings","\u002Fen\u002Fguides\u002Forganization","en\u002Fguides\u002F7.organization",[622,626],{"title":623,"path":624,"stem":625,"icon":556},"Members and roles","\u002Fen\u002Fguides\u002Forganization\u002Fmembers-and-roles","en\u002Fguides\u002F7.organization\u002F1.members-and-roles",{"title":627,"path":628,"stem":629,"icon":618},"Organization settings and billing","\u002Fen\u002Fguides\u002Forganization\u002Forganization-settings","en\u002Fguides\u002F7.organization\u002F2.organization-settings",[631,633],{"title":500,"path":501,"stem":502,"description":632,"icon":503,"children":-1},"The editor's bars, the left rail and its panels; automatic saving, undo, device views and preview.",{"title":506,"path":507,"stem":508,"description":634,"icon":509,"children":-1},"Change the text on your page in place and format it; upload images or pick stock photos; link buttons and cards.",1790889527385]