0

I wan't to add bootstrap.css to a template in a custom layout.xml, this is my code:

view/frontend/web/css/bootstrap.css here is the css file

view/frontend/layout/pakke_trackshipment_info.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

  <head>
   <!-- Here I have tried both methods but no one worked -->
    <css src="Vendor_Pakke::css/bootstrap.css"/>
    <css src="css/bootstrap.css" />
  </head>

    <referenceContainer name="content">
        <block class="Vendor\Pakke\Block\TrackInfo\TrackingInfo" name="tracking_info" template="Vendor_Pakke::track_info.phtml"/>
        <!--Magento\Framework\View\Element\Template-->
    </referenceContainer>
</page>

Also I will add my controller code in case i'ts wrong. I'm practically sending $order_id to the template and printing the template.

public function execute()
{

   $order_id = $this->getRequest()->getParam("order_id");

    $resultPage = $this->resultPageFactory->create();
    $resultPage->getConfig()->getTitle()->prepend(__(' heading '));

    $block = $resultPage->getLayout()
            ->getBlock('tracking_info')
            ->setOrderId($order_id)
            ->toHtml();
    $this->getResponse()->setBody($block);
}

The template shows the html correctly with the data that I'm passing to it, but the css never loads, it's just plain html.

Greetings!

Improve this question
2
  • please check update answer. if not works let me know.
    – Sarvesh Patel
    Commented Jan 8, 2020 at 4:51
  • share your module file structure. ok
    – Sarvesh Patel
    Commented Jan 8, 2020 at 4:51

4 Answers 4

Reset to default
1

*Make sure your layout file is correct way, otherwise not works!

Please try below code

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 <head>
   <!-- Here I have tried both methods but no one worked -->
    <css src="Vendor_Pakke::css/bootstrap.css"/>
  </head>
  <!-- put here your another code -->
</page>

and your file view/frontend/web/css/bootstrap.css here ok after this please run below commands

  1. php bin/magento c:c

  2. php bin/magento setup:upgrade

  3. php bin/magento setup:static-content:deploy -f

  4. php bin/magento setup:di:compile

Hope it works.

Improve this answer
2
  • Hello, It did not work anyway, but I give you the point because I now this way it would work, the problem might be in my controller, when I do the toHtml(); method
    – Oscar Vazquez
    Commented Jan 9, 2020 at 21:29
  • okay thanks bro.
    – Sarvesh Patel
    Commented Jan 10, 2020 at 4:46
0

Instead of this file pakke_trackshipment_info.xml

you can create

default.xml

on view/frontend/layout/

so full path

app/code/VendorName/ModuleName/view/frontend/layout/default.xml

code will be

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
    <css src="VendorName_ ModuleName::css/bootstrap.css" />
</head>

Improve this answer
1
  • the problem with this way, is that It will add bootstrap to the whole website, I just wan't to add boostrap to an specific phtml, even if I don't use bootstrap classes it changes general elements like th, tr, h1, and so on
    – Oscar Vazquez
    Commented Jan 8, 2020 at 14:18
0

Please Add css in your layout as per below:

  <?xml version="1.0"?>
  <page xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
  <head>
    <css src="VendorName_ModuleName::css/custom.css" />
  </head>

Now put your css in below path:

VendorName/ModuleName/view/frontend/web/css/custom.css

-Remove the pub/static folder from your root directory

Use Command:

php bin/magento setup:static-content:deploy -f

php bin/magento cache:flush

Improve this answer
0

Just Follow Below Step :-

rm -rf pub/static/frontend/ pub/static/adminhtml/ pub/static/_requirejs pub/static/deployed_version.txt var/cache var/page_cache var/generation var/view_preprocessed var/session generated/code

php/bin magento s:up

php bin/magento setup:static-content:deploy -f

php bin/magento cache:flush

After Below Step Give Proper Permision.

Improve this answer

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.