Add .css and .js files to a certain view/page?

Good day,

I would like to use some .js files and .css files into a specific view. So those files only load and the CSS is only applicable on that page (not the entire app).

I’ve tried adding them to the component of my index.html, firstly this doesn’t work but also I don’t want it loading those files in the whole application, only on one specific page.

I’ve tried adding the following above of that page, however it’s not working.

<head>
    <link href="css/tiles.css" title="style" rel="stylesheet" type="text/css" />
    <link id="clink" href="css/style-blue.css" title="style" rel="stylesheet" type="text/css" media="screen"/>
    <!-- masory tiles -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script src="js/jquery.masonry.min.js" type="text/javascript"></script>
    <script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
    <script src="js/MetroJs.lt.js" type="text/javascript"></script>
    <script src="js/jquery.flexslider-min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/hoverintent.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery.jplayer.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/javascript.js" type="text/javascript"></script>
</head>

How do I get these files to load and initialise on a specific page?

4 Likes