お手軽一言掲示板(この辺の文章は「管理画面」の「設定」内にある「フリースペース」タブから編集できます。) RSSフィード

てがろぐ - Fumy Otegaru Memo Logger -

2025年6月27日(金) 23:26:33〔5時間前〕 更新

■No.3286, No.3285, No.3284, No.3283, No.3282, No.3281, No.3280[7件] ( 7

■フリースペース: 編集

ここは、CGIの設定画面から自由に文章を入力して掲載できるスペースです。スキンを編集しなくてもCGI上から手軽に内容を変更できます(HTML使用可)。
動作サンプルです。◆他のスキン:標準スキン, 昔のツイッターっぽいスキン(ピンク版), 付箋型スキン, シンプル日記スキン, ジャーナル(日誌)スキン, ブログタイプスキン, チャットタイプスキン, 黒板スキンてがろぐCGIの配布ページに戻る

■日付検索:

■全文検索:

or 管理画面へ

〔146文字〕 編集

No.3286 by Icon of misaki みさき 〔2年以上前〕

同人誌の頒布のお知らせ等はさんごよみを利用した方が閲覧者の感覚的に分かりやすいのでは? と思いサイトに導入してから半年ほど経ちました。

作品を作った数が少なくて活用しまくっている! とは言えませんが褒めていただくこともあります。

さんごよみのアップデートありがとうございました!

#感謝

回答/返信 〔457文字〕 編集

No.3285 by NO IMAGE にしし 〔2年以上前〕

昼食はピザ。🍕🍕🍕

🧀「てがろぐに名前変換機能を追加して欲しい」というご要望を頂いたのですけども、既存の名前変換スクリプトを利用する方法でさほど難易度は高くなさそうに感じているのですが(※私の認識が足りないだけかもしれませんが)、何か『てがろぐ側にこの機能があったら名前変換のために便利になる』というような何らかの機能はあるでしょうか?

🧀Re:3284◆ですよね……。そのご要望は当然あるだろうなとは思っていました。今のところは残念ながらその機能はないのです。てがろぐ開発の初期段階ではそもそもブログのように(CMSのように)使うことは全く想定していなかったので(1行目だけを分離する機能も構想もありませんでしたし)、投稿本文からtitle要素をどうにかする手段がないのですよね……。^^; OGPのog:titleにタイトルを引っ張ってきている方法がかなりアクロバットなのですが。それと同じ方法を使えば実装は不可能ではないと思いますので、ちょっと何か実現方法を考えてみます。気長にお待ち頂ければ幸いです。

〔412文字〕 編集

No.3284 by Icon of tomoyo ともよ 〔2年以上前〕

いつも愛用させてもらってます。設定とかざっくり目を通してみたけどよくわからなかったので質問させてください。

記事を個別表示(tegalog.cgi?postid=xx)させた際に、現在は現在は skin-cover.html の<body>〜</body>内に
<title>[[SITUATION:TITLE]] [[FREE:TITLE:MAIN]] [[FREE:TITLE:SUB]]</title>
と記述してあり、それによりブラウザのタイトル欄に「No.xx - 主タイトル 副タイトル」と表示されます
ここに「記事タイトル」となる [[COMMENT:TITLE]] を表示させられるようにできないでしょうか?

記事を個別表示させた時だけブラウザのタイトル欄に「No.xx 記事タイトル - 主タイトル 副タイトル」となるようにしたいのです。
ご返答いただければ幸いに思います。いつもありがとうございます。

回答/返信 〔2156文字〕 編集

No.3283 by NO IMAGE にしし 〔2年以上前〕

お腹が減ったのでチーズを食べました。🧀🧀🧀

🧀Re:3279◆内側スキンに「前後の投稿へ移動するリンク」を表示させてしまうと、例えば『1ページに30件の投稿を表示する』設定のとき、「前後の投稿へ移動するリンク」も30個表示されてしまいます。^^;(いや、「それで良い」というケースもある気もしますけども、たぶんご希望はそうではないですよね?^^;)No.3282さんがCSSで掲載順序を変更する方法をご提案下さいましたから、私は別解としてJavaScriptで解決する方法をご紹介致します。↓

▼記述するJavaScriptソース #🌱豆知識
外側スキンの末尾(※内側スキンではありません)に以下の9行を書くと(コメントを除けば7行ですし、scriptタグも除けば5行ですが)、ユーティリティリンクの冒頭に「前後の投稿へ移動するリンク」等がコピーされて表示されます。
<script>
let uElm = document.querySelector(".utilitylinks");
if( uElm ) {
   // ユーティリティリンク枠が存在する場合のみ
   let pnElm = document.querySelector(".pagenavi");
   // ナビゲーションリンクのコピーを、ユーティリティリンクの頭に挿入する
   uElm.innerHTML = pnElm.innerHTML + uElm.innerHTML;
}
</script>

※変数名 uElm は utility Element の略で、pnElm は page navi Element の略のつもりです。

▼簡単な解説
やっていることは簡単で、
  • 2行目は、ユーティリティリンク枠を作っている要素 <div class="utilitylinks"> を取得しています。
  • 3行目は、ユーティリティリンク枠が存在するかどうかを調べています。(存在しないときは何も処理しません。)
  • 5行目は、ページナビゲーション(移動リンク)部分を作っている <div class="pagenavi"> を取得しています。
  • 7行目は、『ユーティリティリンク枠の中身(HTML)』を、『ページナビゲーションの中身(HTML) + ユーティリティリンク枠の中身(HTML)』に差し替えています。

この結果、ユーティリティリンクの冒頭に「前後の投稿へ移動するリンク」等がコピーされて表示されます。(元々あるナビゲーションリンクは元のまま存在し続けます。)

▼class名の注意
なお、ナビゲーションリンクを作っている要素のclass名が .pagenavi なのは、標準添付の各スキンでの例なので、お使いのスキンで記述されているclass名が異なる場合には、5行目の .pagenavi の部分はそれに合わせて書き換える必要があります。(同一ページ内に2回以上使われているclass名の場合は、最初の方の中身だけが取得されます。)

▼補足
上記のソースをそのまま使うと、「ユーティリティリンク枠の冒頭」にナビゲーションリンクが加わります。
そうではなくて、ユーティリティリンク枠よりも前にナビゲーションリンクを表示したい場合は、6~7行目を以下のように差し替えて下さい。
   // ナビゲーションリンクのコピーを、ユーティリティリンクのに挿入する
   uElm.outerHTML = pnElm.outerHTML + uElm.outerHTML;

さらに、「元々存在していた方のナビゲーションリンクを消したい場合は、さらに続けて以下の1行を加えて下さい。
   pnElm.outerHTML = '';

以上です。
……ここまで書いてから思ったんですが、「ナビゲーションリンクをコピーしてユーティリティリンク枠の上に加える」よりも、「ユーティリティリンク枠をコピーして、ナビゲーションリンクの下に貼り付けて、元々のユーティリティリンク枠は消す」という方が(スキンの作り方によっては)配置調整の自由度が高いかもしれないな……、とふと思いました。^^;

🧀Re:3281◆ご期待に添えなくてすみません。最近のリッチなCMSだとそういうのはできて当然だとも思うのですけども、その分たくさんのJavaScriptが動いているのだろうな……と思います(調べてはいませんが)。てがろぐは、使用面での手軽さもそうですが、動作面の軽さも重視したいと思っておりまして、かつ、開発者(=私)の手軽さもそこそこ重視しながら開発しております(^_^;)のでご理解頂ければ幸いです。需要はあるとは思いますので、何か良い実装方法が思いついたら試してみます。(╹◡╹)

🧀Re:3282,3280◆サンプルソースのご提示をどうもありがとうございます! 最初、CSSでどうにかならんかな……と思いつつも思いつかなかったのでJavaScriptでの解決方法で試してしまいましたが、たしかにページ全体に対して順序を指定し直せばCSSだけで実現できますね!

〔326文字〕 編集

No.3282 by Icon of admin あどみ 〔2年以上前〕

>>3279
にししさんじゃないですがCSSのdisplay:flexを使う方法もあります。標準スキンで説明すると
.contents .mainarea {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.situation {
~略~
order:1;
}
.onelogbox {
~略~
order:2;
}
.utilitylinks {
~略~
order:4;
}
.pagenavi {
~略~
order:3;
}
~略~は元々あるCSSです。display: flex;を指定した要素の子要素にorder:数字;で順序を入れ替えることができます。

〔107文字〕 編集

No.3281 by Icon of admin あどみ 〔2年以上前〕

>>3277,>>3278
こんばんは、>>3275です。なるほどシンプルそうに見えて実は複雑な処理が必要なのですね。それではアドバイスいただいた機能を上手に使っていこうと思います。ご返信ありがとうございました!🙇

〔57文字〕 編集

No.3280 by Icon of admin あどみ 〔2年以上前〕

>>3279
にししさんじゃないですが、CSS(positionプロパティ)で位置調整したらなんとかなりそうです。

■日付一覧:

■カレンダー:

2022年11月
12345
6789101112
13141516171819
20212223242526
27282930

■最近の投稿:

■新着画像リスト:

Perlのバージョンを上げる設定(さくらインターネット)

全318個 (総容量 36.17MB)

■複合全文検索:

  • 投稿者名:
  • 投稿年月:
  • #タグ:
  • カテゴリ:
  • 出力順序:

ランダムに1件を見る / ギャラリーモードで表示 / 画像一覧モードで表示 / サイトマップモードで表示 / 時系列順で表示する

動作サンプルです。 ご自由にお試し下さい。パスワードguest管理画面もお試し頂けます。
■いま見ているスキンは「ジャーナル(日誌)スキン」です。他に、 標準スキン昔のツイッターっぽいスキン(ブルー)昔のツイッターっぽいスキン(ピンク)付箋型スキンシンプル版スキンブログタイプスキン(タイトル付きブログっぽくできるスキン)、 黒板スキンチャットタイプスキンがあります。
てがろぐCGIの配布・解説ページに戻る