<link href="/grav/user/themes/developer/assets/plugins/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet"> <link href="/grav/user/themes/developer/assets/plugins/font-awesome/css/font-awesome.css" type="text/css" rel="stylesheet"> <link href="/grav/user/themes/developer/assets/plugins/octicons/octicons.min.css" type="text/css" rel="stylesheet"> <link href="/grav/user/themes/developer/assets/plugins/github-activity/css/github-activity.min.css" type="text/css" rel="stylesheet"> <link href="/grav/user/themes/developer/assets/css/styles.css" type="text/css" rel="stylesheet"> <link href="//fonts.googleapis.com/css?family=Lato:300,400,300italic,400italic" type="text/css" rel="stylesheet"> <link href="//fonts.googleapis.com/css?family=Montserrat:400,700" type="text/css" rel="stylesheet"> <link href="/grav/user/plugins/github-markdown-alerts/assets/github-markdown-alerts.css" type="text/css" rel="stylesheet"> <link href="/grav/user/plugins/form/assets/form-styles.css" type="text/css" rel="stylesheet"> <link href="/grav/user/plugins/highlight/css/default.css" type="text/css" rel="stylesheet"> <link href="/grav/user/plugins/login/css/login.css" type="text/css" rel="stylesheet"> <style> :root { --gh-alert-note-border-color: #316dca; --gh-alert-note-title-color: #316dca; --gh-alert-tip-border-color: #347d39; --gh-alert-tip-title-color: #347d39; --gh-alert-important-border-color: #8256d0; --gh-alert-important-title-color: #8256d0; --gh-alert-warning-border-color: #c69026; --gh-alert-warning-title-color: #c69026; --gh-alert-caution-border-color: #c93c37; --gh-alert-caution-title-color: #c93c37; } </style>
James Lee

James Lee

Web App Developer

Contact Me

Home

<h1>Say Hello to Grav 2.0!</h1> <h2>installation successful...</h2> <p>Congratulations! You have installed the <strong>Base Grav 2.0 Package</strong> that provides a <strong>simple page</strong> and the new default <strong>Quark 2</strong> theme to get you started — built on <a href="https://blades.ninja/">Blades CSS</a> (the actively maintained successor to Pico CSS), Font Awesome 7, and a refined typographic system with light/dark/auto appearance.</p> <div class="md-alert md-alert--warning" dir="auto"> <p class="md-alert-title"><svg class="octicon octicon-alert inline-block " viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg> Warning</p> <div class="md-alert-body"> <p>If you see a <strong>404 Error</strong> when you click <code>Typography</code> in the menu, please refer to the <a href="http://learn.getgrav.org/troubleshooting/page-not-found">troubleshooting guide</a>.</p> </div> </div> <h3>Find out all about Grav</h3> <ul> <li>Learn about <strong>Grav</strong> by checking out our dedicated <a href="https://learn.getgrav.org">Learn Grav</a> site.</li> <li>Download <strong>plugins</strong>, <strong>themes</strong>, and Grav <strong>skeleton</strong> packages from the <a href="https://getgrav.org/downloads">Grav Downloads</a> page.</li> <li>Follow the <a href="https://getgrav.org/blog">Grav Development Blog</a> to keep up with the latest happenings in the Grav-verse.</li> <li>Browse the source on <a href="https://github.com/getgrav/grav">GitHub</a> and file issues or pull requests there.</li> </ul> <div class="md-alert md-alert--tip" dir="auto"> <p class="md-alert-title"><svg class="octicon octicon-light-bulb inline-block " viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z"></path></svg> Tip</p> <div class="md-alert-body"> <p>If you want a more <strong>full-featured</strong> base install, check out the <a href="https://getgrav.org/downloads"><strong>Skeleton</strong> packages available in the downloads</a> — several have already been updated for Grav 2.0.</p> </div> </div> <h3>Edit this Page</h3> <p>To edit this page, navigate to the folder you installed <strong>Grav</strong> into, and browse to the <code>user/pages/01.home</code> folder. Open <code>default.md</code> in your <a href="https://learn.getgrav.org/basics/requirements">editor of choice</a>. You'll see the content of this page written in <a href="https://learn.getgrav.org/content/markdown">Markdown format</a>.</p> <h3>Create a New Page</h3> <p>Creating a new page is a simple affair in <strong>Grav</strong>. Follow these steps:</p> <ol> <li> <p>Navigate to your pages folder — <code>user/pages/</code> — and create a new folder. In this example, we'll use <a href="https://learn.getgrav.org/content/content-pages">explicit default ordering</a> and call the folder <code>03.mypage</code>.</p> </li> <li> <p>Launch your text editor and paste in the following sample content:</p> <pre><code>--- title: My New Page --- # My New Page! This is the body of **my new page** and I can easily use _Markdown_ syntax here.</code></pre> </li> <li> <p>Save this file in <code>user/pages/03.mypage/</code> as <code>default.md</code>. That tells <strong>Grav</strong> to render the page using the <strong>default</strong> template from Quark 2.</p> </li> <li> <p>Reload your browser to see your new page appear in the menu.</p> </li> </ol> <div class="md-alert md-alert--note" dir="auto"> <p class="md-alert-title"><svg class="octicon octicon-info inline-block " viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg> Note</p> <div class="md-alert-body"> <p>The page will automatically show up in the menu after the <strong>Typography</strong> item. If you want a different label, add <code>menu: My Page</code> between the dashes in the front matter — this is the YAML header block, where all per-page options are configured.</p> </div> </div> <h3>What's new in Grav 2.0</h3> <p>Grav 2.0 is the biggest release in the project's history — a modernized core, a rebuilt admin, a fresh default theme, and an updated dependency stack. Most of what you already know still works, but everything underneath has been sharpened.</p> <ul> <li><strong>PHP 8.3+</strong> baseline, with a modernized core and typed internals throughout.</li> <li><strong>Symfony 7 + Twig 3</strong> dependency stack, bringing the latest framework improvements and long-term support.</li> <li><strong>Quark 2</strong> as the default theme — <a href="https://blades.ninja/">Blades CSS</a>, Font Awesome 7, auto/light/dark mode with <code>localStorage</code> persistence, locally-hosted Cal Sans + Inter fonts, and a refined Cal.com-inspired design system.</li> <li><strong>Admin 2.0</strong> — a fully API-powered SPA interface that's dramatically faster, more responsive, and decoupled from page renders. Navigation, form saves, and media operations no longer trigger full reloads.</li> <li><strong>Public REST API</strong> — the same endpoints that power Admin 2.0 are available to your own tools and integrations.</li> <li><strong>GitHub Markdown Alerts</strong> — the legacy <code>markdown-notices</code> plugin has been replaced by <code>github-markdown-alerts</code>, using the familiar <code>&gt; [!NOTE]</code> / <code>[!TIP]</code> / <code>[!IMPORTANT]</code> / <code>[!WARNING]</code> / <code>[!CAUTION]</code> syntax.</li> <li><strong>Refined caching and asset pipeline</strong> — cleaner invalidation, faster cold starts, and smarter dependency fingerprinting.</li> <li><strong>Hardened security defaults</strong> — tightened CSP headers, modern session handling, and improved input sanitization across core plugins.</li> <li><strong>Better developer ergonomics</strong> — stricter type hints, cleaner event signatures, and clearer deprecation paths.</li> </ul> <div class="md-alert md-alert--important" dir="auto"> <p class="md-alert-title"><svg class="octicon octicon-report inline-block " viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v9.5A1.75 1.75 0 0 1 14.25 13H8.06l-2.573 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25Zm7 2.25v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 9a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg> Important</p> <div class="md-alert-body"> <p>Upgrading from Grav 1.x requires a migration. Follow the step-by-step guide at <a href="https://getgrav.org/migrate-to-2">getgrav.org/migrate-to-2</a> — it covers pre-flight checks, the migration itself, and what to verify afterward.</p> </div> </div>
<script src="/grav/user/themes/developer/assets/plugins/jquery-1.11.1.min.js"></script> <script src="/grav/user/themes/developer/assets/plugins/jquery-migrate-1.2.1.min.js"></script> <script src="/grav/user/themes/developer/assets/plugins/bootstrap/js/bootstrap.min.js"></script> <script src="/grav/user/themes/developer/assets/plugins/jquery-rss/dist/jquery.rss.min.js"></script> <script src="/grav/user/themes/developer/assets/plugins/mustache-0.7.2.min.js"></script> <script src="/grav/user/themes/developer/assets/plugins/github-activity/js/github-activity.min.js"></script> <script src="/grav/user/themes/developer/assets/js/main.js"></script> <script src="/grav/user/plugins/highlight/js/highlight.pack.js"></script> <script> hljs.initHighlightingOnLoad(); </script>