Drupal How-To: Customize your Site's Mobile Look with Views - Step 1
This is the first step in a process outlined in my recent blog post: Drupal How-To: Customize your Site's Mobile Look with Views
In this process we're going to create a series of views that replace the normal display formats, so that they can replace the normal display when the site is being accessed via mobile device.
We're working with a site that has images (node type), which are organized into image galleries (node type), which are grouped together in different categories (taxonomy).
We'll be creating three views, and before we get too far we're going to need to know what path we plan to use for each. We will be customizing links within the views to use these views rather than normal displays, so a good first step is to make a note of what we're going to use for the path for each view.
In this example, the first view will be a view that displays categories of the image galleries, and it's intended for mobile display, so I'm going to use the base path "mgals". The second view will display an individual gallery, so I'll call it "mgal". And the last view is of an image, and we'll call it "mim".
Having settled on those, we'll jump right in to setting up the first view.
Set up your view as you would normally -- filter it by the node type and whether or not the nodes are published. Pick the fields you want to display. I'm using title, the body (limited to about 250 characters), and a cover image. The cover image requires a relationship to find the right image.
The teasers for the portfolios in that section normally would have links to the node -- but I need to redirect those. So, for each link in the view (both the title and the image, which also links to the node) I instead rewrite the link, using the URL path to my second view.
To make this link work, the view results need to include the node ID of the destination node, and I need to have that field selected BEFORE the I need the NID to complete my rewritten link.
This is something that can be very confusing the first few times you try to work with replacement patterns in views, so let me repeat it -- any data that you want to use as a replacement pattern in the view needs to be called BEFORE the data field in which you plan to use it.
Anyway, armed with the node ID and the path to my second view (wait, did we create that yet?) I can create the link that points to the second view, supplying the NID as an argument. So, in my example, I've created a link to "mgal/[nid]" where "mgal" is the base path to my second view, and "[nid]" is the replacement pattern for the node ID I've already called.
Do that for both the title and the image, and you're already well on your way. In the next step, we'll set up the view to handle the mobile display of the individual galleries.
