In this video, we'll create a menu item, configure access, add a header and footer and add a pager to our View.

I'll head back to the View

  • Go to "Structure => Views => Shop" (admin/structure/views/view/shop)

Page Settings

Page settings let us define the URL for this page, add a menu item and control access to this view.

  • Path: /shop (This is where we specify the URL for this page. Click "/shop" to change the URL from "shop" to your desired URL. I'll leave this set to "shop".)
  • Menu
    • Click "No menu"
    • [x] Normal menu entry
      • Title: Shop (This is the text that will be displayed for the menu item. ie: the <li>)
      • Description: Browse our shop (This is the text that will be displayed when you hover over the menu item.)
      • Menu: Main menu (This will list all of the menus configured on your site.)
      • Weight: 0 (A heavier weight (higher number) will display the item lower (in vertical menus) or further right (in horizontal menus). You can adjust this visually at any time in the menu settings.)
  • (Apply)

To check this menu, I'll click "Save" then go home in a new tab and see the Shop menu tab. When I click "Shop" I'm taken to the page we've created with Views. Let's go back to the view

  • Access - The last option for Page settings is Access. Access lets you define the users who can access the view. By default, anyone with the permission to "View published content" can access this view. For our example, let's say the shop is only available to site members. To accomplish this we will grant access to authenticated users.

(To see the list of permissions and roles, go to "People => Permissions" (I'll open it in a new tab). When we scroll down we'll the see "View published content" permission. The anonymous user, authenticated user and administrator roles all have permission to view published content, which means that these users also have the ability to access the "Product" view. To check this, I'll open the site in Safari and see that we still have access to the "Shop" page. Let's switch back to the other browser.)

To allow only authenticated user:

  • Access
    • Click "Permission"
    • [x] Role
    • (Apply (all displays))
      • Role: [x] authenticated user (By selecting authenticated user you are giving access to any user who can log into the site that also include the administrator role.)
  • (Apply(all displays))
  • (Save) (Save the view)

To check results, switch back to the other browser and refresh, we cannot see the "Shop" page or menu item.

Header

Back on our Views configuration page, the next option is “Header”. A header is text that will be displayed at the top of view.

  • Click "Add" (Here you’ll see a few options: Result summary, Text area, Unfiltered text and View area - which lets you display a View within this View. We’ll just add a basic text area.)
  • [x] Global: Text area
  • (Apply(all displays))
    • These are the products we have for sale.
  • (Apply(all displays))

When we scroll down to the live preview, we’ll see our header in action.

Footer

The footer is just like the header, but will be displayed at the bottom of the view.

  • Click "Add"
  • [x] Global: Text area
  • (Apply(all displays))
    • Thank you for visiting Modules Unraveled.
  • (Apply(all displays))

Now when we scroll down we’ll see both the header and footer in the live preview.

Pager

The next configuration option after Footer is Pager. The pager sets the number of results to be displayed per page. Our view is rendering a list using a full pager with 10 items per page. To change the default settings:

  • Use pager
    • Click "Full" (When you click “Full” you’ll see four options.)
      • Display a specified number of items - allows you to specify how many items will be displayed without a pager being rendered.
        • Offset - You can also choose an offset. One reason you might use an offset is if you have two view displays, one showing the most recent article as a teaser, and the second showing a list of all articles, only displaying their titles. You can set the list of all articles to skip the first one, since it's already displayed in the other view.
      • Display all items - displays all the items that meet the filter criteria.
        • Offset - You can also set an offset.
      • Paged output, full pager - Uses a pager with the previous and next options as well as the first and last options and displays clickable numbers to jump to a specific page. This one has quite a few options on it's options page.
        • Items per page: 3 - How many items to display
        • Offset - The number of items to skip
        • Pager ID - If you're experiencing an issue with multiple pagers on a single page, changing the ID here may resolve your issue, otherwise it's recommended that you leave this set to 0.
        • Number of pages - You can limit the results by the number of pages.
        • Number of pager links visible - This specifies the number of page numbers that are visible in the pager.
        • Tags - You can change the text used for the "first", "previous", "next", and "last" links.
        • Expose items per page - If this is checked, the user can determine how many items are shown per page. When checked, there are fields to set the label, and the "items per page options" (ie: 5, 10, 20 etc.)
        • Include all items option - This will add an "all items" option to display all items.
        • All items label - You can set the "all items" label
        • Expose Offset - If this is checked, the user can determine how many items should be skipped at the beginning.
      • Paged output, mini pager - Uses a pager with only the previous and next options. Displays current page number. ie: 1 of 6. Other than that, it has all of the same options as full pager.
      • [x] Paged output, full pager
    • (Apply(all displays))
    • Items per page: 3
  • (Apply(all displays))
  • (Save) (Save the view)

Scroll down to live preview and see that now have a pager that displays 3 items per page.

In the next video we'll take a look at our first advanced setting by adding a relationship.