How Do I Style An Email Field in Drupal?

Question

I have a list of Staff Members in Drupal6.

I need to style a node such that the email field of a staff member displays as "Contact [First word of Full Name field]". Clicking it causes a mailto:// link to open. BTW, I know that's not a recommended procedure because a contact form or a captcha would be more effective, but my client desires it.

Yes, I'm using the CCK module and the CCK Email module too.

So, again, I have a list of staff members using a custom content type. I have an email field in there using CCK Email module. When I display the node of a staff member, it's just showing the email address. My client wants to make it say "Contact Jonathan" if the staff member is named "Jonathan McDaniels", and so on with each node of each staff member. When "Contact Jonathan" or "Contact Sara" is clicked, it should do the ordinary mailto:// hyperlink stuff.

Answer 1

To resolve this problem purely inside of Drupal without your own PHP code, you will need these modules in Drupal 6:

1. CCK Module
2. CCK Link Module
3. CCK Token Module

Unfortunately the CCK Email Module won't solve this problem.

Once copied into sites/all/modules and activated, you can then take your custom content type for Staff Member and create a field Staff Email as a type of "Link". Then, set the Title of that link to Static Title and set the text to:

Contact [title]

In the Default Value, set Staff Email URL to:

mailto:[email protected]

And set the Help Text to explain the default format requirement. Note if they enter this wrong without the mailto:, then the link will end up being passed off as a node, which is incorrect. Perhaps someone can think of a hook to test for this on this field in the PHP (or Javascript on form load) and swap it on the fly if forgotten.

Now, for only using the first name instead of the full name, you have a couple choices. You can use field_staff_firstname and field_staff_lastname (custom text fields you create) and not use the node's title (aka [title] token). Another route is to hook the page in PHP or with Javascript on form load, looking for this node element, intercepting it, and showing only Contact + first name.

Answer 2

Yet another way to do this is with PHP. You can create a file node.tpl.php in your theme folder, copying this over from the garland theme. At the top of it, however, add this call:

require_once('node_hooks.php');

Now create a file node_hooks.php in your themes folder. This gives you enormous power now over a given node. You should start to learn the $node variable by doing this in your node_hooks.php file:

<?php
    print_r($node);

Refresh your node page and then do a View Source in your browser on it. This will show you the object and each array element inside $node.

In my case I had a node of type 'staff' because that's what I called it when creating it. I also had a special CCK field called CCK Email and used it to create a field named field_staff_email. This was storing a value like [email protected]. So, because of this, I could add this into my node_hooks.php file to do the search and replace on the content so that I get "Contact Jonathan" instead of the email address:

<?php

if ($node->type == 'staff') {
    adjustStaffContactField($node, $content);
}

function adjustStaffContactField(&$node,&$content) {
    $asWords = explode(' ',$node->title);
    $sContact = htmlentities(strip_tags($asWords[0]));
    $sContact = trim($sContact);
    $sContact = "Contact $sContact";
    $sLink = $node->field_staff_email[0]['email'];
    $sContact = "<a href='mailto:$sLink'>$sContact</a>";
    $sLookingFor = "<a href=\"mailto:$sLink\">$sLink</a>";
    $content = str_replace($sLookingFor, $sContact, $content);
}

Answer 3

Hi there,

I had the same problem of trying to turn a cck field into a mailto link. I found this posting but have found another, and fairly simple way, of doing it. It is done by overriding the cck theme template: content-field.tpl.php. This is the template which outputs the field values, so you can edit this to update the value you want. Copy the template into your own theme folder (don't overwrite the original), I then replaced the line:

          <?php print $item['view'] ?>

(This was line 42 in my template), with:

             <?php
         // new lines for email field to turn it into a mailto link
         ?>
         <?php if ($field_name=='field_email') : ?>
            <?php // print_r($item);?>
            <?php print "<a href='mailto:" . $item['value'] . "'>". $item['value'] ."</a>"; ?>
        <?php else : ?>
        <?php
        // original line
        ?>
      <?php print $item['view'] ?>
        <?php endif; ?>
        <?php
        // end edit
        ?>

In this example, my field was called "field_email"

Hope this helps.

Ben