0

I'm currently working with a static block on our website. I'm trying to hide certain pieces of texts within this block when viewed on mobile. I've come across some answers which use CSS. However, I don't have access to the CSS file of our website.

Therefore my question is: Is it possible to achieve this without adjusting the actual CSS file within the static block?

2
  • which version of magento you used? Apr 25, 2018 at 13:39
  • Magento ver. 1.9.3.8
    – Jordyb
    Apr 25, 2018 at 13:45

1 Answer 1

1

Since you don't have access to a CSS file, I only see two options.

1 - Embed a stylesheet at the top of the static block. While editing the static block in question, click the orange Show/Hide Editor button, insert your CSS solution mentioned above, and click save. Clear cache, and refresh page.

Here is a sample:

<style>
@media only screen and (max-width: 767px) {
    .myclass{display:none;}
}
</style>

2 - Add a style tag and desired CSS to the head section of every page using the Miscellaneous Scripts section in the Magento Admin.

  • While logged into the Magento Admin, navigate to System > Configuration > General > Design. Expand the HTML Head section and paste your CSS solution mentioned above (including the style tags). Save the configuration. Clear cache, and refresh page. The same code sample above applies.
8
  • Thanks for your reply! Everytime I add this code to the static block, in the editor. It dissapears when I switch to wysiwyg editor.
    – Jordyb
    Apr 25, 2018 at 15:01
  • Sometimes saving the block while the WYSIWYG editor is still hidden helps. If not, than I would recommend the 2nd suggestion. Apr 25, 2018 at 15:11
  • So it doesnt work, yet. This is all the code on the page. <style> @media only screen and (max-width: 767px) { .myclass{display:none;} } </style> <p style="text-align: left;">&nbsp;</p> <p style="text-align: left; padding-left: 80px;"><strong>✓ </strong>Betaal na ontvangst✓ </strong>Altijd een servicepunt bij u in de buurt<strong> ✓ </strong> Gratis verzending<strong><span style="float: right; padding-right: 80px;">✉ &nbsp; &nbsp; &nbsp;Schrijf je in voor de nieuwsbrief</span></strong></p> <p style="text-align: left;">&nbsp;</p>
    – Jordyb
    Apr 25, 2018 at 15:18
  • Well, .myclass is just a suggested selector - you need to change this to a selector of your choice. What are you trying to hide within that content? All of it? Apr 25, 2018 at 15:20
  • 1
    It Works! You're the best! Calling it a day for now. Thank you!
    – Jordyb
    Apr 25, 2018 at 15:31

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.