0

I have added CSS design for a CMS block in the same block,

<div class="container">

    <div class="row">

        <div class="col-sm">
            <img src="{{media url="image.png"}}" alt="">
        </div>

        <div class="col-sm">

        <div class="row" style="top: 822px; left: 864px; width: 266px; height: 156px; text-align: left; font: normal normal normal 28px/41px Laca; letter-spacing: 0px; color: #404040; text-transform: capitalize; opacity: 1;">Welcome to store</div>

        <div class="row" style="top: 1021px; left: 870px; width: 272px; height: 210px; text-align: left; font: normal normal normal 16px/22px Laca; letter-spacing: 0px; color: #707070; opacity: 1;">Her is my text</div>

        <div class="row" style="top: 1231px; left: 870px; width: 118px; height: 50px; background: #F1592A 0% 0% no-repeat padding-box; border-radius: 4px; opacity: 1;">Read More</div>
        </div>

    </div>

</div>

how to create an external css file and include inside the static block, i am working on a custom theme that is inherited from a blank theme.

My custom css placed under app/design/frontend/mytheme/theme/web/css for some other design.

How to include my css file into CMS Block?

1 Answer 1

1

Step 1: You need to create file a css file in /app/design/frontend/<Theme_Name>/web/css/local.css

Step 2: At this step, create default_head_blocks.xml file in app/design/frontend/<Theme_Name>/<Module_NameSpace>/layout/

Step 3: In default_head_blocks.xml, using css tag (css) to include a css file which we created at Step 2.

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      layout="2columns-left"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/local.css" />
    </head>
</page>
2
  • This method also working, add css inside _theme.less under app\design\frontend\Myrwd\mytheme\web\css\source\ _theme.less the css style will apply on CMS Block. I didn't call css path inside my cms block but the css applied.
    – zus
    Dec 22, 2020 at 3:57
  • Same where i can add js?
    – zus
    Dec 22, 2020 at 3:57

Your Answer

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

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