No.123, No.122, No.121, No.120, No.119, No.118, No.117［7件］
aien更新しました。kozin・sirasonと色の変数名を揃え、各所の配色を若干変更、ギャラリーモードは単独記事へのリンクをサムネから分離し、サムネクリックの挙動をカスタマイズできるようにしました。何か不具合等ありましたらお気軽にご連絡ください。
aien更新しました。kozin・sirasonと色の変数名を揃え、各所の配色を若干変更、ギャラリーモードは単独記事へのリンクをサムネから分離し、サムネクリックの挙動をカスタマイズできるようにしました。何か不具合等ありましたらお気軽にご連絡ください。
#カスタマイズ #スキンaien
ギャラリーモードで、画像をクリックで拡大ではなく単独記事に飛ぶようにする
2024/09/30以降リニューアルしたaienでは、ギャラリーモードで通常投稿のサムネをクリックすると画像が拡大表示され、鍵投稿のサムネをクリックすると単独記事に飛ぶ仕様になっています。これを、全てのサムネをクリックで単独記事に飛ぶようにする方法です
①「tegalog-aien-gallery.css」793行目あたりの
.gallogbox:not(.logstatus-lock) .imgpermalink { display: none;}
を消す
②ギャラリースキンの「skin-onelog.html」5行目あたり[[COMMENT:PICTS]]を[[ONEPICT:1]]に書き換える
2024/09/30以降リニューアルしたaienでは、ギャラリーモードで通常投稿のサムネをクリックすると画像が拡大表示され、鍵投稿のサムネをクリックすると単独記事に飛ぶ仕様になっています。これを、全てのサムネをクリックで単独記事に飛ぶようにする方法です
①「tegalog-aien-gallery.css」793行目あたりの
.gallogbox:not(.logstatus-lock) .imgpermalink { display: none;}
を消す
②ギャラリースキンの「skin-onelog.html」5行目あたり[[COMMENT:PICTS]]を[[ONEPICT:1]]に書き換える
#カスタマイズ
#スキンaienのギャラリーモードは、標準スキンの
「skin-onelog.html」内[[ONEPICT:1]](1投稿1枚目の画像を読み込む)の部分を
[[COMMENT:PICTS]](1投稿全ての画像を読み込む)にして
cssの.imagebox :nth-child(n+2) { display: none;}の部分で2枚目以降を非表示にしています。
これはギャラリーモードだけで全ての画像を見られるようにするためですが、標準の仕様と同じにしたい方は、
ギャラリーモード用スキンの「skin-onelog.html」5行目あたり[[COMMENT:PICTS]]を[[ONEPICT:1]]に書き換え、
「tegalog-aien-gallery.css」の740行目あたり.imagebox :nth-child(n+2) { display: none;}の部分を消しておいてください。
この標準仕様なら、「(鍵投稿でも)n枚目の画像を [[ONEPICT:n]] 記法等で表示する」設定で1枚目の画像がワンクッションになるはずです
「(鍵投稿でも)本文の1行目だけは常に見せる」設定だと、1行目に書いたハッシュタグがギャラリーモードでも表示されます ご都合のいい方で使い分けてください
「skin-onelog.html」内[[ONEPICT:1]](1投稿1枚目の画像を読み込む)の部分を
[[COMMENT:PICTS]](1投稿全ての画像を読み込む)にして
cssの.imagebox :nth-child(n+2) { display: none;}の部分で2枚目以降を非表示にしています。
これはギャラリーモードだけで全ての画像を見られるようにするためですが、標準の仕様と同じにしたい方は、
ギャラリーモード用スキンの「skin-onelog.html」5行目あたり[[COMMENT:PICTS]]を[[ONEPICT:1]]に書き換え、
「tegalog-aien-gallery.css」の740行目あたり.imagebox :nth-child(n+2) { display: none;}の部分を消しておいてください。
この標準仕様なら、「(鍵投稿でも)n枚目の画像を [[ONEPICT:n]] 記法等で表示する」設定で1枚目の画像がワンクッションになるはずです
「(鍵投稿でも)本文の1行目だけは常に見せる」設定だと、1行目に書いたハッシュタグがギャラリーモードでも表示されます ご都合のいい方で使い分けてください
＞09/29 13:28の方へ
<>
メッセージありがとうございます。
そもそも「畳む」を押したときページ位置が戻らないのはてがろぐの仕様のようです。このサイトの一部の記事で押す前の位置に戻っているように見えるのは、多分記事の隠してある部分と開いた画面の高さがちょうど同じくらいだからかな？と思います。過去にも要望が出ているようなので、てがろぐ側でアプデが来るのを祈っていただければ…と思います。
メッセージありがとうございます。
そもそも「畳む」を押したときページ位置が戻らないのはてがろぐの仕様のようです。このサイトの一部の記事で押す前の位置に戻っているように見えるのは、多分記事の隠してある部分と開いた画面の高さがちょうど同じくらいだからかな？と思います。過去にも要望が出ているようなので、てがろぐ側でアプデが来るのを祈っていただければ…と思います。
＞09/26 17:34の方へ
<>
メッセージありがとうございます。
ギャラリーモードスキンは、デフォルトでは「skin-gallery」という名前のフォルダの中に入っているものが適用されます。これは「設定」→「補助出力」→【ギャラリーモードの出力】から変えられるので、「skin-sirason-gallery」をフォルダごとアップロードし、ここの設定名称を「skin-sirason-gallery」にしてみてください。これで適応できるはずです。
※もしくは、設定を変えずに「skin-gallery」の中身(多分デフォルトのギャラリースキンが入っていると思います)と「skin-sirason-gallery」の中身を入れ替える方法もあります。お好きな方で適用してみてください。
公式の説明ページはこちらです
→ギャラリー用スキンの作り方・使い方
「skin-sirason」の適用方法は、「フォルダごとアップする→スキン切替の設定で適用する」でOKです。表示がおかしくなったり重かったりしたら、フォルダから3つのファイルを出してcgiと同じ場所に置く方法も試してみてください。
→スキンの置き方
うまくいかなかったとかもっとこうしたい等、また何かありましたらご連絡ください～
メッセージありがとうございます。
ギャラリーモードスキンは、デフォルトでは「skin-gallery」という名前のフォルダの中に入っているものが適用されます。これは「設定」→「補助出力」→【ギャラリーモードの出力】から変えられるので、「skin-sirason-gallery」をフォルダごとアップロードし、ここの設定名称を「skin-sirason-gallery」にしてみてください。これで適応できるはずです。
※もしくは、設定を変えずに「skin-gallery」の中身(多分デフォルトのギャラリースキンが入っていると思います)と「skin-sirason-gallery」の中身を入れ替える方法もあります。お好きな方で適用してみてください。
公式の説明ページはこちらです
→ギャラリー用スキンの作り方・使い方
「skin-sirason」の適用方法は、「フォルダごとアップする→スキン切替の設定で適用する」でOKです。表示がおかしくなったり重かったりしたら、フォルダから3つのファイルを出してcgiと同じ場所に置く方法も試してみてください。
→スキンの置き方
うまくいかなかったとかもっとこうしたい等、また何かありましたらご連絡ください～
＞08/21 16:23 蒲原様へ
<>
メッセージありがとうございます。
・ギャラリーをスマホから見たときに画像を2列か3列にしたい
ちょっと調整が難しいのですが、一番簡単なのは「tegalog-kozin-gallery.css」の末尾に
/* 画面幅599px以下で画像を2列にする */
@media screen and (max-width:599px) {
.galmainbox { grid-template-columns: repeat(2 , 1fr);}}
と追加する方法かと思います。スマホで3列だと表示が崩れたので2列でよろしくお願いします。
追記したcssファイルをアップロードしたら、PCならスーパーリロード(Ctrl+F5)(macはCmd + Shift + R)、スマホならブラウザのキャッシュを削除して更新されているか確認してみてください。
～ここから説明～
ギャラリーのサムネの列を決定しているのは、「tegalog-kozin-gallery.css」609行目あたりからの/* 画像欄をグリッド表示にする */という部分です。grid-template-columns: repeat(auto-fill, minmax(160px,1fr));という部分で、「画像を横幅いっぱいに敷き詰めて一つのサムネが横160px以下になったら折り返す」という装飾にしています。これで、PCやスマホの画面幅によって列が変わります。(PCでブラウザの横幅を伸縮させてみると挙動がわかりやすいです)
ここの「160px」と書いてあるところを「150px」とかにするとだいたいのスマホで2列くらいになるのですが、今度はPCの表示が4列になるんですね…(これでもよければここで調整する方法もあります)
なので、最初に提示した方法では、599px以下の画面幅の場合にはずっと2列になるよう固定しています。多分大丈夫かと思いますが、表示崩れなどありましたらまたご相談ください。
・「カテゴリ「◯◯」に属する投稿」などの文面の変更
これはてがろぐの設定画面からできます。「設定」→【状況に応じた見出しの表示】からある程度の変更が可能です。これ以上カスタマイズしたいとなると、どのような表示にしたいかによってそれに合わせたCSSを書かなければならないのでちょっと難しくなります。もしどうしてもこうしたいという希望がありましたらまたご連絡ください。(できなかったらすみません)
メッセージありがとうございます。
・ギャラリーをスマホから見たときに画像を2列か3列にしたい
ちょっと調整が難しいのですが、一番簡単なのは「tegalog-kozin-gallery.css」の末尾に
/* 画面幅599px以下で画像を2列にする */
@media screen and (max-width:599px) {
.galmainbox { grid-template-columns: repeat(2 , 1fr);}}
と追加する方法かと思います。スマホで3列だと表示が崩れたので2列でよろしくお願いします。
追記したcssファイルをアップロードしたら、PCならスーパーリロード(Ctrl+F5)(macはCmd + Shift + R)、スマホならブラウザのキャッシュを削除して更新されているか確認してみてください。
～ここから説明～
ギャラリーのサムネの列を決定しているのは、「tegalog-kozin-gallery.css」609行目あたりからの/* 画像欄をグリッド表示にする */という部分です。grid-template-columns: repeat(auto-fill, minmax(160px,1fr));という部分で、「画像を横幅いっぱいに敷き詰めて一つのサムネが横160px以下になったら折り返す」という装飾にしています。これで、PCやスマホの画面幅によって列が変わります。(PCでブラウザの横幅を伸縮させてみると挙動がわかりやすいです)
ここの「160px」と書いてあるところを「150px」とかにするとだいたいのスマホで2列くらいになるのですが、今度はPCの表示が4列になるんですね…(これでもよければここで調整する方法もあります)
なので、最初に提示した方法では、599px以下の画面幅の場合にはずっと2列になるよう固定しています。多分大丈夫かと思いますが、表示崩れなどありましたらまたご相談ください。
・「カテゴリ「◯◯」に属する投稿」などの文面の変更
これはてがろぐの設定画面からできます。「設定」→【状況に応じた見出しの表示】からある程度の変更が可能です。これ以上カスタマイズしたいとなると、どのような表示にしたいかによってそれに合わせたCSSを書かなければならないのでちょっと難しくなります。もしどうしてもこうしたいという希望がありましたらまたご連絡ください。(できなかったらすみません)
-Tags-