Home > Mobile >  Shopify: Cannot get rid of an element even after editing base CSS
Shopify: Cannot get rid of an element even after editing base CSS

Time:07-26

I have a <p> element which I wish to remove by display:none. I am adding the following code in the main CSS file (core.css). This file is getting referenced on all pages as per the Network tab. Also, in Inspect Element I see the code for this particular element is coming from inline styling, which isn't part of any asset file on Shopify Code Editor, and cannot be edited as a result. What is the way out here?

Code I am adding to core.css:

p.hulk-powered-wrapper {
    display:none !important;
  }

Page in question: CSS files being loaded

CodePudding user response:

I added identical code in the Chrome DevTools and it worked (i.e., Shopify Forms Powered by HulkApps disappeared).

Two questions:

  1. Is this the only thing you have inside the core.css?
  2. I'm not familiar with Shopify, but in Magento 2 sometimes CSS doesn't work because of the cache. Have you cleared the cache?

UPDATE

  1. I see you have a lot of code inside the core.css. Everything else works? Is this display: none; the only thing that doesn't?
  2. I see that p.hulk-powered-wrapper{display:none !important} is inside the core.css so the problem shouldn't be related with the cache.

CodePudding user response:

Looks like that p tag is inside an iframe, so maybe try something like this (with jQuery):

$("#frame_ai7L9yHu4aWawvcQdO6NJw").contents().find(".hulk-powered-wrapper").hide();
  • Related