ホームページ作成に関する説明

目　次

【Topicsの年度別表示】参考

Topicsの年度別表示は、タグの「年」と「Topics」でコントロールする。
投稿時には、「年」と「Topics」を付けておき、「報告」がアップされたら、「案内」から「Topics」タグを外し、Topicsに表示されないようにする。
[ catlist orderby=title excerpt=yes title_class=”lcp_title” order=desc id=-28 tags=”2024+Topics” numberposts=100 ]
使用時は、[ catlistの[の後ろのスペースを削除する。また、numberposts=100 ]の]の前のスペースも外す。

orderby=title　タイトルに06月01日と入れて日付順に並ぶようにする。月と日の前の０は、並べるために必要。
orderby=post_date　投稿ページで登録した実施日基準で並べる指定。
orderby=date　投稿日基準で並べる指定。投稿日は、手動で変更できる。
excerpt=yes　抜粋表示指定（投稿ページで抜粋を入力する）
title_class=”lcp_title”　記事の色を変えるためのcssで使うclassの設定
order=desc　　降順で並べる指定。
id=-28は、「会員の広場」カテゴリのidでの除外指定。
tags=”2024+Topics”　タグが2024とTopicsの記事を表示する指定。
numberposts=100　　投稿を100個並べる指定。デフォルトは10個。

【記事の文字色指定catlist】

.lcp_catlist{
font-size: 20px; /* 文字サイズ指定 */
color: “#0000ff”; / *文字色指定 */
}
cssに記述する

【字下げ】

.zisage{

padding-left:1em;text-indent:-1em;
}
cssに記述する。

①まずは「padding-left」で左側に1文字分の余白を作り出して右側にずらし、
②その後「text-indent」で１行目だけ同じ1文字分左に戻しています。

【子テーマ追加】

子テーマ追加　2024年6月7日　Lightning-child

【背景画像】参考

下記のurlに集約して保管（Bcg_ktcmg.jpgはゴルフの事例）
サーバー変更時は、このフォルダーを移動し、関連urlを変更する必要あり。
https://ktcm-kobe.com/sozai/wp_haikeigazou/Bcg_ktcmg.jpg

【ウイジェット　サイドバー】参考

サイドバートップページ外観から入る

機械クラブの目的等を表示

【スクロールバーを表示させる】参考

CSSでoverflowを指定する。

Lightningの場合

.subSection { overflow:auto; height: 50vh; }

参考URL

https://ja.wordpress.org/support/topic/%E3%82%B5%E3%82%A4%E3%83%89%E3%83%90%E3%83%BC%E3%81%AE%E5%9B%BA%E5%AE%9A%E3%83%9A%E3%83%BC%E3%82%B8%E4%B8%80%E8%A6%A7%E3%81%AB%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E3%83%90%E3%83%BC%E3%82%92

【デベロッパーツール】参考

https://ushigyu.jp/chrome-developer-tool

【会費納入アニメーション】参考

cssアニメーションにより実現した。Javaではない。

【訪問者カウンター】参考

クラッシックエディターモードでFC2カウンターJava Scriptを直接書き込んだ。
divタグで囲む必要がある。

<div>

<!-- FC2カウンター ここから -->
<script language="javascript" type="text/javascript" src="//counter1.fc2.com/counter.php?id=39612760&main=1"></script>
<noscript><img src="//counter1.fc2.com/counter_img.php?id=39612760&main=1" /></noscript></br>
<!-- FC2カウンター ここまで -->

</div>

【行事Topics】参考

2024年カテゴリの「会員の広場」でタグの「2024 and Topics」を表示

[ catlist name=’会員の広場’ orderby=title order=desc tags=”2024+topics” numberposts=100 ]
投稿時には、「年」と「Topics」を付けておき、「報告」がアップされたら、「案内」から「Topics」タグを外し、Topicsに表示されないようにする。

2023年カテゴリの「会員の広場」でタグの「2023 and Topics」を表示　

[ catlist name=’会員の広場’ orderby=title order=desc tags=”2023+topics” numberposts=100 ]
投稿時には、「年」と「Topics」を付けておき、「報告」がアップされたら、「案内」から「Topics」タグを外し、Topicsに表示されないようにする。

【機械クラブ表彰歴代受賞者リスト】

2002(H14)の前に不要な黒い縦棒が入っており、その次の行の冨田佳宏、安達泰治が字下げになっていません。どうすればなおるでしょうか。

原因は
「WordPressのLightningテーマのデフォルト設定値（特にスタイルシート）のデザインセンスが悪い」、ということのようです。

分析をして、このページだけスタイルシートの設定を上書きしてみました。
方法はブロックエディタの編集画面で、一番下までスクロールダウンすると、「目次」セクションの上に「CustomCSS」というのがありますが、そちらに上書き設定するようにスタイルシートを書き込みました。
その設定は、このページにだけ有効なものです。　他に影響を与えませんので、ここをいじるのが対応策です。

dl,dt,dd {
    border-left-style: none;
    white-space: nowrap;
    padding-left: 10px;
}
dt {
    font-weight: 700;
    display: inline;
}
dd {
    margin-left: 1em;
}

という部分で、いま最適設定を試行錯誤しながら探していますが、根本的に効いているのは
dl,dt,dd の　border-left-style: none;　と　dd の　margin-left: 1em;　です。
Lightningテーマのオリジナルは
dd, dt {
    border-left-width: 2px;
    border-left-style: solid;
であるため縦線が出たり、かつ
dd {
    display: block;
    margin-inline-start: 40px;
であるため、インデントしないなどが起こり、結果、添付いただいた画像のようなセンスのない
表示になってしまったということです。それらを打ち消して、このページだけ強制的に別の見え方に
するためにCustomCSSに設定を加えているということです。

Post Views: 157