69

I'm using Joomla! 3.0, which has Twitter Bootstrap 2.1.0 included. I want to do my own Joomla! template, and I need to use dropdown menus. When I include following CSS/JS:

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>    
<script type="text/javascript" src="<?php echo $this->baseurl ?>/media/jui/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/media/jui/css/bootstrap.css"></script>
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/Site.css" rel="stylesheet" type="text/css">
<link rel="shotcut icon" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/images/favicon.ico" type="image/x-icon">

I get following CSS error:

Uncaught SyntaxError: Unexpected token {

in /media/jui/css/bootstrap.css, line 19

Cysioland
  • 1,126
  • 1
  • 9
  • 21

1 Answers1

233

You have syntax error because you tried to include CSS file as it was JavaScript, so change

<script type="text/javascript" src="<?php echo $this->baseurl ?>/media/jui/css/bootstrap.css"></script>

to

<link href="<?php echo $this->baseurl ?>/media/jui/css/bootstrap.css" rel="stylesheet" type="text/css" />

Also close other link tags properly with />, not with just >

Flexo
  • 87,323
  • 22
  • 191
  • 272
Marko D
  • 7,576
  • 2
  • 26
  • 38
  • 1
    Note you can include jQuery and bootstrap with Joomla through a PHP command just call `JHtml::_('bootstrap.framework')` (see docs page here for more info http://docs.joomla.org/Javascript_Frameworks ) – George Wilson Feb 20 '13 at 15:52
  • I ran into this when jumping into node development and not paying close enough attention to external resources. Double check your paths, file extensions, and file contents. Make sure everything JavaScript is .js and everything CSS is .css. Also make sure you're not importing jquery.js as jquery.css. Sounds dumb but it happened to me my first time around so figured it will probably happen to someone else as well. – fIwJlxSzApHEZIl Mar 21 '16 at 17:32
  • Similar issue in that I was adding a Style.Bundle as a Script.Bundle – clarence_odbody Aug 14 '19 at 12:09