aDriv4 - MANAGER

Edit File: example-recent-stories.html

In this example you will create a list of nodes of the content type "story", to be shown in a block. Through this step-by-step process, you will become familiar with some basic steps in creating a view, and familiarize yourself with the Views User Interface.

<ol>
<li><h3>Creating a new view</h3>
Go to <a target="_blank" href="base_url:admin/structure/views/add">add new view</a>. Give your new view the name 'recent_stories', description 'Recent Stories', tag 'story', type 'Node' and click Next.</li>
<li><h3>About the interface</h3>
You have been brought to Views User Interface. As you start, you are editing the "Default" options for the view. In the 1st column on the left you can see the drop-down menu offers 'block', for example, to select settings specific only to block views. In the remaining columns, you will be able to add or change options by clicking on links or icons. These options will then appear below this main area. Most likely, you will need to scroll a bit to see the options appear.</li>
<li><h3>Selecting the fields to display</h3>
 <ol>
 <li>In 3rd column locate the Fields options. Click the + icon to add fields.</li>
 <li>Scroll down to Defaults: Add fields. In the Groups drop-down menu select 'Node', then check the following two fields: Node: Post date, Node: Title. Then click Add.</li>
 <li>You will be taken through the fields you added one at a time. Make the changes specified below.
 <ul>
 <li>For the Post date field: Delete the 'Post date' label. Change the Date format to Custom, and the Custom date format to 'F j, Y, g:i a' (do not type the single quotes; for the meaning of these letter codes, click on the PHP docs link under that box to arrive at the explanation). Click Update.</li>
 <li>For the Title field: Delete the 'Title' label. Select Link this field to its node. Click Update.</li>
 </ul>
 </li>
 <li>Scroll back up to Fields and click the &uarr;&darr; icon to rearrange fields.</li>
 <li>Drag the four-sided arrow next to Node: Title so that it appears above Node: Post date. Click Update to save the new field order.</li>
 </ol>
</li>
<li><h3>Filtering to story nodes only</h3>
 <ol>
 <li>Click the + icon next to Filters.</li>
 <li>In the Groups drop-down menu select 'Node', then check the Node: Published and Node: Type filters, and click Add.</li>
 <li>Select the Published checkbox. Click Update</li>
 <li>Select Is one of and check Story in the Node Type field. Click Update.</li>
 </ol>
</li>
<li><h3>Sorting to show most recent first</h3>
 <ol>
 <li>Scroll up to Sort criteria and click the + icon.</li>
 <li>In the Groups drop-down menu below, select 'Node', then check Node: Post date, and click Add. Alternatively, you may instead check Node: Last comment time, or Node: Updated/commented date, or Node: Updated date.</li>
 <li>Select Descending Sort order. Click Update.</li>
 </ol>
</li>
<li><h3>Refining the basic settings</h3>
 <ul>
 <li>In 1st column under Basic settings locate these options:
 <ul>
 <li>Items to Display setting, click 10. Change the '10' to '4'. Click Update</li>
 <li>Style setting, click Unformatted. Change to List. Click Update.</li>
 </ul>
 </li>
 </ul>
</li>
<li><h3>Adding a block display for custom options</h3>
 <ol>
 <li>In the dropdown on the left, ensure that Block is selected, and click Add Display.</li>
 <li>Under Block settings, click the None link next to the Admin setting. Change Block: Block admin description to 'Recent Stories'.</li>
 </ol>
</li>
<li><h3>Saving the view</h3>
Click Save to save your work.</li>
<li><h3>Instructing Drupal to show the block</h3>
Finally, you should tell Drupal to show this block. Configure your block by going to <a target="_blank" href="base_url:admin/structure/block">admin/structure/block</a>. Locate the block in the list: it is labeled Recent Stories. Place this block in a region and click Save. You may click Configure to set a different title, to determine which roles can view the block, and on which pages it appears; If you want your block on the front page only, enter '&lt;front&gt;'.</li>
</ol>