Twitter
スマホから見ると、スラッシュの入った投稿は何故か枠からはみ出るな
せっかくなので、ratreスキンを投稿ボタンの文字白くして、検索欄に文字入力したときの文字色も見やすい色にした。
電子ペーパー用工作に使うfullcalenderをアップさせる場所がなかったから、てがろぐをファイルに入れて整理したら、ディレクトリ変わって元のURLだとアクセスできなくなっちゃった…
(てがろぐ自体をtegalog01というファイルにいれた）
こうなったら今まで外のSNSに上げてたてがろぐURLを削除するゴリラ戦法でどうにかするか…
リダイレクトの処理いろいろ調べてためしてみたけど、cgiだからなんかうまくいかん やはり最初にてがろぐを個別ファイルに入れずベタ置きしたのが敗因か
ソフトいれたりサイト作ったりは、それしか使う用がないしな！と思っても、とりあえず作成したファイルに整理しましょう！ソフトとかはだいぶ身に付いてきてたのにこういうとこで雑なことするから！
(てがろぐ自体をtegalog01というファイルにいれた）
こうなったら今まで外のSNSに上げてたてがろぐURLを削除するゴリラ戦法でどうにかするか…
リダイレクトの処理いろいろ調べてためしてみたけど、cgiだからなんかうまくいかん やはり最初にてがろぐを個別ファイルに入れずベタ置きしたのが敗因か
ソフトいれたりサイト作ったりは、それしか使う用がないしな！と思っても、とりあえず作成したファイルに整理しましょう！ソフトとかはだいぶ身に付いてきてたのにこういうとこで雑なことするから！
てがろぐ改造したメモ
・白くする
→スマホで黒い画面見ると顔が写り込むから嫌なんだけど、パソコンからだと白にすると眩しすぎるんだよな
大人しくスマホの保護シート変えるのが一番早い気がして来たので保留
→やっぱり色変えた！まぶしくならない白にしたから大丈夫そう
・カテゴリ・アーカイブごとの記事数表示
リンクラベル...
HTML内に、[[CATEGORY:TREE:識別子]] と記述すると、その位置にカテゴリのリンクリストが指定の掲載内容・順序でのツリー形式(※)で挿入されます。(1スキン内で何回でも記述できます。)
識別子には、以下の7種類の文字と記号が使えます。
カテゴリツリーのカスタマイズ例
「 T 」：カテゴリ名テキスト（Text）
「 I 」：カテゴリアイコン（Icon）
「 C 」：カテゴリ該当数（Count／丸括弧あり）
「 c 」：カテゴリ該当数（count／丸括弧なし）
「 D 」：カテゴリ概要文（Description）
「 B 」：改行（<br>タグ）
「 <> 」：当該カテゴリ限定ページへのリンクにする範囲たたむ
<T>CBDを追加して、カテゴリ名・該当数・改行後に概要文が出るようにしたけど、数字だけでない。内部的にはちゃんと数字は入力されてるっぽいけど。
とりあえず使ってないアーカイブ欄だけ消して様子見
→黒かった背景色変えたら、黒い数字出て来た！これ色指定されてなかったから埋もれてたのかも
・他にやったこと
→カテゴリの概要文削除・リンクの下にあったいらない線削除・リンクの文字の大きさ他の見出しとそろえる・投稿日時の表示を曜日付きに変更・最終更新の表記を登録日に合わせる
・白くする
→スマホで黒い画面見ると顔が写り込むから嫌なんだけど、パソコンからだと白にすると眩しすぎるんだよな
大人しくスマホの保護シート変えるのが一番早い気がして来たので保留
→やっぱり色変えた！まぶしくならない白にしたから大丈夫そう
・カテゴリ・アーカイブごとの記事数表示
リンクラベル...
HTML内に、[[CATEGORY:TREE:識別子]] と記述すると、その位置にカテゴリのリンクリストが指定の掲載内容・順序でのツリー形式(※)で挿入されます。(1スキン内で何回でも記述できます。)
識別子には、以下の7種類の文字と記号が使えます。
カテゴリツリーのカスタマイズ例
「 T 」：カテゴリ名テキスト（Text）
「 I 」：カテゴリアイコン（Icon）
「 C 」：カテゴリ該当数（Count／丸括弧あり）
「 c 」：カテゴリ該当数（count／丸括弧なし）
「 D 」：カテゴリ概要文（Description）
「 B 」：改行（<br>タグ）
「 <> 」：当該カテゴリ限定ページへのリンクにする範囲たたむ
<T>CBDを追加して、カテゴリ名・該当数・改行後に概要文が出るようにしたけど、数字だけでない。内部的にはちゃんと数字は入力されてるっぽいけど。
とりあえず使ってないアーカイブ欄だけ消して様子見
→黒かった背景色変えたら、黒い数字出て来た！これ色指定されてなかったから埋もれてたのかも
・他にやったこと
→カテゴリの概要文削除・リンクの下にあったいらない線削除・リンクの文字の大きさ他の見出しとそろえる・投稿日時の表示を曜日付きに変更・最終更新の表記を登録日に合わせる
スキンに元からついている投稿用モーダル（ウインドウ）だと、モーダル外の要素がスクロールするのが嫌で調べて試してたけど、自力ではどうにもならなさそう。
しょうがないので、非表示にしていた元スキンの表示の中にログイン限定クイックポスト欄をねじ込むことで解決した。
しょうがないので、非表示にしていた元スキンの表示の中にログイン限定クイックポスト欄をねじ込むことで解決した。
絵文字ピッカーはせっかく入れたので残しておきたいけど、絵文字は全然使ってないし目に入ると気が散る→とりあえずファイルの名称を違う名前に変更して、てがろぐ側で認識できないようにして茶を濁す リンクに使用している絵文字は画像として使用しているので問題なし
→やっぱり過去のテスト投稿の絵文字にエラーでるのは気になるので、消してきた。ratreのskincoverの方にXmodoki2のスクリプト読み込みが入ってたせいで表示が完全に消えなくなっていた。
→やっぱり過去のテスト投稿の絵文字にエラーでるのは気になるので、消してきた。ratreのskincoverの方にXmodoki2のスクリプト読み込みが入ってたせいで表示が完全に消えなくなっていた。
スキンをいろいろ試した。
リンクラベル...
アイコンの位置が一番いい。なぜかリンクの色がどうしてもデフォルトになる。投稿欄のアイコンがデモページより小さくなってる気がする。（アイコン非表示にした）
アイコンからポップアップで検索欄・カテゴリ欄などがでるが、毎回×を押してウインドウを消すのが少し取り回し悪く感じた。
リンクラベル...
カテゴリ欄が左端にでるのが可愛いしシンプルで画面が見やすいが、カテゴリが多すぎてかさばってしまい、ヘッダーリンクが画面に上手く収まりきらなかったので断念。
リンクラベル...
これを採用した。上のアイコンの順番や移動先のメニューの位置を並び替えても、それぞれ対応する場所まで移動してくれて便利。トップに戻るボタンもついてるのがよい。
クイック投稿欄の絵文字ピッカーが巨大化＋縦になって入力しづらい問題は、下記のサイトを見返して、CSSを書き換えたらどうにかなった。
いろんな拡張機能を入れてると、それ専用の記述を忘れるね。
リンクラベル...
ギャラリーはこれがいいな
リンクラベル...
リンクラベル...
リンクラベル...
アイコンの位置が一番いい。なぜかリンクの色がどうしてもデフォルトになる。投稿欄のアイコンがデモページより小さくなってる気がする。（アイコン非表示にした）
アイコンからポップアップで検索欄・カテゴリ欄などがでるが、毎回×を押してウインドウを消すのが少し取り回し悪く感じた。
リンクラベル...
カテゴリ欄が左端にでるのが可愛いしシンプルで画面が見やすいが、カテゴリが多すぎてかさばってしまい、ヘッダーリンクが画面に上手く収まりきらなかったので断念。
リンクラベル...
これを採用した。上のアイコンの順番や移動先のメニューの位置を並び替えても、それぞれ対応する場所まで移動してくれて便利。トップに戻るボタンもついてるのがよい。
クイック投稿欄の絵文字ピッカーが巨大化＋縦になって入力しづらい問題は、下記のサイトを見返して、CSSを書き換えたらどうにかなった。
いろんな拡張機能を入れてると、それ専用の記述を忘れるね。
リンクラベル...
ギャラリーはこれがいいな
リンクラベル...
リンクラベル...
てがろぐ作ったはいいんだけど、なんかメモする気にならねえんだよな
もしかして：絵文字がうるさくて気が散っている
がんばってつけたけど外すか……？
もしかして：絵文字がうるさくて気が散っている
がんばってつけたけど外すか……？
skin-solid
枠とカテゴリの表示がかわいいてがろぐスキン
枠とカテゴリの表示がかわいいてがろぐスキン
リアクションボタンをサイトにつけるやつ
なんかすごくてこずったけど実装できた！！根性で埋め込んだのでどうやったかはあんまり説明できない。
グレー枠内の絵文字を押すと、上に絵文字が召喚できます。
・head追記は、スキンのcover内head始まって５行目ぐらいのlink relの大群の一番上に入れる。パスはサイトURLから記述。
・body追記はcover内bodyの底に置く。
・リアクションの置きたい場所に記述する項目はまじでてこずった。
onelogに記述するんだけど、説明通りにdiveclassのcomentに置いてもだめそうだった。ので、3行目くらいにあったarticle classってとこの後ろにreaction-idをねじ込んで、divやらなんやらをちまちま入れ替えてるうちになんか上手くいった。だめなら気合いでどうにかするしかないね。
・文字のやつはMEGAMOJIで作った。
・よく見るアニメーションのやつはSlackmojisでダウンロードした。parrotは専用ページから。
たたむ
ここは私の城なので、私を褒めたたえることしかできないようにしました。気軽に褒めてね！
なんかすごくてこずったけど実装できた！！根性で埋め込んだのでどうやったかはあんまり説明できない。
グレー枠内の絵文字を押すと、上に絵文字が召喚できます。
・head追記は、スキンのcover内head始まって５行目ぐらいのlink relの大群の一番上に入れる。パスはサイトURLから記述。
・body追記はcover内bodyの底に置く。
・リアクションの置きたい場所に記述する項目はまじでてこずった。
onelogに記述するんだけど、説明通りにdiveclassのcomentに置いてもだめそうだった。ので、3行目くらいにあったarticle classってとこの後ろにreaction-idをねじ込んで、divやらなんやらをちまちま入れ替えてるうちになんか上手くいった。だめなら気合いでどうにかするしかないね。
・文字のやつはMEGAMOJIで作った。
・よく見るアニメーションのやつはSlackmojisでダウンロードした。parrotは専用ページから。
たたむ
ここは私の城なので、私を褒めたたえることしかできないようにしました。気軽に褒めてね！
リンクラベル...
これ参考にして、画像をドラッグアンドドロップするだけで投稿できるようにした！
コピペで画像貼れるようになってすごく便利になった。
加工したい内容にチェックを入れてから画像を読み込まないと加工してくれないことに注意。
文字と透かし画像は同時に入れられないっぽい。
注意点
・upload.js upload.php NotoSansJPのttf(使うフォントファイル) watermark.png(透かし画像サンプル)がてがろぐ本体のある場所に追加された。
・edit.htmが今使ってるプロフィールスキンに追加された。
元データからの変更点
・テキスト挿入時のフォントはM＋フォントからNotoSansJPに変更
・テキスト挿入のデフォルトにAI禁止を追加
ついでに投稿画面の設定もいじった。
・既存画像の挿入の文言を投稿済み画像の挿入に変更
・てがろぐ更新で増えたなんでも簡単入力ボタンを編集して、「改行」「隠す」「リンク」のコマンドをワンボタンで追加できるようにした。
リンクの入力ルールに慣れなさ過ぎて毎回自分の投稿見返しながら書いてたのですごくたすかる
たたむ
これ参考にして、画像をドラッグアンドドロップするだけで投稿できるようにした！
コピペで画像貼れるようになってすごく便利になった。
加工したい内容にチェックを入れてから画像を読み込まないと加工してくれないことに注意。
文字と透かし画像は同時に入れられないっぽい。
注意点
・upload.js upload.php NotoSansJPのttf(使うフォントファイル) watermark.png(透かし画像サンプル)がてがろぐ本体のある場所に追加された。
・edit.htmが今使ってるプロフィールスキンに追加された。
元データからの変更点
・テキスト挿入時のフォントはM＋フォントからNotoSansJPに変更
・テキスト挿入のデフォルトにAI禁止を追加
ついでに投稿画面の設定もいじった。
・既存画像の挿入の文言を投稿済み画像の挿入に変更
・てがろぐ更新で増えたなんでも簡単入力ボタンを編集して、「改行」「隠す」「リンク」のコマンドをワンボタンで追加できるようにした。
リンクの入力ルールに慣れなさ過ぎて毎回自分の投稿見返しながら書いてたのですごくたすかる
たたむ
skin-profileの改造をした。
・リンクの色をあっさりした感じに調整した。
・リンクページ行間を、投稿ページの行間と同じサイズに調整。
・「Yaku Han JP」「Noto Sans Japanese」導入。
・たたむボタンの色を目立たないようにした。
・リンクの切れてたファビコンを修正。
・カテゴリ欄を横並びにし、ハッシュタグと同じ文字サイズに調整。
参考ページ
【Web制作】約物半角フォント「Yaku Han JP」とてがろぐ検索避け
フォントの太さをスマホでは400、PCでは500にしたい
これはうまくできなかったけど、フォントを「Noto Sans Japanese」にしたら気にならなくなった。
・リンクの色をあっさりした感じに調整した。
・リンクページ行間を、投稿ページの行間と同じサイズに調整。
・「Yaku Han JP」「Noto Sans Japanese」導入。
・たたむボタンの色を目立たないようにした。
・リンクの切れてたファビコンを修正。
・カテゴリ欄を横並びにし、ハッシュタグと同じ文字サイズに調整。
参考ページ
【Web制作】約物半角フォント「Yaku Han JP」とてがろぐ検索避け
フォントの太さをスマホでは400、PCでは500にしたい
これはうまくできなかったけど、フォントを「Noto Sans Japanese」にしたら気にならなくなった。
中央配置は
<div style="text-align: center">～</div>
<div style="text-align: center">～</div>
インラインフレームのスクロールと境界線消し
括弧iframe src="埋め込みたいURL" frameBorder="0"scrolling="no"> target="_blank rel="noreferrer noopener"></iframe括弧でいけた
括弧iframe src="埋め込みたいURL" frameBorder="0"scrolling="no"> target="_blank rel="noreferrer noopener"></iframe括弧でいけた
skin-profileにスキン変更した！
余白が増えて画面がすっきりした。
ヘッダーは1400×500px。
以下変更点
・ファビコン設定
・ヘッダー画像・アイコン画像
・ホーム画面のフリースペース削除
・ホーム画面の画像一覧削除
・投稿一覧の上に検索ボックス等追加
・投稿一覧下の時系列検索をボックス表示に
たたむ
余白が増えて画面がすっきりした。
ヘッダーは1400×500px。
以下変更点
・ファビコン設定
・ヘッダー画像・アイコン画像
・ホーム画面のフリースペース削除
・ホーム画面の画像一覧削除
・投稿一覧の上に検索ボックス等追加
・投稿一覧下の時系列検索をボックス表示に
たたむ
画像表示のポップアップ出なくなってたのを修正。
Tanの設定でlightboxじゃない設定にしてたの忘れてててこずった
てがろぐのlightboxを変更する方法
管理画面の[設定]→[システム設定]→【画像拡大スクリプトの選択】で、下図のように「Lightboxを使う」か「他のスクリプトを使う」かを選択できます。ここで、Lightbox以外の任意の画像拡大用スクリプトのURLを指定できます。
次に、管理画面の[設定]→[ページの表示]→【投稿本文の表示／画像】や【投稿本文内のURL処理】で、画像リンクに対して指定する必要のある特定の記述を加えます。
たたむ
ついでに、画像拡大時にぐいーんと枠が広がるアニメーションを無効にして一瞬で表示する方法も導入
Tanの設定でlightboxじゃない設定にしてたの忘れてててこずった
てがろぐのlightboxを変更する方法
管理画面の[設定]→[システム設定]→【画像拡大スクリプトの選択】で、下図のように「Lightboxを使う」か「他のスクリプトを使う」かを選択できます。ここで、Lightbox以外の任意の画像拡大用スクリプトのURLを指定できます。
次に、管理画面の[設定]→[ページの表示]→【投稿本文の表示／画像】や【投稿本文内のURL処理】で、画像リンクに対して指定する必要のある特定の記述を加えます。
たたむ
ついでに、画像拡大時にぐいーんと枠が広がるアニメーションを無効にして一瞬で表示する方法も導入
X_modokiのヘッダー画像を変更した。
tegalog.cgi設置ディレクトリ内「images」フォルダに「X-header.jpg」という名前でアップロードすれば適用される。
スキンのファイル内にassets→faviconのファイル作って入れてみたけど反応するかな
(追記:一日半くらいでちゃんと出た）
アイコンを透過から白地にしてツイッターっぽくした
tegalog.cgi設置ディレクトリ内「images」フォルダに「X-header.jpg」という名前でアップロードすれば適用される。
スキンのファイル内にassets→faviconのファイル作って入れてみたけど反応するかな
(追記:一日半くらいでちゃんと出た）
アイコンを透過から白地にしてツイッターっぽくした
てがろぐtanの改造終わった！
・onelog（投稿ごとの表示）のID表示をカテゴリ名のリンクに変更
・フリースペースの表示を削除
・カテゴリごとのタブ追加が難しかったので、てがろぐの書式でカテゴリ一覧を追加した
・サイドのメニューを検索窓・ハッシュタグ一覧・ほかサイトのリンク（フリースペースで入れてたリンクを直打ちした）に変えた
・検索や絞り込みしたときに出てくるパンくずリストを削除
直したいところ
・タブ表示にしたい（カテゴリ一覧が一列に収まるようになってほしい）
・フォントがなぜかかわらない
・検索と投稿の窓に入力中のフチ消したい
・隠した文章を表示したときに背景がグレーになるのを白にしたい
・ハッシュタグ一覧をもっとコンパクトにしたい（1行1項目でなくてもいい）
たたむ
・onelog（投稿ごとの表示）のID表示をカテゴリ名のリンクに変更
・フリースペースの表示を削除
・カテゴリごとのタブ追加が難しかったので、てがろぐの書式でカテゴリ一覧を追加した
・サイドのメニューを検索窓・ハッシュタグ一覧・ほかサイトのリンク（フリースペースで入れてたリンクを直打ちした）に変えた
・検索や絞り込みしたときに出てくるパンくずリストを削除
直したいところ
・タブ表示にしたい（カテゴリ一覧が一列に収まるようになってほしい）
・フォントがなぜかかわらない
・検索と投稿の窓に入力中のフチ消したい
・隠した文章を表示したときに背景がグレーになるのを白にしたい
・ハッシュタグ一覧をもっとコンパクトにしたい（1行1項目でなくてもいい）
たたむ