Adding custom js and css to Product grid in Magento 2Adding Site-wide Custom CSSmain.CRITICAL: Plugin class doesn't existHow to enable inline edit in catalog grid without changing source code?Magento 2.1 Create a filter in the product grid by new attributeMagento 2 Add new field to Magento_User admin formAdd an extension to edit the product name quickly in admin. Magento 2Grid action column custom callback with multiple params in magento2Customer export not working after creating custom attributes in magento 2.2.5Cannot export list of customer from the grid magento 2Magento Customer Grid Custom attribute can't export csv and export xml
How to continually let my readers know what time it is in my story, in an organic way?
Why was my Canon Speedlite 600EX triggering other flashes?
Can my Serbian girlfriend apply for a UK Standard Visitor visa and stay for the whole 6 months?
Alias for root of a polynomial
Single word that parallels "Recent" when discussing the near future
Creative Commons useage question!
Do not cross the line!
Acronyms in HDD specification
Smooth function that vanishes only on unit cube
Show solution to recurrence is never a square
Do we have C++20 ranges library in GCC 9?
Is Valonqar prophecy unfulfilled?
Will casting a card from the graveyard with Flashback add a quest counter on Pyromancer Ascension?
How does this Martian habitat 3D printer built for NASA work?
Biology of a Firestarter
Why is it harder to turn a motor/generator with shorted terminals?
complicated arrows in flowcharts
Find the unknown area, x
Uh oh, the propeller fell off
Can multiple outlets be directly attached to a single breaker?
AMPScript Lookup From Child Business Unit
Motorola 6845 and bitwise graphics
Developers demotivated due to working on same project for more than 2 years
Offered a new position but unknown about salary?
Adding custom js and css to Product grid in Magento 2
Adding Site-wide Custom CSSmain.CRITICAL: Plugin class doesn't existHow to enable inline edit in catalog grid without changing source code?Magento 2.1 Create a filter in the product grid by new attributeMagento 2 Add new field to Magento_User admin formAdd an extension to edit the product name quickly in admin. Magento 2Grid action column custom callback with multiple params in magento2Customer export not working after creating custom attributes in magento 2.2.5Cannot export list of customer from the grid magento 2Magento Customer Grid Custom attribute can't export csv and export xml
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
1
Can we add custom JavaScript and CSS to the Product grid. I've created a product_listing.xml within my own module, and it's working, but can we add custom JS and CSS to product_listing.xml like we do for page layouts?
Here's my product_listing.xml located in MyCompany/MyModule/view/adminhtml/ui_component.
<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<listingToolbar name="listing_top">
<massaction name="listing_massaction">
<action name="upload">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">upload</item>
<item name="label" xsi:type="string" translate="true">Upload</item>
<item name="url" xsi:type="url" path="myroute/product/upload"/>
</item>
</argument>
</action>
<action name="check_import_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_import_status</item>
<item name="label" xsi:type="string" translate="true">Check Source Document Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatesourcestatus"/>
</item>
</argument>
</action>
<action name="request_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">request_translations</item>
<item name="label" xsi:type="string" translate="true">Request Translations</item>
<item name="url" xsi:type="url" path="myroute/product/requesttranslations"/>
</item>
</argument>
</action>
<action name="check_target_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_target_status</item>
<item name="label" xsi:type="string" translate="true">Check Translations Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatetargetstatus"/>
</item>
</argument>
</action>
<action name="download_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">download_translations</item>
<item name="label" xsi:type="string" translate="true">Download Translations</item>
<item name="url" xsi:type="url" path="myroute/product/downloadtranslations"/>
</item>
</argument>
</action>
<action name="disassociate_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">disassociate_translations</item>
<item name="label" xsi:type="string" translate="true">Disassociate Translations</item>
<item name="url" xsi:type="url" path="myroute/product/disassociatetranslations"/>
</item>
</argument>
</action>
</massaction>
</listingToolbar>
<columns name="product_columns" class="MagentoCatalogUiComponentListingColumns">
<column name="source" class="MyCompanyMyModuleUiComponentListingColumnsSourceIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/sourceicon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Source</item>
<item name="sortOrder" xsi:type="number">34</item>
</item>
</argument>
</column>
<column name="translations" class="MyCompanyMyModuleUiComponentListingColumnsTargetIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/targeticon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Translations</item>
<item name="sortOrder" xsi:type="number">37</item>
</item>
</argument>
</column>
</columns>
</listing>
magento2 javascript css product-list
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
|
show 3 more comments
1
Can we add custom JavaScript and CSS to the Product grid. I've created a product_listing.xml within my own module, and it's working, but can we add custom JS and CSS to product_listing.xml like we do for page layouts?
Here's my product_listing.xml located in MyCompany/MyModule/view/adminhtml/ui_component.
<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<listingToolbar name="listing_top">
<massaction name="listing_massaction">
<action name="upload">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">upload</item>
<item name="label" xsi:type="string" translate="true">Upload</item>
<item name="url" xsi:type="url" path="myroute/product/upload"/>
</item>
</argument>
</action>
<action name="check_import_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_import_status</item>
<item name="label" xsi:type="string" translate="true">Check Source Document Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatesourcestatus"/>
</item>
</argument>
</action>
<action name="request_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">request_translations</item>
<item name="label" xsi:type="string" translate="true">Request Translations</item>
<item name="url" xsi:type="url" path="myroute/product/requesttranslations"/>
</item>
</argument>
</action>
<action name="check_target_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_target_status</item>
<item name="label" xsi:type="string" translate="true">Check Translations Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatetargetstatus"/>
</item>
</argument>
</action>
<action name="download_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">download_translations</item>
<item name="label" xsi:type="string" translate="true">Download Translations</item>
<item name="url" xsi:type="url" path="myroute/product/downloadtranslations"/>
</item>
</argument>
</action>
<action name="disassociate_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">disassociate_translations</item>
<item name="label" xsi:type="string" translate="true">Disassociate Translations</item>
<item name="url" xsi:type="url" path="myroute/product/disassociatetranslations"/>
</item>
</argument>
</action>
</massaction>
</listingToolbar>
<columns name="product_columns" class="MagentoCatalogUiComponentListingColumns">
<column name="source" class="MyCompanyMyModuleUiComponentListingColumnsSourceIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/sourceicon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Source</item>
<item name="sortOrder" xsi:type="number">34</item>
</item>
</argument>
</column>
<column name="translations" class="MyCompanyMyModuleUiComponentListingColumnsTargetIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/targeticon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Translations</item>
<item name="sortOrder" xsi:type="number">37</item>
</item>
</argument>
</column>
</columns>
</listing>
magento2 javascript css product-list
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
1
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.
– Joseph Hovik
Jun 1 '17 at 15:33
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02
|
show 3 more comments
1
1
1
Can we add custom JavaScript and CSS to the Product grid. I've created a product_listing.xml within my own module, and it's working, but can we add custom JS and CSS to product_listing.xml like we do for page layouts?
Here's my product_listing.xml located in MyCompany/MyModule/view/adminhtml/ui_component.
<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<listingToolbar name="listing_top">
<massaction name="listing_massaction">
<action name="upload">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">upload</item>
<item name="label" xsi:type="string" translate="true">Upload</item>
<item name="url" xsi:type="url" path="myroute/product/upload"/>
</item>
</argument>
</action>
<action name="check_import_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_import_status</item>
<item name="label" xsi:type="string" translate="true">Check Source Document Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatesourcestatus"/>
</item>
</argument>
</action>
<action name="request_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">request_translations</item>
<item name="label" xsi:type="string" translate="true">Request Translations</item>
<item name="url" xsi:type="url" path="myroute/product/requesttranslations"/>
</item>
</argument>
</action>
<action name="check_target_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_target_status</item>
<item name="label" xsi:type="string" translate="true">Check Translations Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatetargetstatus"/>
</item>
</argument>
</action>
<action name="download_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">download_translations</item>
<item name="label" xsi:type="string" translate="true">Download Translations</item>
<item name="url" xsi:type="url" path="myroute/product/downloadtranslations"/>
</item>
</argument>
</action>
<action name="disassociate_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">disassociate_translations</item>
<item name="label" xsi:type="string" translate="true">Disassociate Translations</item>
<item name="url" xsi:type="url" path="myroute/product/disassociatetranslations"/>
</item>
</argument>
</action>
</massaction>
</listingToolbar>
<columns name="product_columns" class="MagentoCatalogUiComponentListingColumns">
<column name="source" class="MyCompanyMyModuleUiComponentListingColumnsSourceIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/sourceicon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Source</item>
<item name="sortOrder" xsi:type="number">34</item>
</item>
</argument>
</column>
<column name="translations" class="MyCompanyMyModuleUiComponentListingColumnsTargetIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/targeticon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Translations</item>
<item name="sortOrder" xsi:type="number">37</item>
</item>
</argument>
</column>
</columns>
</listing>
magento2 javascript css product-list
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
Can we add custom JavaScript and CSS to the Product grid. I've created a product_listing.xml within my own module, and it's working, but can we add custom JS and CSS to product_listing.xml like we do for page layouts?
Here's my product_listing.xml located in MyCompany/MyModule/view/adminhtml/ui_component.
<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<listingToolbar name="listing_top">
<massaction name="listing_massaction">
<action name="upload">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">upload</item>
<item name="label" xsi:type="string" translate="true">Upload</item>
<item name="url" xsi:type="url" path="myroute/product/upload"/>
</item>
</argument>
</action>
<action name="check_import_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_import_status</item>
<item name="label" xsi:type="string" translate="true">Check Source Document Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatesourcestatus"/>
</item>
</argument>
</action>
<action name="request_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">request_translations</item>
<item name="label" xsi:type="string" translate="true">Request Translations</item>
<item name="url" xsi:type="url" path="myroute/product/requesttranslations"/>
</item>
</argument>
</action>
<action name="check_target_status">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">check_target_status</item>
<item name="label" xsi:type="string" translate="true">Check Translations Status</item>
<item name="url" xsi:type="url" path="myroute/product/updatetargetstatus"/>
</item>
</argument>
</action>
<action name="download_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">download_translations</item>
<item name="label" xsi:type="string" translate="true">Download Translations</item>
<item name="url" xsi:type="url" path="myroute/product/downloadtranslations"/>
</item>
</argument>
</action>
<action name="disassociate_translations">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="type" xsi:type="string">disassociate_translations</item>
<item name="label" xsi:type="string" translate="true">Disassociate Translations</item>
<item name="url" xsi:type="url" path="myroute/product/disassociatetranslations"/>
</item>
</argument>
</action>
</massaction>
</listingToolbar>
<columns name="product_columns" class="MagentoCatalogUiComponentListingColumns">
<column name="source" class="MyCompanyMyModuleUiComponentListingColumnsSourceIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/sourceicon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Source</item>
<item name="sortOrder" xsi:type="number">34</item>
</item>
</argument>
</column>
<column name="translations" class="MyCompanyMyModuleUiComponentListingColumnsTargetIcon">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">text</item>
<item name="component" xsi:type="string">MyCompany_MyModule/js/grid/columns/targeticon</item>
<item name="add_field" xsi:type="boolean">true</item>
<item name="label" xsi:type="string" translate="true">Translations</item>
<item name="sortOrder" xsi:type="number">37</item>
</item>
</argument>
</column>
</columns>
</listing>
magento2 javascript css product-list
magento2 javascript css product-list
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
edited Jun 1 '17 at 15:57
Joseph Hovik
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
asked May 31 '17 at 23:21
Joseph HovikJoseph Hovik
326214
326214
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
1
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.
– Joseph Hovik
Jun 1 '17 at 15:33
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02
|
show 3 more comments
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
1
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.
– Joseph Hovik
Jun 1 '17 at 15:33
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
1
1
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:
Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.– Joseph Hovik
Jun 1 '17 at 15:33
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:
Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.– Joseph Hovik
Jun 1 '17 at 15:33
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02
|
show 3 more comments
2 Answers
2
active
oldest
votes
0
You need to 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-class</item>
</item>
</argument>
</column>
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
add a comment |
-1
You can add using some XML tags like these below.
CSS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /css / filename.css
JS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /js / filename.js
XML:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="css/filename.css"/>
<script src="js/filename.js"/>
</head>
</page>
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
add a comment |
Your Answer
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "479"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f176893%2fadding-custom-js-and-css-to-product-grid-in-magento-2%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
You need to 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-class</item>
</item>
</argument>
</column>
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
add a comment |
0
You need to 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-class</item>
</item>
</argument>
</column>
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
add a comment |
0
0
0
You need to 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-class</item>
</item>
</argument>
</column>
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
You need to 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-class</item>
</item>
</argument>
</column>
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
edited Jun 2 '17 at 12:02
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
answered Jun 1 '17 at 5:33
Prince PatelPrince Patel
14k65883
14k65883
add a comment |
add a comment |
-1
You can add using some XML tags like these below.
CSS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /css / filename.css
JS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /js / filename.js
XML:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="css/filename.css"/>
<script src="js/filename.js"/>
</head>
</page>
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
add a comment |
-1
You can add using some XML tags like these below.
CSS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /css / filename.css
JS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /js / filename.js
XML:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="css/filename.css"/>
<script src="js/filename.js"/>
</head>
</page>
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
add a comment |
-1
-1
-1
You can add using some XML tags like these below.
CSS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /css / filename.css
JS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /js / filename.js
XML:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="css/filename.css"/>
<script src="js/filename.js"/>
</head>
</page>
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
You can add using some XML tags like these below.
CSS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /css / filename.css
JS:
code / vendorname / modulename / view / frontend(for admin adminhtml) / web /js / filename.js
XML:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="css/filename.css"/>
<script src="js/filename.js"/>
</head>
</page>
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
answered Jun 1 '17 at 4:28
Rafael Corrêa GomesRafael Corrêa Gomes
4,81023366
4,81023366
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
add a comment |
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
Thanks Rafael again for your answer. I'm still trying to figure out the information you sent me about Magento 2 plugins. :)
– Joseph Hovik
Jun 1 '17 at 15:39
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f176893%2fadding-custom-js-and-css-to-product-grid-in-magento-2%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
What you want achieve ?
– Mohammad Mujassam
Jun 1 '17 at 3:17
Did you get my answer?
– Prince Patel
Jun 1 '17 at 6:14
Mohammad, I want to add js and css to a custom icon I've created in each product row.
– Joseph Hovik
Jun 1 '17 at 15:23
1
Prince Patel, yes thank you for your answer. However I get this error when adding the code you cited at the top of my product_listing.xml file:
Exception #0 (Exception): Warning: DOMDocument::loadXML(): Extra content at the end of the document in Entity, line: 6 in /home/username/web/magento2/vendor/magento/framework/View/Element/UiComponent/Config/DomMerger.php on line 324.– Joseph Hovik
Jun 1 '17 at 15:33
@JosephHovik. Check my updated answer.
– Prince Patel
Jun 2 '17 at 12:02