先頭固定(←ここの文字列も自由に変更可能。非表示にも設定可能)
🤔てがろぐヘルプ群:セットアップ方法、使い方・設定方法、カスタマイズ方法、FAQ・豆知識
※開発放言
フォロー数が増えると、私の開発モチベーションが向上するメリットもあります。(笑)
2025年1月 この範囲を時系列順で読む この範囲をファイルに出力する
🥖Re:4937◆いま初めて自分でも思いついたんですけども、IF文を使ってカテゴリ別に出力する方法を使えば、カテゴリ別に表示件数を分けることも可能な気がします。
外側スキンで [[TEGALOG]] と書かれた部分に投稿本文が(そのときの状況に応じて)出力されるわけですが、この [[TEGALOG]] をIF文で囲むこともできます。
とすると、
- [[IF(cat-info): [[TEGALOG:5]] :IF]] と書けば、カテゴリID「info」の場合は5件だけ出力
- [[IF(cat-memo): [[TEGALOG:30]] :IF]] と書けば、カテゴリID「memo」の場合は30件出力
- [[IF(-cat-info -cat-memo): [[TEGALOG]] :IF]] と書けば、カテゴリIDが「info」でも「memo」でもない場合はデフォルトの出力
どうかな……?
ただ、「infoとmemoを同時に表示する場合」では、最初に書いた方の件数が採用されてしまいますけども。(あと、他に問題のでる状況はありますかね……?)
🥖Re:4934◆どのような表示を作りたいか次第ですけども、フリースペースの分割機能を使って、「ある特定のカテゴリに限定されているときにだけ表示されるフリースペース」を設ければ、任意のメッセージを先頭(などどこでも好きな位置)に表示できます。投稿を先頭に固定するよりも掲載内容が自由な(HTMLも使えます)ので便利な可能性もあります。
🥖Re:4935◆サポートありがとうございます!
🥖Re:4938◆No.4939さんの通りです。
🥖Re:4939◆サポートありがとうございます!
🥖Re:4940◆サポートありがとうございます!私もそう思っていました。つい今し方、上記の方法を思いつくまでは。^^;(動作確認をしていないので、本当にあの方法で大丈夫かどうかはまだ分からないですけども。^^;)
🆕 Ver 4.5.2βの更新点(概要):
《▼新機能》
●スキン側からログイン状態を把握するための記法を5種類追加
《▼仕様改善》
《▼不具合修正》
なし
詳しい使い方などは、上記の開発進捗状況報告ページの記事をご覧下さい。
🍘SNSでのアナウンス:
Mastodon(Pawoo)
Bluesky
Twitter:
(ツイート埋め込み処理中...)Twitterで見る
4673(4671)によると、カテゴリ毎に件数を変えるのは現状では難しいようです。
(ぱっと思いついた方法だと、お使いのスキンをコピーして件数指定版スキンを作り、件数を指定したいカテゴリのリンク出力箇所にクエリパラメータ「skin=件数指定版のskin」を追加して適用させる、などの力技になりそうです……)
てがろぐの記事を新しい順ではなく古い順から表示させることはできますか?
てがろぐでは、カテゴリごとに記事の表示件数を変えることってできますか?
例えばカテゴリAには長文を書きたいから表示件数は1、カテゴリBはちょっとした呟きを置きたいから表示件数は20、など。
教えていただけると幸いです…。
ありがとうございます、試してみます🙇♂️
カテゴリ別表示(cat=○○)で表示した場合、固定表示が上に上がらないんですが、いい方法ご存じの方いらっしゃらないでしょうか
現在日付を未来のものにして、管理画面で日付ソートして上げ直してる状態です
総合目次を見たのですが、美味い方法が思いつかなくて、、、
4930さん
遅くなって申し訳ありません。
スキンの確認本当にありがとうございます。
また、丁寧な説明もとても助かります。
「画像一覧」以外でしておりましたので、先程教えていただいた通りにしましたところうまくいきました!
本当にありがとうございました。
id="[[POSTID]]"が必要だったのですね…!
スキンの情報ありがとうございます!
お使いのスキンを確認したところ、「画像一覧」の実現に、てがろぐの画像一覧モード(mode=picts)が使用されています。
画像一覧モードは、投稿に関係ない表示モード となるため、
「画像一覧」で、投稿単位にLightBoxのスライドの範囲を指定することはできません。
「画像一覧」以外の場合は、
skin-cover.htmlに、
4918の二つ目のコードを追加いただき、
skin-onelog.htmlの、
<articleで始まるタグの最後に、
id="[[POSTID]]"を追加いただければ、ご希望の動作になると思います。
4923でカテゴリに関する要望を出したものです。
ご教授ありがとうございます🙇♀️
教えて頂いた方法を実践してカスタマイズに成功しました。JavaScriptで出来ることも多いのですね……勉強不足でお恥ずかしい限りです。今回を機に、JavaScriptにも積極的に触れて勉強しようと思います。本当にありがとうございました!
月餅ならありますけども。🥮🥮🥮
☕Re:4921◆便利そうなスクリプトをありがとうございます!
☕Re:4923◆ご要望をありがとうございます。ご要望としては記録しておきますが、そのように設定できる機能を作るのは大変なので、ご自身でJavaScriptを書いてスキンに追加なさるのがたぶん一番早いのではないかと思います。スキンだけでなく管理画面の投稿欄でもedit.jsやedit.htmを使う方法で、任意のJavaScriptを加えられます。
てがろぐ投稿欄のカテゴリチェックボックスはinput要素で作られていますが、value="info"のようにカテゴリIDが値に含まれています。これを利用することで、『Ⓐにチェックが入ったらⒷにもチェックを入れる』というような処理はJavaScriptで実現可能です。
例えば、infoにチェックを入れたらmemoにも入れるという場合は、
document.addEventListener('DOMContentLoaded', function () {
// カテゴリID「info」のチェックボックスを取得
const infoCheckbox = document.querySelector('input[type="checkbox"][value="info"]');
// カテゴリID「memo」のチェックボックスを取得
const memoCheckbox = document.querySelector('input[type="checkbox"][value="memo"]');
// infoチェックボックスの状態が変わったら……
infoCheckbox.addEventListener('change', function () {
// memoチェックボックスの状態を infoチェックボックスに合わせる
memoCheckbox.checked = infoCheckbox.checked;
});
});
動作確認はしていないんですけども、だいたいこんな感じでいけるのではないかと思います。カテゴリID名はハードコーディングになりますから汎用的ではありませんが、自分だけで使うなら使えるのではないかと思います。(^_^;)
☕Re:4924◆[[LOOPCOUNT]]は「そのページ内で上から何番目に表示されているのか」を出すだけなので、2ページ目に行けばまたNo.1から始まりますが、その点は大丈夫ですかね……?
また、そもそも投稿単独ページでは、常に「No.1」になってしまうと思いますが。
もし「一欄外にした投稿にNo.を割り振りたくない」というご要望だとすると、そこはさすがに、現状のシステムから乖離しすぎるので実現は困難だと思います。まさしくご自身で書かれている通り、直接本文に「No.123」のようにお好きな番号を書くのが現実的ではないかと思います。いっそのこと、記事No.を表示するのをやめてしまえば良い気もしますけどもね。(^_^;)
もしくは、てがろぐを2個セットアップして、これまで一覧外にしていた投稿をすべて2つ目のてがろぐに移す方法もありそうです。それだと、1つ目のてがろぐ(全部見せる投稿だけのてがろぐ)では番号は連番になるでしょうから。
☕Re:4926◆なるほど、お知らせありがとうございます。スキン名とリンクを No.4918 の本文末尾に加えておきました。
>>4926さん
お、お言葉に甘えまして…!
pipiさんのてがろぐだけで簡易サイトを作れるスキンを利用しております…!
https://pipi.noor.jp/t/06/tegalog.cgi
お手すきの際で全然問題ありませんので!
No.4920
にししさん、ご指摘と補足ありがとうございます。
デフォルトスキンでの確認を失念しており申し訳ございません。
使用していたスキンは、X_modoki です。
No.4922さん
お試しいただきありがとうございます。
NSFWを除外するコードの方は動いてよかったです!
(範囲指定する方は、ご利用のスキンがわかれば、こちらでも確認できるかもです・・・!)
現在[[LOOPCOUNT]]で各記事のタイトルを「No.数字」としているのですが、現在の仕様だと上(新しいもの)から1~の数字になるのですが、これを逆にすることはできますか?(古いものからNo.1~にしたい、一番新しい記事を表示されている数の一番上の数字にしたい)
もともと[[COMMENT:TITLE]]で各記事にNO.数字というふうにしていたのですが、これだと一覧外にした記事の分の数字が抜けてしまう(No.123の隣にあるのがNo.125とか)になっているのが気になってしまい、[[LOOPCOUT]]に切り替えたのですが、今度は新しいものがNo.1になるのが気になってしまって…。
需要の低い要望かつ、なんなら自分で一行目に「No.数字」を書けばいいのですが……。
もしほかに対処法などがありましたらお教えしていただけると助かります。
⭐️投稿フォームに、ワンクリックで【複数カテゴリ】を選択できるフォーマット的な機能が欲しい
親カテゴリ:ギャラリー
子カテゴリ:シリーズタイトル
孫カテゴリ:ナンバリング
……というように、複数カテゴリを選択して投稿する記事があります。手動でもそこまで手間はありませんが、必要なものを選択し忘れる事があるので、事前に設定(上記の場合は親〜孫の3つをグループ化して)登録→投稿フォームでそれを呼び出せるものがあると嬉しいです🙇
4905です
Re:4915 Re:4918さん
ご丁寧にコードありがとうございます。
スライドの範囲を記事毎にしたかったのですがなぜかスライドショーではなくそのまま画像URLに飛びました…
NSFWを除外するコードは簡単に実装出来ました。
本当にありがとうございます!
Re:4920 にししさんもありがとうございます。
補足読んだのですがうまくコード解らなくてこちらでは使えませんでした……!
他の方にとって助かる情報に違いないのですが申し訳ないです。。。
今年もどうぞよろしくお願いします。
>>4920
>>4911です
https://hushigi-library.sub.jp/haihu/016.php
OGP画像生成のPHPができたので、配布を開始ししました。
①文頭のテキストを画像にしてimageフォルダに入れる
②OGP画像の個別設定は個別で記入する
この方式になってます。
年末に書いた開発近況とか諸々はこちら。
今年もよろしくお願い致します。
ちょいと放置気味ですみません。年末から今月にかけて仕事が忙しいので。_(:3」∠)_
🍔Re:4905◆残念ながら記事をまたがない専用機能(記法)は今のところありません。ただ、隣接画像を連続して閲覧させなくするにはこのへんの方法はあります。NSFWだけを除外するにはNo.4915さんがご提示下さったようなJavaScriptを活用する手がありますのでお試し下さい。
🍔Re:4911◆おぉ、製作中ですか。期待しています!(╹◡╹)ノ
🍔Re:4914,4917◆今のところ専用機能はないのですが、解決したようで良かったです。^^
🍔Re:4915◆JavaScriptの提示をどうもありがとうございます!
🍔Re:4916◆詳しい情報と解説付きのサポートをどうもありがとうございます!
🍔Re:4918◆参考情報をどうもありがとうございます。そのJavaScriptソースは、各投稿が article要素 で囲まれていることが前提になっていますね。外部で配布されているスキンが前提でしょうかね。もしよろしければそのスキンの情報も教えて頂けると、今後に読む方の参考になって(汎用的に役に立つ情報になって)ありがたいです。何にしても、詳しいお役立ち情報をありがとうございます!(╹◡╹)ノ
なお、このソースを任意のスキンでお試しになる方々のための参考情報として補足しておきますと、各投稿が <div class="onelogbox" id="…">~</div> という要素で囲まれている場合(標準スキンなどがそうです/※id属性値に投稿番号が出力されるスキンである必要があります。例えばスキンソースに id="pos[[LOOPCOUNT]]" と書かれているなど)は、No.4918さんのソースに含まれる imagelink.closest("article").id の部分を imagelink.closest("div.onelogbox").id に書き換えると良いと思います。
🍔Re:4919◆ご要望をどうもありがとうございます! 今後の参考にします。(╹◡╹)
いつもお世話になっております。
「続きを読む/畳む」ボタンの位置が変わらないよう一括で設定変更できるようになると嬉しいです。
【続きを読む】
(本文)
↓「続きを読む」押下後
【畳む】
(本文)
となるイメージです。
過去ログは拝見済みです。
4915です。
投稿2回に分かれてしまい申し訳ございません。
NSFW画像のみスライドの範囲を記事毎にしたい場合は、以下で出来ると思います。
(やり方)
利用しているスキンのskin-cover.htmlの[[JS:LIGHTBOX]]の直前に以下を追加する
<script>
document.addEventListener("DOMContentLoaded", function () {
const nsfws = document.querySelectorAll("a.nsfw");
for (let nsfw of nsfws) {
let page_id = nsfw.closest("article").id
nsfw.setAttribute("data-lightbox", "nsfw" + page_id);
}
});
</script>
NSFW画像かどうかに関わらず、スライドの範囲を記事毎にしたい場合は、追加するスクリプトを以下にすれば大丈夫です。
<script>
document.addEventListener("DOMContentLoaded", function () {
const imagelinks = document.querySelectorAll("a.imagelink");
for (let imagelink of imagelinks) {
let value = imagelink.getAttribute("data-lightbox");
if(value != null && value != "") {
let page_id = imagelink.closest("article").id
imagelink.setAttribute("data-lightbox", page_id);
}
}
});
</script>
参考スキン:X_modoki (管理者追記 2025/1/7)
4914です。
ご回答有難うございます。
JavaScriptの使用がサーバ等の理由で駄目というわけではなく、私の知識が乏しくて導入が難しいのでCGI本体側の設定で出来れば~と思っての質問でした。
ソースの記述までして頂いて有難うございます。
早速スキンに打ち込んでみましたらナビゲーションリンクのNo.が文字列に置き換わりました!
自サイトスキンのonelog.htmlのタイトルに設定されてるdiv classがonelogtitleとなっていた為、そこだけ変更しました。
(標準タイプは2行目が反映されるのにブログタイプのソースは何故反映すらされないのか半日頭を捻っていました…classの違いに気付けば単純な事でした…)
おかげ様で理想的な表示になりました。
有難うございますm(__)m
前後移動リンクなど外側スキンに投稿本文の内容を抜き出して表示させるには、現在はJavascriptを使わないと不可能です。お見かけしたというテンプレートサイトさんのスキンがJavascriptで実現しておられるのも同様の理由です。
使用しているスキンテンプレートへの導入が難しい為
の部分が、JavaScriptを使って実現すること自体がダメということでしたら以下の文章はスルーして下さい。
私は>>3855の者なのですが、3855を投稿した当時に変数を流用して<TITLE>~</TITLE>内だけじゃなくて前後移動リンクにも記事の1行目を反映するバージョンを副産物として作っていたのを思い出したので引っ張り出して来ました。
3855同様、外側スキンhtmlの最後の方にある遅延読み込みスクリプト群に下記の折りたたみ部分のソースを貼り付けるか、<script>~</script>の中身だけをjsファイルとして保存して遅延読み込みスクリプト群の所から<script src="保存したファイル名.js"></script>として呼び出せば使えるので、今ご利用中のスキンでもJavaScriptで実現することは可能なはずです。てがろぐ公式スキンのブログタイプスキンと、昔のツイッター風スキンで動作確認したものを置いておきます。
※JavaScriptを使っている都合上、記事単独ページを表示した時に一瞬だけ前後移動リンク部分に本来の「No.○○」が表示されてしまうのは仕様です。
ブログタイプスキン向け
(本文1行目をタイトルとして入力している、[[COMMENT:TITLE]]系の記法を使っているという環境向け)
<script>
window.addEventListener('load', function() {
let nowurl = location.href; //現在のURL
let singleurl = nowurl.indexOf('postid='); //記事単独表示かをURL内からpostid=の有無で判別
//postid=がURLに含まれる場合のみ実行
if( singleurl != -1){
let Basetitle = document.title; //元のページタイトルを変数に入れておく
let ArticleTitleget = document.querySelector('.logtitle'); //logtitleクラスのhtml要素を取得
let ArticleTitle = ArticleTitleget.innerText; //logtitleクラスのテキストだけ取得
document.title = Basetitle + ' - ' + ArticleTitle; //ページタイトルを元のタイトル、半角スペースとハイフン、記事タイトルを連結させたものにする
//<TITLE>タグに追加ここまで
//前後ページ移動リンクが存在するか確認(どちらか片方が無い場合もあるので)
let prevurl = document.querySelector('.prevlink') ? document.querySelector('.prevlink').href : null;
let nexturl = document.querySelector('.nextlink') ? document.querySelector('.nextlink').href : null;
if (prevurl !== null) {
fetch(prevurl).then(response => response.text()).then(data => {
let titlePREV = new DOMParser().parseFromString(data, 'text/html').querySelector('.logtitle').textContent;
document.querySelector('.prevlink').textContent = titlePREV;
});
}
if (nexturl !== null) {
fetch(nexturl).then(response => response.text()).then(data => {
let titleNEXT = new DOMParser().parseFromString(data, 'text/html').querySelector('.logtitle').textContent;
document.querySelector('.nextlink').textContent = titleNEXT;
});
}
}
});
</script>
※<TITLE>~</TITLE>に現在表示しているページの本文一行目を入れたくない場合は
document.title = Basetitle + ' - ' + ArticleTitle; //ページタイトルを元のタイトル、半角スペースとハイフン、記事タイトルを連結させたものにする
の行をコメントアウトして下さい。畳む
標準スキンや昔のツイッター風スキンなど、ブログタイプ以外のスキン向け
([[COMMENT:TITLE]]系の記法を使っていない場合。JavaScriptで投稿本文の冒頭部分から抜き出す文字数を指定する)
<script>
window.addEventListener('load', function() {
let nowurl = location.href; //現在のURL
let singleurl = nowurl.indexOf('postid='); //記事単独表示かをURL内からpostid=の有無で判別
//postid=がURLに含まれる場合のみ実行
if( singleurl != -1){
let Basetitle = document.title; //元のページタイトルを変数に入れておく
let ArticleTitleget = document.querySelector('.comment'); //commentクラスのhtml要素を取得
let ArticleTitle1 = ArticleTitleget.innerText; //commentクラスのテキストだけ取得
let textcount = 16; //ここで切り出す文字数を指定
let ArticleTitle = ArticleTitle1.substring(0, textcount); //0の部分を変えると切り出し開始位置を変更可能
document.title = Basetitle + ' - ' + ArticleTitle + '…'; //元のタイトルと連結させて最後に「…」を入れる
//<TITLE>タグに追加ここまで
//前後ページ移動リンクが存在するか確認(どちらか片方が無い場合もあるので)
let prevurl = document.querySelector('.prevlink') ? document.querySelector('.prevlink').href : null;
let nexturl = document.querySelector('.nextlink') ? document.querySelector('.nextlink').href : null;
if (prevurl !== null) {
fetch(prevurl).then(response => response.text()).then(data => {
let titlePREV1 = new DOMParser().parseFromString(data, 'text/html').querySelector('.comment').textContent; //commentクラスから取得
let titlePREV = titlePREV1.substring(0, textcount); //指定した文字数でカット
document.querySelector('.prevlink').textContent = titlePREV + '…'; //カットした前記事の文字の末尾に「…」を入れる
});
}
if (nexturl !== null) {
fetch(nexturl).then(response => response.text()).then(data => {
let titleNEXT1 = new DOMParser().parseFromString(data, 'text/html').querySelector('.comment').textContent; //commentクラスから取得
let titleNEXT = titleNEXT1.substring(0, textcount); //指定した文字数でカット
document.querySelector('.nextlink').textContent = titleNEXT + '…'; //カットした後記事の文字の末尾に「…」を入れる
});
}
}
});
</script>
※<TITLE>~</TITLE>に現在表示しているページの本文一行目を入れたくない場合は
document.title = Basetitle + ' - ' + ArticleTitle + '…'; //元のタイトルと連結させて最後に「…」を入れる
の行をコメントアウトして下さい。畳む
1時頃に一度投稿したのですが、最新の1件もしくは最古の1件を単独表示した時にうまく動かない欠陥を見つけたので削除・修正の上で再投稿しました。申し訳ございません。
横からすみません、
とりあえずNSFW画像(class="nsfw"リンク内の画像)をlightboxのスライドショーからから外す方法ですが、
以下で出来るのではと思います。
(記事内のNSFW画像をクリックして表示されるlightboxのスライドショーはNSFW画像のみのスライドショーに、通常画像をクリックして表示されるlightboxのスライドショーはNSFW画像以外のみのスライドショーになります)
NSFW用画像とその他画像のlightbox表示を分ける
aタグの「data-lightbox="tegalog"」でグループを指定しているので、NSFW画像の場合はdata-lightboxの値にデフォルト値(tegalog)以外を指定する
(やり方)
利用しているスキンのskin-cover.htmlの[[JS:LIGHTBOX]]の直前に以下を追加する
<script>
document.addEventListener("DOMContentLoaded", function () {
const nsfws = document.getElementsByClassName("nsfw");
for (let nsfw of nsfws) {
nsfw.setAttribute("data-lightbox", "nsfw");
}
});
</script>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160