【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文字分左に戻しています。

【字下げ　パディング】

使ったテクニックは、ブロックエディタの中でブロック編集に入って、段落に対してパディング設定してやり、段落としています（添付画像ご覧ください）。

１。ブロック選択
２。半分黒い○(スタイル設定)を選択
３。サイズの横の➕クリック
４。パディング選択
５。水平方向パディング量の選択

【スタイル設定でできること】

１。テキストと背景の色設定
２。タイポグラフィ
　　タイポグラフィとは、文章や文字を読みやすく、見た目に美しく配置する技術であり、同時に文字をデザイン要素として活用して表現を豊かにする技術でもあります。もともとは活字を組版して印刷物を作る技術でしたが、現在ではWebデザインなど幅広い分野で、書体（フォント）の選択、文字のサイズ・太さ、行間・文字間隔の調整、全体のレイアウトなどを工夫することで、情報伝達力やブランドイメージの向上に不可欠な要素となっています。
３。サイズ
４。枠線

【子テーマ追加】

子テーマ追加　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: 198