てがろぐ
- Fumy Otegaru Memo Logger -
カテゴリ「カテゴリなし」の投稿［3876件］
こんにちわ。
>>5192の折畳ラベルについて書いた者です。
も、もうアップデートされてる！？とびっくりしました！
さっそくバージョンアップさせていただきました。
更に使いやすくなり、嬉しい限りです。
これからもてがろぐライフを楽しみたいと思います。
ありがとうございました！
>>5192の折畳ラベルについて書いた者です。
も、もうアップデートされてる！？とびっくりしました！
さっそくバージョンアップさせていただきました。
更に使いやすくなり、嬉しい限りです。
これからもてがろぐライフを楽しみたいと思います。
ありがとうございました！
続きを読む
てす
ラベル
折り畳まれる内容
てがろぐにはいつもお世話になっています。
折り畳み（[O:～）機能なのですが、機能ボタンを使った時、隠す（[H:～）機能と同じくラベル入力なしでも挿入できるようにしてもらえると嬉しいです。
毎回ラベルを変える訳でもなくデフォルトで入るラベルで充分なので…
それなら隠す機能でいいのでは？と言われてしまいそうですが、これは私の都合でしかないのですが、てがろぐ外の自サイトで同じ折り畳みタグを多用しているので合わせたいのもありまして。
（ですのでてがろぐで折り畳み機能が追加されてめちゃくちゃ嬉しかったです！）
もし何か理由あってのラベル必須項目なら申し訳ないです。
折り畳み（[O:～）機能なのですが、機能ボタンを使った時、隠す（[H:～）機能と同じくラベル入力なしでも挿入できるようにしてもらえると嬉しいです。
毎回ラベルを変える訳でもなくデフォルトで入るラベルで充分なので…
それなら隠す機能でいいのでは？と言われてしまいそうですが、これは私の都合でしかないのですが、てがろぐ外の自サイトで同じ折り畳みタグを多用しているので合わせたいのもありまして。
（ですのでてがろぐで折り畳み機能が追加されてめちゃくちゃ嬉しかったです！）
もし何か理由あってのラベル必須項目なら申し訳ないです。
>>5189
No.5178の者です、お返事ありがとうございます。確認が遅れ大変失礼いたしました。
個人的には30MB以上のデータサイズでも対応できるようにして頂けるならありがたいのですが、サーバーへの負荷や操作ミスのリスクを考えると難しいところですね…
今後大きなサイズのイラストを投稿するときはFTPを利用するようにします。
お忙しい中お手数をおかけしました。
No.5178の者です、お返事ありがとうございます。確認が遅れ大変失礼いたしました。
個人的には30MB以上のデータサイズでも対応できるようにして頂けるならありがたいのですが、サーバーへの負荷や操作ミスのリスクを考えると難しいところですね…
今後大きなサイズのイラストを投稿するときはFTPを利用するようにします。
お忙しい中お手数をおかけしました。
No.5181の日付についての質問をした者です。
無事にやりたかった動きになりました。にしし様、5185様、本当にありがとうございました！
無事にやりたかった動きになりました。にしし様、5185様、本当にありがとうございました！
てがろぐCGIを Ver 4.6.0 等にバージョンアップした結果として 500 Internal Server Error になる場合：
（※Ver 4.5.3β以降で発生します。）
もし、サーバのコントロールパネルからPerlのバージョンを切り替えられる場合で、切り替えても問題ないなら、Perl 5.10.x 以降のバージョンにして下さい。そうすると、正常稼働するようになります。
例えば、さくらインターネットのサーバなら下記の場所（コントロールパネル→スクリプト設定→言語バージョン設定）で切り替えられます。特に不都合がなければ『標準のPerl[推奨]』に切り替えると望ましいですが、最低でもPerl 5.10 以上にすれば問題ありません。
Perlのバージョンを上げる設定(さくらインターネット)
なお、他に稼働させているCGIの都合でPerlのバージョンを上げられない場合は、次に公開するてがろぐの新バージョンをお待ち下さい。こちらのローカルにあるソースでは、Perl 5.10.x 未満でエラーになる記述を修正しましたので、次のバージョンからは Perl 5.8.9 のような古いPerlでも正常稼働するようになります。
※Ver 4.5.3β以降で発生していた問題なので、この間に 4.5.3、4.5.4、4.5.5、4.5.6、4.5.7 のβ版を挟んでいたわけですが、全く報告がなかったことからして、β版をご試用の方々はみなさんわりと新しいバージョンをご使用ということなんでしょうね。(^_^;) 私もそういえば、Perl 5.8.9では動作確認をしていませんでした。
（※Ver 4.5.3β以降で発生します。）
もし、サーバのコントロールパネルからPerlのバージョンを切り替えられる場合で、切り替えても問題ないなら、Perl 5.10.x 以降のバージョンにして下さい。そうすると、正常稼働するようになります。
例えば、さくらインターネットのサーバなら下記の場所（コントロールパネル→スクリプト設定→言語バージョン設定）で切り替えられます。特に不都合がなければ『標準のPerl[推奨]』に切り替えると望ましいですが、最低でもPerl 5.10 以上にすれば問題ありません。
なお、他に稼働させているCGIの都合でPerlのバージョンを上げられない場合は、次に公開するてがろぐの新バージョンをお待ち下さい。こちらのローカルにあるソースでは、Perl 5.10.x 未満でエラーになる記述を修正しましたので、次のバージョンからは Perl 5.8.9 のような古いPerlでも正常稼働するようになります。
※Ver 4.5.3β以降で発生していた問題なので、この間に 4.5.3、4.5.4、4.5.5、4.5.6、4.5.7 のβ版を挟んでいたわけですが、全く報告がなかったことからして、β版をご試用の方々はみなさんわりと新しいバージョンをご使用ということなんでしょうね。(^_^;) 私もそういえば、Perl 5.8.9では動作確認をしていませんでした。
はじめまして。
自サイトの方で一言ツール＋簡易イラスト置き場として「てがログ」を利用させていただいている者です。PCからもスマホからも手軽に更新できるのが便利で凄く重宝しております。素敵なスクリプトをありがとうございます！
現在てがろぐ4.5を使用しているのですが、4.6へのアップデートを行うと500エラーが表示されるようになってしまいました。
Tegupでの自動バージョンアップ、最新版をサイトから落としてきてFTPソフトで上書きする方法の両方を試しましたがどちらも500エラーになります。Tegupでは正常にバージョンアップが完了しましたという表示が出たあと、サイトに戻るとエラー画面となります。
cgiやphp部分の改造は特に行っておらずスキンまわりを弄っているだけなのですが（外部から「いいねボタン・改」というスクリプトを引っ張ってきていますがスキンに表示を追加するのみの調整です）、500エラーが出る原因となりそうな箇所などもしありましたらご教授いただけますでしょうか。
下記が実際に設置しているURLとなります。お忙しい中恐縮ですが、どうぞよろしくお願いいたします。
（設置先はさくらインターネットになります）
https://blue-black.sakura.ne.jp/blue/tega/tegalog.cgi
自サイトの方で一言ツール＋簡易イラスト置き場として「てがログ」を利用させていただいている者です。PCからもスマホからも手軽に更新できるのが便利で凄く重宝しております。素敵なスクリプトをありがとうございます！
現在てがろぐ4.5を使用しているのですが、4.6へのアップデートを行うと500エラーが表示されるようになってしまいました。
Tegupでの自動バージョンアップ、最新版をサイトから落としてきてFTPソフトで上書きする方法の両方を試しましたがどちらも500エラーになります。Tegupでは正常にバージョンアップが完了しましたという表示が出たあと、サイトに戻るとエラー画面となります。
cgiやphp部分の改造は特に行っておらずスキンまわりを弄っているだけなのですが（外部から「いいねボタン・改」というスクリプトを引っ張ってきていますがスキンに表示を追加するのみの調整です）、500エラーが出る原因となりそうな箇所などもしありましたらご教授いただけますでしょうか。
下記が実際に設置しているURLとなります。お忙しい中恐縮ですが、どうぞよろしくお願いいたします。
（設置先はさくらインターネットになります）
https://blue-black.sakura.ne.jp/blue/tega/tegalog.cgi
シューアイスを食べようかな……どうしようかな……と迷って、腹の脂肪具合と相談して、とりあえず見送りました。_(:3」∠)_
🧊Re:5185◆おぉ、それはスマートなアルゴリズムですね！ たしかに、JavaScriptが解釈しやすい日付フォーマットでdata-属性に出力しておいて現在日時と比較する方法なら、てがろぐの現状の仕様だけで簡単に（任意の）経過時間が計算できますね。
というわけで、No.5181さんは、ぜひ以下の手順で試してみて下さい。
実際の動作テストはしていないのですが、JavaScriptソースを読んだ限りではいけそうな気がします。
なお、「24時間」の閾値を変更したい場合は、ソース中の if (diffHours >= 24) の「24」の部分を修正すれば良いです。
🧊Re:5185◆おぉ、それはスマートなアルゴリズムですね！ たしかに、JavaScriptが解釈しやすい日付フォーマットでdata-属性に出力しておいて現在日時と比較する方法なら、てがろぐの現状の仕様だけで簡単に（任意の）経過時間が計算できますね。
というわけで、No.5181さんは、ぜひ以下の手順で試してみて下さい。
--- ▼Step①: ---
まず、内側スキンで相対時刻を掲載したい箇所に
<span data-published="[[DATE:Y-M-D]]T[[DATE:h:m:s]]">[[DATE:《A》]]</span>
……と書いておきます。
（※data-published属性値は ISO 8601 のローカル時刻形式「YYYY-MM-DDThh:mm:ss」になるようにしています。）
--- ▼Step②: ---
次に、外側スキンに『日時情報を比較して非表示にするJavaScript』を書きます。
具体的には、このリンク先で閲覧できるChatGPTとの一連の会話をご覧下さい。
この会話の最後に提示されているソース（全20行）をコピー＆ペーストして使って下さい。（注：最初のソースではなく最後のソースです。）
（なぜISO 8601フォーマットにしたのかの理由が会話の途中で分かります。^^;）
実際の動作テストはしていないのですが、JavaScriptソースを読んだ限りではいけそうな気がします。
なお、「24時間」の閾値を変更したい場合は、ソース中の if (diffHours >= 24) の「24」の部分を修正すれば良いです。
投稿時間から24時間以上経過した場合に非表示にするだけだったら
javascriptで内側スキンに日時を表示するspan要素に相対時間表示（[[DATE:A]]）を入れて、
span要素にdata属性でdata-publishedなどの中に[[DATE:Y/M/D W h:m]]などを与える
現在時刻をnew Dateで作った後data-publishedに与えた日時と比較して24時間(60*60*24=86400秒)以上だったら
style属性にdisplay:noneを付与する（または最初にnone属性を与えておいてblockに変更する）とかでも実装できそうかなと思いました
実際のコードは書いてないのであくまでも考えてみただけですが……
javascriptで内側スキンに日時を表示するspan要素に相対時間表示（[[DATE:A]]）を入れて、
span要素にdata属性でdata-publishedなどの中に[[DATE:Y/M/D W h:m]]などを与える
現在時刻をnew Dateで作った後data-publishedに与えた日時と比較して24時間(60*60*24=86400秒)以上だったら
style属性にdisplay:noneを付与する（または最初にnone属性を与えておいてblockに変更する）とかでも実装できそうかなと思いました
実際のコードは書いてないのであくまでも考えてみただけですが……
あいうえお
tesuto
(Loading...)...
SkebへのカードリンクがダメなのってSkeb側の仕様なんですかね……
(Loading...)...
SkebへのカードリンクがダメなのってSkeb側の仕様なんですかね……
検索して探したのですがなかなか見つからなかったので、こちらにて失礼します。経過時間(相対時間)表記機能について質問です。[[DATE:《A》]] を使ってn秒前やm分前という表示を24時間以内の時だけ表示させ、24時間を過ぎたら非表示にしたいのですが、この場合はどこを設定すればできますか？
経過時間の表記変更は設定の項目でできる事は分かったのですが、一定時間後に非表示にするなどの方法が探してもなかなか見つからなくこちらで質問させて頂きました。
お忙しいところ恐れ入りますが何卒よろしくお願い致します。
経過時間の表記変更は設定の項目でできる事は分かったのですが、一定時間後に非表示にするなどの方法が探してもなかなか見つからなくこちらで質問させて頂きました。
お忙しいところ恐れ入りますが何卒よろしくお願い致します。
5174/5176です。要望、ご検討いただきありがとうございます。
また、余談とのことでしたが、具体的な対応策を詳細にご教示いただき、ありがとうございました。何度も読み返させていただきました。
少し前に、同じく手作業で1000件ほど、SNSの投稿データをてがろぐに移動させたことがあったものですから、300件くらいなら…と、感覚が麻痺してしまっていたような状態でした。
でも、やはり何かしら効率化は【できる】し、恐らく自分の勉強のために、【やるべき】でもあるのだなと猛省いたしました。ご想像のとおり、プログラミング言語やAIとは縁遠い人生でしたので、これを機にもう少し、勉強してみようと思います。
この度は色々とお時間を割いていただき、誠にありがとうございました。
また、余談とのことでしたが、具体的な対応策を詳細にご教示いただき、ありがとうございました。何度も読み返させていただきました。
少し前に、同じく手作業で1000件ほど、SNSの投稿データをてがろぐに移動させたことがあったものですから、300件くらいなら…と、感覚が麻痺してしまっていたような状態でした。
でも、やはり何かしら効率化は【できる】し、恐らく自分の勉強のために、【やるべき】でもあるのだなと猛省いたしました。ご想像のとおり、プログラミング言語やAIとは縁遠い人生でしたので、これを機にもう少し、勉強してみようと思います。
この度は色々とお時間を割いていただき、誠にありがとうございました。
5174です。ご返信痛み入ります。
先の投稿があまりにも言葉足らずだったなと反省しましたので、背景情報を補足させていただきます。
・今回やりたかったこと: 既にブログとして稼働中＆公開中のてがろぐに、よそのブログから過去の投稿(300件ほど)を移設する
・移設元のブログにはエクスポート機能がない
件数が多いため、当初は tegalog.xml を編集する方法を考えましたが、上記の条件から、
・既にあるファイルをさわって壊してしまう不安
・そもそも移設元ブログから加工しやすい形でデータを取ってこれないため、それなら不慣れなテキストエディタでこわごわデータを加工するより、移設元ブログの記事編集画面とてがろぐの投稿画面を横に並べて、1投稿ずつ日時・タイトル・本文をそれぞれコピペで移す方が不安もなく、恐らくスピードもはやい
・さらに、てがろぐの「投稿の一括調整」をかければ、日付順に並べ替えて再採番もできる＝やりたいことはブラウザ上で全てかなう
ということで、今回は手作業で移設作業を行いました。
かなり特殊なケースかと思いますし、私自身は今回の作業は既に完了済みのため、どうしても今すぐ必要というわけではないのですが、今後また似たような作業が発生したときに(現在、あらゆるSNSやブログの投稿を、てがろぐ一箇所に集約しようと画策中のため)、もし日時ボタンが常時表示できるようになっていたら作業スピードを上げられそうだと思い、要望として書かせていただきました。
先の投稿があまりにも言葉足らずだったなと反省しましたので、背景情報を補足させていただきます。
・今回やりたかったこと: 既にブログとして稼働中＆公開中のてがろぐに、よそのブログから過去の投稿(300件ほど)を移設する
・移設元のブログにはエクスポート機能がない
件数が多いため、当初は tegalog.xml を編集する方法を考えましたが、上記の条件から、
・既にあるファイルをさわって壊してしまう不安
・そもそも移設元ブログから加工しやすい形でデータを取ってこれないため、それなら不慣れなテキストエディタでこわごわデータを加工するより、移設元ブログの記事編集画面とてがろぐの投稿画面を横に並べて、1投稿ずつ日時・タイトル・本文をそれぞれコピペで移す方が不安もなく、恐らくスピードもはやい
・さらに、てがろぐの「投稿の一括調整」をかければ、日付順に並べ替えて再採番もできる＝やりたいことはブラウザ上で全てかなう
ということで、今回は手作業で移設作業を行いました。
かなり特殊なケースかと思いますし、私自身は今回の作業は既に完了済みのため、どうしても今すぐ必要というわけではないのですが、今後また似たような作業が発生したときに(現在、あらゆるSNSやブログの投稿を、てがろぐ一箇所に集約しようと画策中のため)、もし日時ボタンが常時表示できるようになっていたら作業スピードを上げられそうだと思い、要望として書かせていただきました。
日々お世話になっております。
要望なのですが、投稿の入力欄の「日時」ボタンも、設定で「最初から展開しておく(常時表示)」ができるようになりますと非常に有難いです。
具体的な理由としましては、他ブログ等の投稿を複数手作業でインポートする際、毎回日時ボタンを展開する手間が省けるためです。
さらに可能であれば、たとえば日時が「2025/5/14 0:00:00」だった場合、自動でゼロ埋めして「2025/05/14 00:00:00」として投稿できる(エラーで弾かれない)ようになると、より助かります。
ご検討よろしくお願いいたします。
要望なのですが、投稿の入力欄の「日時」ボタンも、設定で「最初から展開しておく(常時表示)」ができるようになりますと非常に有難いです。
具体的な理由としましては、他ブログ等の投稿を複数手作業でインポートする際、毎回日時ボタンを展開する手間が省けるためです。
さらに可能であれば、たとえば日時が「2025/5/14 0:00:00」だった場合、自動でゼロ埋めして「2025/05/14 00:00:00」として投稿できる(エラーで弾かれない)ようになると、より助かります。
ご検討よろしくお願いいたします。
test
折り畳みテスト
テストだよ。
だよ。
だよ。
だよ。
だよ。
だよ。
だよ。
Ver 4.6.1βアップデートしました。details＋summary要素の折り畳み機能実装嬉しいです！従来の[H:～]記法のボタンと同じような見た目になるCSSを追加して使ってみました。開閉アニメーションのjavascriptなども試してみようと思います。ありがとうございます！
details要素＋summary要素で実現される「折り畳む」機能を搭載した Ver 4.6.1β(未配布)の動作テスト。
JavaScriptなしで動作する点も良いですね。装飾はCSS次第で好きなようにできます。
ここの動作試験場では、標準スキンにしか(まだ)CSSを用意していません。が、details要素＋summary要素はHTMLだけで動作しますから、CSSがなくても（単に装飾がないだけで）動作はします。
折り畳み
折り畳み表示のテスト
こんな感じで見えます。
こんな感じで見えます。
ラベルはその都度指定します
もちろん、1投稿内にいくつでも書けます。
入れ子にもできます
ただし、details要素はspan要素等のインライン要素の内側に書くとHTMLの文法的に正しくなくなるため、そのように文字装飾を書いてしまうと直前のCSSが意図通りに適用されなくなる問題がある点に注意が必要です。
JavaScriptなしで動作する点も良いですね。装飾はCSS次第で好きなようにできます。
ここの動作試験場では、標準スキンにしか(まだ)CSSを用意していません。が、details要素＋summary要素はHTMLだけで動作しますから、CSSがなくても（単に装飾がないだけで）動作はします。
>>5168
修正ありがとうございます！お疲れ様です。
1行単位のフリースペース、私はあると助かります！
それと現在特定の自由装飾をjsでdetails+summayに変換して隠す機能の代わりに使ってるので、もし公式で実装されるとすごくすごく嬉しいです！！！
修正ありがとうございます！お疲れ様です。
1行単位のフリースペース、私はあると助かります！
それと現在特定の自由装飾をjsでdetails+summayに変換して隠す機能の代わりに使ってるので、もし公式で実装されるとすごくすごく嬉しいです！！！
5166です。たびたびすみません…。
5166後半の「画像拡張子で検索をした時に、続きを読むボタンを押すと画像拡大スクリプトが動作してしまう」件は、<a>タグのリンク先URLの末尾が画像の拡張子かどうかを先にjavascriptで判定してから画像拡大スクリプトを実行するようにしたら自己解決できました。お騒がせしました。
同じようなことをしたい方が他にいるかは不明ですが、一応解決方法を書いておきます。
外側スキンに書く遅延読み込みスクリプト群を下記のコードにする。
baguetteBox.jsの動作除外用クラスに「uc-nomodal」を指定しています
<script src="baguetteBox.min.js"></script>
<script type="text/javascript">
window.onload = function() {
// 画像拡張子の正規表現
var imageExtensions = /\.(jpg|jpeg|png|gif|webp)$/i;
// すべての `.comment` クラスを持つ `a` タグを取得
var links = document.querySelectorAll('.comment a');
// リンク先URL末尾が画像拡張子になっているリンクがあるかチェック
var hasImageLinks = false;
links.forEach(function(link) {
if (imageExtensions.test(link.href)) {
hasImageLinks = true;
} else {
// 末尾が画像拡張子じゃなければignoreClassで指定するものと同じ除外用クラスを追加
link.classList.add('uc-nomodal');
}
});
// リンク先URL末尾が画像拡張子の場合のみbaguetteBox.jsを実行、uc-nomodalクラスは除外
if (hasImageLinks) {
baguetteBox.run('.comment', {
ignoreClass: 'uc-nomodal'
});
}
};
</script>畳む
5166後半の「画像拡張子で検索をした時に、続きを読むボタンを押すと画像拡大スクリプトが動作してしまう」件は、<a>タグのリンク先URLの末尾が画像の拡張子かどうかを先にjavascriptで判定してから画像拡大スクリプトを実行するようにしたら自己解決できました。お騒がせしました。
同じようなことをしたい方が他にいるかは不明ですが、一応解決方法を書いておきます。
外側スキンに書く遅延読み込みスクリプト群を下記のコードにする。
baguetteBox.jsの動作除外用クラスに「uc-nomodal」を指定しています
<script src="baguetteBox.min.js"></script>
<script type="text/javascript">
window.onload = function() {
// 画像拡張子の正規表現
var imageExtensions = /\.(jpg|jpeg|png|gif|webp)$/i;
// すべての `.comment` クラスを持つ `a` タグを取得
var links = document.querySelectorAll('.comment a');
// リンク先URL末尾が画像拡張子になっているリンクがあるかチェック
var hasImageLinks = false;
links.forEach(function(link) {
if (imageExtensions.test(link.href)) {
hasImageLinks = true;
} else {
// 末尾が画像拡張子じゃなければignoreClassで指定するものと同じ除外用クラスを追加
link.classList.add('uc-nomodal');
}
});
// リンク先URL末尾が画像拡張子の場合のみbaguetteBox.jsを実行、uc-nomodalクラスは除外
if (hasImageLinks) {
baguetteBox.run('.comment', {
ignoreClass: 'uc-nomodal'
});
}
};
</script>畳む
いつもてがろぐに大変お世話になってます。てがろぐ本体・tegupともに最新版にアップデートしました。何でも簡単入力ボタン機能がすごく便利です！
にししさんが>>5160内の5158さんへのレスで書かれている「半角英数1文字だけで検索するとJavaScriptソースが崩れてしまう」件、「続きを読む」ボタンのソースにも同様の影響が出ているようです。設定で「全文検索時でも隠す機能を有効にする」にチェックがついていても、半角英数1文字だけで検索すると「続きを読む」装飾で隠されている部分が全て表示された状態になります。半角英数2文字や全角1文字で検索すると設定通りに隠す機能が有効になるので、半角英数1文字だけの時に起こります。
もう1つ、この検索結果で続きを読むボタンのソースが変わることに関連して要望です。
私は画像拡大スクリプトにbaguetteBox.js を使用しており、commentクラスを対象に画像拡大スクリプトを実行するようにしています。この環境だと、検索キーワードに画像の拡張子が含まれる場合に、続きを読むボタンと画像拡大表示用スクリプトが衝突してしまいます。
【再現手順】※てがろぐデフォルトスキンで再現確認済み
①baguetteBox.jsの配布元 からダウンロードしたzipのdistフォルダにある、baguetteBox.min.jsとbaguetteBox.min.cssを、てがろぐと同じディレクトリにアップロード
②てがろぐデフォルトスキンをテキストエディタで開き
外側スキンの<head>内に
<link rel="stylesheet" href="baguetteBox.min.css">
外側スキンの遅延読み込みスクリプト群の
[[JS:LIGHTBOX:JQ]]
を消して
<script src="baguetteBox.min.js"></script>
<script type="text/javascript">
// comment クラスの中の画像リンクだけをbaguetteBox.jsの実行対象にする
window.addEventListener('load', function() {
baguetteBox.run('.comment');
});
</script>
と書いてアップロード
③適当な画像と、続きを読むボタンを含む投稿をする(画像は「続きを読む」で隠される部分でなくてもよい)
④新着画像リストに表示されている小さい画像をクリックするか、全文検索窓から「.png」「.jpg」など、記事内に存在する画像の拡張子をドットつきで検索をする
※「png」「.pn」「.j」のように画像の拡張子として不完全な文字列ではダメ
⑤検索結果画面にある記事の「続きを読む」ボタンをクリックした瞬間にbaguetteBox.jsが作動するが、画像ファイルのリンクではないので存在しない画像を読み込もうとし続ける畳む
普通に記事を表示した時は続きを読むボタンをクリックしてもbaguetteBox.jsは作動しないのですが、画像の拡張子が含まれる検索結果画面で続きを読むボタンをクリックした時にだけこの現象が起こります。
続きを読むボタンの<a>タグのリンク先は現在のURLの末尾に「#readmore」が付与されたものになりますが、
検索結果画面だと
https://example.com/tegalog/tegalog.cgi?q=.png#readmore
となるため、続きを読むボタンのリンク先URLに含まれる拡張子部分にbaguetteBox.jsが反応してしまうようです。
一応baguetteBox.js側の機能として、ignoreClassで指定したクラスを拡大表示処理の対象から除外することはできます。
【例】
baguetteBox.run('.comment',{
ignoreClass:'readmorebutton'
}
);
ただ、このignoreClassは1つしか指定できないので、続きを読むボタン(readmorebutton)を除外指定してしまうと、別の除外したいクラスが指定できなくなってしまうのです…。AIにbaguetteBox.jsのソースを読ませてignoreClassを複数指定する方法などを質問して色々試してみたりもしたのですが、やはり1つしか指定できない仕様のようです。
ちょうどignoreClassで指定したいクラスが出来て動作確認をしていた際、新着画像をクリックして見ていた時に気付きました。続きを読むボタンの<a>タグに検索キーワードを含めないようにして頂くことはできませんでしょうか。
にししさんが>>5160内の5158さんへのレスで書かれている「半角英数1文字だけで検索するとJavaScriptソースが崩れてしまう」件、「続きを読む」ボタンのソースにも同様の影響が出ているようです。設定で「全文検索時でも隠す機能を有効にする」にチェックがついていても、半角英数1文字だけで検索すると「続きを読む」装飾で隠されている部分が全て表示された状態になります。半角英数2文字や全角1文字で検索すると設定通りに隠す機能が有効になるので、半角英数1文字だけの時に起こります。
もう1つ、この検索結果で続きを読むボタンのソースが変わることに関連して要望です。
私は画像拡大スクリプトにbaguetteBox.js を使用しており、commentクラスを対象に画像拡大スクリプトを実行するようにしています。この環境だと、検索キーワードに画像の拡張子が含まれる場合に、続きを読むボタンと画像拡大表示用スクリプトが衝突してしまいます。
【再現手順】※てがろぐデフォルトスキンで再現確認済み
①baguetteBox.jsの配布元 からダウンロードしたzipのdistフォルダにある、baguetteBox.min.jsとbaguetteBox.min.cssを、てがろぐと同じディレクトリにアップロード
②てがろぐデフォルトスキンをテキストエディタで開き
外側スキンの<head>内に
<link rel="stylesheet" href="baguetteBox.min.css">
外側スキンの遅延読み込みスクリプト群の
[[JS:LIGHTBOX:JQ]]
を消して
<script src="baguetteBox.min.js"></script>
<script type="text/javascript">
// comment クラスの中の画像リンクだけをbaguetteBox.jsの実行対象にする
window.addEventListener('load', function() {
baguetteBox.run('.comment');
});
</script>
と書いてアップロード
③適当な画像と、続きを読むボタンを含む投稿をする(画像は「続きを読む」で隠される部分でなくてもよい)
④新着画像リストに表示されている小さい画像をクリックするか、全文検索窓から「.png」「.jpg」など、記事内に存在する画像の拡張子をドットつきで検索をする
※「png」「.pn」「.j」のように画像の拡張子として不完全な文字列ではダメ
⑤検索結果画面にある記事の「続きを読む」ボタンをクリックした瞬間にbaguetteBox.jsが作動するが、画像ファイルのリンクではないので存在しない画像を読み込もうとし続ける畳む
普通に記事を表示した時は続きを読むボタンをクリックしてもbaguetteBox.jsは作動しないのですが、画像の拡張子が含まれる検索結果画面で続きを読むボタンをクリックした時にだけこの現象が起こります。
続きを読むボタンの<a>タグのリンク先は現在のURLの末尾に「#readmore」が付与されたものになりますが、
検索結果画面だと
https://example.com/tegalog/tegalog.cgi?q=.png#readmore
となるため、続きを読むボタンのリンク先URLに含まれる拡張子部分にbaguetteBox.jsが反応してしまうようです。
一応baguetteBox.js側の機能として、ignoreClassで指定したクラスを拡大表示処理の対象から除外することはできます。
【例】
baguetteBox.run('.comment',{
ignoreClass:'readmorebutton'
}
);
ただ、このignoreClassは1つしか指定できないので、続きを読むボタン(readmorebutton)を除外指定してしまうと、別の除外したいクラスが指定できなくなってしまうのです…。AIにbaguetteBox.jsのソースを読ませてignoreClassを複数指定する方法などを質問して色々試してみたりもしたのですが、やはり1つしか指定できない仕様のようです。
ちょうどignoreClassで指定したいクラスが出来て動作確認をしていた際、新着画像をクリックして見ていた時に気付きました。続きを読むボタンの<a>タグに検索キーワードを含めないようにして頂くことはできませんでしょうか。
アップデートお疲れ様です。
新しい機能のカード型リンク、ずっと欲しかった機能なのでとても嬉しいです。ありがとうございます🙇
ラベルを省略しても使えるのがすごくありがたいです。OGPカードボタンからURLを入力するだけで使えるので、すぐ使えてとても便利です。
いつも更新ありがとうございます。これからもお世話になります🙏
新しい機能のカード型リンク、ずっと欲しかった機能なのでとても嬉しいです。ありがとうございます🙇
ラベルを省略しても使えるのがすごくありがたいです。OGPカードボタンからURLを入力するだけで使えるので、すぐ使えてとても便利です。
いつも更新ありがとうございます。これからもお世話になります🙏
5160
たしかに、自作スキンのCSSとかを確認している最中だったので適当な半角の英語1文字で検索してました……。ここでは「てがろぐ」で検索していたからなんともなかったんですね。スッキリしました！ありがとうございます。
あと5150の件ですが（書いたのは自分です）、フリースペース内には簡単な自己紹介？やお知らせ、細々とした部分（自分が書いてる内容をちょくちょく文言を変えたくなる気質？のため、ウェブ上からすぐ編集できるのが便利でいろいろ使ってるのです……）、ほかのてがろぐと共通して使うhtmlにそれぞれのディレクトリ名（tegalogとかmemoとか）をいれるために使ってます。[[FREESPACE:0]].cssみたいな感じで……。(前はヘッダ用フリースペースなどを使っていたのですが、ログイン画面かどこかでここの文言が出るのが気になってしまいすべてをフリースペースに書いています）
だいたい5個前後くらいですが、skin-coverに書くときに上から順にFREESPACE0→1みたいな感じで順番にしたい、しかしそうするとよく編集しがちな部分が（てがろぐから編集するほうの）フリースペースの下の方になってしまい編集がしづらい……ため、できたら好きな文字列にできたらなと思いました；わかりにくい文章ですいません……。
かなり個人的なわがまま要望になってしまうのでもし可能であれば、で構いません！
たしかに、自作スキンのCSSとかを確認している最中だったので適当な半角の英語1文字で検索してました……。ここでは「てがろぐ」で検索していたからなんともなかったんですね。スッキリしました！ありがとうございます。
あと5150の件ですが（書いたのは自分です）、フリースペース内には簡単な自己紹介？やお知らせ、細々とした部分（自分が書いてる内容をちょくちょく文言を変えたくなる気質？のため、ウェブ上からすぐ編集できるのが便利でいろいろ使ってるのです……）、ほかのてがろぐと共通して使うhtmlにそれぞれのディレクトリ名（tegalogとかmemoとか）をいれるために使ってます。[[FREESPACE:0]].cssみたいな感じで……。(前はヘッダ用フリースペースなどを使っていたのですが、ログイン画面かどこかでここの文言が出るのが気になってしまいすべてをフリースペースに書いています）
だいたい5個前後くらいですが、skin-coverに書くときに上から順にFREESPACE0→1みたいな感じで順番にしたい、しかしそうするとよく編集しがちな部分が（てがろぐから編集するほうの）フリースペースの下の方になってしまい編集がしづらい……ため、できたら好きな文字列にできたらなと思いました；わかりにくい文章ですいません……。
かなり個人的なわがまま要望になってしまうのでもし可能であれば、で構いません！
5156です。
にししさん返信ありがとうございます！
とても個人的な感覚なので、気になるのは自分だけかもしれないのですが、下だと一瞬「フォームはあるけどパスワードがないな、もしかしてあらかじめ知ってる人しか入れないのかな？」と、気早な方は去っていってしまうような気がしてまして…😅
かなり細かいことだと自分でも思うので申し訳ないですし、他の方のもっと重要な要望を優先して頂いて構いません。
にししさん返信ありがとうございます！
とても個人的な感覚なので、気になるのは自分だけかもしれないのですが、下だと一瞬「フォームはあるけどパスワードがないな、もしかしてあらかじめ知ってる人しか入れないのかな？」と、気早な方は去っていってしまうような気がしてまして…😅
かなり細かいことだと自分でも思うので申し訳ないですし、他の方のもっと重要な要望を優先して頂いて構いません。
>>5153 です。
原因がわかりましたのでご報告です。
本番適用しているスキンのみ<head>～</head>部分を別ファイルにして[[INCLUDE:ファイル名]] で合成していたことが原因でした。
別ファイルにしていた内容をskin-cover.htmlにべた書きすると該当スキンでも上書きスタイルシートが出力されていることが確認できました。
私自身がスキンを変わった作り方をしていたのが原因だったのにそれに気づかないままこちらで質問してしまいすみません。
解決できましたのでご報告しておきます。
原因がわかりましたのでご報告です。
本番適用しているスキンのみ<head>～</head>部分を別ファイルにして[[INCLUDE:ファイル名]] で合成していたことが原因でした。
別ファイルにしていた内容をskin-cover.htmlにべた書きすると該当スキンでも上書きスタイルシートが出力されていることが確認できました。
私自身がスキンを変わった作り方をしていたのが原因だったのにそれに気づかないままこちらで質問してしまいすみません。
解決できましたのでご報告しておきます。
ブログカードに検索ワードが含まれている（？）とカードが読み込まれないんですがなぜでしょうか……（ここで試してみたら普通に表示されるのですが）
自分の環境だとてがろぐデフォルトスキンのみで自作のJSやCSSなしの状態でも、検索にブログカードが引っかかると内容が読み込まれない（Loading...で止まる）
Uncaught SyntaxError: missing ) after formal parametersというコンソールエラー？が出ている
なにかしらのjsが干渉している？？？のかなと思うんですがわからなくて……
[画像UPエラー:容量制限を超過]
自分の環境だとてがろぐデフォルトスキンのみで自作のJSやCSSなしの状態でも、検索にブログカードが引っかかると内容が読み込まれない（Loading...で止まる）
Uncaught SyntaxError: missing ) after formal parametersというコンソールエラー？が出ている
なにかしらのjsが干渉している？？？のかなと思うんですがわからなくて……
[画像UPエラー:容量制限を超過]
てがろぐ、とても便利で利用させていただいています。
色々検索したり試してみましたがよくわからないのでこちらで質問失礼します。
iPhoneから見た時、投稿記事本文の文字が右に寄ってしまいます。
PC、タブレットで見る分には気になりませんがiPhoneのみです。
スクロールバーに文字が被り読みにくい為真ん中、もしくは左に寄せたいです。
どこかを書き換えればいいのだろう…というのはわかるんですが、ご助言いただけると幸いです。
色々検索したり試してみましたがよくわからないのでこちらで質問失礼します。
iPhoneから見た時、投稿記事本文の文字が右に寄ってしまいます。
PC、タブレットで見る分には気になりませんがiPhoneのみです。
スクロールバーに文字が被り読みにくい為真ん中、もしくは左に寄せたいです。
どこかを書き換えればいいのだろう…というのはわかるんですが、ご助言いただけると幸いです。
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
