Pick up
いま動いていること
New
新着
スプレッドシートの News シートに1行足すと、いちばん上の特集とこの一覧に自動で入ります。
棚田も、錦鯉も、角突きも。
守っているのは、いつも誰かの手だ。yamakoshi navi
Directory
山古志まとめ
公式サイト、note の記事、観光、移住。山古志にまつわるページを目的から引けるように並べ直しました。
Map
お店と施設
行き先を決めるための地図。ピンを押すと右の一覧が動きます。
Calendar
スプレッドシートの News シートに1行足すと、いちばん上の特集とこの一覧に自動で入ります。
棚田も、錦鯉も、角突きも。
守っているのは、いつも誰かの手だ。yamakoshi navi
公式サイト、note の記事、観光、移住。山古志にまつわるページを目的から引けるように並べ直しました。
行き先を決めるための地図。ピンを押すと右の一覧が動きます。
公式・行政、デジタル村民、note の読みもの、観光、イベント、暮らし、買いもの。バナー画像はスプレッドシートの image 列で差し替えられます。
note の記事は Apps Script が RSS から自動で取り込み、「note・読みもの」に並びます。それ以外は手動キュレーションです。
Googleカレンダーに登録された山古志関連の予定を、そのまま月ごとに表示します。日付を押すとその日の予定が開きます。
交流館、直売所、宿、見どころ。カード右下の「Googleマップで開く」からそのまま経路案内に進めます。
※ この図はスプレッドシートの緯度・経度から描いた簡易マップです。Google マップの埋め込み（マイマップ）に差し替えることもできます — 方法は「つなぎ方」に。
News・まとめ・MAP・広告はスプレッドシート、カレンダーは Googleカレンダー、note は RSS。すべて1本の Google Apps Script 経由で読み込みます。
この設定はブラウザにだけ保存されます（保存できない環境でも、この画面を開いている間は有効です）。
本番では、index.html と同じフォルダに置いた config.js に書き込むのがいちばん簡単です。5行だけの小さなファイルなので、大きなHTMLを探し回る必要がありません。
1. アクセスできるユーザーが「全員」になっていますか
いちばん多い原因です。ここが「自分のみ」だと、Googleがログイン画面を返してしまい、サイト側は何も受け取れません。デプロイをやり直すか、デプロイを管理 → 鉛筆マークから直せます。
2. URLは /exec で終わっていますか
テスト用の /dev で終わるURLは、本人がログインしているときしか動きません。必ず /exec のほうを使ってください。
3. シート名は News / Links / Spots / Ads のままですか
Apps Script はこの名前でシートを探します。日本語に変えると見つけられません。1行目の見出しの文字も変えないでください。
4. いちばん左の列が空の行は、まるごと無視されます
News・Links なら date、Spots なら category、Ads なら sponsor。ここが空だとその行は読み込まれません。
5. コードを直したら、再デプロイが必要です
デプロイを管理 → 鉛筆マーク → バージョン「新バージョン」→ デプロイ。シートの中身を変えただけなら再デプロイは要りません。
6. SHEET_ID は空のままで大丈夫です
スプレッドシートの 拡張機能 → Apps Script から開いていれば、そのスプレッドシートが自動で使われます。URLをそのまま貼ってもIDだけ取り出すようになっているので、Illegal spreadsheet id というエラーは出なくなりました。
News シートの1行は、そのまま「新着」に並びます。ここに hero を TRUE にすればトップの大きな特集に、 map を TRUE にすれば MAP のピンに、event を TRUE にすればカレンダーの予定にもなります。 たとえば新しいカフェの紹介記事なら map を、イベント告知なら event を。両方入れても構いません。
News シートの hero 列に TRUE を入れた行が、上から順にトップの特集になります（最大3件）。TRUE がひとつもなければ新しい順に3件が自動で選ばれます。 見出しは hero_title があればそれを、なければ title から自動で組み立てます（「——」「：」「、」などの区切りで主見出しと副見出しに分けます）。 画像は image 列。空のときは記事ごとに色の違う「文字だけの表紙」が自動で作られます。
| 列 | 内容 |
|---|---|
| date | 2026-08-25 の形式。新しい順に並べ替えて表示します。 |
| tag | 更新 / お知らせ / イベント / メディア のいずれか。 |
| title | 一覧に出る見出し。特集の自動見出しもここから作られます。 |
| url | リンク先。空欄なら本文をポップアップ表示します。 |
| body | url が空のときに表示する本文。 |
| hero / hero_title / hero_sub | トップ特集への昇格と、その見出し。空でOK。 |
| image | 写真URL。特集（1600×900px前後）と新着カードの両方に使われます。 |
| pin | TRUE で一覧の先頭に固定。省略可。 |
| ↓ ここから下は、必要なときだけ入れる欄です | |
| map | TRUE を入れると、この記事がMAPのピンにもなります。下の spot_ 系と lat / lng をあわせて入れてください。 |
| spot_name | MAPに出す名前。空なら title をそのまま使います。 |
| spot_category | 施設 / 見どころ / 食べる など。空なら「記事から」になります。 |
| spot_address | 住所。「Googleマップで開く」のリンク生成に使われます。 |
| spot_hours | 営業時間・開館時間。 |
| lat / lng | 緯度・経度。ピンの位置。Googleマップで右クリック →「この場所について」で取得。 |
| event | TRUE を入れると、この記事がカレンダーの予定にもなります。 |
| event_date | 予定の日付（yyyy-mm-dd）。空のときは date の日に入ります。 |
| event_time | 「13:00-15:00」など。カレンダーの詳細に出ます。 |
| event_place | 開催場所。 |
| event_title | カレンダーでの表示名。空なら title を使います。 |
記事から作られたピン・予定には、もとの記事へのリンクが付きます。
お店の紹介記事を書いたらそのままMAPに載り、イベントの告知を書いたらそのままカレンダーに載る、という使い方を想定しています。
MAPやカレンダーだけに載せたいもの（記事にしないもの）は、これまでどおり Spots シート・Googleカレンダーに直接書いてください。
| 列 | 内容 |
|---|---|
| category | 公式・行政 / デジタル村民 / 観光 / イベント / 暮らし・移住 / 買う・支える / 読みもの など。増やすと絞り込みも自動で増えます。 |
| title / url / description | サイト名、リンク先、1〜2行の紹介文。 |
| image | バナー画像のURL（16:10、1200×750px前後）。空欄なら自動の表紙。 |
| order | 並び順の数値。省略可。 |
note の記事はここに書かなくて構いません。Apps Script の NOTE_USERS に並べたアカウントの RSS を読み、「note・読みもの」として自動で追加されます。
| 列 | 内容 |
|---|---|
| category | 施設 / 見どころ / 直売所 / 宿 / 食べる / 温泉 など。絞り込みボタンになります。 |
| name | お店・施設の名前。 |
| description | 1〜2行の紹介。 |
| hours | 営業時間・開館時間。「開催日のみ」なども可。 |
| address | 住所。Googleマップのリンク生成にも使います。 |
| lat / lng | 緯度・経度。簡易マップのピン位置になります。Googleマップで右クリック →「この場所について」で取得できます。 |
| url | 公式サイトなど。省略可。 |
| image | 写真URL。空欄なら自動の表紙。 |
| 列 | 内容 |
|---|---|
| sponsor | 広告主の名前。カードのカテゴリ欄に出ます。 |
| title | 見出し。記事カードと同じ見え方になります。 |
| url | リンク先。 |
| image | 写真URL（4:3推奨）。空欄なら自動の表紙。 |
| position | 「新着」の何番目に差し込むか（数値）。空なら末尾。 |
| active | TRUE の行だけ表示します。掲載終了は FALSE に。 |
広告カードは記事と同じ形で並びますが、サムネイル左上に PR の表示が必ず入ります。広告であることを隠す設定は用意していません。
Googleカレンダーをひとつ用意し、そのカレンダーIDを Apps Script の CAL_ID に入れます。予定のタイトル・場所・説明がそのまま表示されます。 当月の前後1か月ぶんを読み込むので、翌月の予定も先に入れておけます。
やり方は2つあります。おすすめは A。スプレッドシートに書いた緯度・経度がそのままピンになるので、二重管理になりません。
両方入れた場合は A（APIキー）が使われます。本番では HTML 内の CONFIG.mapKey ／ CONFIG.myMaps に直接書き込んでください。
A. APIキーの取り方
1. console.cloud.google.com でプロジェクトを作る
2. 「APIとサービス」→ ライブラリ → Maps JavaScript API を有効にする
3. 認証情報 → 認証情報を作成 → APIキー
4. 作ったキーを編集し、「アプリケーションの制限」をウェブサイトにして、公開するドメイン（例 https://example.com/*）を登録する
5. 「APIの制限」で Maps JavaScript API だけに絞る
キーはHTMLに書くので誰でも見られます。ドメイン制限は必ずかけてください。請求先アカウントの登録は必要ですが、この規模なら無料枠に収まります。
手元で試すときの注意：file:// では動きません
HTMLファイルをダブルクリックして開いた file:///… の状態では、Googleがドメインを判定できず、必ず拒否されます。制限欄に file:///… を登録しても効きません。
手元で確認するときは、簡易サーバーを立ててから開いてください。macOSならターミナルで
cd ~/Downloads && python3 -m http.server 8000
と打って、ブラウザで http://localhost:8000/ファイル名.html を開きます。
そのうえで、キーの「ウェブサイトの制限」に http://localhost:8000/* を追加してください。公開後は本番ドメイン（https://example.com/*）も追加します。
B. マイマップの埋め込み（キーなしで手軽）
1. google.com/mymaps で地図を作り、ピンを置く
2. 共有 → 「一般的なアクセス」をリンクを知っている全員に
3. 右上の … → 「自分のサイトに埋め込む」→ 出てきた iframe の src="…" の中身をコピー
キーは要りませんが、ピンはマイマップ側で作るので、スプレッドシートとは別管理になります。カードの一覧とピンが連動しない点にご注意ください。
どちらも設定しないとき
緯度・経度から描いた簡易マップが表示されます。カードの「Googleマップで開く」は住所と名前からの検索リンクなので、どの方式でも同じように動きます。
Apps Script に貼り付けて「デプロイ → 新しいデプロイ → ウェブアプリ / アクセスできるユーザー: 全員」で公開し、出てきた /exec のURLを上の欄に入れてください。