Skip to content

Build Your Article Style

The hard technical work is done! Let’s lay out our article style.

Heads Up!

This tutorial was written for the v0.6 version of Phosis. Later versions tweaked the user interface for data field mapping. While the screenshots won’t match the current user interface, the concepts are the same!

Create an Article Style

  1. In the top left, click Add… and then New Article Style.
  2. Give it a title, such as “Tutorial: Article Layout.”
  3. In the Content Blocks Editor below, click Add Content Block.
  4. Choose “Tutorial: 2 Column Layout With Form.”

Once you do this, you’ll see the containers you defined appear, ready for configuration!

Configure the Article Content container

  1. For the Contents, choose Template and then Tutorial: Article Content, as this is the 1st column of the layout.
  2. Choose Self as the data source.
  3. You’ll see the template objects we defined previously appear, with dropdowns to map them to the article’s data.
  4. Map them using the dropdowns as shown in this screenshot: Data Source mapping
  5. Because we used Self as the data source, the “Display how many” option will be ignored.

Next, choose your form.

Configure the Form container

  1. For its Contents, choose Form and then the form you created on the previous page, such as Form: Tutorial Form.

… there is no step 2, as the form was configured previously! Now, onto the “other articles” column.

This container becomes more useful if we have multiple articles posted, which we’ll do as a part of this quickstart. Let’s set it up:

  1. For Contents, choose Template and then Tutorial: Article Preview Card.
  2. Choose Articles as the data source.
  3. You’ll see the template objects we defined previously appear, with dropdowns to map them to the article’s data.
  4. Map them using the dropdowns as shown in this screenshot: Data Source mapping
  5. In Options & Filters, determine how many article preview cards you’d like to attempt to display. Phosis Render will simply repeat the template for each article it’s loaded up to the quantity you specify.
  6. Choose how you’d like the articles selected for this container to be ordered; usually, if it’s a “Most Recent Articles” scenario, you’d order by Date Posted and check the Descending checkbox. For our purposes, we’ll set it to Random.

You’ve set up what you needed. Finally, Save Changes on this article style!