カラーミーでbxsliderをレスポンシブ対応にする

カラーミーキットを元に制作したところ、jqueryのバージョンが1.7.2のため、bxsliderがレスポンシブ対応になりません。
テンプレートの「トップ」に、下記のJavaScriptを記述することでレスポンシブ対応になりました。

head部にviewportを設定

<script>
  var viewport = document.createElement('meta');
  viewport.setAttribute('name', 'viewport');
  viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0');
  document.getElementsByTagName('head')[0].appendChild(viewport);
</script>

• カラーミーで使っているbxSliderの機能と使い方を解説します | naeco.jp

CSSにwidthとheightを記述する方法もあったのですが、iPhoneで確認時、高さの取得がうまく行かないようだったので断念しました。

追記：viewportの設定、全く同じ記述がもともとテンプレートに入っていたようなのですが、なぜかそれでは解決していません。