cancel
Showing results for 
Search instead for 
Did you mean: 

Add Bootstrap as external style sheet

SOLVED

Add Bootstrap as external style sheet

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.

 

 

1 ACCEPTED SOLUTION

Accepted Solutions

Re: Add Bootstrap as external style sheet

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

2 REPLIES 2

Re: Add Bootstrap as external style sheet

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!

Re: Add Bootstrap as external style sheet

@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 ! Smiley Happy