Creating (Editing) Your First Template
Next click the expand node icon (it's the small triangle) in front of the Settings > Templates folder - you should then see a child node titled "Homepage"
Umbraco created this automatically when we created the Document Type (remember that option that said "..without template", we chose the one with and this is what it did).
Clicking on the Homepage node will load the template - which, except for a little bit of Razor code, is empty!
Leaving the code that's there (if you don't understand it, don't worry!) let's copy our template code in. Open up index.html from the Retrospect template in your favourite text editor. Copy and paste the whole thing into this template after the closing curly brace "}". Your template should now look like below:
Umbraco templates use Razor which allows you to add code in your template files. Razor reacts to
@ signs, so the
@ on line 10 should be deleted as below
Click the Save button.
We now have a template. That's two out of the three stages complete for our first page.
Creating Your First Content Node
Our third and final stage to creating our first page in Umbraco is to create a content node where an editor can add the content which Umbraco will use, along with the Document Type and Template, to serve up an HTML page to web visitors.
We're now ready to create our first page in Umbraco! Click the Content button (first option in the top menu).
Hover over the grey text CONTENT and you'll see the three dots ... - click this. If you've done everything correctly so far you should see the option to create our Homepage!
If you can't see this then don't panic - check that Settings> Document Types > Homepage > Structure tab > Allow at root is checked.
Let's create our homepage. Click the icon and you'll see what we've just been setting up - our document type is now going to drive our homepage content – it gives us and the editors the fields they need.
In the field at the top of the page you'll see "Enter a name..." click this and enter the name for your new content node. We're going to call this "Homepage".
Fill in the following on the Contents tab:
Page Title Welcome to Widgets Ltd
Body Text Hello world! We can write what we like here!
"Widgets Ltd 2019"
Click the Footer tab and enter:
Footer Text "Copyright Widgets Ltd 2019"
Now click the green Publish button. The menu will reload with our homepage node under the CONTENT label. And here's the good bit... go and refresh your webpage in your browser http://localhost – the default Umbraco page will be gone and we'll see a very bare, unstyled page! We’re getting there!
If you see a blank page then check you entered your template markup and remembered to save it.