Setting up Custom Fields

Step 4 – Creating a new field

Now you know how to create a template and a page using that template. You could create more pages using the same template if you wanted to. But that wouldn't be particularly useful – this template file is just a static HTML file.

Lets make it dynamic by creating some fields and adding them to it. We are going to create 3 fields to represent the pieces of data that currently appear in our static template. These include the planet's type, age in years, and a brief summary. We will call these fields: planet_type, planet_age and planet_summary.

  • In ProcessWire admin, click Setup > Fields. This screen shows a list of fields currently in the system, most of which are general purpose fields for the basic profile. For the purposes of this tutorial, we are going to ignore those and create our own.
  • Click the Add New Field button. On the next screen, enter planet_type for the Name, select "Text" as the Type, and enter "Planet Type" for the Label. Then click the Save Field button. Now that your field is saved, you are on the Field Edit screen. At this point, your field is created and ready to be added to your planet template.
  • Optional but recommended: While editing your field, click the details tab where you'll see a select box for Text Formatters. Select "HTML Entity Encoder" – this ensures that characters like <, > and & will be converted to HTML entities and not confused as HTML tags. While not required, it's a good practice for text fields like this. After you've done that, click the Save Field button.

Step 5 – Creating more new fields

In step 4 we created the planet_type field. Now we want to create the planet_age and planet_summary fields. So in this step, you'll want to do the same thing for the remaining two fields:

  • Create the planet_age field exactly like you created the planet_type field, but enter "Planet age in years" for the label.
  • Create the planet_summary field exactly like you created the planet_type field, but chose "Textarea" as the Type and enter "Planet summary" for the label.

Note that a "textarea" field is just like a "text" field, except that it can contain multiple lines of text.

Step 6 – Adding new fields to your template

Now that you've created 3 new fields, you need to add them to your planet template.

  • In ProcessWire admin, click Setup > Templates > planet. You are now editing your planet template.
  • In the Fields select box, choose planet_type, then planet_age, then planet_summary. You will see each added to the list. Cick the Save Template button.

Step 7 – Editing a page using your template

Now that you have new fields added to your template, go back and edit the Earth page you created earlier and populate the new fields that are on it.

  • In ProcessWire admin, click Pages at the top, then click the Earth page, and click the edit button that appears to the right of it.
  • You are now editing the Earth page you created earlier. You should see the new fields you added, waiting for text.
  • Enter "Terrestrial planet" for Planet Type
  • Enter "4.54 billion" for Planet Age in Years
  • Paste in the text below for Planet Summary and then click Save.
Earth (or the Earth) is the third planet from the Sun, and the densest and fifth-largest of the eight planets in the Solar System. It is also the largest of the Solar System's four terrestrial planets. It is sometimes referred to as the World, the Blue Planet, or by its Latin name, Terra.

Next: The Template File »


  1. Introduction and First Steps
  2. Create a Template and a Page
  3. Setting up Custom Fields
  4. The Template File
  5. More Pages
  6. Conclusion

Comments

  • Max

    Max 4 years ago 43

    Great stuff Ryan.

    How about adding this as the next step: now that folks have learned how to build the template that will show individual pages for the earth, jupiter, etc it would be nice to show them how to output all the planet outputs on a single page as a list?

    Thanks!

    • Patrick t.

      Patrick t. 3 years ago 65

      Hi Max, i think you need to create some template specific for pages. I can assume from this tutorial, that template file created here is similar to a template for planet details. To get all planets, you need to create a planets.php template file, create a page that act as parent of single planet, and in this page template use a foreach loop with the $page->children array, to list subpages.

  • marc

    marc 4 years ago 33

    Thanks ryan for this easy and simple to understand tutorial.

    +1 for additional tutorial in displaying all the planets on a single page as a list

  • Sito

    Sito 4 years ago 43

    Hello, just new to this CMS, and after following the tuts here I get a 'Earth' page but the with the Title & Content above the navigation menu...
    And also a double title, can't figure this out...any advice please?

    • Dionys

      Dionys 3 years ago 11

      @SITO

      I had the same Problem like you.
      Im not shur if i understand and solve the problem correct, but it works at the end.

      If you use $content .= "".$page->title.""; and this for every planet Variable. It works. Look at _main.php there is the output of this $content var. Im not shure but at the install process i take not the beginner template. At readme.txt i read something about two posibilities to give the page out. The first is direct, i think this was used at this tutorial. The second way is complexer but mor scaleable. I think this is the reason and solution.

      Maybe somebody can correct me.

  • Christophe

    Christophe 4 years ago 62

    Nice tutorial and awesome CMS/CMF ;)
    Great work!!!

  • Marco

    Marco 3 years ago 33

    If we leave the _init and the _main template-references in place (see tab Files when editing template "planet"), wouldn't it be more in line with the Processwire way of thinking to work with the following content of the template file?

  • Ed Preston

    Ed Preston 3 years ago 13

    "Create a new file"?
    How?
    Where?
    I can do cut-and-paste real good, that's not a problem.
    But since this is a beginner level tutorial it would help *a lot* if you could be a little more specific. This "tutorial" assumes we beginners already know the how and the where, but if we did, we wouldn't be beginners

    • Ed Preston

      Ed Preston 3 years ago 00

      OK, commenting to my own reply: I gave up looking for a way to create the new file *in* ProcessWire, and just created it outside of ProcessWire through cPanel, since my site is hosted, and not on my own server.

  • Vik

    Vik 1 year ago 00

    Thank you Ryan!
    Perfect tutorial, very clean and simple
    :)

Post a Comment

Your e-mail is kept confidential and not included with your comment. Website is optional.