地域コラム

地域コラム

2026年1月2日

おすすめ習い事をご紹介!

‘name’ => ‘コラム’,
‘singular_name’ => ‘コラム’,
‘add_new_item’ => ‘新しいコラムを追加’,
‘edit_item’ => ‘コラムを編集’,
‘all_items’ => ‘コラム一覧’,
],
‘public’ => true,
‘has_archive’ => false,
‘menu_position’=> 6,
‘menu_icon’ => ‘dashicons-welcome-write-blog’,
‘supports’ => [‘title’,’editor’,’thumbnail’,’excerpt’],
‘rewrite’ => [‘slug’ => ‘column’],
‘show_in_rest’ => true,
]);
});

/* =========================================================
* 2) メタ項目(コラム設定 + 教室リスト)
* =======================================================*/
add_action(‘add_meta_boxes’, function () {
add_meta_box(
‘athl_column_meta’,
‘コラム設定(一覧カード/タイトル自動生成/教室リスト)’,
‘athl_column_meta_box’,
‘athl_column’,
‘normal’,
‘high’
);
});

function athl_column_meta_box($post) {
wp_nonce_field(‘athl_column_meta_save’, ‘athl_column_meta_nonce’);

$city = get_post_meta($post->ID, ‘_athl_city’, true);
$pick_count = get_post_meta($post->ID, ‘_athl_pick_count’, true);
$skill = get_post_meta($post->ID, ‘_athl_skill’, true);
$card_img_id = get_post_meta($post->ID, ‘_athl_card_img_id’, true);

$intro_title = get_post_meta($post->ID, ‘_athl_intro_title’, true); // 任意:導入見出し
$toc_title = get_post_meta($post->ID, ‘_athl_toc_title’, true); // 任意:目次見出し
$lessons = get_post_meta($post->ID, ‘_athl_lessons’, true);
if (!is_array($lessons)) $lessons = [];

$card_img_url = $card_img_id ? wp_get_attachment_image_url($card_img_id, ‘medium’) : ”;

?>

.athl-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0 16px}
.athl-meta-field label{font-weight:700;display:block;margin-bottom:6px}
.athl-meta-field input[type=”text”], .athl-meta-field input[type=”number”]{width:100%}
.athl-cardimg-preview{display:flex;align-items:center;gap:12px;margin-top:8px}
.athl-cardimg-preview img{width:120px;height:80px;object-fit:cover;border:1px solid #ddd;border-radius:8px}
.athl-repeat{border:1px solid #ddd;border-radius:10px;padding:12px;margin:12px 0;background:#fff}
.athl-repeat h4{margin:0 0 10px}
.athl-repeat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.athl-repeat .wide{grid-column:1 / -1}
.athl-btn{display:inline-block;padding:8px 12px;border-radius:8px;border:1px solid #bbb;background:#f7f7f7;cursor:pointer}
.athl-btn-danger{border-color:#d33;background:#ffecec}
.athl-help{color:#666;margin:4px 0 0}

タイトル自動生成に使います。






未設定なら「アイキャッチ画像」を使います。




おすすめ習い事(教室)リスト(ここを増やせます)

「追加」→必要項目を入力→公開で、詳細ページに自動で並びます。

$row = is_array($row) ? $row : [];
$name = $row[‘name’] ?? ”;
$desc = $row[‘desc’] ?? ”;
$img = $row[‘img’] ?? ”;
$url = $row[‘url’] ?? ”;
$addr = $row[‘addr’] ?? ”;
$tel = $row[‘tel’] ?? ”;
$time = $row[‘time’] ?? ”;
$fee = $row[‘fee’] ?? ”;
$target = $row[‘target’] ?? ”;
$notes = $row[‘notes’] ?? ”;
?>


(function(){
const wrap = document.getElementById(‘athl_lessons_wrap’);
const addBtn = document.getElementById(‘athl_add_lesson’);

function reindex(){
const items = wrap.querySelectorAll(‘.athl-repeat’);
items.forEach((box, i) => {
box.dataset.index = i;
box.querySelectorAll(‘[data-name]’).forEach(el => {
const key = el.getAttribute(‘data-name’);
el.name = `athl_lessons[${i}][${key}]`;
});
const title = box.querySelector(‘.athl-repeat-title’);
if (title) title.textContent = `教室 #${i+1}`;
});
}

addBtn.addEventListener(‘click’, () => {
const template = document.getElementById(‘athl_lesson_template’);
const node = template.content.cloneNode(true);
wrap.appendChild(node);
reindex();
});

wrap.addEventListener(‘click’, (e) => {
if (e.target && e.target.classList.contains(‘athl_remove_lesson’)) {
e.preventDefault();
const box = e.target.closest(‘.athl-repeat’);
if (box) box.remove();
reindex();
}
});

// Media Picker for card image
const pickBtn = document.getElementById(‘athl_card_img_pick’);
const clearBtn= document.getElementById(‘athl_card_img_clear’);
const inputId = document.getElementById(‘athl_card_img_id’);
const preview = document.getElementById(‘athl_card_img_preview’);
let frame;

if (pickBtn) {
pickBtn.addEventListener(‘click’, function(e){
e.preventDefault();
if (frame) { frame.open(); return; }
frame = wp.media({
title: ‘一覧カード用の画像を選択’,
button: { text: ‘この画像を使う’ },
multiple: false
});
frame.on(‘select’, function(){
const att = frame.state().get(‘selection’).first().toJSON();
inputId.value = att.id;
preview.src = att.sizes?.medium?.url || att.url;
});
frame.open();
});
}
if (clearBtn) {
clearBtn.addEventListener(‘click’, function(e){
e.preventDefault();
inputId.value = ”;
preview.src = ”;
});
}
})();











‘desc’ => sanitize_text_field($row[‘desc’] ?? ”),
‘img’ => esc_url_raw($row[‘img’] ?? ”),
‘url’ => esc_url_raw($row[‘url’] ?? ”),
‘addr’ => sanitize_text_field($row[‘addr’] ?? ”),
‘tel’ => sanitize_text_field($row[‘tel’] ?? ”),
‘time’ => sanitize_text_field($row[‘time’] ?? ”),
‘fee’ => sanitize_text_field($row[‘fee’] ?? ”),
‘target’ => sanitize_text_field($row[‘target’] ?? ”),
‘notes’ => sanitize_text_field($row[‘notes’] ?? ”),
];
}
}

update_post_meta($post_id, ‘_athl_lessons’, $clean);
});

/* =========================================================
* 3) 一覧(固定ページ用)ショートコード
* – .athl-col-wrap{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start} .athl-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:22px} .athl-card{border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 18px rgba(0,0,0,.05);transition:.15s} .athl-card:hover{transform:translateY(-2px)} .athl-thumb{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#f2f2f2} .athl-card-body{padding:14px 14px 16px} .athl-card-title{margin:0 0 6px;font-size:16px;line-height:1.35;font-weight:800} .athl-card-date{font-size:12px;opacity:.7;margin:0 0 8px} .athl-card-excerpt{font-size:13px;opacity:.85;margin:0} .athl-side{border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:16px;background:#fff} .athl-side h3{margin:0 0 10px;font-size:15px} .athl-search{display:flex;gap:8px} .athl-search input{flex:1;border:1px solid rgba(0,0,0,.2);border-radius:10px;padding:10px 12px} .athl-search button{border:none;border-radius:10px;padding:10px 12px;cursor:pointer} .athl-mini{display:flex;gap:10px;align-items:center;margin:12px 0} .athl-mini img{width:64px;height:44px;object-fit:cover;border-radius:10px;background:#eee} .athl-mini a{font-size:13px;font-weight:700;line-height:1.3;text-decoration:none} @media (max-width: 900px){ .athl-col-wrap{grid-template-columns:1fr} .athl-grid{grid-template-columns:1fr} }


* =======================================================*/
add_shortcode(‘athl_column_grid’, function ($atts) {
$atts = shortcode_atts([
‘posts_per_page’ => 12,
‘columns’ => 2, // PCの列数(2推奨)
], $atts);

$q = new WP_Query([
‘post_type’ => ‘athl_column’,
‘posts_per_page’ => intval($atts[‘posts_per_page’]),
‘paged’ => max(1, get_query_var(‘paged’)),
]);

ob_start();
?>

.athl-col-wrap{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
.athl-grid{display:grid;grid-template-columns:repeat(, minmax(0,1fr));gap:22px}
.athl-card{border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 18px rgba(0,0,0,.05);transition:.15s}
.athl-card:hover{transform:translateY(-2px)}
.athl-thumb{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#f2f2f2}
.athl-card-body{padding:14px 14px 16px}
.athl-card-title{margin:0 0 6px;font-size:16px;line-height:1.35;font-weight:800}
.athl-card-date{font-size:12px;opacity:.7;margin:0 0 8px}
.athl-card-excerpt{font-size:13px;opacity:.85;margin:0}
.athl-side{border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:16px;background:#fff}
.athl-side h3{margin:0 0 10px;font-size:15px}
.athl-search{display:flex;gap:8px}
.athl-search input{flex:1;border:1px solid rgba(0,0,0,.2);border-radius:10px;padding:10px 12px}
.athl-search button{border:none;border-radius:10px;padding:10px 12px;cursor:pointer}
.athl-mini{display:flex;gap:10px;align-items:center;margin:12px 0}
.athl-mini img{width:64px;height:44px;object-fit:cover;border-radius:10px;background:#eee}
.athl-mini a{font-size:13px;font-weight:700;line-height:1.3;text-decoration:none}
@media (max-width: 900px){
.athl-col-wrap{grid-template-columns:1fr}
.athl-grid{grid-template-columns:1fr}
}
$id = get_the_ID();
$card_img_id = (int)get_post_meta($id, ‘_athl_card_img_id’, true);
$img_url = ”;
if ($card_img_id) $img_url = wp_get_attachment_image_url($card_img_id, ‘large’);
if (!$img_url) $img_url = get_the_post_thumbnail_url($id, ‘large’);$city = get_post_meta($id, ‘_athl_city’, true);
$pick = (int)get_post_meta($id, ‘_athl_pick_count’, true);
$skill= get_post_meta($id, ‘_athl_skill’, true);

// 自動タイトルの見え方(一覧にも反映)
$auto_title = athl_column_build_title($city, $pick, $skill);
?>

まだコラムがありません。

]);
?>
.athl-article{max-width:980px;margin:0 auto}
.athl-hero{border:1px solid rgba(0,0,0,.08);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.05)}
.athl-hero img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#f2f2f2}
.athl-hero-body{padding:18px 18px 8px}
.athl-hero-title{margin:0 0 8px;font-size:22px;line-height:1.35;font-weight:900}
.athl-hero-date{margin:0 0 14px;font-size:13px;opacity:.7}
.athl-box{margin-top:18px;border:1px solid rgba(0,0,0,.08);border-radius:16px;background:#fff;padding:16px 18px}
.athl-box h2{margin:0 0 10px;font-size:18px}
.athl-toc a{text-decoration:none}
.athl-lesson{margin-top:22px}
.athl-lesson h3{margin:0 0 10px;font-size:18px}
.athl-lesson-card{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:start;border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:14px;background:#fff}
.athl-lesson-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;background:#f2f2f2}
.athl-desc{margin:0 0 10px;opacity:.9}
.athl-table{width:100%;border-collapse:collapse;font-size:14px}
.athl-table th,.athl-table td{border-bottom:1px solid rgba(0,0,0,.08);padding:10px 8px;vertical-align:top}
.athl-table th{width:160px;opacity:.75;text-align:left}
.athl-pill{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.12);font-size:12px;opacity:.85}
@media (max-width: 760px){
.athl-lesson-card{grid-template-columns:1fr}
.athl-table th{width:120px}
}


    1. $anchor = ‘lesson-‘ . ($i+1);
    1. ?>

$name = $row[‘name’] ?? ”;
$desc = $row[‘desc’] ?? ”;
$img = $row[‘img’] ?? ”;
$url = $row[‘url’] ?? ”;
$addr = $row[‘addr’] ?? ”;
$tel = $row[‘tel’] ?? ”;
$time = $row[‘time’] ?? ”;
$fee = $row[‘fee’] ?? ”;
$target = $row[‘target’] ?? ”;
$notes = $row[‘notes’] ?? ”;
$anchor = ‘lesson-‘ . ($i+1);
?>



住所
電話
営業時間
料金
補足
公式サイト 公式サイトを見る

<?php return ob_get_clean(); }, 20); /* ========================================================= * 5) タイトル自動生成 * 「●●のおすすめ習い事●●選!○○が身につく習い事は?」 * =======================================================*/ function athl_column_build_title($city, $pick_count, $skill) { $city = trim((string)$city); $skill= trim((string)$skill); $pick_count = $pick_count ?: 15; if ($city === ” && $skill === ”) return ”; $left = $city !== ” ? $city : ‘地域’; $mid = (int)$pick_count; $right= $skill !== ” ? “{$skill}が身につく” : ‘子どもの向上心が育つ’; return “{$left}でおすすめの習い事{$mid}選!{$right}習い事は?”; }

Categories:

Tags:

Recent Posts

Recent Comments

表示できるコメントはありません。

All Categories