1-866-277-9958

Customizing the display of a node

Here is a 5-step process to have full control over the output of a node. This method lets you stay at the theme/display level and gives you full control over output without having to implement any hooks in a module. You'll often find that you can get the desired output without resorting to any PHP template or HTML coding using the first two steps.

First: Edit the order of fields

From the content type edit page, click on the Manage fields tab. The URL is admin/content/node-type/[mynodetype]/fields
From here, drag and drop the fields in the order you want them displayed.

Second: Modify node display settings

From the content type edit page, click on the display tab. The URL is admin/content/node-type/[mynode-type]/display

From here, you can choose from a variety of settings including choosing not to display fields, modifying the field label and selecting from a variety of displays that the field's CCK widget supports. You can customize both full node and teaser display.

Display Fields
Imagefield (shown above) supports a wide variety of display options including imagecache presets and lightboxing. No custom themeing required!

Third: Modify CCK field output

You can modify the HTML output for CCK fields by creating a tpl file. (In practice I find this very useful when I have node reference fields that need to be dereferenced but need to show only some fields of the dereferenced node. Step #2 allows for dereferencing and displaying teasers and full nodes.)

To modify CCK field output, copy content-field.tpl.php from sites/all/modules/cck/themes to your theme's base directory. Create and customize content-field-field_myfieldname.tpl.php for each CCK field you want to theme.

In your content-field-field_myfieldname.tpl.php file you have access to:

/**
 * @file content-field.tpl.php
 * Default theme implementation to display the value of a field.
 *
 * Available variables:
 * - $node: The node object.
 * - $field: The field array.
 * - $items: An array of values for each item in the field array.
 * - $teaser: Whether this is displayed as a teaser.
 * - $page: Whether this is displayed as a page.
 * - $field_name: The field name.
 * - $field_type: The field type.
 * - $field_name_css: The css-compatible field name.
 * - $field_type_css: The css-compatible field type.
 * - $label: The item label.
 * - $label_display: Position of label display, inline, above, or hidden.
 * - $field_empty: Whether the field has any valid value.
 *
 * Each $item in $items contains:
 * - 'view' - the themed view for that item
 *
 * @see template_preprocess_field()
 */

Fourth: Modify Node Template

Create a file called node-mynodetype.tpl.php. This file overrides node.tpl.php.
If you use Zen, your node-mynodetype.tpl.php file will have access to the following. If you do not use Zen, you have have access to a subset of the following:

/**
 * @file node.tpl.php
 *
 * Theme implementation to display a node.
 *
 * Available variables:
 * - $title: the (sanitized) title of the node.
 * - $content: Node body or teaser depending on $teaser flag.
 * - $picture: The authors picture of the node output from
 *   theme_user_picture().
 * - $date: Formatted creation date (use $created to reformat with
 *   format_date()).
 * - $links: Themed links like "Read more", "Add new comment", etc. output
 *   from theme_links().
 * - $name: Themed username of node author output from theme_user().
 * - $node_url: Direct url of the current node.
 * - $terms: the themed list of taxonomy term links output from theme_links().
 * - $submitted: themed submission information output from
 *   theme_node_submitted().
 *
 * Other variables:
 * - $node: Full node object. Contains data that may not be safe.
 * - $type: Node type, i.e. story, page, blog, etc.
 * - $comment_count: Number of comments attached to the node.
 * - $uid: User ID of the node author.
 * - $created: Time the node was published formatted in Unix timestamp.
 * - $zebra: Outputs either "even" or "odd". Useful for zebra striping in
 *   teaser listings.
 * - $id: Position of the node. Increments each time it's output.
 *
 * Node status variables:
 * - $teaser: Flag for the teaser state.
 * - $page: Flag for the full page state.
 * - $promote: Flag for front page promotion state.
 * - $sticky: Flags for sticky post setting.
 * - $status: Flag for published status.
 * - $comment: State of comment settings for the node.
 * - $readmore: Flags true if the teaser content of the node cannot hold the
 *   main body content.
 * - $is_front: Flags true when presented in the front page.
 * - $logged_in: Flags true when the current user is a logged-in member.
 * - $is_admin: Flags true when the current user is an administrator.
 *
 * @see template_preprocess()
 * @see template_preprocess_node()
 */

Final: Add CSS and JS as needed

Use drupal_add_css() and drupal_add_js() in node-mynodedtype.tpl.php to insert CSS and JavaScript.


Get Drupal help when you need it most! Find hundreds of great tutorials. Track, rate, comment and more. Create Account

Hi Dustin, I'm wondering how

Hi Dustin,

I'm wondering how can one tell drupal when to display the node's teaser and when to display the full node? Can it be done without using views?

I'm trying to display a node's teaser via iframe and display the full node when clicking on a link in the teaser.

In normal php I would do this by using a GET variable in the iframe's URL and process that variable in a case statement in the iframed script to determin how to display this and that. In drupal, it doesn't seem that simple.

Am I even on the right track thinking-wise?

usefull thanks Stationery

Great Stuff

I agree as well. Thanks for the useful codes.

araba oyunları Giochi per Ragazze Car Games dress up games

I did applied this

Code Useage

I did applied this code. Was usefull thanks for your informative post.

Re:

There should be no reason to use the iframe. I think you are going down a wrong path in considering iframe.
live scores online--soccer live score--latest scores---soccer live score

Thanks a lot for the post :)

Thanks a lot for the post :)

good article! One Question

To customize node.tpl.php
i have followed these steps.
1.created node-[content type].tpl.php
2.Displayed the required node details from $node array.

But now i have one question

I have installed five star module which is not communicating with my node view page.Because i have not used $content directly.

If i have used $content i am not getting my design.

Can you suggest me what i have to do to get my design and have a communication with drupal i.e getting fivestar status.

Please suggest me.This is very important for me.

I'm marveling how trust

I'm marveling how trust onliest tell drupal when to splurge the node's teaser again when to ostentatiousness the roomy node? Can undoubted steward done without using views?

I'm unyielding to spectacle a node's teaser via iframe besides an act the mammoth knot when clicking on a span connections the teaser. SEO Services

In representative php I would effect this by using a GET adjustable spell the iframe's URL again dash that convertible esteem a quotation statement spell the iframed script to determin how to layout this besides that. In drupal, unaffected doesn't seem that simple.

thank you for sharing. liseli

thank you for sharing. liseli

May i ask a question?

In normal php I would do this by using a GET variable in the iframe's URL?

Great Post... have a couple questions.

Hi Dustin,

I'm wondering how can one tell drupal when to display the node's teaser and when to display the full node? Can it be done without using views?

I'm trying to display a node's teaser via iframe and display the full node when clicking on a link in the teaser.

In normal php I would do this by using a GET variable in the iframe's URL and process that variable in a case statement in the iframed script to determin how to display this and that. In drupal, it doesn't seem that simple.

Am I even on the right track thinking-wise?

@Elliott There should be no

@Elliott

There should be no reason to use the iframe. I think you are going down a wrong path in considering iframe.

Depending on your use, I'd consider using the functions (whether or not you want to invoke hooks) node_view() or theme('node and call the content in the teaser or full body as needed using those functions.

Syndicate content

©1999 - 2011 LevelTen Interactive - Dallas, TX