6. Structure
by Chaz Chumley, Matt Glaman, Richard Jones, Nick Abbott
Drupal 8: Enterprise Web Development
- Drupal 8: Enterprise Web Development
- Table of Contents
- Drupal 8: Enterprise Web Development
- Credits
- Preface
- 1. Module 1
- 1. Introduction
- 2. Installation
- 3. Basic Concepts
- 4. Getting Started with the UI
- 5. Basic Content
- 6. Structure
- 7. Advanced Content
- 8. Configuration
- 9. Users and Access Control
- 10. Optional Features
- 11. Reports
- 12. Extending Drupal
- 13. Theming Drupal
- 14. Getting Support
- 2. Module 2
- 1. Up and Running with Drupal 8
- 2. The Content Authoring Experience
- 3. Displaying Content through Views
- 4. Extending Drupal
- 5. Frontend for the Win
- 6. Creating Forms with the Form API
- 7. Plug and Play with Plugins
- 8. Multilingual and Internationalization
- 9. Configuration Management – Deploying in Drupal 8
- 10. The Entity API
- 11. Off the Drupalicon Island
- 12. Web Services
- 13. The Drupal CLI
- 3. Module 3
- 1. Setting Up Our Development Environment
- 2. Theme Administration
- 3. Dissecting a Theme
- Setting up a local development environment
- Default themes versus custom themes
- Folder structure and naming conventions
- Managing configuration in Drupal 8
- Reviewing the new info.yml file
- The role of templates in Drupal
- Creating our first basic theme
- Introducing Twig
- Template variables
- The role of the theme file in Drupal
- Summary
- 4. Getting Started – Creating Themes
- 5. Prepping Our Project
- 6. Theming Our Homepage
- Creating our HTML wrapper
- Creating our homepage
- Implementing our Header Top region
- Implementing our Header region
- Adding a logo
- Enabling Site branding
- Printing our Header region
- Creating Block templates
- Implementing our search form block
- Placing our search form block
- Creating a search form block template
- Adding custom JavaScript
- Creating an input element template
- Working with menus
- Creating a menu template
- Creating System Menu block template
- Creating a sticky header
- Implementing our Headline Region
- Implementing our Before Content region
- Implementing the footer
- Summary
- 7. Theming Our Interior Page
- 8. Theming Our Blog Listing Page
- Reviewing the Blog Listing mockup
- Creating our blog listing
- Creating a Post Listing view
- Managing our Post Listing block
- Implementing our Node template
- Adding CSS classes to Twig
- Working with content variables
- Using the without filter
- Creating our post image slider
- Working with field templates
- Adding the Owl Carousel library
- Using Twig filters for dates
- Printing title and teaser
- Creating our post metadata
- Field templates and taxonomy
- Handling comments in Drupal 8
- Creating a theme file
- Creating a Categories block
- Managing our Categories block
- Implementing responsive sidebars
- Theming a Block template
- Drupal Views and Twig templates
- Managing popular versus recent content
- Adding the About Us block
- Summary
- 9. Theming Our Blog Detail Page
- Reviewing the Blog detail mockup
- Previewing our Blog detail page
- Creating a Post Full template
- Working with comments
- Implementing social sharing capabilities
- Summary
- 10. Theming Our Contact Page
- 11. Theming Our Search Results
- 12. Tips, Tricks, and Where to Go from Here
- A. Biblography
- Index
In this chapter, we will be looking at organizing the structure of content on your Drupal website. To start with, we'll look at menus before investigating taxonomy in more depth than in our earlier introduction. Finally, we will take a look at creating lists of data as pages and blocks using the Views module.
The representation of the structure of your site to a user will often be via menus. Here we will show you how to manipulate these menus so that you can help a user navigate your site.
As it stands, our Main navigation menu items are listed in alphabetical order:
However, we would like the items in the following order:
Home | Our Services | Our Clients | About us | News | Contact us
To edit the menu, visit the Menu management at Manage | Structure | Menus:
You will see a list of all the currently defined menus; try editing the Main navigation menu:
Use the 'drag handles' to reorder the menu items:
Rearrange the order and save so that your Main navigation menu appears like this:
Earlier, we made a dedicated Contact us Basic page and we linked it into the Main navigation menu at the same time. To illustrate the idea of editing menu items manually, let's point this menu item to the existing Contact form that was automatically provided to us by the Contact module instead of the Basic page.
Even though the menu item was created at the time of creating the page, we can easily overwrite the location that it points to. You may remember from Chapter 4, Getting Started with the UI, that the Contact module provides a contact form at http://drupal-8.dd:8083/contact.
Visit the Menu management page again by navigating to Manage | Structure | Menus | Main navigation.
In order to have the Contact us menu item point to the form instead of the Basic page, all you need to do is manually edit the menu item by clicking on the Edit button in the OPERATIONS column.
The Menu link title is simply the text attached to the menu item (1) but the Link, in our case the Contact us Basic page, is neatly disguised as the title of that targeted page with the nid in brackets afterward:
Edit the item's Link replacing the existing reference to your Contact page (the Basic page with a node ID of 6) with the replacement path of /contact, which is provided by the Contact module.
To manually enter a relative path such as this, precede the path with a forward slash (/).
Save your changes.
Since you are no longer linking the Main navigation menu to the Basic page you created in Chapter 4, Getting Started with the UI, we could remove that page but in fact, we'll keep it and use it later to demonstrate some other features.
-
No Comment