検索を切り替える
検索
メニューを切り替える
781
20
2
5460
川西図鑑
案内
メインページ
最近の更新
おまかせ表示
MediaWiki についてのヘルプ
特別ページ
ファイルをアップロード
個人設定メニューを切り替える
通知
個人メニューを切り替える
ログインしていません
編集を行うと、IPアドレスが公開されます。
user-interface-preferences
個人用ツール
アカウント作成
ログイン
飲食店検索のソースを表示
提供: 川西図鑑
このページを共有
その他の操作
←
飲食店検索
あなたには「このページの編集」を行う権限がありません。理由は以下の通りです:
この操作は、次のグループに属する利用者のみが実行できます:
登録利用者
。
この操作は、次のグループに属する利用者のみが実行できます:
管理者
。
このページは編集や他の操作ができないように保護されています。
このページのソースの閲覧やコピーができます。
__NOINDEX__ <templatestyles src="検索結果カード/styles.css" /> <html> <nav class="breadcrumb"> <a href="/">ホーム</a> › <a href="/wiki/飲食店検索">飲食店検索</a> <span id='navText'></span> </nav> <style> .breadcrumb { font-size: 14px; color: #555; margin-bottom: 12px; } .breadcrumb a { color: #3366cc; text-decoration: none; } .breadcrumb span { color: #333; font-weight: bold; } </style> </html> == 検索条件 == <!-- 検索ボックス --> <html> <form method="get" action="" id="searchForm"> <div class="search-form-container"> <!-- 検索ボタンエリア --> <div class="form-actions"> <button type="button" class="clear-btn">クリア</button> <button type="submit" class="search-btn">検索</button> </div> <!-- 予約可トグル --> <div class="form-row toggle-row"> <span class="toggle-label">予約できる店だけ</span> <label class="toggle"> <input type="checkbox" name="reservable" value="1"> <span class="slider"></span> </label> </div> <!-- 店名検索 --> <div class="form-row"> <input class="form-input" type="text" name="searchText" placeholder="店名で検索" id="searchText"/> </div> <!-- ジャンル --> <div class="form-row"> <select name="genre" id="genre" class="form-select"> <option value="">すべてのジャンル</option> <option value="居酒屋">居酒屋</option> <option value="ダイニングバー・バル">ダイニングバー・バル</option> <option value="創作料理">創作料理</option> <option value="和食">和食</option> <option value="洋食">洋食</option> <option value="イタリアン・フレンチ">イタリアン・フレンチ</option> <option value="中華">中華</option> <option value="焼肉・ホルモン">焼肉・ホルモン</option> <option value="韓国料理">韓国料理</option> <option value="アジア・エスニック料理">アジア・エスニック料理</option> <option value="各国料理">各国料理</option> <option value="カラオケ・パーティ">カラオケ・パーティ</option> <option value="バー・カクテル">バー・カクテル</option> <option value="ラーメン">ラーメン</option> <option value="お好み焼き・もんじゃ">お好み焼き・もんじゃ</option> <option value="カフェ・スイーツ">カフェ・スイーツ</option> <option value="その他グルメ">その他グルメ</option> </select> </div> <!-- 最寄り駅 --> <div class="form-row"> <select name="station" class="form-select" id="station"> <option value="">最寄り駅:指定なし</option> <option value="川西能勢口駅">川西能勢口</option> <option value="雲雀丘花屋敷駅">雲雀丘花屋敷</option> <option value="川西池田駅">川西池田</option> <option value="北伊丹駅">北伊丹</option> <option value="絹延橋駅">絹延橋</option> <option value="滝山駅">滝山</option> <option value="鴬の森駅">鴬の森</option> <option value="鼓滝駅">鼓滝</option> <option value="多田駅">多田</option> <option value="平野駅">平野</option> <option value="一の鳥居駅">一の鳥居</option> <option value="畦野駅">畦野</option> <option value="山下駅">山下</option> <option value="笹部駅">笹部</option> <option value="日生中央駅">日生中央</option> <option value="妙見口駅">妙見口</option> </select> </div> <!-- 予算 --> <div class="budget-section"> <div class="budget-header"> <span class="budget-title">予算</span> <div class="budget-type"> <label class="radio-label"> <input type="radio" name="lanch-dinner" value="lanch"> <span>昼</span> </label> <label class="radio-label"> <input type="radio" name="lanch-dinner" value="dinner"> <span>夜</span> </label> </div> </div> <div class="budget-range"> <select name="budget_min" id="budget_min" class="form-select-small"> <option value="">下限なし</option> <option value="1000">1,000円</option> <option value="2000">2,000円</option> <option value="3000">3,000円</option> </select> <span class="budget-separator">〜</span> <select name="budget_max" id="budget_max" class="form-select-small"> <option value="">上限なし</option> <option value="2000">2,000円</option> <option value="3000">3,000円</option> <option value="5000">5,000円</option> </select> </div> </div> </div> <!-- こだわり条件(アコーディオン) --> <details class="accordion"> <summary>こだわり条件</summary> <div class="accordion-content"> <!-- 支払い方法 --> <fieldset class="filter-group"> <legend>支払い方法</legend> <div class="checkbox-grid"> <label class="checkbox-label"> <input type="checkbox" name="credit"> <span>カード</span> </label> <label class="checkbox-label"> <input type="checkbox" name="emoney"> <span>電子マネー</span> </label> <label class="checkbox-label"> <input type="checkbox" name="qr"> <span>QRコード決済</span> </label> </div> </fieldset> <!-- 禁煙・喫煙 --> <fieldset class="filter-group"> <legend>禁煙 / 喫煙</legend> <div class="radio-grid"> <label class="radio-label"> <input type="radio" name="smoking" value=""> <span>指定なし</span> </label> <label class="radio-label"> <input type="radio" name="smoking" value="non"> <span>禁煙のみ</span> </label> <label class="radio-label"> <input type="radio" name="smoking" value="allow"> <span>喫煙可</span> </label> </div> </fieldset> <!-- メニュー --> <fieldset class="filter-group"> <legend>メニュー</legend> <div class="checkbox-grid"> <label class="checkbox-label"> <input type="checkbox" name="tabehodai"> <span>食べ放題</span> </label> <label class="checkbox-label"> <input type="checkbox" name="nomihodai"> <span>飲み放題</span> </label> <label class="checkbox-label"> <input type="checkbox" name="takeout"> <span>テイクアウト</span> </label> </div> </fieldset> <!-- 設備・サービス --> <fieldset class="filter-group"> <legend>設備・サービス</legend> <div class="checkbox-grid"> <label class="checkbox-label"> <input type="checkbox" name="parking"> <span>駐車場</span> </label> <label class="checkbox-label"> <input type="checkbox" name="privateroom"> <span>個室</span> </label> <label class="checkbox-label"> <input type="checkbox" name="wifi"> <span>Wi-Fi</span> </label> <label class="checkbox-label"> <input type="checkbox" name="barrierfree"> <span>バリアフリー</span> </label> <label class="checkbox-label"> <input type="checkbox" name="kids"> <span>お子様連れOK</span> </label> <label class="checkbox-label"> <input type="checkbox" name="reserve"> <span>貸切</span> </label> </div> </fieldset> <!-- アコーディオン内の検索ボタン --> <div class="form-actions"> <button type="button" class="clear-btn">クリア</button> <button type="submit" class="search-btn">検索</button> </div> </div> </details> </form> <style> /* ======================================== フォーム全体 ======================================== */ #searchForm { max-width: 800px; font-size: 14px; } .search-form-container { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); margin-bottom: 16px; } /* ======================================== ボタンエリア ======================================== */ .form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 16px; } .clear-btn { padding: 10px 20px; background: #e0e0e0; color: #333; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.2s; } .clear-btn:hover { background: #d0d0d0; } .clear-btn:active { transform: scale(0.98); } .search-btn { padding: 10px 24px; background: #f59e0b; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.2s; } .search-btn:hover { background: #d97706; } .search-btn:active { transform: scale(0.98); } /* ======================================== フォーム行 ======================================== */ .form-row { margin-bottom: 12px; } .toggle-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #f9fafb; border-radius: 8px; } .toggle-label { font-weight: 500; color: #333; } /* ======================================== 入力フィールド ======================================== */ .form-input, .form-select { width: 100%; padding: 12px 16px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; transition: all 0.2s; background: #fff; } .form-input:focus, .form-select:focus { outline: none; border-color: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.1); } .form-input::placeholder { color: #9ca3af; } /* ======================================== 予算セクション ======================================== */ .budget-section { background: #f9fafb; padding: 16px; border-radius: 8px; margin-bottom: 12px; } .budget-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; } .budget-title { font-weight: 600; color: #333; } .budget-type { display: flex; gap: 16px; } .budget-range { display: flex; align-items: center; gap: 8px; } .form-select-small { flex: 1; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; background: #fff; } .budget-separator { color: #6b7280; font-weight: 500; } /* ======================================== トグルスイッチ ======================================== */ .toggle { position: relative; width: 44px; height: 24px; display: inline-block; } .toggle input { display: none; } .slider { position: absolute; cursor: pointer; inset: 0; background: #d1d5db; border-radius: 24px; transition: 0.3s; } .slider::before { content: ""; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px; background: white; border-radius: 50%; transition: 0.3s; } .toggle input:checked + .slider { background: #f59e0b; } .toggle input:checked + .slider::before { transform: translateX(20px); } /* ======================================== ラジオボタン ======================================== */ .radio-label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; } .radio-label input[type="radio"] { width: 18px; height: 18px; cursor: pointer; } .radio-label span { font-size: 14px; color: #374151; } .radio-grid { display: flex; gap: 16px; flex-wrap: wrap; } /* ======================================== チェックボックス ======================================== */ .checkbox-label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; } .checkbox-label input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; } .checkbox-label span { font-size: 14px; color: #374151; } .checkbox-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; } /* ======================================== アコーディオン ======================================== */ .accordion { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 0; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.08); } .accordion summary { padding: 16px 20px; cursor: pointer; font-weight: 600; font-size: 15px; color: #111827; background: #f9fafb; user-select: none; list-style: none; display: flex; align-items: center; justify-content: space-between; } .accordion summary::-webkit-details-marker { display: none; } .accordion summary::after { content: "▼"; font-size: 12px; color: #6b7280; transition: transform 0.3s; } .accordion[open] summary::after { transform: rotate(180deg); } .accordion-content { padding: 20px; } /* ======================================== フィルターグループ ======================================== */ .filter-group { border: none; padding: 0; margin-bottom: 20px; } .filter-group:last-of-type { margin-bottom: 0; } .filter-group legend { font-weight: 600; font-size: 14px; color: #111827; margin-bottom: 12px; } /* ======================================== ダークモード対応 ======================================== */ .skin-theme-clientpref-night .search-form-container, .skin-theme-clientpref-night .accordion { background: #1e1e1e; border-color: #3a3a3a; } .skin-theme-clientpref-night .form-input, .skin-theme-clientpref-night .form-select, .skin-theme-clientpref-night .form-select-small { background: #2a2a2a; border-color: #3a3a3a; color: #e5e7eb; } .skin-theme-clientpref-night .toggle-row, .skin-theme-clientpref-night .budget-section, .skin-theme-clientpref-night .accordion summary { background: #2a2a2a; } .skin-theme-clientpref-night .toggle-label, .skin-theme-clientpref-night .budget-title, .skin-theme-clientpref-night .filter-group legend, .skin-theme-clientpref-night .accordion summary { color: #e5e7eb; } .skin-theme-clientpref-night .radio-label span, .skin-theme-clientpref-night .checkbox-label span { color: #d1d5db; } .skin-theme-clientpref-night .clear-btn { background: #3a3a3a; color: #e5e7eb; } .skin-theme-clientpref-night .clear-btn:hover { background: #4a4a4a; } /* 自動モード(ダーク時) */ @media (prefers-color-scheme: dark) { .skin-theme-clientpref-os .search-form-container, .skin-theme-clientpref-os .accordion { background: #1e1e1e; border-color: #3a3a3a; } .skin-theme-clientpref-os .form-input, .skin-theme-clientpref-os .form-select, .skin-theme-clientpref-os .form-select-small { background: #2a2a2a; border-color: #3a3a3a; color: #e5e7eb; } .skin-theme-clientpref-os .toggle-row, .skin-theme-clientpref-os .budget-section, .skin-theme-clientpref-os .accordion summary { background: #2a2a2a; } .skin-theme-clientpref-os .toggle-label, .skin-theme-clientpref-os .budget-title, .skin-theme-clientpref-os .filter-group legend, .skin-theme-clientpref-os .accordion summary { color: #e5e7eb; } .skin-theme-clientpref-os .radio-label span, .skin-theme-clientpref-os .checkbox-label span { color: #d1d5db; } .skin-theme-clientpref-os .clear-btn { background: #3a3a3a; color: #e5e7eb; } .skin-theme-clientpref-os .clear-btn:hover { background: #4a4a4a; } } /* ======================================== レスポンシブ ======================================== */ @media (max-width: 600px) { .search-form-container { padding: 16px; } .budget-header { flex-direction: column; align-items: flex-start; gap: 12px; } .checkbox-grid { grid-template-columns: 1fr; } } </style> <script> document.getElementById('searchForm').addEventListener('submit', function (e) { const searchText = document.getElementById('searchText'); const genre = document.getElementById('genre'); const station = document.getElementById('station'); const budget_min = document.getElementById('budget_min'); const budget_max = document.getElementById('budget_max'); if (searchText.value === '') { searchText.removeAttribute('name'); // 空のとき name属性を削除 } if (genre.value === '') { genre.removeAttribute('name'); // 空のとき name属性を削除 } if (station.value === '') { station.removeAttribute('name'); // 空のとき name属性を削除 } if (budget_min.value === '') { budget_min.removeAttribute('name'); // 空のとき name属性を削除 } if (budget_max.value === '') { budget_max.removeAttribute('name'); // 空のとき name属性を削除 } }); document.addEventListener('DOMContentLoaded', function () { const params = new URLSearchParams(window.location.search); params.forEach((value, key) => { // input, select, checkbox, radio 全対応 const el = document.querySelector(`[name="${key}"]`); if (!el) return; // checkbox / radio (name[] の対応含む) if (el.type === "checkbox" || el.type === "radio") { document.querySelectorAll(`[name="${key}"]`).forEach(input => { if (input.value === value) { input.checked = true; } }); } else { // text / select など el.value = value; } }); const clearBtn = document.querySelector('.clear-btn'); const form = document.getElementById('searchForm'); clearBtn.addEventListener('click', function () { form.reset(); }); // URLパラメータ取得 var area = params.get("station"); var category = params.get("genre"); var reservable = params.get("reservable"); var smoking = params.get("smoking"); var tabehodai = params.get("tabehodai"); var nomihodai = params.get("nomihodai"); var takeout = params.get("takeout"); var parking = params.get("parking"); var kids = params.get("kids"); var reserve = params.get("reserve"); var count = document.getElementById("count"); count = count.dataset.total.toString(); // タイトル生成 let title = "川西市でおすすめのグルメ情報をご紹介! | 川西図鑑"; // パンくず用テキスト生成 let nav = ""; if (area) { if (category) { title = `${area}でおすすめのおいしい${category}をご紹介! | 川西図鑑`; nav = ` › ${area} × ${category}`; } else { title = `${area}でおすすめのおいしいグルメをご紹介! | 川西図鑑`; nav = ` › ${area}`; } } else if (category) { title = `川西市でおすすめのおいしい${category}をご紹介! | 川西図鑑`; nav = ` › ${category}`; } // タイトル更新 document.title = title; // パンくず更新 document.getElementById('navText').textContent = nav; if (area) { area = "の" + area; } else { area = ""; } if (category) { category = "の" + category; } else { category = ""; } if (count) { count = count + "件"; } else { count = ""; } if (reservable) { reservable = "予約可能"; } else { reservable = ""; } if (smoking == "non" ) { smoking = "禁煙"; } else { smoking = ""; } if (tabehodai) { tabehodai = "食べ放題あり"; } else { tabehodai = ""; } if (nomihodai) { nomihodai = "飲み放題あり"; } else { nomihodai = ""; } if (takeout) { takeout = "テイクアウトあり"; } else { takeout = ""; } if (parking) { parking = "駐車場あり"; } else { parking = ""; } if (kids) { kids = "お子様連れOK"; } else { kids = ""; } if (reserve) { reserve = "貸切可能"; } else { reserve = ""; } const keys = [ reservable, smoking, tabehodai, nomihodai, takeout, parking, kids, reserve, ]; const valid = keys.filter(v => { if (!v) return false; if (v.trim() === "") return false; return true; }); // 上から3つだけ取得 const top3 = valid.slice(0, 3); // description に使う文字列を作成 let conditionText = ""; if (top3.length > 0) { conditionText = top3.join("・"); } if (conditionText) { conditionText = `${conditionText}のお店を厳選して表示しています。`; } else { conditionText = ``; } // description生成 let desc = `「川西図鑑」では、兵庫県川西市${area}で人気${category}のお店を ${count}掲載中。${conditionText}営業時間、アクセス、写真、地図などの詳細情報をまとめています。ランチやディナー、テイクアウトなど条件で絞り込みができ、地元でおすすめのお店が見つかります。`; let meta = document.querySelector("meta[name='description']"); if (!meta) { meta = document.createElement("meta"); meta.name = "description"; document.head.appendChild(meta); } meta.content = desc; // 現在のURL取得 let url = window.location.href; // ページネーション const fullurl = new URL(location.href); const page = parseInt(fullurl.searchParams.get('page') || '1', 10); // 最終ページ制御 const countMeta = document.getElementById('count'); if (!countMeta) return; const total = parseInt(countMeta.dataset.total, 10); const limit = parseInt(countMeta.dataset.limit, 10); if (isNaN(total) || isNaN(limit) || limit <= 0) return; const lastPage = Math.ceil(total / limit); if (lastPage <= 1) { const pagination = document.querySelector('.pagination'); if (pagination) pagination.style.display = 'none'; return; } if (page > lastPage) { fullurl.searchParams.set('page', lastPage); location.replace(fullurl.toString()); } if (page < 1) { fullurl.searchParams.set('page', 1); location.replace(fullurl.toString()); } function makeLink(targetPage) { fullurl.searchParams.set('page', targetPage); return fullurl.toString(); } // 各ボタン const first = document.querySelector('[data-role="first-page"]'); const prev = document.querySelector('[data-role="prev-page"]'); const next = document.querySelector('[data-role="next-page"]'); const last = document.querySelector('[data-role="last-page"]'); if (page <= 1) { first.classList.add('disabled'); prev.classList.add('disabled'); } else { first.href = makeLink(1); prev.href = makeLink(page - 1); } if (page >= lastPage) { next.classList.add('disabled'); last.classList.add('disabled'); } else { next.href = makeLink(page + 1); last.href = makeLink(lastPage); } // 数字ボタン const pageNumbers = document.querySelector('[data-role="page-numbers"]'); if (!pageNumbers) return; const start = Math.max(1, page - 2); const end = Math.min(lastPage, page + 2); for (let i = start; i <= end; i++) { const link = document.createElement('a'); link.textContent = i; const newUrl = new URL(url); newUrl.searchParams.set('page', i); link.href = newUrl.toString(); if (i === page) { link.classList.add('current'); } pageNumbers.appendChild(link); } });//# sourceURL=foobar.js </script> </html> {{#vardefine:hitCount | {{#cargo_query: tables=飲食店情報 |fields=COUNT(*) |where=( (飲食店情報.店名 LIKE CONCAT('%','{{#urlget:searchText}}','%') OR 飲食店情報.住所 LIKE CONCAT('%','{{#urlget:searchText}}','%') OR 飲食店情報.ジャンル LIKE CONCAT('%','{{#urlget:searchText}}','%')) {{#if: {{#urlget:genre}} | AND 飲食店情報.ジャンル LIKE CONCAT ('%','{{#urlget:genre}}','%') }} {{#if: {{#urlget:station}} | AND 飲食店情報.最寄り = '{{#urlget:station}}' }} {{#if: {{#urlget:lanch-dinner}} | {{#ifeq: {{#urlget:lanch-dinner}} | lanch | {{#if: {{#urlget:budget_min}} | AND 飲食店情報.予算昼上限 >= {{#urlget:budget_min}} }} {{#if: {{#urlget:budget_max}} | AND 飲食店情報.予算昼下限 < {{#urlget:budget_max}} }}}} {{#ifeq: {{#urlget:lanch-dinner}} | dinner | {{#if: {{#urlget:budget_min}} | AND 飲食店情報.予算夜上限 >= {{#urlget:budget_min}} }} {{#if: {{#urlget:budget_max}} | AND 飲食店情報.予算夜下限 < {{#urlget:budget_max}} }} }} }} {{#ifeq: {{#urlget:smoking}} | non | AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%禁煙%') }} {{#ifeq: {{#urlget:smoking}} | allow | AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%喫煙%') AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%分煙%') }} {{#if: {{#urlget:tabehodai}} | AND 飲食店情報.食べ放題 = 1 }} {{#if: {{#urlget:nomihodai}} | AND 飲食店情報.飲み放題 = 1 }} {{#if: {{#urlget:takeout}} | AND 飲食店情報.テイクアウト = 1 }} {{#if: {{#urlget:parking}} | AND 飲食店情報.駐車場 = 1 }} {{#if: {{#urlget:privateroom}} | AND 飲食店情報.個室 = 1 }} {{#if: {{#urlget:wifi}} | AND 飲食店情報.WiFi = 'あり' }} {{#if: {{#urlget:barrierfree}} | AND 飲食店情報.バリアフリー = 1 }} {{#if: {{#urlget:kids}} | AND 飲食店情報.お子様連れ = 1 }} {{#if: {{#urlget:reserve}} | AND 飲食店情報.貸切 = 1 }} {{#if: {{#urlget:reservable}} | AND 飲食店情報.予約 = 1 }} ) }} }} {{#vardefine:page|{{#urlget:page|1}}}} {{#vardefine:limit|30}} {{#vardefine:offset| {{#expr: ({{#var:page}} - 1) * {{#var:limit}} }} }} {{#vardefine:from| {{#expr: ({{#var:page}} - 1) * {{#var:limit}} + 1 }} }} <h1 style="font-size: 1.2em;"> <strong>{{#if: {{#urlget:station}} | {{#urlget:station}} |川西市}}</strong>の<strong>{{#if: {{#urlget:genre}} | {{#urlget:genre}} |グルメ}}</strong></h1><strong style="float: right;" id="count" data-total="{{#var:hitCount}}" data-limit="{{#var:limit}}">{{#var:hitCount}} 件の結果があります({{#var:from}} 件目~) </strong> == 検索結果 == <!-- 検索実行 --> {{#cargo_query: tables=飲食店情報 |fields=飲食店情報._pageName,飲食店情報.店名,飲食店情報.画像,飲食店情報.ジャンル,飲食店情報.郵便番号,飲食店情報.住所,飲食店情報.最寄り,飲食店情報.営業時間月,飲食店情報.定休日,飲食店情報.電話番号,飲食店情報.予算昼下限,飲食店情報.予算昼上限,飲食店情報.予算夜下限,飲食店情報.予算夜上限,飲食店情報.ストリートビューURL,飲食店情報.座標 |where=( (飲食店情報.店名 LIKE CONCAT('%','{{#urlget:searchText}}','%') OR 飲食店情報.住所 LIKE CONCAT('%','{{#urlget:searchText}}','%') OR 飲食店情報.ジャンル LIKE CONCAT('%','{{#urlget:searchText}}','%')) {{#if: {{#urlget:genre}} | AND 飲食店情報.ジャンル LIKE CONCAT ('%','{{#urlget:genre}}','%') }} {{#if: {{#urlget:station}} | AND 飲食店情報.最寄り = '{{#urlget:station}}' }} {{#if: {{#urlget:lanch-dinner}} | {{#ifeq: {{#urlget:lanch-dinner}} | lanch | {{#if: {{#urlget:budget_min}} | AND 飲食店情報.予算昼上限 >= {{#urlget:budget_min}} }} {{#if: {{#urlget:budget_max}} | AND 飲食店情報.予算昼下限 < {{#urlget:budget_max}} }}}} {{#ifeq: {{#urlget:lanch-dinner}} | dinner | {{#if: {{#urlget:budget_min}} | AND 飲食店情報.予算夜上限 >= {{#urlget:budget_min}} }} {{#if: {{#urlget:budget_max}} | AND 飲食店情報.予算夜下限 < {{#urlget:budget_max}} }} }} }} {{#ifeq: {{#urlget:smoking}} | non | AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%禁煙%') }} {{#ifeq: {{#urlget:smoking}} | allow | AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%喫煙%') AND 飲食店情報.禁煙喫煙 LIKE CONCAT('%分煙%') }} {{#if: {{#urlget:tabehodai}} | AND 飲食店情報.食べ放題 = 1 }} {{#if: {{#urlget:nomihodai}} | AND 飲食店情報.飲み放題 = 1 }} {{#if: {{#urlget:takeout}} | AND 飲食店情報.テイクアウト = 1 }} {{#if: {{#urlget:parking}} | AND 飲食店情報.駐車場 = 1 }} {{#if: {{#urlget:privateroom}} | AND 飲食店情報.個室 = 1 }} {{#if: {{#urlget:wifi}} | AND 飲食店情報.WiFi = 'あり' }} {{#if: {{#urlget:barrierfree}} | AND 飲食店情報.バリアフリー = 1 }} {{#if: {{#urlget:kids}} | AND 飲食店情報.お子様連れ = 1 }} {{#if: {{#urlget:reserve}} | AND 飲食店情報.貸切 = 1 }} {{#if: {{#urlget:reservable}} | AND 飲食店情報.予約 = 1 }} ) |format=template |template=検索結果カード |named args=yes |default=該当する店舗はありません。 |limit={{#var:limit}} |offset={{#var:offset}} |order by=score DESC |more results text= }} <html> <div class="pagination"> <a data-role="first-page" href="#"><<</a> <a data-role="prev-page" href="#"><</a> <div class="page-numbers" data-role="page-numbers"></div> <a data-role="next-page" href="#">></a> <a data-role="last-page" href="#">>></a> </div> <style> .pagination { display: flex; justify-content: center; gap: 12px; margin: 24px 0; font-size: 14px; } .pagination a { display: inline-flex; align-items: center; justify-content: center; padding: 8px 14px; min-width: 40px; text-decoration: none; border-radius: 6px; border: 1px solid; transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease; } .page-numbers { display: flex; gap: 6px; } .page-numbers a { min-width: 36px; padding: 8px 0; } /* ライト・通常 */ .pagination a { background: #f9fafb; color: #1f2937; border-color: #d1d5db; } .pagination a:hover { background: #eef2f7; box-shadow: 0 1px 4px rgba(0,0,0,0.08); } /* 非活性 */ .pagination a.disabled { background: #f1f5f9; color: #94a3b8; border-color: #e2e8f0; pointer-events: none; box-shadow: none; } /* 現在ページ(数字) */ .pagination .page-numbers a.current { background: #1f2937; color: #fff; border-color: #1f2937; font-weight: 600; pointer-events: none; } /* ダーク・通常 */ .skin-theme-clientpref-night .pagination a { background: #374151; color: #f9fafb; border-color: #4b5563; } .skin-theme-clientpref-night .pagination a:hover { background: #4b5563; } /* ダーク・非活性 */ .skin-theme-clientpref-night .pagination a.disabled { background: #1f2937; color: #6b7280; border-color: #374151; } /* ダーク・現在ページ */ .skin-theme-clientpref-night .pagination .page-numbers a.current { background: #f9fafb; color: #1f2937; border-color: #f9fafb; } </style> </html> __目次非表示__
このページで使用されているテンプレート:
テンプレート:パンくずリスト
(
ソースを閲覧
)
テンプレート:ページネーション
(
ソースを閲覧
)
テンプレート:検索UI/飲食店
(
ソースを閲覧
)
テンプレート:検索UI/飲食店/styles.css
(
ソースを閲覧
)
テンプレート:検索結果カード
(
ソースを閲覧
) (保護)
テンプレート:検索結果カード/styles.css
(
ソースを閲覧
)
テンプレート:飲食店検索/script.js
(
ソースを閲覧
)
飲食店検索
に戻る。
飲食店検索のソースを表示
提供: 川西図鑑