web制作備忘録(自分用)

php,javascript,wordpress等のサンプルコードとか

カテゴリ: Google

GoogleのスプレッドシートでURLの一覧を作った時に自動でハイパーリンクにならなかった時の対処法。

[方法]
正規表現を使ってURLを一括検索し、ハイパーリンクの関数【HYPERLINK()】に置換する。

[検索]

(https?://.*)

[置換]

=HYPERLINK("$1","$1")

Googleスプレッドシートめっちゃ便利。

サイトのページタイトルとかディスクリプションの一覧をスプレッドシートでつくるときに便利な関数があったのでサンプルを紹介します。

=IMPORTXML(【URL】, 【XPath】)

サイトのURLからhtmlの任意の要素を取得し出力します。

【サンプルコード】

=IMPORTXML(【URL】, "//title") 
=IMPORTXML(【URL】, "//meta[@name='keywords']/@content")
=IMPORTXML(【URL】, "//meta[@name='description']/@content")
=IMPORTXML(【URL】, "//div[@class='hoge']") 
上から順に
  • ページタイトルを出力
  • キーワードを出力
  • ディスクリプションを出力
  • 任意のクラスを出力

【URL】の部分はセルを参照したり、任意のURLを入れる。

2つ目の引数にはXPathが入ります。
XPathがわからなければchromeのデベロッパーツールでコピーもできます。

無題クリップ_083116_112142_AM

自分のiPhoneで撮影したGoogleのストリートビューをサイトに表示してみました。


【手順】

  1. まずは自分のカメラやスマートフォンを使って360度画像を撮影して下さい。
    スマホの方はストリートビューのアプリを使って撮影できます。
  2. googleマップにアクセスしメニューを開きます。
    map_001
  3. 「自分の投稿」を開きます。
    map_002
  4. 「写真」を開き表示したい任意の画像(ストリートビュー)をクリック
    map_003
  5. 左上のオプションを開きます。
    map_004
  6. 「画像を共有または埋め込む」をクリック
    map_005
  7. コードが表示されました。URLをコピーして表示したいサイトに貼り付ければOK
    map_006

【デモ】

↑このページのトップヘ