Creating a CCK and Views powered Drupal site » Using Views module to create a "listing" of Articles » Set up the "Articles" View
The next step is to set up a new View using Views module, to generate a list of the latest Articles, making use of the fields that were set up in the Article content type. Of course, Views module can export/import Views, but going through the full process below will help you learn how Views works so you will be able to work with it and create your own custom Views.
Initial setup/configuration of your “Articles” View
- Go to Administer > Site Building > Views (admin/build/views) and click “Add” at the top.
- For View name enter:
articles. Optionally add a short View description for your own reference, and a View tag ofarticleto help you find the View in the future. Leave View type set toNode. Press “Next” to continue.
Configure the “Default” settings
Views version 2 now offers the ability to define multiple “Displays” for a single View, each of which can present the same View in a different way.
The first thing to do when creating a new View is to set up the Defaults configuration. The options you set for Defaults apply to all other custom Displays you create later. However, all of the options set for Defaults can be overridden with your own custom settings by each Display. This saves you time by defining some or all of the settings that will be shared by every Display.
Views configuration for “Defaults”: Basic settings
- Begin by clicking the link for Basic settings > Title, and in the field that dynamically appears, enter
Articles. Press the “Update” button to save the new setting. - Next click the link for Basic settings > Use pager, select the
Full pageroption, and press the “Update” button.
Views configuration for “Defaults”: Fields
- Next, on the Fields configuration block, press the + icon to bring up the option to begin adding new Fields to the View. Scroll down the list and add a check for the following items:
Content: Text: Article Teaser (field_article_teaser_text)Node: Post dateNode: Title- Note: Add only the above fields… you may notice a field called “Node: Teaser” but that is not the one you need to add. Also be sure not to add the other custom field that you created earlier, field_article_subtitle, since it is not needed in the View.
- Click the “Add” button and you will then be presented with a sequence of configuration screens (one after the next) allowing you to customize the settings for each individual field you just added. After configuring each field, press the “Update” button to proceed to the next field’s configuration:
- For Content: Text: Article Teaser change the Label option to
None. - For Node: Post date delete the text from the Label field so that it is blank and adjust the Date format option if you wish to. For instance, if you’d like the date displayed similar to July 4, 2008 (leaving out the time of day), set the Date format to
Customand enter the Custom date format asF jS, Y. - For Node: Title delete the text from the Label field so that it is blank and check the
Link this field to its nodeoption.
- For Content: Text: Article Teaser change the Label option to
- Again on the Fields configuration block, click the up/down arrow icon, which allows you to rearrange the order of the fields. Simply drag the fields into the correct order (e.g. Title, Post date, and Article Teaser), and press “Update”.
Views configuration for “Defaults”: Sort criteria
- Click the + icon in the Sort criteria configuration block. Scroll down the list and add the
Node: Post dateitem. In the following screen chooseDescendingfor the Sort order and press the “Update” button.
Views configuration for “Defaults”: Filters
- Click the + icon in the Filters configuration block. Scroll down the list and add the following filters:
Node: PublishedNode: Type
- Click the “Add” button and customize the settings for each field. After configuring each field, press the “Update” button to proceed to the next field’s configuration:
- For Node: Published check
Published(which ensures only content that is marked as Published will be shown). - For Node: Type put a check next to
Articleunder “Node type”.
- For Node: Published check
Create the “Page” Display
You will be creating two custom Displays: the first, a “Page” Display, which will be a full-size listing of the articles, and a second “Block” Display, which will be a small sub-listing of article teasers which will be placed in the sidebar of the site (or on your home page). So let’s begin first with the “Page” Display:
- Near the top left, with the dropdown menu set to
Page, click on the “Add Display” button. A new tab with the name “Page” will appear below the Default Display.
Views configuration for “Page”: Basic settings
- Since you can have as many different Displays as you want, it’s a good habit to always add a custom name to each Display you make so that you can keep them organized (these names are for your own reference and are not displayed publicly). Begin by clicking the link for Basic settings > Name, and in the field that dynamically appears, change the name to
Page: Articles. Press the “Update” button, and then press the “Save” button at the bottom of the Views interface to save the View - you should now see that the Page Display is now named Page: Articles (Display name changes aren’t updated until you save the View). Click on the new Page: Articles tab to make it the active tab again.
Views configuration for “Page”: Page settings
- Click the link for Page settings > Path, and enter the URL you want the full article listing page to have (e.g. enter
articlesif you want the URL to be example.com/articles). Press the “Update” button. - Optional step:
If you’d like to add the Articles page to your site’s menu, click the link for Page settings > Menu. Select theNormal menu entryoption, enter the menu item title in the field (e.g.Articles), and press the “Update” button. Menu items generated by Views modules appear by default in Drupal’s Navigation menu. You can adjust this (e.g. to move it to your Primary Links menu) though you MUST first save your View before navigating away from it. Go to Administer > Site building > Menus > Navigation (admin/build/menu-customize/navigation), locate the name of your menu item, click edit, and choose thePrimary linksmenu under the “Parent item” option.
Create the “Block” Display
Now you’ll create the second Display, this time as a “Block” type, which will be a small sub-listing of article teasers which will be placed in the sidebar of the site (or on your home page):
- Near the top left of the page, change the dropdown menu setting to
Block, and click on the “Add Display” button. A new tab with the name “Block” will appear below the Default and Page: Articles Displays.
Views configuration for “Block”: Basic settings
- Again, it’s wise to give every Display a unique name. Click the link for Basic settings > Name, and in the field that dynamically appears, change the name to
Block: Articles. Press the “Update” button, and then press the “Save” button at the bottom of the Views interface to save the View. Click on the new Block: Articles tab to make it the active tab again. - Click the link for Basic settings > More link, and click on the “Override” button, which makes this setting apply to this Display only and none of the others (if you intend to Override a setting, always click the “Override” button immediately before you make any changes to the settings). Check the option for
Create more link, and press the “Update” button.Note: Since the “More link” option only applies to Block Displays, you could turn this setting on in the Defaults Display - however it’s included in this way here as at least one example of using the Override feature of Views Displays. You can use this feature to do all kinds of interesting things within a single View, including adding specific fields, filters, and arguments to one Display of the View, and completely different ones to a different Display (thereby creating a separate Display that is based on the same underlying Default values, but otherwise an entirely different View).
Your View is now complete
The View and its Displays are now complete. However, you can return to edit and adjust the View at any time.
Ensure that you click the “Save” button for the View (make sure you see the “The view has been saved” message at the top of the screen). Pay a visit to http://www.example.com/articles to see the output of the Page: Articles Display you’ve created.
When you’re ready proceed to the next section of the guide, where you will activate the Block: Articles Display to be used in the sidebar of your site.
When saving the page display for the first time, one gets the error
Display Page: Articles uses path but path is undefined. I think you’d better rearrange the article, by setting the path before saving. ;-)Congrats for your work.
Ciao, Giovanni
ps. you can delete this comment when you’ll publish the article.
There’s also a trimmed note when talking about the override feature.
Anyway, I’ve just had to reinsert my data (name, email, homepage) to post a new comment.
It could be useful if it would automatically “recognize” me. I’m using Chrome at the moment.
Ciao, Giovanni
Thanks very much for catching those. I will repeat creating the View myself and come up with an improved procedure to avoid the error if possible. I also will add a note near the beginning informing the reader that it is possible that Views may occasionally mention errors or problems during setup but that they are generally “ok” (as in, not an emergency or something they necessarily did wrong) so long as they resolve them before calling the View “complete” :) I think it will be best to mention this up front just so that a newbie with Views is not alarmed when they see an error/warning.
As for the note, I’ll look at what I was trying to say there and pick up where I left off haha
And yes, the feedback from comments will be used to improve the article to “perfection” :) They won’t be kept ultimately once the article’s published. After completion, this article will be posted as a Tutorial on Drupal.org (I’m writing here initially however, because the tools on Drupal.org are insufficient for my writing workflow).
I will look into any improvements that might be possible for Anonymous comments on this site. In the mean-time feel free to register an account if you’d like.
David, I can’t see any form to login/create an user. :P
As anonymous user, I can see only “Recent posts” in the Nav menu.
I “betted” you was using Durpal ;-), manually pointed to user/register, and created a new account.
However, I’m still waiting for the activation email. I hope someday I’ll receive it. ;-)
Greetings, Giovanni
Ah, forgot that once I adjusted comment settings a while back it no longer says “Log in or register to post”. I’ll put a link up.
So far as the activation email, it should have arrived. I checked the server’s mail queue and it is empty. I made a test account just now and the activation email arrived immediately. I’ll look into why it didn’t arrive for you, and in the mean time manually activate your account.
Edit: the only new account has this as the domain: @libero.it … I have an entry in my mail error log that says the domain does not exist. I have set the password for your account to 1a234b - please go ahead and log in and change it to your preference as soon as possible, and update your email if needed. Thanks!
Hmm, the domain is correct.
As you can see, libero.it does exist.
Libero Infostrada is one of the most important Italian ISP.
I don’t know why your [domain] ISP says it doesn’t exist.
Anyway, I logged in and changed the password.
Now, don’t call me pedant :-D, but when I tried to upload an image for my profile, it said:
The selected file /tmp/tmp_R2nAQq could not be uploaded, because the destination files/pictures/picture-9.jpg is not properly configured.Failed to upload the picture image; the pictures directory doesn't exist or is not writable.
Give a look here, if needed.
Ciao :-), Giovanni
Hm odd, my mail server setup is definitely not up to spec so it is likely its fault. Thanks I will look into it. I haven’t spent very much time refining the Drupal installation on this site yet, as I’m just using it as a “public writing tool” at this point. I’ll see why it gave that error (odd since I just added a user picture for my own account for the first time the other day and it seemed to work… I’ll check it out). Thanks for reporting the bugs to me :)
I have been experiencing the same issue with Drupal and emails. If you are on a shared host it is likely that your mail settings are not ideal for Drupal.
This helped me http://drupal.org/node/67202
But it seems many have had similar issues setting up mail. For me mail was the black hole I didn’t know anything about, i still don’t know much but have learnt a bit.