User login

Adding CSS IDs and anchor name fragment to a node title in teaser lists

I want to be able to have a link to http://example.com/big-ol-teaser-list-of-drupal-nodes#node-123 so I go to the right space on the page.

I would say what Drupal version I'm using, but I'm ashamed to say it's 4.7.

Current status: I'm switching to Joomla. OK, seriously, the only way to do this is through the theme. See very bottom of this page (that's an example of the within-page kind of link we're talking about, in Agaric's case we want to use it to go to a specific place on pages we're not currently on).

Not exactly...
HOWTO: Hide the node title on a page
http://drupal.org/node/138910

You can hide node titles by specific node type by adding some code to your template.php file [...] in the _phptemplate_variables() function.

drupal node title anchor text

All links are anchors in HTML lingo, so the text I'm talking about that follows a # (pound or number sign) must be called something else.

Drupal calls them fragments. So I want the titles of nodes on teaser lists (including views-created lists -- basically, everywhere) to include an identifying fragment (node number such as #123, title such as #node-title).

This is described in XHTML as a named anchor – which apparently does not need a name="123" convention in the "a" tag but simply a id="123" which we use all the time for CSS anyway.

http://cnx.org/content/m14051/latest/#links

First, we need to place a marker at the location to which we wish our link to go. Next, we need to specify the link to that marker. This marker is often called a "named anchor." Some HTML generators will also call it a "bookmark."

The code shown on line 49 of Figure 10 shows the XHTML code associated with specifying the marker/named anchor.

Notice the name and id attributes, both with the same values. The older versions of this tag use the name attribute and later versions use the id attribute. If you use only one, the id attribute is recommended.

Drupal 4.7 does not put an anchor name, mark, fragment, or CSS identification element for node titles in teaser lists:

<h2><a href="/auction2007/node/527" title="&quot;Angel Fish&quot; - Oil Painting">&quot;Angel Fish&quot; - Oil Painting</a></h2>

xhtml a tag link specification

I put this link here because despite the title, "Anchor as option | drupal.org" "url (drupal build link html code"... it has nothing to do with anchors on node titles. http://drupal.org/node/65917 Not relevant.

Contributing a simple new module. Already did all the online searching I could think of, so the next step is Drupal's IRC channels.

First try #drupal-support:
Has anyone run across a way to add anchor identifiers (name, id, #) to the titles of teasers in node listings?
I want to be able to have a link to http://example.com/big-ol-teaser-list-of-drupal-nodes#node-123 so I go to the right space on the page.

Agaric, through the painstaking investigative mechanism of adding a print statement to the hook_nodeapi implementation 'view' operation, established that the title parameter of the $node object is text only– no HTML to mess with.

function zing_auction_nodeapi(&$node, $op, $teaser = NULL, $page = NULL) {
  switch ($op) {
    case 'view':
print '<pre>' . $node->title . '</pre>';
[...]
}

Agaric further established, through the equally painstaking process of typing the following Drupal API URL directly (not recommended, if you do this check the tab to make sure you are Drupal 5)

http://api.drupal.org/api/function/node_view/5

That node_view does not control the output of the node title.

Instant Correction(TM): a quick look at node_page_default, which displays the front page and seems to be one of a very few places in core that calls node_view for the purpose of a simple listing of teasers, indicates that the title is most definitely not displayed there.

So another look at node_view takes us to:

node_build_content

This is getting disconcerting because I don't see a linked title added in theme_node either.

Yet with this we establish conclusively that the title for teasers is not being made into a link in the node object as available to nodeapi view:

function zing_auction_nodeapi(&$node, $op, $teaser = NULL, $page = NULL) {
  switch ($op) {
    case 'view':
print '<pre>';
print_r($node);
print '</pre>';
[...]
}

Let's turn to #drupal itself
This is a question about module development in Drupal 5/4.7

... still wandering around Drupal API.

Dog-glab-blaned-gatsadoeu aoeuxbaoseutdhau ntasoduisaouh!!!!

I think I know what's going on here.

Linking the title of a node in a teaser list to its full node is not done in Drupal core - not in the module code anyway.

It is instead done in any theme worth its salt. And not even by overriding a themable function? But by the template system.


<?php if ($page == 0): ?>
<h2><a href="<?php print $node_url ?>" title="<?php print $title ?>"><?php print $title ?></a></h2>

What I want to mess with is the variable $node_url.

A search for
node_url site:api.drupal.org
and a little digging

And we find theme.inc for Drupal 6 in the function template_preprocess_node:

$variables['node_url'] = url('node/'. $node->nid);

But what about Drupal 5 and 4.7?

There is no template_preprocess_node function.

Damn thing is in phptemplate_node.

http://api.drupal.org/api/function/phptemplate_node/5

So back to #drupal with a much more specific question:

ben-agaric: This is a question about module development in Drupal 5/4.7. Is it possible to override a variable defined in phptemplate ( http://api.drupal.org/api/function/phptemplate_node/5 ) from a module?

ben-agaric: This is a question about module development in Drupal 5/4.7. Is it possible to override a variable defined in phptemplate ( http://api.drupal.org/api/function/phptemplate_node/5 ) from a module?

And then I realize I don't want to override node_url at all. I want to add an element to the a tag, which is different.

ben-agaric: Correction: I want to add an element to the a tag, so I guess there's no way to do it but in the theme.

At least I clean up after myself.

Current approach:

<?php if ($page == 0):
$anchor_id = ' name="node-' . $nid . '" id="node-' . $nid . '" ';
?>
<h2><a <?php print $anchor_id ?> href="<?php print $node_url ?>" title="<?php print $title ?>"><?php print $title ?></a></h2>

There's a lot of aspects to consider in linking back to this-- did I come from a list or a single page, how do I know which listing I came from, what about paged views (this breaks comment id links for instance).

But we've finally got a start. Dang me and my module-centric approach.

Searched words: 
drupal theme node titles for teasers drupal add anchor to node links on front page, views, and lists

Comments

Adding CSS IDs and anchor name fragment to a node title in

Ηey I κnοw thіs is off topic but I ωas wondeгing
іf you knew of any widgets І
cοuld аdd to my blog thаt automatісаlly tweet my newest
twіtter updаtes. Ӏ've been looking for a plug-in like this for quite some time and was hoping maybe you would have some experience with something like this. Please let me know if you run into anything. I truly enjoy reading your blog and I look forward to your new updates.

Feel free to visit my weblog; Arlie

Post new comment

The content of this field is kept private and will not be shown publicly.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • You can use Markdown syntax to format and style the text. Also see Markdown Extra for tables, footnotes, and more.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
  • Syntax highlight code surrounded by the {syntaxhighlighter SPEC}...{/syntaxhighlighter} tags, where SPEC is a Syntaxhighlighter options string or "class="OPTIONS" title="the title".
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.