settings

何らかの配布場

nanraka-no-haihu-ba

てがろぐ用のスキンを配布する場所

先頭固定

更新情報
2024/12/09 カスタマイズつまずきがちポイント書いた
2024/11/30 メッセージ返信
2024/11/30 メッセージ返信
2024/11/24 「ippen」シリーズ全部修正
2024/11/23 「kozin」とお揃い画像一覧モードスキン配布開始「kozin」更新「kozin」とお揃いテンプレート更新
2024/11/18 メッセージ返信
2024/11/17 メモスキン「ippen04」バラ配布
2024/11/13 メッセージ返信
2024/11/04 「kozin」とお揃いテンプレート配布開始
2024/10/24 スキン「meikan」配布開始
2024/09/30 「aien」更新
2024/09/29 メッセージ返信
2024/09/26 メッセージ返信
2024/08/22 メッセージ返信
2024/08/21 メッセージ返信
2024/07/27 メッセージ返信
2024/07/26 メッセージ返信
2024/07/25 「tenran03」更新
2024/07/20 「tenran01・02」更新
2024/07/14 「hokan」更新
2024/07/10 メッセージ返信
2024/06/26 メッセージ返信
2024/06/22 「sirason」更新(リニューアル)
2024/05/26 「kozin」更新(リニューアル)
2024/05/18 「ippen」更新(メモ機能追加)
2024/05/14 メッセージ返信
2024/04/26 作品展示用スキン「ippen02・03」バラ配布
2024/04/07 更新履歴埋め込みスキン「kousin02」放流
2024/04/06 テンプレート+スキン「ippen」配布開始
2024/04/02 メッセージ返信
2024/03/14 メッセージ返信
2024/02/15 メッセージ返信
2024/02/03 スキン「aien」配布開始
2024/01/16 メッセージ返信
2024/01/08 実験的スキン「zikken04」放流
>>2023年の更新履歴
 
>>カスタマイズつまずきがちポイント<<
スキン変更やカスタマイズ時に何か役に立つかもと思って書いておきます。


配布物

ban_kozin_r.png
>>てがろぐ用スキン「kozin」
つぶやき用のシンプルスキン(ギャラリーモード付き)
>>お揃いデザインのhtmlテンプレート配布
>>お揃いデザインの画像一覧モード用スキン配布


ban_sirason_r.png
>>てがろぐ用スキン「sirason」
つぶやき用のシンプルスキン(ギャラリーモード付き)/メニューバー上部固定


ban_hokan_r.png
>>てがろぐ用スキン「hokan」
絵や小説のログを整理・保管できるスキン(ちょっとした個人サイトっぽくできる)


ban_tenran.png
>>てがろぐ用スキン「tenran」
絵や小説のログを整理・保管できるスキン(「hokan」の2カラムver.)

ban_tenran03.png
>>てがろぐ用スキン「tenran03」
つぶやき(ブログ)用のシンプルスキン(ギャラリーモード付き)/2カラム

ban_aien.png
>>てがろぐ用スキン「aien」
つぶやき用のシンプルスキン(ギャラリーモード付き)/メニューバー下部固定

ban_ippen.png
>>テンプレート+スキン「ippen」
個人サイト作成用のHTMLテンプレート+てがろぐスキン
>>更新履歴埋め込みスキン「kousin02」バラ配布
>>作品展示用スキン「ippen02・03」バラ配布
>>メモスキン「ippen04」バラ配布

ban_meikan.png
>>てがろぐ用スキン「meikan」
キャラクターまとめ用のスキン/2カラム/スマホでドロワーメニュー

 
実験的スキン置き場
※普段よりさらに無保障・無サポートのスキン未満物置き場 使えそうだったらどうぞ

>> 超シンプル画像展示スキン「zikken01」

>>IF文使用hokanシンプルバージョン「zikken02」「zikken03」

>>画像一覧モード用スキン習作「zikken04」

アバウト

アバウトと利用規約

一般常識の範囲内ならご自由に使っていただいてかまいませんが、一応詳しいとこ書いときます

免責事項
当サイトで配布しているものを利用したことによって生じた損害等の一切の責任を負いかねますのでご了承ください。

OKなこと
  • 個人・商用利用
  • 他サイト様のテンプレート等との併用(他サイト様の規約もご確認ください)
  • 改造
  • 改造再配布(公式ページに書いてなかったけど多分大丈夫じゃないかな…)
  • 管理人が死んだとかこのサイトがなくなったとき、スキン自体を代理配布すること(管理人の名前を添えてくれると嬉しい)


ダメなこと
  • 自作発言
  • スキン自体を売るなどの営利利用
  • 政治・宗教・実写アダルトサイトでの使用
  • 誰かを攻撃したり傷付けるための使用


  • てがろぐ自体の使い方についてはてがろぐ公式ページをご覧ください
  • バグ報告歓迎 直せるかどうかは別
  • 管理人はド素人なのでhtmlやcssに関する質問にはお答えできません ごめん
  • ただ、スキンの問題やカスタマイズについて自分で調べてみてどうしても解決できなかったら聞いてみてください(解決できるとは限りませんが…)
  • 配布とかするの初めてなので、なんか規約違反とかこれマズイんじゃないのとかあったらこっそり教えてください…


一応公式掲示板にあった、標準スキン改造した場合の配布について→No.2920


管理人:えむけー →連絡用(Googleフォーム)
「何らかの配布場」(「何配」でも「NnHB」でも)
URL:https://mk-okiba.wew.jp/tegalog_haihu/
リンクフリー バナーはお持ち帰りでどうぞ
haihuba_banner.png

登録サーチ様:
88x31_3.png

てがろぐ開発者様:
NishishiFactory2023s.png
→てがろぐ公式ページ

お世話になりました:
tegabn05.png(閉鎖)
畳む

アバウト

2024年12月 この範囲を時系列順で読む この範囲をファイルに出力する

てがろぐおすすめ設定

hokanのデモサイトに書いた記事のコピペですがこっちにも置いておきます。

・「設定」→「システム設定」→【管理画面内の表示】→「投稿削除・カテゴリ削除ボタンを右寄せで表示する」にチェックを入れておいた方が絶対にいい これはマジ

・これは好みもありますが、画像のファイル名を英数字で付けている人は「設定」→「システム設定」→【画像投稿機能】→「元のファイル名をできるだけ維持する」にチェック入れておいた方が使いやすいと思います。

・「設定」→「投稿欄の表示」→【投稿入力欄の表示と動作】から、クイックポストや投稿画面の入力欄の大きさが変えられます 管理人はここをcssでいじろうとしてハマった

・「設定」→「投稿欄の表示」→【QUICKPOSTの表示】で「ログインしている際にのみ表示する」にチェックを入れると、クイックポストや各記事編集アイコンなどがログイン時のみ表示されるようになります。

・1行目タイトル、2行目から本文、のスキンの場合、鍵投稿のタイトルは「設定」→「ページの表示」→【鍵付き(パスワード保護)投稿の表示】→「本文の1行目だけは常に見せる」をONにすると記事タイトルになります。
(※Ver 4.3.1以降、「本文の2行目も常に見せる」設定が可能になりました。2行目にタグや鍵投稿内容の説明文などが書けます)
(※Ver 4.4.2以降、鍵フォームの位置を自由に入力できるようになりました)

・複数カテゴリ名の間のコンマ→「設定」→「ページの表示」→【カテゴリの表示】 好みで

・OGP「設定」→「補助出力」→【OGP+Twitter Cardの出力】→「共通画像のURL」てがろぐURLをTwitter(X)にシェアすると出る画像の設定はここ 単独記事シェアしたときは記事一枚目の画像が出るはず


とにかくてがろぐはデフォで設定できる項目がたくさんあるので、「ここのデザインやシステムをもう少しこうしたい…」ってときはcssよりまず設定を確認してみるのがおすすめです。
畳む

役に立つかも情報

デベロッパーツールとスキンの配色について

スキンをDLしてカスタマイズしてみたいけど、どこをどうすればいいかわかんないよ…なとき、
ブラウザのデベロッパーツール(開発者ツール)を使うのが便利です。
ここでは軽い説明しかしないので、もっと深く使いたい方はググってみてください。

まずPCのGoogle Chromeで当サイトのトップページを開き、F12キーを押してみてください。

241216_01.png

はい、なんかたくさん文字が出てきましたが怖くないです。これがサイトの構造(HTML)と装飾(CSS)です。
てがろぐを設置しページを開いたときのHTMLは、「skin-cover.html」と「skin-onelog.html」が組み合わされ、てがろぐ固有のコードがHTMLコード等に変換され出力されています。画面左下の小窓がそのHTMLです。
→参照:スキンファイルの位置関係(公式ページ)

右下の小窓はCSSです。当サイトのスキン「kozin」なら「tegalog-kozin.css」の内容がここに表示されます。
このCSSの窓の真ん中下辺りに、root {~で始まる、カラーコードがたくさん書かれたエリアがあると思います。これが「tegalog-kozin.css」の最初の方にある「カスタム用色変更欄」の部分です。

241216_02.png

この四角い色のとこをクリックしてカラーピッカーをいじると、

241216_03.png

画面上の色が変わります。

これは直接サイトのCSSをいじっているわけではなく、自分のブラウザ上で一時的に表示が変更されているだけです。これでCSSをいじって表示を確認し、いい感じの配色ができたらカラーコードをコピーしておき、自分のスキンに適用してみてください。

その他、HTML窓の左上にある矢印アイコンを選択した状態で画面上をウロウロしてみると、そこがHTMLのどの部分なのか、どのようなCSSが適用されているかがわかります。

241216_04.png

これでカスタマイズしたいCSSの編集を試してみてください。
 
スキンの配色

配色については私が教えてほしい。配色ツールとかなんかかっこいいカラーパレット作ってくれるサイトに頼りまくっています。
ちなみに当サイトで配布しているスキンの配色は、「メインカラー(koi-iro)」「サブカラー(link-iro)」さえ決めればどうにかなるように…なっていたらいいな(願望)。
以下配色に迷ったときのおすすめです。

haikei-iro…薄いグレー(気持ちメインカラーを混ぜると馴染み良い)
naiyou-iro…真っ白より気持ちグレー入れる(目に優しくする)
mozi-iro…真っ黒より気持ち薄める(目に優しくする)
koi-iro…お好きなメインカラー
usu-iro…↑のメインカラーを少し薄めて明るくする
link-iro…お好きなサブカラー
link-hover-iro…↑のサブカラーを少し薄めて明るくする

あとは先述のデベロッパーツールで視認性を確認して、見づらければ微調整してみてください。
メインとサブ色がなんかちぐはぐな場合は彩度と明度を寄せるだけでもなんとかなります。もう少しインパクトが欲しければ、usu-iroやlink-hover-iroを全然違う色にしてみても面白いです。(hokanはこのusu-iroが派手なタイプ)
「ここだけ特別な色にしたいんだけど…」というときは、デベロッパーツールでその部分を特定してカラーコードに書き換えるといいです。
畳む

役に立つかも情報

カスタマイズつまずきがちポイント

スキン変更やカスタマイズについて、管理人がガチ初心者だったときわからなかった点とか質問されがちな点を、何か役に立つかなと思って書いておきます。

●リトルサーバーのWEBマネージャー上でHTMLやCSSファイルを編集すると一部の文字が消える
→これはバグで今のところどうしようもないみたいです。OS付属のテキストエディタやフリーのテキストエディタなどを使って編集してみてください。おすすめはMeryかVScode。
ちなみに消えるのは「\」(バックスラッシュ)。これがCSSから消えると、スキン上のアイコンが文字の羅列になったりします。

●カスタマイズする前にバックアップを取る
→後で泣かないために

●公式の使い方リファレンスで探したい情報がどこにあるかわからない
→ページ内検索(Ctrl + F)で単語を探す。だいたい書いてあります。余裕があればサポート掲示板内も検索してみると、過去の質問に答えがある場合もあります。

●ギャラリーモードスキンや画像一覧モードスキンが反映されない!
→てがろぐギャラリーモードに適用されるスキンは、デフォルトでは「skin-gallery」という名前のフォルダの中に入っているものになります。これは「設定」→「補助出力」→【ギャラリーモードの出力】から変えられます。このサイトで配布しているギャラリースキンはだいたい「skin-(スキン名)-gallery」になっているので、このフォルダ名を「skin-gallery」に変えるか、設定からスキン格納ディレクトリ名を変更してください。画像一覧モードも同様です。(「ディレクトリ」と「フォルダ」はだいたい同じ意味だと思ってもらっていいです)
→公式ページ:ギャラリー用スキンの作り方・使い方
→公式ページ:画像一覧モード用スキンの作り方・使い方

●CSSを編集してアップしたのに何も変わってない…
→スーパーリロード(Ctrl + F5)(Cmd + Shift + R)もしくはブラウザのキャッシュを削除
これはブラウザ上に前のCSSのデータが残っているためです。
ちなみに閲覧者側のブラウザでもこれが起こり得るので、CSSを編集して閲覧者側にもそれを反映させたいときは、閲覧者さんにリロードかキャッシュ削除してね!と伝えたりしてください。
HTMLのheadで読み込むCSSファイル名の末尾にパラメータを付けることで強制的に反映させる方法もあります。「CSS 強制読み込み パラメータ」とかでググってみてね

●カスタマイズしてみたいけどどこをどういじればいいかわかんないよ…
→ブラウザのデベロッパーツール(開発者ツール)を使う
色んなところで解説されているので面倒うちで解説する必要もないかな…と思ったんですが、後で簡単な説明でも書いておきます。
(2024/12/17追記)
書きました。 >>デベロッパーツールとスキンの配色について

●設定もリファレンスもサポート掲示板も見たら、公式の標準スキンを見てみる
→公式の標準スキンは、その時点でのてがろぐの機能がほぼ全て盛り込まれています。ソースにはコメントが詳細に書いてあるので、困ったときや具体的なソースの書き方を知りたいときはとても頼りになります。
一番最初にてがろぐを使うときは、しばらく標準スキンで使ってみて機能を把握するのがいいと思います。スキンを変更して使っている場合でも、たまに標準スキンで使ってみると知らなかった新機能に気付いたりカスタマイズで悩んでいたことがするっと解決したりするのでおすすめです。


あと何か思いついたら追記します。
畳む

役に立つかも情報

2024年11月 この範囲を時系列順で読む この範囲をファイルに出力する

11/30 19:42の方へ

お返事ありがとうございます!
せっかくご報告いただいたのに、お役に立てなくて申し訳ありません。ご不便をおかけしますが、その方法で使用していただけるとありがたいです。
現在管理人にはiOS環境がないので確認できませんが、いつか何らかの手段を見つけた際には修正いたします。
詳しく教えていただきありがとうございました!
畳む

返信

11/30 12:21の方へ

メッセージありがとうございます。
ippenデモサイトで「モモNSFWテスト」のサムネイルの表示がずれているとのことでしたが、どのようにずれていましたか?以下は管理人の環境(PC/Chrome)のスクショなのですが、

241130_01.png

一応これが現在のデフォルト表示になっております。

お手数ですが上記スクショのような表示になっていなかったら、スーパーリロード(Ctrl+F5)(macはCmd + Shift + R)かブラウザのキャッシュの削除をお試しください。その上でもしまだズレているようであれば、先日(11/24)更新したippenの最新のスキンをお試しください。その更新で、「キャプション付きの画像がサムネイル表示されたとき、その画像がサムネイルサイズより小さいと縮まってしまう」という問題を解消したので、それであれば解決できているはずです。
(変更した部分は「ichiran-e.css」14行目あたり、/*一覧での画像の大きさ*/のところです。)

上記全てで解決できなかった場合は、お手数ですが
・どのようにずれているか
・使用した画像の縦横のサイズ(px)
・スキンとてがろぐ本体の最終更新はいつか
・自分でのカスタマイズの有無
・お使いのブラウザ
等、詳しい内容を教えてくださると助かります。よろしくお願いします。
畳む

返信

スキンippen全部修正しました。全体的に軽微な修正ですが大きなものは
・ヘッダー画像をデフォルトで丸くして、丸くないやつと選べるようにした
・カテゴリメニューを第二階層まで対応
です。
デモサイトの方も更新しているので、表示がなんか変だったら更新したりキャッシュを削除してみてください。不具合等ありましたらお気軽にご連絡ください。

つぶやき

#お知らせ #スキンippen
セットのippenで「ipmemo」のカテゴリIDでmemo機能を使っているとき、鍵投稿の鍵を開けたときなど単独記事ページにて記事が2重に表示されている場合、

「skin-onelog.html」18行目あたり

[[IF(onelog):<!-- 単独投稿用ボックス(単独ページのみ出力) -->

のかっこ内に -cat-ipmemoを足して

[[IF(onelog -cat-ipmemo):<!-- 単独投稿用ボックス(単独ページのみ出力) -->

と修正してください。多分解消されるはずです。

つぶやき

「kozin」デザイン画像一覧モード用スキン配布

kozin_p_ss01.png

kozinデザイン画像一覧モード用スキン
ダウンロード

→画像一覧モードデモ

説明
  • にししふぁくとりー様で配布されているマイクロブログツール「てがろぐ」の画像一覧モード用のスキンです(Ver 4.5.0で動作確認)。
  • てがろぐ公式の画像一覧モードスキンを改造して作っています。
  • メタタグによる簡単な検索避け付。
  • 配布はゆるゆる適当ですが一応→利用規約的なものをさらっと読んでおいてください。

↓以下詳細説明

使用フォント
アイコン:Google Fonts Icons (Material Icons Rounded)

使い方
※画像一覧モード用スキンとして使用してください。
「skin-kozin-picts」フォルダをtegalog.cgiと同じディレクトリに置いて、「設定」→「補助出力」→【画像一覧モードの出力】→スキン格納ディレクトリ名 を「skin-kozin-picts」に変える。
もしくは
「skin-kozin-picts」フォルダを「skin-picts」という名前に変更してtegalog.cgiと同じディレクトリに置く。

てがろぐの「画像一覧モード」は、従来のギャラリーモード(画像を使用している投稿ごとに表示する)とは違い、画像一枚ごとに表示するモードです。2ページ以上の漫画やログをたくさん1記事に投稿する人はギャラリーモード、一枚絵が多く一覧でざっと見せたい人は画像一覧モード、が展示として使いやすいかと思います。
注※「images」フォルダに入っている画像は全て一覧になって表示されるので、鍵投稿などに乗せた画像にはあらかじめ「一覧外」フラグを付けておくことを推奨します。

→公式ページ「画像一覧モード」
→公式ページ「画像一覧モード用スキンの作り方・使い方」

※全体の色カスタマイズ方法
「tegalog-kozin-picts.css」ファイル11行目くらいからの「カスタム用色変更欄」のカラーコードを書き換えてください。

※ヘッダー画像の差し替え方
つぶやき用kozinスキンを使っていて、既に「tega_header.png」という画像が「images」フォルダに入っている場合はそのまま適用されます。なかったら管理画面→画像の管理 から「tega_header.png」という名前の画像をアップする、もしくは「images」フォルダ内にそのまま入れてください。
「設定」→「システム設定」→「画像投稿機能」で「元のファイル名をできるだけ維持する」になっているか確認してください。
元画像の大きさに関わらず、PCで150px四方、スマホで100px四方の円型になります。調整したい場合は「tegalog-kozin-picts.css」114行目より。
透過ロゴ画像やバナー等、丸くない画像を表示したい場合は「skin-cover.html」28行目あたり<img src="images/tega_header.png" class="headimg maru">class="headimg maru"の「 maru」を消してclass="headimg"にしてください。

※画像に重なっている検索アイコンの消し方
「skin-onelog.html」4行目あたりからの
<!-- 投稿検索アイコン -->
<a href="?q=PICT:%20[[COMMENT:LINE:5]]" class="pictsearch" title="この画像が使われている投稿"><span class="material-icons-round">image_search</span></a>
を消す。

#スキンkozin
 
2024/11/23 配布開始
畳む

配布

FREESPACE
フリースペースエリアです。
管理画面から自由に編集ができます。
・プロフィールとか
・リンク集とかにしてもいいかも
expand_less