Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Nathan Reece 62 posts 376 karma points
    Jul 22, 2020 @ 06:31
    Nathan Reece
    0

    How do I Install Bootstrap to my Umbraco 8 Project

    Whats the best way to install bootstrap onto my Umbraco 8 project?

    im not amazing at CSS and i have heard bootstrap can make styling my pages easier, the starter site seems to have some boot strap syntax but a lot is missing.

    Can anyone help me.

  • David Armitage 510 posts 2082 karma points
    Jul 22, 2020 @ 06:43
    David Armitage
    100

    Hi Nathan,

    This is very easy as with any website.

    If you are using the starter site there should be a view called Master.cshtml or MasterView.cshtml.

    You are wanting to edit that file.

    First of all this link will help you. https://www.bootstrapcdn.com/

    1. At the top (in the html head) add a reference to bootstrap.css. The best way to do that is using a CDN link. You can grab the CDN link from by visiting the line I added above.

    It should look something like this.

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    
    1. At the bottom (just before the end body tag) add a reference to bootstrap.js. The best way to do that is using a CDN link. You can grab the CDN link from by visiting the line I added above.

    It should look something like this.

    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
    

    That's it. Very easy!

    Hope this helps.

    Regards

    David

  • Nathan Reece 62 posts 376 karma points
    Jul 22, 2020 @ 06:53
    Nathan Reece
    0

    Thankyou, That helped.

    I have wrote a Step by Step Blog if any one else needs help.

    https://www.umbrajobs.com/blog/posts/2020/july/how-to-install-bootstrap-with-umbrcao-8/

  • David Armitage 510 posts 2082 karma points
    Jul 22, 2020 @ 06:59
    David Armitage
    0

    Yeah looks like you figured it out.

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies