Magento 2 – Add CSS Class to Admin UI Grid Column

admincssgridmagento2uicomponent

I need to add some css rules to one of the columns of my custom admin ui grid. Is there a way to add css class to it from listing xml file?

Best Answer

Sure, just add "fieldClass" property to the column configuration:

<column name="column_name">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="fieldClass" xsi:type="string">your-css-rule(s)</item>
        </item>
    </argument>
</column>

Related Solutions

Magento2 – How to Add CSS Class on Body

In your layout or template file, you need to add an attribute to the body tag, like this:

<body>
    <attribute name="class" value="my-css-class"/>
    ...

Hope that Helps

Magento 2 – Custom Grid Column Sort Order

Try this solution

Use below line to sort the column in grid.

<item name="sortOrder" xsi:type="number">6</item>

Open you database table ui_bookmark.
Search the name of your uiComponent from namespce column of ui_bookmark table. You can check uiComponent name from respective layout xml. below is just an example path.
```
/app/code/Vendor/Module/view/adminhtml/layout/module__controller_index.xml
```
Now delete the records that you find from ui_bookmark table.

Clear the cache

php bin/magento cache:flush

php bin/magento cache:clean

Thats all. Enjoy!

Best Answer

Related Solutions

Magento2 – How to Add CSS Class on Body

Magento 2 – Custom Grid Column Sort Order

Related Topic