List Manager Forum

CSS Class on Fields

User taxwebmaster 2015-02-26 18:15:35

I'd like to modify certain fields using css, so in the Fields Edit screen, I add a name in the CSS Class area. When looking at my html code, I can see this class on the input field of the form in the back end, but not on the front end list view. Am I doing something wrong? Or is that css class not used on the front end list view? Thanks.

Moonsoft support 2015-02-27 09:51:58

Hello,

Css class is also applying in frontend view form fields not only in backend. Please note that this class is only added to the form fields and not in table cells. If you need to refer to any column in table list, you can use default column classes 'lm_colum_X' where X is the column order number in table.

In case you can't see class in form fields, please place a ticket (private) in Helpdesk in your Customer Area with an url to test and we'll take a look.

Regards,

User taxwebmaster 2015-03-04 00:40:37

Thanks. I see what you mean. On my site, I have several lists created by ListManager. If I use the 'lm_column_x" class, it will affect every list. Is there a way to target just the list or table on one page with css? I see id="###list_table", but it looks like ### changes each time the page loads.

I could use the page class created by Joomla, but unfortunately, the template I'm using has disabled the page class feature.

Thanks again.

Moonsoft support 2015-03-04 09:50:40

Hi,

Yes, if you use the lm_column_x class you'll be affecting every list. To restrict the style to specific list, you should include the list inside a div or section with an specific class, for ex:

...here list manager list...

Now you can create a style class lm_column_x only affecting inside mylist1

.mylist1 .lm_column_x{}

Regards,

User taxwebmaster 2015-03-04 23:40:33

Here's how I ended up getting it to work. This will use the current menu item's alias as the class for the page. It got this by modifying code from http://joomla.stackexchange.com/questions/5398/adding-custom-css-styling-on-some-of-my-pages

In the template's index.php file, add this ABOVE the doctype
(opening php tag)
$app = JFactory::getApplication();
$menu = $app->getMenu();
$active = $menu->getActive();
$pageclass = $active->alias;
(closing php tag)

And add this in the body tag:
class="(openphptag) echo $pageclass; (closephptag)"

Then I could target the column using normal css:
body.aliasname th.lm_column_# {
width: 8em;
}

Edited by taxwebmaster - 04.03.2015 23:42

Edited by taxwebmaster - 04.03.2015 23:43

Moonsoft support 2015-03-05 09:46:40

Hi,
yes, that's a very good solution! Thank you very much for sharing!

Regards

...
CalcBuilder

Create dynamic calculators

Buy now!
...
Support/development

Perfect for small code changes or to correct any bug at your site

Buy now!