Oregon State University

Random Image Block Part 3: Creating the View

Getting Started:

  1. To begin from the left sidebar navigation click the ‘Administer’ link.
  2. From the Administer page click the ‘Views’ link found under the ‘Site Building’ section.
  3. From the ‘Views’ page click the ‘Add’ link in the top of the content area.
    add view
  4. Now you are ready to create your view.

Basic Information:

  1. First enter a name for you view. The name must be unique to the view, and can only consist of alphanumeric values and underscores. Go ahead and give it a value of random_image.
  2. Since we want everyone to be able to see the image block we will leave the ‘Access’ option alone. If you wanted to restrict the blocks visibility to certain roles you would check them here.
  3. In the ‘Description’ field enter some text that describes what the view is for. This will only be displayed in the ‘Views List’.
    basic info

Setting up the Block View:

  1. For this tutorial we are going to be creating a block view so go ahead and skip everything in the page menu and expand the block menu.
  2. First check the ‘Provide Block’ option, this will tell Drupal to create a block to contain this view.
  3. In the ‘View Types’ dropdown choose the List option this will allow us to specify only specific pieces of the node that we want to show. We will define what pieces to display in just a moment.
  4. Give the view a title by entering a value that relates to your images into the ‘Title’ field. For this example I entitled my view, OSU Logos.
  5. In the ‘Nodes per block’ we will want to define how many nodes we wish to see at once. For our purposes we will set this to one because we only want the block to grab one random image at a time.
    block view info

Defining the Display, Filters, and Sort:

  1. Now skip down to the ‘Fields’ menu and expand it so you can see its’ options.
  2. Here is where we will define what pieces of the node are displayed in the list view.
  3. The first field we want to add is Node: Title, select this from the dropdown and then press ‘Add Field’.
  4. Next we will want to add the image for display as well. So from the dropdown find the image field we created when creating the custom content type. If you followed this tutorial the field was named image. So we want to select Image: Image (field_image) then press ‘Add Field’.
    Field settings
  5. Now scroll down to the ‘Filters’ section and expand it so that you can see the options available.
  6. Filters allow you to do just what they say, filter out content and display only the content that meets certain specifications.
  7. For our purposes we will set two filters. One to make sure the content is actually published and the second to filter out only the nodes that are of our specific content type.
  8. To create the first filter, find the Node: Published value from within the dropdown. Select it and press the ‘Add Filter’ button.
  9. For the second filter search through the dropdown again and find Node: Type select it and press the ‘Add Field’ button. Now once the filter is added to the filter list just above the dropdown you will see a few extra options for this last filter. By default the filter should be set as Is One Of for the first option so you can leave this alone. The second option however needs to be set to the custom content we created
    filters earlier. So in the case of the tutorial select Random Image. You are now done with the filters section.
  10. Now that the filters have been added the last thing we need to do in order to get the view setup is set the sort order to random to allow the view to randomly display an image.
  11. So scroll down to the ‘Sort Criteria’ menu and expand it so you can see the options available.
  12. From the ‘Add Criteria’ dropdown select the Random value and press ‘Add Criteria’.
    sort criteria
  13. Now press ‘Save’. All that’s left now is to activate and place the block that was created.

Activating and Positioning the Block:

  1. From the left sidebar navigation choose the ‘Administer’ link.
  2. From the ‘Administer’ page choose ‘Blocks’ from under the ‘Site Building’ section.
  3. You should now see a page containing a list of all your sites blocks. Search the ‘Deactivated’ section for the block that was created from your view. In the case of the tutorial it was named random_image.
    block disabled
  4. In the region dropdown for your block choose Content. Also give the block a weight of -10 to make it display at the top of the content.
    block values
  5. Press ‘Save Blocks’ and you are all set.
    block final
  6. Navigate to a page to see the block within the content area. Refresh your browser a few times and the images will cycle randomly.

 

Return to:
Random Image Block Part 1: Setting up the CCK
Random Image Block Part 2: Adding Content


Central Web Services, Oregon State University, Corvallis, OR 97331 · 541-737-1189
Contact us with your comments, questions and feedback
Copyright © 2007 Oregon State University | Disclaimer