{"id":381549,"date":"2026-09-15T13:07:22","date_gmt":"2026-09-15T13:07:22","guid":{"rendered":"https:\/\/colorlib.com\/wp\/?page_id=381549"},"modified":"2026-09-15T20:45:22","modified_gmt":"2026-09-15T20:45:22","slug":"documentation","status":"publish","type":"page","link":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/","title":{"rendered":"Pato documentation"},"content":{"rendered":"<div class=\"wpb-content-wrapper\" id=\"wpb-content-root\">[vc_row el_id=&#8221;top&#8221; css=&#8221;.vc_custom_patodoc00{padding-top:44px !important;padding-bottom:30px !important;background-color:#faf7f4 !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c682e{font-size:40px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-16 wpex-text-center vcex_6aaaee49c682e\"><span class=\"vcex-heading-inner wpex-inline-block\">Pato documentation<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoc00t{text-align:center !important;font-size:18px !important;max-width:760px !important;margin-left:auto !important;margin-right:auto !important;}&#8221;]\n<style>html{scroll-behavior:smooth}.pato-docs{scroll-margin-top:110px}.pato-docs h3{font-size:20px;margin:30px 0 10px}.pato-docs-fig{margin:22px 0 30px}.pato-docs-fig img{display:block;width:100%;height:auto;border:1px solid #e6e1dc;border-radius:8px}.pato-docs-fig figcaption{font-size:14px;line-height:1.55;color:#6b6560;margin-top:9px}.pato-docs-tip{background:#f7f3ee;border-left:4px solid #d41b22;border-radius:4px;padding:14px 18px 2px;margin:22px 0}.pato-docs kbd{display:inline-block;font:600 13px\/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#fff;border:1px solid #d7d1cb;border-bottom-width:2px;border-radius:4px;padding:0 6px;color:#1d2327;white-space:nowrap}.pato-docs-steps li{margin-bottom:8px}.pato-docs-table{overflow-x:auto;margin:18px 0 24px}.pato-docs-table table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}.pato-docs-table th,.pato-docs-table td{border-bottom:1px solid #ece7e2;padding:9px 10px;text-align:left;vertical-align:top}.pato-docs-table th{background:#faf7f4}.pato-docs pre{background:#faf7f4;padding:16px 18px;border-radius:6px;overflow-x:auto;font-size:14px;line-height:1.6;white-space:pre}.pato-docs-toc{columns:2;column-gap:40px;max-width:720px;margin:0 auto;text-align:left;padding-left:22px}.pato-docs-toc li{margin-bottom:6px;break-inside:avoid}@media (max-width:640px){.pato-docs-toc{columns:1}}<\/style>\n<p>Everything you need to take a restaurant site from install to open, in the order you will need it, with a screenshot or a short animation for every step. Pato is a free block theme for restaurants, caf\u00e9s, bakeries and bars.[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_patodoc00b{text-align:center !important;margin-top:22px !important;}&#8221;][vc_btn title=&#8221;Download Pato&#8221; style=&#8221;flat&#8221; color=&#8221;green&#8221; link=&#8221;url:https%3A%2F%2Fupdates.colorlib.com%2Fdownload%2Ftheme%2Fpato.zip|title:Download%20Pato|target:_blank&#8221; css=&#8221;.vc_custom_patodoc00c{display:inline-block !important;vertical-align:middle !important;margin-right:12px !important;margin-bottom:10px !important;}&#8221; i_icon_fontawesome=&#8221;fa fa-download&#8221; add_icon=&#8221;true&#8221;][vc_btn title=&#8221;Live demo&#8221; style=&#8221;flat&#8221; color=&#8221;grey&#8221; link=&#8221;url:https%3A%2F%2Fcolorlibhub.com%2Fpato%2F|title:Live%20demo|target:_blank&#8221; css=&#8221;.vc_custom_patodoc00d{display:inline-block !important;vertical-align:middle !important;margin-right:12px !important;margin-bottom:10px !important;}&#8221; i_icon_fontawesome=&#8221;fa fa-eye&#8221; add_icon=&#8221;true&#8221;][\/vc_column_text][vc_column_text css=&#8221;.vc_custom_patodoc00m{text-align:center !important;font-size:14px !important;color:#6b6560 !important;margin-top:6px !important;}&#8221;]Written for Pato 1.1.1 on WordPress 7.1. Every screenshot is from a fresh install.[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;contents&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc0c{padding-top:34px !important;padding-bottom:4px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c6a7b{font-size:24px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-16 wpex-text-center vcex_6aaaee49c6a7b\"><span class=\"vcex-heading-inner wpex-inline-block\">On this page<\/span><\/h2>[vc_column_text]\n<ol class=\"pato-docs-toc\">\n<li><a href=\"#quick-start\">The short version<\/a><\/li>\n<li><a href=\"#install\">Install Pato<\/a><\/li>\n<li><a href=\"#starters\">Start from one of six restaurants<\/a><\/li>\n<li><a href=\"#menu\">Change dishes and prices<\/a><\/li>\n<li><a href=\"#editing\">Find your way around a page<\/a><\/li>\n<li><a href=\"#reservations\">Bookings: the reservation form<\/a><\/li>\n<li><a href=\"#hours\">Opening hours, address and map<\/a><\/li>\n<li><a href=\"#header\">Logo, header, footer and navigation<\/a><\/li>\n<li><a href=\"#styles\">Colours and fonts<\/a><\/li>\n<li><a href=\"#dark-mode\">Dark mode<\/a><\/li>\n<li><a href=\"#templates\">Page templates<\/a><\/li>\n<li><a href=\"#shop\">Selling gift cards and more<\/a><\/li>\n<li><a href=\"#forms\">Contact forms<\/a><\/li>\n<li><a href=\"#updates\">Updates<\/a><\/li>\n<li><a href=\"#shortcuts\">Keyboard shortcuts<\/a><\/li>\n<li><a href=\"#troubleshooting\">If something is not where you expect<\/a><\/li>\n<\/ol>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;quick-start&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc01{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c6c07{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c6c07\"><span class=\"vcex-heading-inner wpex-inline-block\">The short version<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct01{max-width:860px !important;}&#8221;]\n<p>If you read one section, read this one. Each step links to the full explanation further down.<\/p>\n<ol class=\"pato-docs-steps\">\n<li><strong>Install and activate Pato.<\/strong> It builds your pages and your menu on its own. <a href=\"#install\">Install Pato<\/a><\/li>\n<li><strong>Import the starter site closest to your place<\/strong> from Appearance \u2192 Starter sites. <a href=\"#starters\">Starter sites<\/a><\/li>\n<li><strong>Put in your own dishes and prices.<\/strong> Click the text on the page and type over it. <a href=\"#menu\">Dishes and prices<\/a><\/li>\n<li><strong>Add your logo and check the menu links.<\/strong> <a href=\"#header\">Logo, header and navigation<\/a><\/li>\n<li><strong>Change the opening hours, address and map.<\/strong> <a href=\"#hours\">Opening hours and map<\/a><\/li>\n<li><strong>Send yourself a test booking<\/strong> and make sure the email arrives. <a href=\"#reservations\">Bookings<\/a><\/li>\n<li><strong>Pick colours and fonts<\/strong> if the starter\u2019s are not yours. <a href=\"#styles\">Colours and fonts<\/a><\/li>\n<\/ol>\n<p>None of it needs code, a page builder or a plugin.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;install&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc02{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c6d8d{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c6d8d\"><span class=\"vcex-heading-inner wpex-inline-block\">Install Pato<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct02{max-width:860px !important;}&#8221;]\n<p>Download the zip with the button at the top of this page. <strong>Do not unzip it<\/strong> \u2014 WordPress installs the zip file itself.<\/p>\n<ol class=\"pato-docs-steps\">\n<li>In your dashboard, go to <strong>Appearance \u2192 Themes<\/strong> and click <strong>Add New Theme<\/strong>.<\/li>\n<li>Click <strong>Upload Theme<\/strong> at the top of the screen.<\/li>\n<li>Click <strong>Choose File<\/strong>, pick <code>pato.zip<\/code>, then click <strong>Install Now<\/strong>.<\/li>\n<li>When WordPress reports the theme is installed, click <strong>Activate<\/strong>.<\/li>\n<\/ol>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png\" alt=\"WordPress Add Themes screen with the Upload Theme panel open, showing a Choose File button and an Install Now button.\" width=\"1600\" height=\"406\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Appearance \u2192 Themes \u2192 Add New Theme \u2192 <strong>Upload Theme<\/strong>.<\/figcaption><\/figure>\n<p>Pato needs <strong>WordPress 6.6 or newer<\/strong> and <strong>PHP 7.4 or newer<\/strong>, and is tested up to WordPress 7.1. <strong>Tools \u2192 Site Health \u2192 Info<\/strong> shows both versions.<\/p>\n<h3>What happens when you activate it<\/h3>\n<p>On a site that has not been built yet, Pato creates seven pages \u2014 <strong>Home, Menu, Reservation, About, Gallery, Contact and Blog<\/strong> \u2014 and fills each with real content. It sets Home as the front page and Blog as the posts page, and builds a navigation menu that links them all.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-pages-created.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-pages-created.png\" alt=\"The Pages screen straight after activating Pato, listing About, Blog (Posts Page), Contact, Gallery, Home (Front Page), Menu and Reservation.\" width=\"1600\" height=\"824\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Straight after activation: seven new pages, with Home as the front page and Blog as the posts page.<\/figcaption><\/figure>\n<p><em>Privacy Policy<\/em> and <em>Sample Page<\/em> come with WordPress, not with Pato. Delete Sample Page whenever you like.<\/p>\n<div class=\"pato-docs-tip\">\n<p><strong>Already had pages?<\/strong> Then Pato builds nothing, so it can never overwrite a site you have been working on. Import a starter site instead (next section) \u2014 that works on any site \u2014 or point your front page at an existing page in <strong>Settings \u2192 Reading<\/strong>:<\/p>\n<\/div>\n<figure class=\"pato-docs-fig\" style=\"max-width:760px\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-reading-settings.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-reading-settings.png\" alt=\"Settings, Reading with A static page selected, Home chosen as the homepage and Blog as the posts page.\" width=\"1600\" height=\"681\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Settings \u2192 Reading. Choose <em>A static page<\/em>, then the page your site should open on.<\/figcaption><\/figure>\n<h3>Where Pato lives in the dashboard<\/h3>\n<p>Pato is a block theme, so there is no Customizer and no theme options panel. It adds exactly one screen, <strong>Appearance \u2192 Starter sites<\/strong>. Everything else \u2014 header, footer, colours, fonts, templates \u2014 is in <strong>Appearance \u2192 Editor<\/strong>. <strong>Fonts<\/strong> is WordPress\u2019s own font library, where you can add a typeface of your own.<\/p>\n<figure class=\"pato-docs-fig\" style=\"max-width:170px\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-appearance-menu.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-appearance-menu.png\" alt=\"The WordPress admin menu with Appearance expanded to Themes, Editor, Fonts and Starter sites, with Starter sites highlighted.\" width=\"320\" height=\"978\" loading=\"lazy\" decoding=\"async\"><\/a><\/figure>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;starters&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc03{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c6f17{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c6f17\"><span class=\"vcex-heading-inner wpex-inline-block\">Start from one of six restaurants<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct03{max-width:860px !important;}&#8221;]\n<p>Pato comes with six complete front pages, each written for a different kind of place. They are not colour swaps: each has its own photographs, headline, dishes and prices, weekly offers and gallery, and its own colours and fonts.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-six-starters.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-six-starters.jpg\" alt=\"The opening screens of Pato&#039;s six starter sites, Bistro, Fine dining, Caf\u00e9, Pizzeria, Bar and Bakery, each with its own photograph, headline and colours.\" width=\"2456\" height=\"1294\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>The six starter sites. Each has its own photographs, headline, dishes, offers, gallery, colours and fonts.<\/figcaption><\/figure>\n<div class=\"pato-docs-table\">\n<table>\n<thead>\n<tr>\n<th>Starter<\/th>\n<th>Written for<\/th>\n<th>Colours<\/th>\n<th>Fonts<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><strong>Bistro<\/strong><\/td>\n<td>A neighbourhood restaurant: menu, reviews and a booking form<\/td>\n<td>Ember<\/td>\n<td>Montserrat &amp; Poppins<\/td>\n<\/tr>\n<tr>\n<td><strong>Fine dining<\/strong><\/td>\n<td>One tasting menu, press quotes and private hire<\/td>\n<td>Cellar (dark)<\/td>\n<td>Montserrat throughout<\/td>\n<\/tr>\n<tr>\n<td><strong>Caf\u00e9<\/strong><\/td>\n<td>All-day coffee and cake, gift cards and opening times<\/td>\n<td>Harvest<\/td>\n<td>Poppins throughout<\/td>\n<\/tr>\n<tr>\n<td><strong>Pizzeria<\/strong><\/td>\n<td>Menu first, then delivery and collection<\/td>\n<td>Olive<\/td>\n<td>Poppins throughout<\/td>\n<\/tr>\n<tr>\n<td><strong>Bar<\/strong><\/td>\n<td>Drinks, events and late opening<\/td>\n<td>Midnight (dark)<\/td>\n<td>Montserrat &amp; Poppins<\/td>\n<\/tr>\n<tr>\n<td><strong>Bakery<\/strong><\/td>\n<td>Counter menu, specials and gift cards<\/td>\n<td>Harvest<\/td>\n<td>Poppins throughout<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<h3>Import one<\/h3>\n<ol class=\"pato-docs-steps\">\n<li>Go to <strong>Appearance \u2192 Starter sites<\/strong>.<\/li>\n<li>Click <strong>Import this<\/strong> on the starter you want.<\/li>\n<li>When the screen reloads with <em>\u201cImported, and set as the front page\u201d<\/em>, click <strong>View it<\/strong>.<\/li>\n<\/ol>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-starter-sites.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-starter-sites.png\" alt=\"The Appearance, Starter sites screen: six cards for Bistro, Fine dining, Caf\u00e9, Pizzeria, Bar and Bakery, each with a short description and an Import this button.\" width=\"1600\" height=\"565\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Appearance \u2192 Starter sites.<\/figcaption><\/figure>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-import-starter.gif\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-import-starter.gif\" alt=\"Animation: clicking Import this on the Pizzeria starter, the Imported, and set as the front page notice, and the new pizzeria home page.\" width=\"960\" height=\"600\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Importing the Pizzeria starter: <strong>Import this<\/strong>, then <strong>View it<\/strong>.<\/figcaption><\/figure>\n<h3>What importing does, and what it does not<\/h3>\n<ul>\n<li>It <strong>creates a new page<\/strong> named after the starter \u2014 \u201cPizzeria\u201d, say \u2014 and makes it your front page.<\/li>\n<li>It <strong>applies the starter\u2019s colours and fonts<\/strong> to the whole site. Anything else you changed in Styles is kept.<\/li>\n<li>It <strong>never edits or deletes a page you already have<\/strong>, and it does not touch your navigation menu.<\/li>\n<li>It <strong>changes only the front page.<\/strong> Your Menu, About, Gallery and other pages keep the content they had. After importing the Pizzeria starter, open the Menu page and put pizzas on it too \u2014 or delete that page and its menu link and let the front page\u2019s menu do the job.<\/li>\n<\/ul>\n<div class=\"pato-docs-tip\">\n<p><strong>Try several.<\/strong> Each import adds one page, so you can import all six, compare them, and keep the one you like. Delete the others from <strong>Pages<\/strong> (hover over a title, then <strong>Trash<\/strong>). To go back to one you imported earlier, choose it under <strong>Settings \u2192 Reading \u2192 Homepage<\/strong>. The colours stay those of your most recent import; change them in <a href=\"#styles\">Styles<\/a>.<\/p>\n<\/div>\n<p>Everything a starter creates is ordinary content made of ordinary blocks. Nothing is locked, and nothing depends on the theme\u2019s pattern files once it is imported.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;menu&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc04{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7097{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7097\"><span class=\"vcex-heading-inner wpex-inline-block\">Change dishes and prices<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct04{max-width:860px !important;}&#8221;]\n<p>A menu row is two text blocks side by side \u2014 the dish and the price \u2014 with a dotted leader drawn between them, and an optional description underneath. There is no menu plugin and no special block to learn: you change a price the way you change any other text.<\/p>\n<h3>Change a price or a dish name<\/h3>\n<ol class=\"pato-docs-steps\">\n<li>Open the page. From the front of your site, click <strong>Edit Page<\/strong> in the black bar at the top; from the dashboard, go to <strong>Pages<\/strong> and click the page\u2019s title. Menus are on your front page and on the page called <strong>Menu<\/strong>.<\/li>\n<li>Click the price. A small toolbar appears above it.<\/li>\n<li>Select the old text \u2014 double-click it, or press <kbd>\u2318 A<\/kbd> (<kbd>Ctrl A<\/kbd> on Windows), which selects only that price \u2014 and type the new one.<\/li>\n<li>Click <strong>Save<\/strong> in the top-right corner, or press <kbd>\u2318 S<\/kbd> \/ <kbd>Ctrl S<\/kbd>.<\/li>\n<\/ol>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-price.gif\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-price.gif\" alt=\"Animation: clicking a price on the menu, selecting it and typing a new price, after which the Save button is highlighted.\" width=\"960\" height=\"628\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Changing a price: click it, select it, type, then Save.<\/figcaption><\/figure>\n<p>The dotted leader stretches or shrinks by itself, so a long dish name or a four-digit price never needs lining up. Type any currency the way you want it to read: <code>\u20ac18<\/code>, <code>\u00a318<\/code> or <code>18 kr<\/code>.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-price.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-price.jpg\" alt=\"The block editor with a menu price selected: a block toolbar above the dish row, Paragraph settings in the sidebar and the block breadcrumb along the bottom.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>A price selected. The breadcrumb along the bottom shows where it sits: the price is a Paragraph inside the dish row\u2019s Group.<\/figcaption><\/figure>\n<h3>Add a dish<\/h3>\n<p>Copy one that is already there: the copy keeps the row layout and the leader.<\/p>\n<ol class=\"pato-docs-steps\">\n<li>Click the <strong>name<\/strong> of a dish next to where the new one should go.<\/li>\n<li>Press <strong>Select parent<\/strong> \u2014 the first button on the toolbar \u2014 so the whole row, name and price, is outlined.<\/li>\n<li>If the dish has a description, hold <kbd>Shift<\/kbd> and click the description too. It is a separate line under the row, so it has to be selected with it.<\/li>\n<li>Press <kbd>\u21e7 \u2318 D<\/kbd> (<kbd>Ctrl Shift D<\/kbd>), or choose <strong>Duplicate<\/strong> from the toolbar\u2019s <strong>\u22ee<\/strong> menu. The copy appears directly below.<\/li>\n<li>Type over the copy\u2019s name, price and description, and save.<\/li>\n<\/ol>\n<p><strong>To remove a dish<\/strong>, select it the same way and press <kbd>\u2303 \u2325 Z<\/kbd> (<kbd>Shift Alt Z<\/kbd>), or choose <strong>Delete<\/strong> from the <strong>\u22ee<\/strong> menu. <strong>To move a dish<\/strong>, select it and use the up and down arrows on the toolbar. <strong>A description is optional<\/strong> \u2014 delete it if you do not want one.<\/p>\n<h3>Add a whole menu or course<\/h3>\n<p>Pato has ready-made menu sections \u2014 lunch and dinner, a drinks list, a breakfast menu, a counter menu for a bakery or caf\u00e9, a pizzeria menu and more.<\/p>\n<ol class=\"pato-docs-steps\">\n<li>Click where the new section should go, then click the blue <strong>+<\/strong> in the top-left corner.<\/li>\n<li>Open the <strong>Patterns<\/strong> tab and choose <strong>Pato: menus<\/strong>.<\/li>\n<li>Click a preview to insert it, or drag it into place, then type over the dishes.<\/li>\n<\/ol>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-pattern-inserter.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-pattern-inserter.jpg\" alt=\"The block inserter&#039;s Patterns tab with the Pato: menus category open, showing previews of ready-made menu sections.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>The block inserter\u2019s Patterns tab with <em>Pato: menus<\/em> open.<\/figcaption><\/figure>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;editing&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc05{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7214{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7214\"><span class=\"vcex-heading-inner wpex-inline-block\">Find your way around a page<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct05{max-width:860px !important;}&#8221;]\n<p>Every page Pato builds is a stack of sections \u2014 an opening photograph, an introduction, the menu, a gallery, a booking panel \u2014 and every section is made of ordinary blocks.<\/p>\n<h3>List View: the outline of the page<\/h3>\n<p>Click <strong>Document Overview<\/strong> (the three stacked lines near the top left) or press <kbd>\u2303 \u2325 O<\/kbd> (<kbd>Shift Alt O<\/kbd>). A list of every block on the page opens on the left. Click an arrow to open a section, and click any row to select that block \u2014 the easy way to reach text inside a column or on top of a photograph.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-list-view.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-list-view.jpg\" alt=\"The block editor&#039;s List View beside the Home page, with the hero Cover expanded into its heading, paragraph, spacer and buttons, followed by the page&#039;s other sections.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>List View (left) with the home page\u2019s opening banner opened up. Clicking a row selects that block on the page.<\/figcaption><\/figure>\n<p>In List View you can <strong>drag a section<\/strong> up or down the page, and use each row\u2019s <strong>\u22ee<\/strong> menu to duplicate, delete or hide it. Some sections carry a small label such as <em>about<\/em>, <em>menu<\/em> or <em>gallery<\/em>. That is the section\u2019s anchor, set under <strong>Advanced \u2192 HTML anchor<\/strong> in the block settings: a button linking to <code>#menu<\/code> scrolls straight to it. Keep it if you move the section.<\/p>\n<h3>Add a section<\/h3>\n<p>Click the blue <strong>+<\/strong>, open <strong>Patterns<\/strong>, and browse <strong>Pato: sections<\/strong> \u2014 the chefs, takeaway, wine nights, private dining, questions and answers, the map, opening hours, a booking panel, the latest blog posts and more \u2014 or <strong>Pato: pages<\/strong> for a whole page at once. Insert it, then edit it like anything else.<\/p>\n<h3>Change a photograph<\/h3>\n<p>Click the photograph and choose <strong>Replace<\/strong> on the toolbar, then <strong>Open Media Library<\/strong> or <strong>Upload<\/strong>. On an opening banner (a Cover block), the <strong>Focal point<\/strong> picker in the sidebar decides which part of the photograph stays in view on a phone. Fill in <strong>Alternative text<\/strong> for every photograph: a short description for people who cannot see it, and for search engines.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;reservations&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc06{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c737e{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c737e\"><span class=\"vcex-heading-inner wpex-inline-block\">Bookings: the reservation form<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct06{max-width:860px !important;}&#8221;]\n<p>The booking form is built into Pato \u2014 no plugin \u2014 and is already on the Home, Reservation and Contact pages.<\/p>\n<figure class=\"pato-docs-fig\" style=\"max-width:640px\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-reservation-form.png\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-reservation-form.png\" alt=\"Pato&#039;s booking form with fields for name, email address, phone number, date, time, number of people and a message, and a Book a table button.\" width=\"1256\" height=\"1102\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>The booking form as your guests see it. Fields marked * are required.<\/figcaption><\/figure>\n<p>It asks for a name, email address, phone number, date, time, number of people and an optional message; name, email, date, time and number of people are required. It is checked on your server, protected from spam bots by a hidden trap field and a security token, and works with JavaScript turned off.<\/p>\n<h3>Where bookings go<\/h3>\n<p>Each booking is emailed to the <strong>Administration Email Address<\/strong> in <strong>Settings \u2192 General<\/strong>. Change that address and bookings follow it. The email\u2019s <em>reply-to<\/em> is the guest, so pressing Reply in your inbox answers them.<\/p>\n<h3>Test it before you open<\/h3>\n<ol class=\"pato-docs-steps\">\n<li>Open your Reservation page in a private browser window, so you see it as a guest does.<\/li>\n<li>Fill in the form with your own email address and click <strong>Book a table<\/strong>.<\/li>\n<li>Check the page confirms the booking, then check the email arrives at the address in Settings \u2192 General \u2014 look in the spam folder too.<\/li>\n<\/ol>\n<div class=\"pato-docs-tip\">\n<p><strong>No email?<\/strong> Many hosts do not send WordPress email reliably. Install an SMTP plugin, such as FluentSMTP or WP Mail SMTP, and connect it to your email provider. Pato sends through WordPress\u2019s own <code>wp_mail()<\/code>, so whatever fixes a missing password-reset email fixes bookings too.<\/p>\n<\/div>\n<h3>Put the form on another page<\/h3>\n<p>Add a <strong>Shortcode<\/strong> block and type <code>&#091;pato_reservation_form&#093;<\/code>. The form is a shortcode on purpose: it is built fresh each time the page is shown, so it keeps working however the page around it is edited.<\/p>\n<h3>For developers: send bookings somewhere else<\/h3>\n<p>Bookings can go to a booking system, a CRM, a spreadsheet or a webhook instead of email. Add this to a child theme\u2019s <code>functions.php<\/code> or a small plugin:<\/p>\n<pre>add_filter( 'pato_reservation_handlers', function ( $handled, $booking ) {\n\t\/\/ $booking has: name, email, phone, date, time, people, message\n\tmy_crm_create_booking( $booking );\n\treturn true; \/\/ handled, so Pato sends no email of its own\n}, 10, 2 );<\/pre>\n<div class=\"pato-docs-table\">\n<table>\n<thead>\n<tr>\n<th>Filter<\/th>\n<th>Use it to<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>pato_reservation_fields<\/code><\/td>\n<td>Add, remove, relabel or reorder the form\u2019s fields<\/td>\n<\/tr>\n<tr>\n<td><code>pato_reservation_handlers<\/code><\/td>\n<td>Send the booking elsewhere; return <code>true<\/code> to skip the email<\/td>\n<\/tr>\n<tr>\n<td><code>pato_reservation_email_to<\/code><\/td>\n<td>Send bookings to an address other than the site administrator\u2019s<\/td>\n<\/tr>\n<tr>\n<td><code>pato_reservation_email_subject<\/code><\/td>\n<td>Change the email\u2019s subject line<\/td>\n<\/tr>\n<tr>\n<td><code>pato_reservation_email_body<\/code><\/td>\n<td>Change the email\u2019s text<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;hours&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc07{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c74eb{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c74eb\"><span class=\"vcex-heading-inner wpex-inline-block\">Opening hours, address and map<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct07{max-width:860px !important;}&#8221;]\n<p>Opening hours appear in two places: the <strong>Opening hours and address<\/strong> section on the Contact and Reservation pages (and in the Caf\u00e9, Pizzeria and Bakery starters), and the <strong>Opening times<\/strong> column of the footer, which shows on every page. Update both.<\/p>\n<h3>On a page<\/h3>\n<ol class=\"pato-docs-steps\">\n<li>Open the page and click the list of hours. It is a <strong>Custom HTML<\/strong> block, so you see its code.<\/li>\n<li>Change the text between the tags: each <code>&lt;dt&gt;<\/code> holds the days and the <code>&lt;dd&gt;<\/code> after it holds the hours. Copy a <code>&lt;dt&gt;\u2026&lt;\/dt&gt;&lt;dd&gt;\u2026&lt;\/dd&gt;<\/code> pair to add a line; delete one to remove it.<\/li>\n<li>Click <strong>Preview<\/strong> on the block\u2019s toolbar to check it, then <strong>Save<\/strong>.<\/li>\n<\/ol>\n<pre>&lt;dt&gt;Monday \u2013 Friday&lt;\/dt&gt;&lt;dd&gt;11:00 \u2013 23:00&lt;\/dd&gt;\n&lt;dt&gt;Sunday&lt;\/dt&gt;&lt;dd&gt;Closed&lt;\/dd&gt;<\/pre>\n<h3>In the footer<\/h3>\n<p>Go to <strong>Appearance \u2192 Editor \u2192 Patterns<\/strong>, choose <strong>Footer<\/strong> under template parts, and edit the hours the same way. The footer\u2019s phone number, email address and street address are in Custom HTML blocks too: change the visible text and the <code>tel:<\/code> and <code>mailto:<\/code> links beside it. The footer is shared, so one save updates every page.<\/p>\n<h3>The map<\/h3>\n<p>The map is an OpenStreetMap embed, so it needs no API key and no billing account. It is a <strong>Custom HTML<\/strong> block. To show your own address:<\/p>\n<ol class=\"pato-docs-steps\">\n<li>Find your place on <a href=\"https:\/\/www.openstreetmap.org\/\" target=\"_blank\" rel=\"noopener\">openstreetmap.org<\/a>, right-click it and choose <strong>Show address<\/strong>. The latitude and longitude appear at the top of the panel on the left.<\/li>\n<li>Click the map block to see its code. In the <code>src<\/code> address, replace the two numbers after <code>marker=<\/code> with your latitude and longitude, keeping the <code>%2C<\/code> between them.<\/li>\n<li>The four numbers after <code>bbox=<\/code> are the edges of the map: west, south, east, north. About 0.005 either side of your point gives a street-level view.<\/li>\n<\/ol>\n<pre>\u2026embed.html?bbox=-74.0170%2C40.6990%2C-74.0070%2C40.7100&amp;layer=mapnik&amp;marker=40.704644%2C-74.011987<\/pre>\n<p>Prefer Google Maps? Delete the block, add a new Custom HTML block, and paste the code from Google Maps\u2019 <strong>Share \u2192 Embed a map<\/strong>.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;header&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc08{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7661{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7661\"><span class=\"vcex-heading-inner wpex-inline-block\">Logo, header, footer and navigation<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct08{max-width:860px !important;}&#8221;]\n<p>The header and footer are <strong>template parts<\/strong>: edit one once and every page follows.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-template-parts.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-template-parts.jpg\" alt=\"The Site Editor Patterns screen listing Pato&#039;s three template parts: Footer, Header and Sidebar.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Appearance \u2192 Editor \u2192 Patterns \u2192 <em>All template parts<\/em>: the header, the footer and the blog sidebar.<\/figcaption><\/figure>\n<h3>Add your logo<\/h3>\n<ol class=\"pato-docs-steps\">\n<li>Go to <strong>Appearance \u2192 Editor \u2192 Patterns<\/strong> and choose <strong>Header<\/strong>.<\/li>\n<li>Click the grey logo placeholder beside the site name, and upload your logo or pick it from the Media Library.<\/li>\n<li>Drag the handle on the logo\u2019s corner to resize it, then click <strong>Save<\/strong>.<\/li>\n<\/ol>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-header.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-edit-header.jpg\" alt=\"The Header template part open in the Site Editor: a logo placeholder, the site title, the navigation links and a Book a table button.\" width=\"1600\" height=\"253\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>The Header template part. Click the grey placeholder to add your logo.<\/figcaption><\/figure>\n<p>The name beside the logo is your <strong>Site Title<\/strong> from <strong>Settings \u2192 General<\/strong>. If your logo already spells out the name, select the title in the header and delete it. Until you add a logo, the placeholder shows only in the editor, never to visitors.<\/p>\n<h3>Change the navigation menu<\/h3>\n<p>Go to <strong>Appearance \u2192 Editor \u2192 Navigation<\/strong> and open the <strong>Primary<\/strong> menu.<\/p>\n<ul>\n<li><strong>Reorder links<\/strong> with <strong>Move up<\/strong> and <strong>Move down<\/strong> in the <strong>\u22ee<\/strong> menu beside each link.<\/li>\n<li><strong>Add a link<\/strong> with the <strong>+<\/strong> under the list: search for a page, or paste any web address.<\/li>\n<li><strong>Remove a link<\/strong> from its <strong>\u22ee<\/strong> menu. The page itself is not deleted.<\/li>\n<li><strong>Rename a link<\/strong> in the header: open <strong>Patterns \u2192 Header<\/strong>, click the link in the menu and type over it. The page\u2019s own title does not change.<\/li>\n<\/ul>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-navigation.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-navigation.jpg\" alt=\"The Site Editor Navigation panel showing the Primary menu: Home, Menu, Reservation, Gallery, About, Blog and Contact.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Appearance \u2192 Editor \u2192 Navigation, with the Primary menu open.<\/figcaption><\/figure>\n<p>On a phone the menu folds into a single button that opens it full-screen. That happens by itself.<\/p>\n<h3>The two buttons on the right<\/h3>\n<p>The moon is the visitor\u2019s <a href=\"#dark-mode\">dark mode<\/a> switch. <strong>Book a table<\/strong> is an ordinary Button block: click it to change its words, and use the link button on its toolbar to point it somewhere else \u2014 a booking service, say, or a phone number written as <code>tel:+441234567890<\/code>.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;styles&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc09{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c77c6{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c77c6\"><span class=\"vcex-heading-inner wpex-inline-block\">Colours and fonts<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct09{max-width:860px !important;}&#8221;]\n<p>Colours and fonts are set once for the whole site in <strong>Appearance \u2192 Editor \u2192 Styles<\/strong>. Click <strong>Styles<\/strong>, then <strong>Browse styles<\/strong>.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-styles.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-styles.jpg\" alt=\"The Site Editor Styles panel with Browse styles, Typography, Colors, Background, Shadows and Layout, beside a preview of the home page.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Appearance \u2192 Editor \u2192 <strong>Styles<\/strong>.<\/figcaption><\/figure>\n<p>Click a colour variation and the preview on the right changes immediately. Your live site does not change until you click <strong>Save<\/strong>, so try as many as you like.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-palettes.gif\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-palettes.gif\" alt=\"Animation: clicking through colour variations in Browse styles while the preview changes from red to olive, charcoal, the dark Midnight and Cellar palettes, and teal.\" width=\"960\" height=\"600\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Browse styles: each click previews a palette. Your live site does not change until you click Save.<\/figcaption><\/figure>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-browse-styles.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-browse-styles.jpg\" alt=\"Browse styles in the Site Editor, showing nine colour variations and six typography variations.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Browse styles: the eight palettes plus the theme default, then the five font pairings plus the default.<\/figcaption><\/figure>\n<h3>The eight palettes<\/h3>\n<div class=\"pato-docs-table\">\n<table>\n<thead>\n<tr>\n<th>Palette<\/th>\n<th>Background<\/th>\n<th>Buttons and prices<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><strong>Ember<\/strong> (the theme\u2019s own colours)<\/td>\n<td>Light<\/td>\n<td>Tomato red<\/td>\n<\/tr>\n<tr>\n<td><strong>Olive<\/strong><\/td>\n<td>Light<\/td>\n<td>Olive green<\/td>\n<\/tr>\n<tr>\n<td><strong>Vineyard<\/strong><\/td>\n<td>Light<\/td>\n<td>Deep wine<\/td>\n<\/tr>\n<tr>\n<td><strong>Charcoal<\/strong><\/td>\n<td>Light<\/td>\n<td>Charcoal grey<\/td>\n<\/tr>\n<tr>\n<td><strong>Harvest<\/strong><\/td>\n<td>Light<\/td>\n<td>Amber brown<\/td>\n<\/tr>\n<tr>\n<td><strong>Seaside<\/strong><\/td>\n<td>Light<\/td>\n<td>Teal<\/td>\n<\/tr>\n<tr>\n<td><strong>Midnight<\/strong><\/td>\n<td>Dark<\/td>\n<td>Coral<\/td>\n<\/tr>\n<tr>\n<td><strong>Cellar<\/strong><\/td>\n<td>Dark<\/td>\n<td>Warm amber<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>Every palette was checked before it shipped: body text, secondary text, links and button labels all meet WCAG AA contrast on every background the design uses, in light mode and in dark mode.<\/p>\n<h3>The five font pairings<\/h3>\n<p>Pato uses <strong>Montserrat<\/strong> for headings, <strong>Poppins<\/strong> for text and <strong>Courgette<\/strong> for the handwritten lines above section titles, such as \u201cOur menu\u201d. All three are served from your own site, not from Google. The typography variations rearrange them:<\/p>\n<ul>\n<li><strong>Montserrat &amp; Poppins<\/strong> \u2014 the default: Montserrat headings, Poppins text.<\/li>\n<li><strong>Poppins throughout<\/strong> \u2014 rounder and softer.<\/li>\n<li><strong>Montserrat throughout<\/strong> \u2014 tighter and more formal.<\/li>\n<li><strong>Poppins headings<\/strong> \u2014 Poppins headings over Montserrat text.<\/li>\n<li><strong>No script<\/strong> \u2014 the handwritten lines use Montserrat instead of Courgette, for a plainer look.<\/li>\n<\/ul>\n<h3>Change one colour, or undo<\/h3>\n<p>To adjust a single colour, open <strong>Styles \u2192 Colors \u2192 Edit palette<\/strong> and click a swatch. Pato names its colours by job \u2014 <em>Base<\/em> is the page, <em>Contrast<\/em> the text, <em>Primary<\/em> the buttons and prices \u2014 so changing one swatch changes it everywhere it is used.<\/p>\n<p>To undo, click <strong>Revisions<\/strong> at the bottom of the Design panel and go back to any earlier save, or open the <strong>\u22ee<\/strong> menu at the top of Styles and choose <strong>Reset styles<\/strong> to return to the theme\u2019s own.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;dark-mode&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc10{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c792d{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c792d\"><span class=\"vcex-heading-inner wpex-inline-block\">Dark mode<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct10{max-width:860px !important;}&#8221;]\n<p>The moon in the header lets each visitor choose light or dark. It is separate from your palette: dark mode lifts the palette you chose instead of replacing it, so an Olive site stays olive and only the backgrounds and text change.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-dark-mode.gif\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-dark-mode.gif\" alt=\"Animation: clicking the moon icon in the header switches the menu page to dark mode, and clicking it again switches back.\" width=\"900\" height=\"645\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>The moon switches a visitor to dark mode, and back again.<\/figcaption><\/figure>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-dark-mode.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-dark-mode.jpg\" alt=\"The same menu section side by side in light mode and in dark mode, with the palette&#039;s red prices kept in both.\" width=\"1624\" height=\"586\" loading=\"lazy\" decoding=\"async\"><\/a><\/figure>\n<ul>\n<li>Until a visitor clicks it, it follows their phone or computer\u2019s own light or dark setting.<\/li>\n<li>Once they click, it remembers their choice on that device.<\/li>\n<li>It is applied before the page is drawn, so a phone in dark mode never flashes white.<\/li>\n<\/ul>\n<p><strong>To remove the switch<\/strong>, add <code>add_filter( 'pato_enable_dark_mode', '__return_false' );<\/code> to a child theme or a small plugin. <strong>To move it<\/strong>, edit the header and drag the button: it is an ordinary Button block with the class <code>pato-scheme-toggle<\/code>, and any button with that class becomes the switch.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;templates&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc11{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7a95{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7a95\"><span class=\"vcex-heading-inner wpex-inline-block\">Page templates<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct11{max-width:860px !important;}&#8221;]\n<p>A template decides what surrounds a page\u2019s content: the header, a banner, a sidebar, the footer. Pato ships 14 templates. For a page you choose between three:<\/p>\n<ul>\n<li><strong>Page<\/strong> \u2014 a photograph banner with the page\u2019s title on it, above the content.<\/li>\n<li><strong>Page without title<\/strong> \u2014 no title and no banner. Use it when the page opens with its own photograph; every page Pato builds uses it.<\/li>\n<li><strong>Page with sidebar<\/strong> \u2014 the content, with search, categories and recent posts on the right.<\/li>\n<\/ul>\n<p>To switch, open the page, click the <strong>Page<\/strong> tab in the sidebar, click the template\u2019s name next to <strong>Template<\/strong>, and choose <strong>Change template<\/strong>.<\/p>\n<figure class=\"pato-docs-fig\"><a href=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-template-menu.jpg\" target=\"_blank\" rel=\"noopener\"><img src=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-template-menu.jpg\" alt=\"The page settings sidebar with the Template option opened, offering Edit template, Change template, Use default template and Create new template.\" width=\"1600\" height=\"1000\" loading=\"lazy\" decoding=\"async\"><\/a><figcaption>Page tab \u2192 Template \u2192 <strong>Change template<\/strong>.<\/figcaption><\/figure>\n<p>Posts can use <strong>Post with sidebar<\/strong> the same way. The blog, archives, categories, tags, author pages, search results and the 404 page each have their own designed template, which you can change in <strong>Appearance \u2192 Editor \u2192 Templates<\/strong>.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;shop&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc12{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7bec{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7bec\"><span class=\"vcex-heading-inner wpex-inline-block\">Selling gift cards and more<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct12{max-width:860px !important;}&#8221;]\n<p>Install WooCommerce and Pato styles it \u2014 the shop, product pages, cart and checkout take the theme\u2019s colours, fonts and buttons, so the shop does not look like a different website. There is nothing to configure.<\/p>\n<p>That covers both the block-based shop WooCommerce builds on a block theme and the older shortcode pages, so it works whichever way your shop is set up. Gift cards, a cookbook, merchandise or collection orders are the usual reasons a restaurant wants one. Without WooCommerce, none of this styling is loaded.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;forms&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc13{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7d51{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7d51\"><span class=\"vcex-heading-inner wpex-inline-block\">Contact forms<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct13{max-width:860px !important;}&#8221;]\n<p>Pato\u2019s own booking form needs no plugin. For a separate contact form, install any of these and Pato styles it to match: Contact Form 7, WPForms, Gravity Forms, Fluent Forms, Forminator, Ninja Forms, Formidable Forms or HappyForms. Add the plugin\u2019s block to the page and the form takes the theme\u2019s fields, button and spacing.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;updates&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc14{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c7eb1{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c7eb1\"><span class=\"vcex-heading-inner wpex-inline-block\">Updates<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct14{max-width:860px !important;}&#8221;]\n<p>Pato is not in the WordPress.org theme directory, so it checks <code>updates.colorlib.com<\/code> for new versions every 12 hours. A new version then appears in <strong>Dashboard \u2192 Updates<\/strong> and on <strong>Appearance \u2192 Themes<\/strong>, like any other theme, and updates with one click.<\/p>\n<p>The check sends the theme\u2019s version, your WordPress and PHP versions, your site\u2019s language, whether it is a multisite, and a one-way hash of your site address. It sends no personal data and no site name, and the hash cannot be turned back into your address. To switch it off, add <code>add_filter( 'pato_check_for_updates', '__return_false' );<\/code> \u2014 you will then not hear about new versions.<\/p>\n<p><strong>Updates change the theme, not what you wrote.<\/strong> Your pages are your content. The single deliberate exception is version 1.1.1, which repairs pages built by 1.0.0 and 1.1.0: in those, every spacer showed <em>\u201cThis block contains unexpected or invalid content\u201d<\/em> in the editor. The repair puts back one missing character in each spacer\u2019s settings the first time an administrator opens the dashboard, and changes nothing a visitor can see.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;shortcuts&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc15{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c8008{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c8008\"><span class=\"vcex-heading-inner wpex-inline-block\">Keyboard shortcuts worth knowing<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct15{max-width:860px !important;}&#8221;]\n<div class=\"pato-docs-table\">\n<table>\n<thead>\n<tr>\n<th>To<\/th>\n<th>Mac<\/th>\n<th>Windows<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>Save<\/td>\n<td><kbd>\u2318 S<\/kbd><\/td>\n<td><kbd>Ctrl S<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Undo \/ redo<\/td>\n<td><kbd>\u2318 Z<\/kbd> \/ <kbd>\u21e7 \u2318 Z<\/kbd><\/td>\n<td><kbd>Ctrl Z<\/kbd> \/ <kbd>Ctrl Shift Z<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Select the text in a block (press again for the whole page)<\/td>\n<td><kbd>\u2318 A<\/kbd><\/td>\n<td><kbd>Ctrl A<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Duplicate the selected block<\/td>\n<td><kbd>\u21e7 \u2318 D<\/kbd><\/td>\n<td><kbd>Ctrl Shift D<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Delete the selected block<\/td>\n<td><kbd>\u2303 \u2325 Z<\/kbd><\/td>\n<td><kbd>Shift Alt Z<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Add a block before \/ after<\/td>\n<td><kbd>\u2325 \u2318 T<\/kbd> \/ <kbd>\u2325 \u2318 Y<\/kbd><\/td>\n<td><kbd>Ctrl Alt T<\/kbd> \/ <kbd>Ctrl Alt Y<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Open List View<\/td>\n<td><kbd>\u2303 \u2325 O<\/kbd><\/td>\n<td><kbd>Shift Alt O<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Show every shortcut<\/td>\n<td><kbd>\u2303 \u2325 H<\/kbd><\/td>\n<td><kbd>Shift Alt H<\/kbd><\/td>\n<\/tr>\n<tr>\n<td>Add a block by name<\/td>\n<td colspan=\"2\">Type <kbd>\/<\/kbd> on an empty line, then the block\u2019s name<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_id=&#8221;troubleshooting&#8221; el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc16{padding-top:34px !important;padding-bottom:6px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c8174{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c8174\"><span class=\"vcex-heading-inner wpex-inline-block\">If something is not where you expect<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoct16{max-width:860px !important;}&#8221;]\n<p><strong>The editor says \u201cThis block contains unexpected or invalid content\u201d.<\/strong> On a page built by Pato 1.0.0 or 1.1.0 that is a known fault in the spacers. Update to 1.1.1 or later and open the dashboard once; the pages are repaired automatically. Clicking <strong>Attempt recovery<\/strong> on each block also fixes it.<\/p>\n<p><strong>There is no Appearance \u2192 Starter sites.<\/strong> It appears only while Pato is the active theme, and only for users who can change the site\u2019s design \u2014 administrators.<\/p>\n<p><strong>My front page shows the latest blog posts.<\/strong> Go to <strong>Settings \u2192 Reading<\/strong>, choose <em>A static page<\/em>, and pick Home (or your starter) as the homepage.<\/p>\n<p><strong>I imported a starter, but the Menu page still has the old dishes.<\/strong> Importing changes only the front page. Edit the Menu page too, or remove it.<\/p>\n<p><strong>My colours changed after importing a starter.<\/strong> Each starter brings its own palette and fonts. Pick different ones in <a href=\"#styles\">Styles<\/a>, or use <strong>Revisions<\/strong> there to go back.<\/p>\n<p><strong>Bookings are not arriving.<\/strong> Check the address in Settings \u2192 General and your spam folder, then test whether WordPress can send mail at all \u2014 most hosts need an SMTP plugin. If WordPress cannot send a password reset, it cannot send a booking.<\/p>\n<p><strong>The header is see-through on some pages and solid on others.<\/strong> That is deliberate: it sits over the photograph when a page opens with one, and becomes a solid bar when there is nothing to sit on, such as a blog post.<\/p>\n<p><strong>I edited a pattern file in the theme and my page did not change.<\/strong> Starter content is copied into your pages when it is created, so it is yours from then on. Edit the page, not the pattern.<\/p>\n<p><strong>I saved, but visitors still see the old version.<\/strong> A caching plugin or your host\u2019s cache is serving a stored copy. Clear it from the plugin\u2019s or host\u2019s settings.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row][vc_row el_class=&#8221;pato-docs&#8221; css=&#8221;.vc_custom_patodoc99{padding-top:34px !important;padding-bottom:56px !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;]<style>.vcex-heading.vcex_6aaaee49c8307{font-size:28px;font-weight:700;}<\/style><h2 class=\"vcex-heading vcex-heading-plain vcex-module wpex-heading wpex-text-2xl wpex-mb-14 vcex_6aaaee49c8307\"><span class=\"vcex-heading-inner wpex-inline-block\">Still stuck?<\/span><\/h2>[vc_column_text css=&#8221;.vc_custom_patodoc99t{max-width:860px !important;}&#8221;]\n<p>Ask on the <a href=\"https:\/\/colorlibsupport.com\/\" target=\"_blank\" rel=\"noopener\">Colorlib support forum<\/a>. Include your WordPress version, your PHP version, what you did, and what you expected to happen \u2014 a screenshot helps.<\/p>\n[\/vc_column_text][\/vc_column][\/vc_row]\n<\/div>","protected":false},"excerpt":{"rendered":"<p>[vc_row el_id=&#8221;top&#8221; css=&#8221;.vc_custom_patodoc00{padding-top:44px !important;padding-bottom:30px !important;background-color:#faf7f4 !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text css=&#8221;.vc_custom_patodoc00t{text-align:center !important;font-size:18px !important;max-width:760px !important;margin-left:auto !important;margin-right:auto !important;}&#8221;] Everything you need to take a restaurant site from install to open, in the order you will need it, with a screenshot or a short animation for every step. Pato is a free block theme for restaurants, caf\u00e9s, bakeries and bars.[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_patodoc00b{text-align:center&hellip;<\/p>\n","protected":false},"author":0,"featured_media":0,"parent":381531,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_yoast_wpseo_focuskw":"","_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","footnotes":""},"class_list":["page","type-page","status-publish","hentry","entry","no-media"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Pato documentation - Colorlib<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Pato documentation - Colorlib\" \/>\n<meta property=\"og:description\" content=\"[vc_row el_id=&#8221;top&#8221; css=&#8221;.vc_custom_patodoc00{padding-top:44px !important;padding-bottom:30px !important;background-color:#faf7f4 !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text css=&#8221;.vc_custom_patodoc00t{text-align:center !important;font-size:18px !important;max-width:760px !important;margin-left:auto !important;margin-right:auto !important;}&#8221;] Everything you need to take a restaurant site from install to open, in the order you will need it, with a screenshot or a short animation for every step. Pato is a free block theme for restaurants, caf\u00e9s, bakeries and bars.[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_patodoc00b{text-align:center&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/\" \/>\n<meta property=\"og:site_name\" content=\"Colorlib\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/colorlib\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-15T20:45:22+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@colorlib\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"26 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/\",\"name\":\"Pato documentation - Colorlib\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/pato-docs-upload-theme.png\",\"datePublished\":\"2026-09-15T13:07:22+00:00\",\"dateModified\":\"2026-09-15T20:45:22+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/#primaryimage\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/pato-docs-upload-theme.png\",\"contentUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/pato-docs-upload-theme.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/documentation\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Best Responsive WordPress Themes\",\"item\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Pato\",\"item\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/themes\\\/pato\\\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Pato documentation\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#website\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\",\"name\":\"Colorlib\",\"description\":\"WordPress tutorials, theme reviews, and web design inspiration. Free themes and 1,000+ HTML templates from Colorlib.\",\"publisher\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#organization\",\"name\":\"Colorlib\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/colorlib-logo-top-1.png\",\"contentUrl\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/wp-content\\\/uploads\\\/sites\\\/2\\\/colorlib-logo-top-1.png\",\"width\":800,\"height\":400,\"caption\":\"Colorlib\"},\"image\":{\"@id\":\"https:\\\/\\\/colorlib.com\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/colorlib\",\"https:\\\/\\\/x.com\\\/colorlib\",\"https:\\\/\\\/www.instagram.com\\\/colorlib\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/colorlib\",\"https:\\\/\\\/youtube.com\\\/c\\\/Colorlib\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Pato documentation - Colorlib","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/","og_locale":"en_US","og_type":"article","og_title":"Pato documentation - Colorlib","og_description":"[vc_row el_id=&#8221;top&#8221; css=&#8221;.vc_custom_patodoc00{padding-top:44px !important;padding-bottom:30px !important;background-color:#faf7f4 !important;}&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text css=&#8221;.vc_custom_patodoc00t{text-align:center !important;font-size:18px !important;max-width:760px !important;margin-left:auto !important;margin-right:auto !important;}&#8221;] Everything you need to take a restaurant site from install to open, in the order you will need it, with a screenshot or a short animation for every step. Pato is a free block theme for restaurants, caf\u00e9s, bakeries and bars.[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_patodoc00b{text-align:center&hellip;","og_url":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/","og_site_name":"Colorlib","article_publisher":"https:\/\/www.facebook.com\/colorlib","article_modified_time":"2026-09-15T20:45:22+00:00","og_image":[{"url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_site":"@colorlib","twitter_misc":{"Est. reading time":"26 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/","url":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/","name":"Pato documentation - Colorlib","isPartOf":{"@id":"https:\/\/colorlib.com\/wp\/#website"},"primaryImageOfPage":{"@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/#primaryimage"},"image":{"@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/#primaryimage"},"thumbnailUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png","datePublished":"2026-09-15T13:07:22+00:00","dateModified":"2026-09-15T20:45:22+00:00","breadcrumb":{"@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/#primaryimage","url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png","contentUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/pato-docs-upload-theme.png"},{"@type":"BreadcrumbList","@id":"https:\/\/colorlib.com\/wp\/themes\/pato\/documentation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/colorlib.com\/wp\/"},{"@type":"ListItem","position":2,"name":"Best Responsive WordPress Themes","item":"https:\/\/colorlib.com\/wp\/themes\/"},{"@type":"ListItem","position":3,"name":"Pato","item":"https:\/\/colorlib.com\/wp\/themes\/pato\/"},{"@type":"ListItem","position":4,"name":"Pato documentation"}]},{"@type":"WebSite","@id":"https:\/\/colorlib.com\/wp\/#website","url":"https:\/\/colorlib.com\/wp\/","name":"Colorlib","description":"WordPress tutorials, theme reviews, and web design inspiration. Free themes and 1,000+ HTML templates from Colorlib.","publisher":{"@id":"https:\/\/colorlib.com\/wp\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/colorlib.com\/wp\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/colorlib.com\/wp\/#organization","name":"Colorlib","url":"https:\/\/colorlib.com\/wp\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/colorlib.com\/wp\/#\/schema\/logo\/image\/","url":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/colorlib-logo-top-1.png","contentUrl":"https:\/\/colorlib.com\/wp\/wp-content\/uploads\/sites\/2\/colorlib-logo-top-1.png","width":800,"height":400,"caption":"Colorlib"},"image":{"@id":"https:\/\/colorlib.com\/wp\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/colorlib","https:\/\/x.com\/colorlib","https:\/\/www.instagram.com\/colorlib\/","https:\/\/www.linkedin.com\/company\/colorlib","https:\/\/youtube.com\/c\/Colorlib"]}]}},"_links":{"self":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/pages\/381549","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/comments?post=381549"}],"version-history":[{"count":2,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/pages\/381549\/revisions"}],"predecessor-version":[{"id":381595,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/pages\/381549\/revisions\/381595"}],"up":[{"embeddable":true,"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/pages\/381531"}],"wp:attachment":[{"href":"https:\/\/colorlib.com\/wp\/wp-json\/wp\/v2\/media?parent=381549"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}