Adding twitter's Bootstrap library into magento 2 for responsive theme design

Since, magento2 doesn't include bootstrap library by default. Instead it has it's own library for responsive layout for all devices.
                                                    Peoples like me who are familiar with bootstrap and used to use these library face difficulties while going to design theme without bootstarp. So, here i am going to link bootstrap library into magento 2 theme for responsive theme design.
                                 Yes it is true that bootstrap made conflict with existing styling of magento 2, which should be over-rided on your own.



You can add Bootstrap this way, follow below steps
1) Place your JS and CSS at below location
/app/design/frontend/vendor-name/theme-name/web/css
/app/design/frontend/vendor-name/theme-name/web/js
2) Call files in your default_head_blocks.xml
app/design/frontend/vendor-name/theme-name/Magento_Theme/layout/default_head_blocks.xml
add these line of code
<css src="css/bootstrap.css" />
 <script src="js/bootstrap.min.js"/>
3) Run below commands
php bin/magento setup:upgrade

php bin/magento setup:static-content:deploy

Comments

Popular posts from this blog

Jasper report integration in Spring boot/Spring MVC.

FireBase Crud operation in Spring Boot

Hybris Overview and b2c installation initialization