Desk with computer and notepad

How to Create a Blog Post in the Example App

Creating a blog post is simple with the Example App. A blog post has an author, so we will want to add our author page, too. Every blog post page consists of a title, a subtitle, and a widgetlist. The widgetlist is where you will build up the body of the blog post using the available widgets in the Example App. The blog post page settings include options for further customizing the post and specifying how and when to share. Let’s get started.

Create an Author Page

To create an author page, first click on the hamburger menu in the top right of the Scrivito toolbar. Be sure you are in Edit mode so the "Create page" item is selectable and click on it. This will open the page type browser, which indicates, via icons, the page types available in your project. Click on the "Author" icon, and a new empty Author page will be created.

The author page has a place for adding an author image, the author's name and a description. You will notice when you add the author’s name, the "More great blog posts from" section is automatically updated because this is a connected component. So once you are done with this, you have an author page which keeps track of and will list all your blog posts. Cool, huh?

Create a Blog Post

Now on to what you came here to do, get a blog post out. Again we will start from the page menu by clicking on the hamburger in the top right. Select "Create page" and choose “Blog Post”.

When the new empty page is rendered you will see two “Click to edit” fields and a widgetlist. These are the parts the page type was built with to make it a Blog Post page. The first “Click to edit” indicator is the title of the blog post and the second is the subtitle. While the subtitle is optional, you should always include a title as this is fed into the metadata of the page and assists with SEO.

The grey section with yellow indicators and a plus sign in the middle is the widgetlist. Well, technically it is a section widget which includes a widgetlist, a place to add widgets. We use the section widget as the default widget for most pages in the Example App as it provides a consistent base for the layout and formatting the Example App was designed for. From here you can add widgets to build up the section and/or add additional sections to build up the page. Clicking on the grey plus sign opens the widget browser to let you select from the 30+ widgets we have included in the Example App. If you would like to see an example of each widget you can navigate to the “Pages & Widgets” page.

Blog Post Page Menu

Once you have built up your page with widgets and sections, you can further fine tune the blogpost using the page menu. Again, open the page menu using the hamburger menu at the top right of the screen, then select “Edit page properties”. From here you can update the information about the page.

General tab:

  • Add a “Published at” date (if not today).
  • Change the image at the top of the page.
  • Add tags to categorize a post and support filtering.
  • Create a permalink.

Social cards tab:

  • Customize how the page looks in Facebook and Twitter when you share the page.

Meta data tab:

  • Set a description for SEO and web crawlers as well as indicate how you want the page indexed in the search engines.

As you can see, there are lots of options available for building a professional website. While these settings are optional, each will make your website more robust as well.

Finishing up

Once the blog post is ready for the world, all that is needed is to publish. Don't worry, you can always come back and change or fix it anytime because now it is Scrivito content. To publish, move your cursor to the right and hover or click on the Scrivito sidebar. Under the name of the current working copy (THIS WORKING COPY) is the “Publish” button with an arrow up icon ⇪. Clicking here will save the changes made in the working copy and make it live to your website visitors.