Category: WEB

0

WEBサイトにGooglemapの地図を利用されている企業様は多いかと思いますが御社のWEBサイトの地図は正常に表示されていますか?
意外と自分の会社のWEBサイトの地図が埋め込まれているページを見る機会は少ないかと思いますので、この機会に確認してみてはいかがでしょうか?
2018年6月11日以降、Googleの地図サービスが刷新されたことにより「このページでは Google マップが正しく読み込まれませんでした。」とエラーになっているページが散見されるようになりました。

理由は以下の3つ。

  1. APIキーを利用していない場合
  2. APIキーを利用しているが、無償枠「月間28,000マップロード」を超えた場合
  3. 請求先アカウントの登録がされていない

ちなみにiframeを使って地図を埋め込んでいる場合は今回のケースには当てはまらないためセーフとなりますので、エラーが出ているようでしたら、これを機にiframeの埋め込みに変更するのも手かもしれません。

0

Bootstrap3からBootstrap4に移行してもっとも戸惑ったのがブレイクポイントごとに表示・非表示を制御するhiddenとvisibelが使えなくなってしまった点。
以下に変更後にどのようになったかをまとめてみました。正直、以前の方が分かりやすかった気がします。

  • .visible-xs-{display} ⇒ .d-{display}.d-sm-none/.d-{display}.d-md-none
  • .visible-sm-{display} ⇒ .d-none.d-md-{display}.d-lg-none
  • .visible-md-{display} ⇒ .d-none.d-lg-{display}.d-xl-none
  • .visible-lg-{display} ⇒ .d-none.d-xl-{display}
  • .hidden-xs ⇒ .d-none.d-sm-{display}/.d-none.d-md-{display}
  • .hidden-sm ⇒ .d-{display}.d-md-none.d-lg-{display}
  • .hidden-md ⇒ .d-{display}.d-lg-none.d-xl-{display}
  • .hidden-lg ⇒ .d-{display}.d-xl-none

{display} の種類が block, inline, inline-block の3種類から block, inline, inline-block, table, table-cell, table-cell, flex, inline-flex の9種類に増加
※以下のサイトを参考にさせて頂きました。
http://cccabinet.jpn.org/bootstrap4/utilities/display