4

I would use Bootstrap styling to custumize my SP Page.

I added those links to a CWEP:

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

But nothing happens when I apply a style. Am I including Bootstrap with the right way ?

  • can u check if your firewall is blocking the access to site maxcdn.bootstrapcdn.com ? – Ankitkumar Malde Apr 3 '17 at 12:19
2

You can use an isolated bootstrap.

https://formden.com/blog/isolate-bootstrap

If you just add Bootstrap CSS to your webpage it will conflict with your page’s existing CSS creating a jumbled mess of styles. Wouldn't it be nice if we could isolate Bootstrap CSS to a particular class? We can! We just need to use LESS to prefix all Bootstrap CSS with a class name.

1

Tip: instead of Bootstrap go with Microsofts own "Fabric Core",

different syntax; does the same

For now, you still have to load it yourself:

https://spoprod-a.akamaihd.net/files/fabric/office-ui-fabric-core/6.0.0/css/fabric.min.css

but in the long run it will be there by default, as Microsoft uses it for all modern interfaces

1

Since you are using SharePoint online, it probably blocking the cdn domains you used for referencing bootstrap files. This is because of same origin policy adopted by many online site in header to avoid clickjacking.

The best way to do it is by downloading those files locally, upload it to the document library and then reference it from there. This way, you will always have the working reference in your code irrespective of future bootstrap release which may not work with your code and also there are chances that, links may break in future.

1

I have tested your references with content editor web part and working as expected. But it is recommended to download to your site and add reference to avoid cross domain issues.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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