Views - Adding row id instead of row class

Posted by ulfurr on November 7, 2012 at 10:38am

I am using jquery tabs which displays the active list item <li> based on its ID.

I would like to use Views to produce the content.

In the Views UI, FORMAT > SETTINGS there is an option, ROW CLASS that gives the option of adding class to each row. With the help of the Replace patterns there is the possibility to name the class based in each row based on its Node ID i.e:

Row class:
somedandyclassname-[nid]

This would give the HTML list item output of:

<ul>
  <li class="somedandyclassname-1">Every</li>
  <li class="somedandyclassname-2">Breath</li>
  <li class="somedandyclassname-3">You</li>
  <li class="somedandyclassname-4">Take</li>
..etc
</ul>

And its all dandy but.

What I would like to see is ID selector instead. Like this:

<ul>
  <li ID="somedandyIDname-1">Every</li>
  <li ID="somedandyIDname-2">Move</li>
  <li ID="somedandyIDname-3">You</li>
  <li ID="somedandyIDname-4">Make</li>
..etc
</ul>

Is this to hard to handle in the Views UI?

Thanks for reading and your effort if it applies

-Ulfurr

Comments

Views templates

Posted by spovlot on November 7, 2012 at 5:12pm

You can use Views theme templates to modify the HTML output and add your id attribute. You can find information about this in the Views Advanced Help. Under the Advanced section, you will find Theme: information. This link will show you possible file name for templates and a sample content of that file. You probably want to copy and modify the "Style output". You can put your custom template in your own theme directory. You probably want a name like "views-view-list--your-view--page.tpl.php"

Re: Views templates

Posted by ulfurr on November 8, 2012 at 9:51am

spovlot: Thank you for your advice.