By redvespa on

I'm thrilled to have found the Views module. It solves a few headaches I've been having trying to learn all of drupal in one go.

I'm messing with some content and I want a very limited view in a block (I only want title and body) only View type "List View" and "tables" lets you limit fields so I'm going with List View as I don't want tables. The thing it adds content as Unordered lists, thus creating indents and bullets where I don't want them.

I'm pretty new to all this, but I can't find anywhere in the module which adds in the tags ul and li. I hope I can find what ever is doing it and either turn it off, or rip it out.

i.e
instead of
========

  • New Thing

    • The body of the thing

  • Another New Thing

    • Body of that thing

I really want
==========

New Thing

The body of the thing

Another New Thing

Body of that thing

Can somebody point me to the code which is adding the tags, and any suggestions about dealing with it.

Thanks muchly

⋅ Categories: Drupal 4.7.x

Comments

eliza411’s picture

eliza411 commented

You should be able to look at the source code and use your stylesheet (located in themes/themefolder) to control how it's displayed.

Adding something like

ul {
list-style-type: none;
}

except you'll need a class or id to make it specific.

redvespa’s picture

redvespa commented

I get what you are saying, stop it at the style sheet. I still don't understand where it was being added in the first place though.

Also, what gets generated by the views module ends up looking like this

<div class="content">
<div class='view view-NNContent'>
<div class='view-content view-content-NNContent'>
<div class="item-list">
<ul><li><div class='view-item view-item-NNContent'>
<div class='view-field view-data-node_title'><a href="/?q=node/10"> Products</a></div>
<div class='view-field view-data-node_body'><img src="icon-1.gif" alt="pic" >
Some content about the product</div>
</div>
</li></ul>
</div></div></div> </div>

Which class or id is the one I want? None of them seem to react to

ul{
list-style-type: none;
}

thanks

eliza411’s picture

eliza411 commented

I didn't have time to look at these in drupal. I just made a little static page to test. ul alone won't work in drupal because it has more specific directives already. These might be specfic enough, though.

.item-list ul {
list-style-type: none
}

It might also shut off more bullets than you want, in which case you can try a more specific context:

.view-content .item-list ul {
list-style-type: none
}

etc.

redvespa’s picture

redvespa commented

I love it when you learn enough to answer your own question. :-)
I'll post it just in case other people want to know
I found I had to affect style for "ul li" not just "ul" for class .item-list.

There is an entry in drupal.css which I started playing with. (but I run mutlisite, so I want site/theme specific)
Once I found that worked, I could then make it specific to view-content item-list an not across the board.

So this went into my theme stylesheet.

.view-content-NNContent .item-list ul li{
	list-style-type: none;
}
eliza411’s picture

eliza411 commented

It's great that you post your solution, too. I like knowing that someone I've tried to help has solved their problem, plus your solution from withint drupal is helpful to others. Nice work figuring it out!

Als’s picture

Als
Location Milano, Italia
commented

I recognize your solution is correct under all points of view. But why (the Hell) doesn't it work for me?
My view is identical to yours in the generated html, as I have similar goals: I need a list with titles alone.

In the theme's style.css I defined a class which is as specific as possible:
.view-content .view-content-Principale .item-list ul li
('Principale' is the name of the view).

I also put the property "list-style-type: none;" in the all the possibly relevant styles of drupal.css:
ul.menu, ul.menu li, li.expanded, li.collapsed, li.leaf, li a.active

Why does IE and Firefox, all recent versions and updated, keep visualizing circles beside the titles?
Thanks!

FranCarstens’s picture

FranCarstens commented

Man, did I get a headache with this one. And nothing worked. Who'd have guessed that you had to include the <li> in the css. Great work!! Thanks for posting.

-- If no-one asked Drupal questions there would be no Drupal answers --

macm’s picture

macm commented

Hi Folks

See: http://drupal.org/node/1892

Works like a charm , you can remove item-list ul li

My function now is:

function theme_item_list($items = array(), $title = NULL, $type =  'span', $attributes = NULL) {
  if (isset($title)) {
    $output .= '<h3>'. $title .'</h3>';
  }

  if (!empty($items)) {
    $output .= "<$type" . drupal_attributes($attributes) . '>';
    foreach ($items as $item) {
      $attributes = array();
      $children = array();
      if (is_array($item)) {
        foreach ($item as $key => $value) {
          if ($key == 'data') {
            $data = $value;
          }
          elseif ($key == 'children') {
            $children = $value;
          }
          else {
            $attributes[$key] = $value;
          }
        }
      }
      else {
        $data = $item;
      }
      if (count($children) > 0) {
        $data .= theme_item_list($children, NULL, $type, $attributes); // Render nested list
      }
      $output .= drupal_attributes($attributes) . $data;
    }
    $output .= "</$type>";
  }
  return $output;
}

Hope be useful.

macm
Mario

foxtrotcharlie’s picture

foxtrotcharlie commented

Check out this node for a way to easily remove the list item (ul and li) markup from your views lists:

http://drupal.org/node/136136

Charles

www.parkroad.co.za

Charles

Drupal development, Cape Town, South Africa

susata’s picture

susata commented

Mr. foxtrotcharlie, you totally rock.

If you want to know why you made my day, here's my tale:
http://drupal.org/node/212078

Thank you.

dorien’s picture

dorien commented

If you are using Garland, the list-style is already none! It uses a background image!

.view-content ul li {
background-image: none;
}

will do the trick!