6. Umbraconewssite: Add news Category

The previous article made a simple homepage, added several news sections on the navigation bar, and then we added the pages of these news sections.

At the beginning we still need to create Document Types to display the news list. We do the planning first, the news list only need to put news headlines and pictures to show it,.
The document type that we created for this news list is also created under setting–> document Types , creating a document type named News list. Note that an option "Master Document Type" appears in the Create menu, and this option is useful if some of your data for this template is inherited from another template, select that template as the master template. Did not appear before because there is only one Home template. Our News page is independent and does not need to be inherited, so the default selection is "none ...".

First create a tabs named Info , and then add a section name property that you can use to edit the type of news list.

Open the home document type, go to the Structure tab, select the option to allow after root to set the home type to the root node; Allowed Chile node types behind the News list , the function is to allow the news list as a child of the Home node.

We go back to the Content feature node and click on the three dots button behind " home " to see that the News List Type We just created is ready to use. If there are no options for the news list type, but some hints, try refreshing the page if you haven't checked the news list type in the Home document type setting to Child nodes of the Home type, remember to save.

After the creation, enter the settings interface, the first text box is set the name of the node, but also the Web page in the node when the URL, it is generally better to use English, because the URL of the Chinese path may be a problem, and not too good-looking.

Follow the same method to set up several other nodes.

Next we link these pages separately to the first page navigation bar button written in the previous article.
Go back to Templates , change the code in Master , bind several news links, and convert the code of the bootstrap navigation bar to:

1 <Divclass= "NavBar navbar-inverse navbar-fixed-top">2         <Divclass= "Container">3             <Divclass= "Navbar-header">4                 <Buttontype= "button"class= "Navbar-toggle"Data-toggle= "Collapse"Data-target= ". Navbar-collapse">5                     <spanclass= "Icon-bar"></span>6                     <spanclass= "Icon-bar"></span>7                     <spanclass= "Icon-bar"></span>8                 </Button>9                 <Divstyle= "Text-align:center">Ten                     <ahref= "@home. Url "> One                         <Imagesrc= "@ (Home.sitelogo)" /> A                     </a> -                 </Div> -             </Div> the             <Divclass= "Navbar-collapse collapse"> -                 <ulclass= "Nav navbar-nav"> - @if (home. Children.any ()) -                     { + foreach (Var childpage in home. Children) -                         { +                             <Li><ahref= "@childPage. Url">@childPage. sectionname</a></Li> A                         } at                     } -                 </ul> -                 <ulclass= "Nav navbar-nav pull-right"> -                     <Li><a>Landing</a></Li> -                     <Li><a>Registered</a></Li> -                 </ul> in             </Div> -  to         </Div> +     </Div>

Explain the above code, mainly @if(home.Children.Any(){......}) this code, home is the current page of the object, is the home.Children current page of the sub-page, that is, the child node under the Home node, that is, we have just set up a few News List Type of node.

At this point we can already click on the button on the navigation bar, and we can do the correct jump, because there is no content, and the templates of the News List is not set to the master template, so the page has nothing.

Go to the Templates feature node, open the News List, and set the master template option to master. and save them.

Then add a line of sample code to the News list . Such as:

Now you can see the effect we need:

Next we add a news detail page, and we'll show it on the News list page.

6. Umbraconewssite: Add news Category