Solved: Add Bootstrap as external style sheet

foysal · ‎07-05-2020

I am trying to add Bootstrap as external style sheet. My default_head_blocks.xml is like below.

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <link rel="stylesheet"  type="text/css" src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous" src_type="url" />
        <css src="css/custom.css"/>
        <css src="css/fixed_css.css"/>
    </head>
</page>

But I am getting error like below while I am trying to browse my site.

Nishu Jindal · ‎07-05-2020

Hi @foysal,

Please remove crossorigin attribute from link element in xml file.

Check this:

https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-themes.html

Thanks!

Problem Solved! Click Kudos & Accept as Solution!

View solution in original post

Nishu Jindal · ‎07-05-2020

Hi @foysal,

Please remove crossorigin attribute from link element in xml file.

Check this:

https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-themes.html

Thanks!

Problem Solved! Click Kudos & Accept as Solution!

gaurav_harsh1 · ‎07-05-2020

@foysal

Try updating your default_head_blocks.xml with below code :

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <link rel="stylesheet"  type="text/css" src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" src_type="url" />
        <css src="css/custom.css"/>
        <css src="css/fixed_css.css"/>
    </head>
</page>

Problem Solved ? Click on 'Kudos' & Accept as Solution !

Add Bootstrap as external style sheet

Add Bootstrap as external style sheet

Re: Add Bootstrap as external style sheet

Re: Add Bootstrap as external style sheet

Re: Add Bootstrap as external style sheet