Search code examples
drupal-7drupal-theming

Prev/Next node navigation with a thumbnail in a full node


I've been trying to figure this out and make it work, but as I'm not a programmer, just a designer with limited coding knowledge I've been hitting a wall on this one.

I'm making my own photo gallery and I would like to display two previous or next images as linked thumbnails. I've found this script that works and shows textual links, but don't know how to adapt it to my needs.

template.php

<?php
function dad_prev_next($current_node = NULL, $op = 'p') {
    if ($op == 'p') {
        $sql_op = '<';
        $order = 'DESC';
    } elseif ($op == 'n') {
        $sql_op = '>';
        $order = 'ASC';
    } else {
        return NULL;
    }

    $output = NULL;

    $sql = "SELECT n.nid, n.title
             FROM {node} n
             WHERE n.nid $sql_op :nid
             AND type IN ('photos')
             AND status = 1
             ORDER BY nid $order
             LIMIT 1";
    $result = db_query($sql, array(':nid' => $current_node -> nid));
    foreach ($result as $data) {
    }
    if (isset($data)) {            


        if ($op == 'n')            
            return l("Next", "node/$data->nid", array('html' => TRUE));
        else if ($op == 'p')
            return l("Previous", "node/$data->nid", array('html' => TRUE));
    }
}
?>

node.tpl.php

<?php print dad_prev_next($node,'p') . " / " . dad_prev_next($node,'n'); ?>

Working example

This one shows two previous/next images as it was designed

template.php

function dad_prev_next($nid = NULL, $op = 'p', $start = 0) {
    if ($op == 'p') {
        $sql_op = '>';
        $order = 'ASC';
    }
    elseif ($op == 'n') {
        $sql_op = '<';
        $order = 'DESC';
    }
    else {
        return NULL;
    }

    $output = '';

    // your node must have an image type field
    // let's say it's name is IMAGEFIELD
    // select from node table
    $query = db_select('node', 'n');
    // join node table with image field table
    $query->leftJoin('field_data_field_photo', 'i', 'i.entity_id = n.nid');
    // join file managed table where all data about managed files stored
    $query->leftJoin('file_managed', 'f', 'f.fid = i.field_photo_fid');
    $query
        // select nid and title from node
        ->fields('n', array('nid', 'title'))
        // select uri from file_managed (image path)
        ->fields('f', array('uri'))
        // select image alt and title
        ->fields('i', array('field_photo_alt', 'field_photo_title'))
        // where nid "greater than"/"lower than" our current node nid
        ->condition('n.nid', $nid, $sql_op)
        // where node type in array('your content types')
        ->condition('n.type', array('photos'), 'IN')
        // where node is published
        ->condition('n.status', 1)
        // where requested node has image to display (if you want thumbnail)
        ->condition('f.uri', '', '!=')
        // order by nid
        ->orderBy('n.nid', $order)
        // limit result to 1
        ->range($start, 1);     

    // make query
    $result = $query->execute()->fetchAll();

    foreach ($result as $node) {
        // theme your thumbnail image
        $variables = array(
            // default image style name `thumbnail`
            // you can use your own by following
            // admin/config/media/image-styles on your site
            'style_name' => 'square_small',
            'path' => $node->uri,
            'alt' => $node->field_photo_alt,
            'title' => $node->field_photo_title
        );
        $image = theme('image_style', $variables);

        $options = array(
            'html' => TRUE,
            'attributes' => array(
                'title' => $node->title
            )
        );
        $output = l($image, "node/{$node->nid}", $options);
    }

    return $output;
}

node.tpl.php

<?php print dad_prev_next($node->nid, 'p', 1); ?>
<?php print dad_prev_next($node->nid, 'p', 0); ?>
<?php print dad_prev_next($node->nid, 'n', 0); ?>
<?php print dad_prev_next($node->nid, 'n', 1); ?>

Solution

  • template.php

    function dad_prev_next($nid = NULL, $op = 'p', $qty = 1) {
        if ($op == 'p') {
            $sql_op = '<';
            $order = 'DESC';
        }
        elseif ($op == 'n') {
            $sql_op = '>';
            $order = 'ASC';
        }
        else {
            return NULL;
        }
    
        $output = '';
    
        // your node must have an image type field
        // let's say it's name is IMAGEFIELD
        // select from node table
        $query = db_select('node', 'n');
        // join node table with image field table
        $query->leftJoin('field_data_field_IMAGEFIELD', 'i', 'i.entity_id = n.nid');
        // join file managed table where all data about managed files stored
        $query->leftJoin('file_managed', 'f', 'f.fid = i.field_IMAGEFIELD_fid');
        $query
            // select nid and title from node
            ->fields('n', array('nid', 'title'))
            // select uri from file_managed (image path)
            ->fields('f', array('uri'))
            // select image alt and title
            ->fields('i', array('field_IMAGEFIELD_alt', 'field_IMAGEFIELD_title'))
            // where nid "greater than"/"lower than" our current node nid
            ->condition('n.nid', $nid, $sql_op)
            // where node type in array('your content types')
            ->condition('n.type', array('photos'), 'IN')
            // where node is published
            ->condition('n.status', 1)
            // where requested node has image to display (if you want thumbnail)
            ->condition('f.uri', '', '!=')
            // order by nid
            ->orderBy('n.nid', $order)
            // limit result to $qty
            ->range(0, $qty);
    
        // make query
        $result = $query->execute()->fetchAll();
    
        foreach ($result as $node) {
            // theme your thumbnail image
            $variables = array(
                // default image style name `thumbnail`
                // you can use your own by following
                // admin/config/media/image-styles on your site
                'style_name' => 'thumbnail',
                'path' => $node->uri,
                'alt' => $node->field_IMAGEFIELD_alt,
                'title' => $node->field_IMAGEFIELD_title
            );
            $image = theme('image_style', $variables);
    
            $options = array(
                'html' => TRUE,
                'attributes' => array(
                    'title' => $node->title
                )
            );
            $output = l($image, "node/{$node->nid}", $options);
        }
    
        return $output;
    }
    

    node.tpl.php

    <?php print dad_prev_next($node->nid, 'p', 2); ?>
    <?php print dad_prev_next($node->nid, 'n', 2); ?>