Add class to ul element in views 3 unformatted list using templates or module code?

Question

I'm contributing to the Radix theme in D7 for panopoly, which uses Twitter Bootstrap.

I'm seeking out ways to implement as many of twitter bootstrap's awesome capabilities as possible, and thus not have to rely on overriding theme css, and to make it work 'natively' and rely on cleaner CSS.

So, the 'unstlyed' list property in Twitter Bootstrap is a perfect example of this.

<ul class="unstyled">
  <li>...</li>
</ul>

However, I can't figure out how I would add this class to the views unformatted style by default using the theme. Is this possible with template files, template.php code or an include file? I would prefer to do this within the radix theme. Help!

Answer 1

You could use the rewrite option in views to get the exact html output you need. Rewrite enables you to override the output of this field with custom text or replacement tokens. I use the last field, since the replacement tokens should be above the field you are rewriting. Make sure to go through set the field, label, wrapper html to None

In Views

1. Click on a Field
2. Click on Rewrite the output of this field
3. Add your code with the desired html output

Code

<ul class="unstyled">
  <li>[field_degree]</li>
  <li>[field_major] </li>
</ul>

Output

<span class="field-item">
 <ul class="unstyled">
   <li>Certificate</li>
   <li>Supervision </li>
 </ul>
</span>

OR you can

1. Click Advanced
2. Click CSS class
3. Add the name of your class "unstyled" to the entire view.