Cutlery/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-05-24 01:12:54 -04:00
Code Issues Packages Projects Releases Wiki Activity
mealie/documentation/admin/building-pages/index.html

1387 lines
33 KiB
HTML
Raw Blame History

<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="canonical" href="https://hay-kot.github.io/mealie/documentation/admin/building-pages/">
<link rel="icon" href="../../../assets/img/favicon.png">
<meta name="generator" content="mkdocs-1.2.3, mkdocs-material-8.1.9">
<title>Building Pages - Mealie</title>
<link rel="stylesheet" href="../../../assets/stylesheets/main.2b4465f4.min.css">
<link rel="stylesheet" href="../../../assets/stylesheets/palette.e6a45f82.min.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700%7CRoboto+Mono&display=fallback">
<style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style>
<link rel="stylesheet" href="../../../assets/stylesheets/custom.css">
<script>__md_scope=new URL("../../..",location),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script>
<script
async
defer
data-domain="hay-kot.github.io/mealie"
src="https://plausible.io/js/plausible.js"
></script>
</head>
<body dir="ltr" data-md-color-scheme="mealie" data-md-color-primary="" data-md-color-accent="">
<script>var palette=__md_get("__palette");if(palette&&"object"==typeof palette.color)for(var key of Object.keys(palette.color))document.body.setAttribute("data-md-color-"+key,palette.color[key])</script>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" for="__drawer"></label>
<div data-md-component="skip">
<a href="#building-pages" class="md-skip">
Skip to content
</a>
</div>
<div data-md-component="announce">
</div>
<header class="md-header md-header--lifted" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../../.." title="Mealie" class="md-header__button md-logo" aria-label="Mealie" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.1 13.34 3.91 9.16a4.008 4.008 0 0 1 0-5.66l7.02 7-2.83 2.84m5.31-.34 6.88 6.88-1.41 1.41L12 14.41l-6.88 6.88-1.41-1.41 9.65-9.66-.2-.22a1.98 1.98 0 0 1 0-2.81l4.34-4.37.93.92L15.19 7l.96.94 3.24-3.25.92.92-3.25 3.24.94.96 3.26-3.25.92.94-4.37 4.34c-.78.78-2.04.78-2.81 0l-.22-.2L13.41 13z"/></svg>
</a>
<label class="md-header__button md-icon" for="__drawer">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2z"/></svg>
</label>
<div class="md-header__title" data-md-component="header-title">
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Mealie
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
<span class="md-ellipsis">
Building Pages
</span>
</div>
</div>
</div>
<form class="md-header__option" data-md-component="palette">
<input class="md-option" data-md-color-media="(prefers-color-scheme: light)" data-md-color-scheme="mealie" data-md-color-primary="" data-md-color-accent="" aria-label="Switch to dark mode" type="radio" name="__palette" id="__palette_1">
<label class="md-header__button md-icon" title="Switch to dark mode" for="__palette_2" hidden>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m17.75 4.09-2.53 1.94.91 3.06-2.63-1.81-2.63 1.81.91-3.06-2.53-1.94L12.44 4l1.06-3 1.06 3 3.19.09m3.5 6.91-1.64 1.25.59 1.98-1.7-1.17-1.7 1.17.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95 2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14.4-.4.82-.76 1.27-1.08.75-.53 1.93.36 1.85 1.19-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82-2.81 3.14-2.7 7.96.31 10.98 3.02 3.01 7.84 3.12 10.98.31z"/></svg>
</label>
<input class="md-option" data-md-color-media="(prefers-color-scheme: dark)" data-md-color-scheme="slate" data-md-color-primary="" data-md-color-accent="" aria-label="Switch to light mode" type="radio" name="__palette" id="__palette_2">
<label class="md-header__button md-icon" title="Switch to light mode" for="__palette_1" hidden>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 7a5 5 0 0 1 5 5 5 5 0 0 1-5 5 5 5 0 0 1-5-5 5 5 0 0 1 5-5m0 2a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0-7 2.39 3.42C13.65 5.15 12.84 5 12 5c-.84 0-1.65.15-2.39.42L12 2M3.34 7l4.16-.35A7.2 7.2 0 0 0 5.94 8.5c-.44.74-.69 1.5-.83 2.29L3.34 7m.02 10 1.76-3.77a7.131 7.131 0 0 0 2.38 4.14L3.36 17M20.65 7l-1.77 3.79a7.023 7.023 0 0 0-2.38-4.15l4.15.36m-.01 10-4.14.36c.59-.51 1.12-1.14 1.54-1.86.42-.73.69-1.5.83-2.29L20.64 17M12 22l-2.41-3.44c.74.27 1.55.44 2.41.44.82 0 1.63-.17 2.37-.44L12 22z"/></svg>
</label>
</form>
<label class="md-header__button md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
</label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
<label class="md-search__icon md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
</label>
<nav class="md-search__options" aria-label="Search">
<button type="reset" class="md-search__icon md-icon" aria-label="Clear" tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"/></svg>
</button>
</nav>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="search-result">
<div class="md-search-result__meta">
Initializing search
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
<div class="md-header__source">
<a href="https://github.com/hay-kot/mealie/" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
</div>
<div class="md-source__repository">
hay-kot/mealie
</div>
</a>
</div>
</nav>
<nav class="md-tabs" aria-label="Tabs" data-md-component="tabs">
<div class="md-tabs__inner md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="../../.." class="md-tabs__link">
Home
</a>
</li>
<li class="md-tabs__item">
<a href="../../getting-started/introduction/" class="md-tabs__link md-tabs__link--active">
Getting Started
</a>
</li>
<li class="md-tabs__item">
<a href="../../../api/redoc/" class="md-tabs__link">
API Reference
</a>
</li>
<li class="md-tabs__item">
<a href="../../../contributors/non-coders/" class="md-tabs__link">
Contributors Guide
</a>
</li>
<li class="md-tabs__item">
<a href="../../../roadmap/" class="md-tabs__link">
Development Road Map
</a>
</li>
<li class="md-tabs__item">
<a href="../../../changelog/v0.5.6/" class="md-tabs__link">
Change Log
</a>
</li>
</ul>
</div>
</nav>
</header>
<div class="md-container" data-md-component="container">
<main class="md-main" data-md-component="main">
<div class="md-main__inner md-grid">
<div class="md-sidebar md-sidebar--primary" data-md-component="sidebar" data-md-type="navigation" >
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary md-nav--lifted" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../../.." title="Mealie" class="md-nav__button md-logo" aria-label="Mealie" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.1 13.34 3.91 9.16a4.008 4.008 0 0 1 0-5.66l7.02 7-2.83 2.84m5.31-.34 6.88 6.88-1.41 1.41L12 14.41l-6.88 6.88-1.41-1.41 9.65-9.66-.2-.22a1.98 1.98 0 0 1 0-2.81l4.34-4.37.93.92L15.19 7l.96.94 3.24-3.25.92.92-3.25 3.24.94.96 3.26-3.25.92.94-4.37 4.34c-.78.78-2.04.78-2.81 0l-.22-.2L13.41 13z"/></svg>
</a>
Mealie
</label>
<div class="md-nav__source">
<a href="https://github.com/hay-kot/mealie/" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
</div>
<div class="md-source__repository">
hay-kot/mealie
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../.." class="md-nav__link">
Home
</a>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2" type="checkbox" id="__nav_2" checked>
<label class="md-nav__link" for="__nav_2">
Getting Started
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Getting Started" data-md-level="1">
<label class="md-nav__title" for="__nav_2">
<span class="md-nav__icon md-icon"></span>
Getting Started
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../getting-started/introduction/" class="md-nav__link">
Introduction
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/install/" class="md-nav__link">
Installation
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/updating/" class="md-nav__link">
Updating
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/api-usage/" class="md-nav__link">
API
</a>
</li>
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2_5" data-md-state="indeterminate" type="checkbox" id="__nav_2_5" checked>
<label class="md-nav__link" for="__nav_2_5">
Recipes
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Recipes" data-md-level="2">
<label class="md-nav__title" for="__nav_2_5">
<span class="md-nav__icon md-icon"></span>
Recipes
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../recipes/recipes/" class="md-nav__link">
Working With Recipes
</a>
</li>
<li class="md-nav__item">
<a href="../../recipes/organizing-recipes/" class="md-nav__link">
Organizing Recipes
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2_6" data-md-state="indeterminate" type="checkbox" id="__nav_2_6" checked>
<label class="md-nav__link" for="__nav_2_6">
Users & Groups
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Users & Groups" data-md-level="2">
<label class="md-nav__title" for="__nav_2_6">
<span class="md-nav__icon md-icon"></span>
Users & Groups
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../users-groups/user-settings/" class="md-nav__link">
User Settings
</a>
</li>
<li class="md-nav__item">
<a href="../../users-groups/meal-planner/" class="md-nav__link">
Planning Meals
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2_7" type="checkbox" id="__nav_2_7" checked>
<label class="md-nav__link" for="__nav_2_7">
Admin
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Admin" data-md-level="2">
<label class="md-nav__title" for="__nav_2_7">
<span class="md-nav__icon md-icon"></span>
Admin
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../dashboard/" class="md-nav__link">
Dashboard
</a>
</li>
<li class="md-nav__item">
<a href="../site-settings/" class="md-nav__link">
Site Settings
</a>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-nav__toggle md-toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<a href="./" class="md-nav__link md-nav__link--active">
Building Pages
</a>
</li>
<li class="md-nav__item">
<a href="../user-management/" class="md-nav__link">
User Management
</a>
</li>
<li class="md-nav__item">
<a href="../backups-and-exports/" class="md-nav__link">
Backups and Restore
</a>
</li>
<li class="md-nav__item">
<a href="../migration-imports/" class="md-nav__link">
Recipe Migration
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2_8" data-md-state="indeterminate" type="checkbox" id="__nav_2_8" checked>
<label class="md-nav__link" for="__nav_2_8">
Toolbox
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Toolbox" data-md-level="2">
<label class="md-nav__title" for="__nav_2_8">
<span class="md-nav__icon md-icon"></span>
Toolbox
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../toolbox/notifications/" class="md-nav__link">
External Notifications
</a>
</li>
<li class="md-nav__item">
<a href="../../toolbox/organize-tools/" class="md-nav__link">
Organization Tools
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2_9" data-md-state="indeterminate" type="checkbox" id="__nav_2_9" checked>
<label class="md-nav__link" for="__nav_2_9">
Community Guides
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Community Guides" data-md-level="2">
<label class="md-nav__title" for="__nav_2_9">
<span class="md-nav__icon md-icon"></span>
Community Guides
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../community-guide/ios/" class="md-nav__link">
iOS Shortcuts
</a>
</li>
<li class="md-nav__item">
<a href="../../community-guide/swag/" class="md-nav__link">
Reverse Proxy (SWAG)
</a>
</li>
<li class="md-nav__item">
<a href="../../community-guide/home-assistant/" class="md-nav__link">
Home Assistant
</a>
</li>
<li class="md-nav__item">
<a href="../../community-guide/bulk-url-import/" class="md-nav__link">
Bulk Url Import
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../../../api/redoc/" class="md-nav__link">
API Reference
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_4" data-md-state="indeterminate" type="checkbox" id="__nav_4" checked>
<label class="md-nav__link" for="__nav_4">
Contributors Guide
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Contributors Guide" data-md-level="1">
<label class="md-nav__title" for="__nav_4">
<span class="md-nav__icon md-icon"></span>
Contributors Guide
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../../contributors/non-coders/" class="md-nav__link">
Non-Code
</a>
</li>
<li class="md-nav__item">
<a href="../../../contributors/translating/" class="md-nav__link">
Translating
</a>
</li>
<li class="md-nav__item md-nav__item--section md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_4_3" data-md-state="indeterminate" type="checkbox" id="__nav_4_3" checked>
<label class="md-nav__link" for="__nav_4_3">
Developers Guide
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Developers Guide" data-md-level="2">
<label class="md-nav__title" for="__nav_4_3">
<span class="md-nav__icon md-icon"></span>
Developers Guide
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../../contributors/developers-guide/code-contributions/" class="md-nav__link">
Code Contributions
</a>
</li>
<li class="md-nav__item">
<a href="../../../contributors/developers-guide/starting-dev-server/" class="md-nav__link">
Dev Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../../contributors/developers-guide/general-guidelines/" class="md-nav__link">
Guidelines
</a>
</li>
<li class="md-nav__item">
<a href="../../../contributors/developers-guide/style-guide/" class="md-nav__link">
Style Guide
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../../../roadmap/" class="md-nav__link">
Development Road Map
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_6" data-md-state="indeterminate" type="checkbox" id="__nav_6" checked>
<label class="md-nav__link" for="__nav_6">
Change Log
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Change Log" data-md-level="1">
<label class="md-nav__title" for="__nav_6">
<span class="md-nav__icon md-icon"></span>
Change Log
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.6/" class="md-nav__link">
v0.5.6 Bug Fixes
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.5/" class="md-nav__link">
v0.5.5 Bug Fixes
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.4/" class="md-nav__link">
v0.5.4 Bug Fixes
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.3/" class="md-nav__link">
v0.5.3 Bug Fixes
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.2/" class="md-nav__link">
v0.5.2 Misc Updates
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.1/" class="md-nav__link">
v0.5.1 Bug Fixes
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.5.0/" class="md-nav__link">
v0.5.0 General Upgrades
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.4.3/" class="md-nav__link">
v0.4.3 Hot Fix
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.4.2/" class="md-nav__link">
v0.4.2 Backend/Migrations
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.4.1/" class="md-nav__link">
v0.4.1 Frontend/UI
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.4.0/" class="md-nav__link">
v0.4.0 Authentication
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.3.0/" class="md-nav__link">
v0.3.0 Improvements
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.2.0/" class="md-nav__link">
v0.2.0 Now With Tests!
</a>
</li>
<li class="md-nav__item">
<a href="../../../changelog/v0.1.0/" class="md-nav__link">
v0.1.0 Beta
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
</nav>
</div>
</div>
</div>
<div class="md-content" data-md-component="content">
<article class="md-content__inner md-typeset">
<a href="https://github.com/hay-kot/mealie/edit/master/docs/documentation/admin/building-pages.md" title="Edit this page" class="md-content__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>
</a>
<h1 id="building-pages">Building Pages</h1>
<div class="admonition warning">
<p class="admonition-title">Warning</p>
<p>The page building is still experimental and may change. You can provide feedback on any changes you'd like to see on <a href="https://github.com/hay-kot/mealie/discussions/229">github</a></p>
</div>
<p>Custom pages can be created to organize multiple categories into a single page. Links to your custom pages are displayed on the home page sidebar and accessible by all users, however only Administrators can create or update pages.
<img alt="custom page" src="../../../assets/img/custom-page.webp" /></p>
<p>To create a new page navigate to the settings page at <code>/admin/settings</code> and scroll down to the custom pages section. Here you can create, view, and edit your custom pages. To reorder how they are displayed on the sidebar you can drag and drop the pages into the preferred order.
<img alt="create custom page" src="../../../assets/gifs/create-custom-page-demo.gif" /></p>
<div class="admonition tip">
<p class="admonition-title">Tip</p>
<p>To save the order of pages you must click the save button displayed on the bottom of the Custom Page section. This is not necessary for updating individual page data. </p>
</div>
</article>
</div>
</div>
<a href="#" class="md-top md-icon" data-md-component="top" data-md-state="hidden">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12z"/></svg>
Back to top
</a>
</main>
<footer class="md-footer">
<nav class="md-footer__inner md-grid" aria-label="Footer">
<a href="../site-settings/" class="md-footer__link md-footer__link--prev" aria-label="Previous: Site Settings" rel="prev">
<div class="md-footer__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
</div>
<div class="md-footer__title">
<div class="md-ellipsis">
<span class="md-footer__direction">
Previous
</span>
Site Settings
</div>
</div>
</a>
<a href="../user-management/" class="md-footer__link md-footer__link--next" aria-label="Next: User Management" rel="next">
<div class="md-footer__title">
<div class="md-ellipsis">
<span class="md-footer__direction">
Next
</span>
User Management
</div>
</div>
<div class="md-footer__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11H4z"/></svg>
</div>
</a>
</nav>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-copyright">
Made with
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
Material for MkDocs
</a>
</div>
</div>
</div>
</footer>
</div>
<div class="md-dialog" data-md-component="dialog">
<div class="md-dialog__inner md-typeset"></div>
</div>
<script id="__config" type="application/json">{"base": "../../..", "features": ["navigation.top", "navigation.expand", "navigation.sections", "navigation.tabs", "navigation.tabs.sticky"], "translations": {"clipboard.copy": "Copy to clipboard", "clipboard.copied": "Copied to clipboard", "search.config.lang": "en", "search.config.pipeline": "trimmer, stopWordFilter", "search.config.separator": "[\\s\\-]+", "search.placeholder": "Search", "search.result.placeholder": "Type to start searching", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.term.missing": "Missing", "select.version.title": "Select version"}, "search": "../../../assets/javascripts/workers/search.22074ed6.min.js"}</script>
<script src="../../../assets/javascripts/bundle.960e086b.min.js"></script>
<script src="../../../assets/js/extra.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink