1

I made it by the book (I think):

  • download and enable respondjs module;
  • download respond.js library and install it like this: libraries/respondjs/respond.min.js & libraries/respondjs/respond.src.js;
  • Download and enable Bootstrap Library module;
  • Download bootstrap and installed it as a library: libraries/bootstrap/js/...
  • Aggregate the CSS files;
  • Emptied the caches a few times and used the "InPrivate" navigation in my IE8 browser;

My code is like that:

<link type="text/css" rel="stylesheet" href="http://url.com/sites/default/files/css/css_ogjvJnfni1_P_WxvXAHlUOgCs860b3ip9DNMapcIGeM.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://url.com/sites/default/files/css/css_E5INd53MC9D9hGN7fTbvA2YKmpTCORTNG-LyRZO0jWA.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://url.com/sites/default/files/css/css_pQJBTHotR_cijx-fDqH3tXIWdiIZQhUIjxOWwL8rTxU.css" media="all" />
<link type="text/css" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootswatch/3.0.2/simplex/bootstrap.min.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://url.com/sites/default/files/css/css_nFez2jKpXwmW9wMfuF-TAsfoop0107dn7vq0qbY1vio.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,600|Ubuntu:300,500&amp;subset=latin" media="all" />
  <!-- HTML5 element support for IE6-8 -->
  <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
  <script src="http://url.com/sites/all/libraries/respondjs/respond.min.js?n5tq5n"></script>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>window.jQuery || document.write("<script src='/sites/all/modules/jquery_update/replace/jquery/1.7/jquery.min.js'>\x3C/script>")</script>
<script src="http://url.com/misc/jquery.once.js?v=1.2"></script>
<script src="http://url.com/misc/drupal.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/jquery_update/replace/ui/external/jquery.cookie.js?v=67fb34f6a866c40d0570"></script>
<script src="http://url.com/sites/all/modules/jquery_update/replace/misc/jquery.form.min.js?v=2.69"></script>
<script src="http://url.com/misc/form.js?v=7.27"></script>
<script src="http://url.com/misc/ajax.js?v=7.27"></script>
<script src="http://url.com/sites/all/modules/jquery_update/js/jquery_update.js?v=0.0.1"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<script src="http://url.com/sites/all/libraries/bootstrap/js/bootstrap.js?n5trqm"></script>
<script src="http://url.com/sites/all/libraries/colorbox/jquery.colorbox.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/colorbox/js/colorbox.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/colorbox/js/colorbox_load.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/views/js/base.js?n5trqm"></script>
<script src="http://url.com/sites/all/themes/bootstrap/js/misc/_progress.js?v=7.27"></script>
<script src="http://url.com/sites/all/modules/views/js/ajax_view.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/captcha/captcha.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/webform/js/webform.js?n5trqm"></script>
<script src="http://url.com/sites/all/modules/colorbox_node/colorbox_node.js?n5trqm"></script>
<script src="http://url.com/sites/all/themes/bootstrap/portfolio/js/scripts.js?n5trqm"></script>
<script src="http://url.com/sites/all/themes/bootstrap/js/misc/ajax.js?n5trqm"></script>
<script src="http://url.com/sites/all/themes/bootstrap/js/modules/views/js/ajax_view.js?n5trqm"></script>

But still, IE8 outputs something unappropriate that looks like the mobile version, give or take a few surprises, like the menu which doesn't work at all, instead of working like mobile version without the bootstrap library locally installed. What am I missing?

2

OK so I finally DID IT.

I have overriden the html.tpl.php file, replacing:

<!-- HTML5 element support for IE6-8 -->
  <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->

By

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

And since, IE8 is actually responding to the media queries.

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.