×
diary
2017年4月
04.19
前回の日記の続き。WordPressではなくてphpでサイトを作るののいいところ？
本文にphpもJavaScriptも簡単に使えることかな。ショートコードは楽だけどショートコードにするのはめんどくさいし……。
しかもphpとJavaScriptの併用は、いいとこどり（楽なとこどりでもある）ができること。
もうクッキーはめんどくさすぎと思ってデータ保存はJavaScriptのローカルストレージに変えてかなり個人的見通し明るくなったけれど。
それ以外でも、phpをやめてJavaScriptにするだけで簡単にできるようになるところもかなりあったり。
とりあえず、外部のテキストファイルを読み込んでついでに自動的に改行を加える（ついでに文字数カウント）――というphpを、小説の場合は気に入って使っているけれど。
ただこれだと、テキストファイルの中にクッキー読み込むような記述が使えなかった。
つまり、こうやってちまちま追加している機能と併用できないので、かなり自分的には最悪だったり。
これも、読み込むテキストファイル内にある記述（一番わかりやすいので保存した名前とか）をphpでなくJavaScriptにするだけで普通に動くようになるし（文字数カウントが多分だめにはなるけど）。
経験値、所持金、経過日数、キル数……だいたいこの辺は、カウンター機能の応用なので、とりあえず3つ関数作った。
複数の候補のなかから（配列）ひとつをランダムに選んで保存する……というのも作った。
これは、たとえば拾った猫が白猫か黒猫かといった部分ランダムだけれど別にテキスト自体を分岐させるわけでもない（フラグにも応用できるけど）という雰囲気的なランダムさが欲しい時にという感じ。こういうの好き。
ランダムリンクはどっちでも作れるけれど、JavaScriptにすればテキストファイルに書けるからこっちのほうがいいかなとか。
これがサンプル。
書いた内容はこれ。
function random_link1(ar){
var txt = "[🍎next]";//リンクの文字
var num = Math.floor(Math.random()*ar.length);
var str = ar[num];
var link = ""+txt+"";
document.write(link);
}
random_link1(Array("index","about"));
絵文字🍎もちゃんと表示できるしー。てことで。
- ランダムリンク（JavaScript）
- ランダムアイテム取得
- カウンター機能（経験値、所持金他）
あくまで小説用と考えれば、この程度あれば今までのフォームのも含めていいんじゃないかなあ。
あとはフォームで入力を途中で促せるものがあるといいかも。
インタラクティブという意味で。
ただ、ランダム要素とカウント要素が入った程度のもの（フォームによる名前等設定は前からあるし）が、今のところ自分にとって必要なものな気はしたり。
04.17
かなり久しぶりの日記。ていうか日記だけでなくテンプレートいじりもすごくご無沙汰だった……。
繁忙期だったし。
直前の日記の次やりたいことメモも、当面はいいかな。
それより今やりたいこと。
WordPressではめんどくさくてhtmlではできないこと――この辺を今やりたい気分なので、php版をいじろうかなあとか。
今一応おわったところ。
- 外部ファイル読込表示（小説用、文字数付）のユーザー定義関数化ですっきり
- ランダムリンクのユーザー定義関数化ですっきり
- 経験値とか
- 所持金とか
- 所持アイテムとか
- フラグ管理
- 戦歴
- その他
またいつもどおり機能いじっただけで全然中身が出来ないということは当然ありえるけれどまあそれはそれで。
ただ今回の変更点としては、php版だけれどデータ保存はJavaScriptの使う予定なところ。
phpのcookieは、もう扱いにくいからできるだけ避けることにする……。
JavaScriptのlocalStorageなら自由度ひろがるー。
経験値は年齢にしてもいいし。小説的には誰得な機能だとは思うけど。せっかく主人公16歳にしてもうろうろしているだけですぐ30歳とかになるみたいな。
ゲームオーバーとかとセットにしてもつかえるとは思うけど。
移植で作ってるから余分なものもひきついでいるけれど、整理するのは結構手間なわりに楽しくない。
だからまた当面は追加で作るかな。
当面は、小説よりの機能からで。
つまりフラグとかはゲームっぽいから後回し。
ただ取得したアイテムとかは楽しいし欲しいような。
経験値はカウンター流用で作れるテスト機能みたいなものだしまあこれはこれであると使えると思う。経験値という名前にするか経過日数にするか、本体はただの数字なんだからどうにでもできるし。
とりあえず。
現時点では元からある名前設定機能と、あとは外部ファイル読込関数、カスタムランダムリンク関数を今回作ったから、わりと楽に小説作れるはず。
ただたしかgetfileで外部ファイル読込にすると（文字数数えられるから気に入ってるけど）、なかのJavaScript使えたか怪しいような。phpは使えないんだけどJavaScriptはどうだろう……。
まあ、4月も、昨年夏秋とかに比べると余裕あるわけでもないから、まあぼちぼち進めたい。
2017年1月
01.08
謹賀新年。年賀状も今日で最終的に終わったはず。
テンプレートの方も精神安定剤としてまたぼちぼち再開したい感じ。
まあ、3連休のあいだは小説とかそっち優先したいけど。
そろそろ次のテンプレート作りたい。
小説もそうだけど、仕上げより新しいの作るほうが好きだし……。
次やりたいこと、とりあえずメモ。
- 無限スクロール
- Masonry
- テーマカスタマイズ API（特に色）
- 画像メインにも流用できる系
Masonryは1年前くらいに作っていたテーマで使っているけれど。また改めてという感じ。
基本記事やカテゴリがごちゃごちゃしているのが自分のサイトなので、Masonryはつめこむのにはすごく便利。
あと、Masonryと相性よさそうな無限スクロール系もとりいれてみようかなとか。
この辺調整だけでも時間大量にかかりそう……。
あともう一つ。
1ページあたりの分量について。
昔から事情はかなりかわっているわけで。だから、ファイルサイズ的には、特に文字数的には、ほぼ本1冊分だろうと１ページにいれて問題ないと個人的に思っていたり。
ていうかページ遷移多いのは、pvかせぎのアフィ系仕様だと思っているし（嫌い）。
好き嫌いは人それぞれだけど、とりあえず自分はページ遷移多いのがものすごく嫌いなので（1記事を分割されているだけで、よっぽどのことがないかぎり次から寄り付きたくないレベル）、できる限りページ遷移を減らすテンプレートを作りたいなとか。
で。
じゃあ10万文字がそのまま1ページに表示されていることに問題はないかというと。
スクロール的な問題で読みづらいという問題があるのは確か。
とはいえ、スクロール量の問題と1ページあたりのサイズの問題は、少なくとも同じ問題ではないということはいえる。
だから無限スクロール的な見た目で（見た目の問題）折りたたむのはいいんじゃないかなとも。
JavaScript、なんとなく控え目の方がいいという思い込みがあったけれど。1箇所も使っていないならそれはそれでニーズあるだろうけれど、1個でも使っているならもうそれはJavaScript使用デザインなんだし、JavaScript有効でなければまともに見られないと切り捨てているサイトでもあるわけだし。なら、JavaScriptてんこもりでもいいんじゃないかなあとも。まあ重さはあるけど、どのみちWordPressは重たいとか開き直れば？
Masonryの小説的使い方。
ランダムに並び替えるのには使えるかも。勿論、これつかわなくて普通にランダム（特にphpなら楽）にすればいいとは思うけど。
2016年12月
12.31
今年も今日で終わり。WordPressテーマ「Ateh's theme-simplestyle」微調整継続。
今日はwidgetに対応させてみたり。
widgetはたまに対応してたりしなかったりだけど、まあwidgetなければRecent Postsを表示するようにしたので、allposts固定ページ作らなくてもある程度導線できたほうがいいかなと思って、ならwidget対応にしたほうが自由度高いかなと思ったという感じ。
日本語がかなりおかしいけどまあいいや。
ただ上のメニューがごちゃごちゃしすぎ。aboutリンクとかは、ヘッダでなくフッタも作ったほうがいいかなとも思うけれど、そこまでいくと結構調整すること増えるので来年でいいかな。
あとカスタムメニュー。
最近ずっと対応させてたけど、今回上のメニューをhtml版から移植したこともあって消してた。ただ上のメニューにカスタムメニュー表示のリンクがあれば、増えすぎた一覧を整理することもできるわけだし、それも次にやろうかな。
基本的には正月休みはもったいないので、忙しいときにもできるテンプレートいじり（睡眠不足は避けたいけど）はお正月にはなるべくしたくない感じ。
てか固定ページを作らないと404になるallpostsリンクはなるべくメニューからはずしたほうがいいのでわ、って気はする。widget追加で実質最近の投稿へのリンクはできたわけだし。カスタムメニューを作ってそのなかに好きに固定ページへのリンクとかはおけばよさげ。
- フッタ（いらないからないのではなく、とりあえず作ってないだけだし）
- カスタムメニュー表示
- メニュー見直し
で。
結局この3つ一応完了……。
ウィジェットとカスタムメニューに対応したので、じゃあ次はカスタムヘッダ（だっけ？）かなあとも思うけど、とりあえず来年にする。別にテーマフォルダの画像を直接入れ替えればいいんだしともいえるし。
おわり。
12.29
WordPressテーマ「Ateh's theme-simplestyle」、微調整した。検索を付け忘れてたから追加したっていう。
html版→php版→WordPress版の移植だったから存在忘れてた感じ。
てことで、手抜ならSEARCHページへのリンク（固定ページ作っていないと無意味）でもよかったけど、今回のデザインはともかくJavaScriptで窓（というかdiv）を開く系なんだし、その形式で追加することに。このやり方だと固定ページとか用意しなくていいし、いいかなーとか。
あと、これ、なんて呼ぶかわからないけれど。
最近わりとよくあるメニュー（ハンバーガーメニューとか）をクリックするとウィンドウっぽいのが現れる、その背景は背景色一色みたいになっている、みたいなの。
100%カバーする背景用div用意するのかなあと最初考えたけれど。これだと1手間増えてめんどくさいというのはあったり。で、次にボーダーでやってみたけど、これだとウィンドウ（っぽい）の位置がずれる。
てことで、次にやったのが、box-shadow。他がこれでやってるかは知らないけれど、手っ取り早く背景色しきつめられて（いるように見えて）すごく楽なので採用。
box-shadow: 0px 0px 0px 10000px #212121;（色は実際は別）これで、ページ遷移してないけれど、検索ページに移ったように見える感じ？
box-shadowの数字の意味うろ覚えだったから最初うまくいかなかったけれど、3番目はぼかさないなら0にするのが重要だった。最初の2つは縦横のずれ。そして4つ目が影の大きさ（長さ、幅？）。10000あればまあ実質大丈夫かなという感じ。
まあそもそも影みたいなものだから、正しい使い方な気もするし。このbox-shadowはどうしても、よくある影っぽい（少しずらして少しぼかす感じ）に使うことが多いけれど、別にそれだけのためにあるわけでもないような？ もう少し使ってみたいかも。
冬休みは基本的にテンプレート作成は禁止。小説書いたりに使うため。
修正はするけど……。
で、検索ついでにstatusのもこの仕様に変更した。黒だと重たいから背景色にしたり、ヘッダのメニューまで覆わなくてもいいかなってことでメニューの下に来るようにしたり。
やっと思い出した、というか探し出した。
モーダルウィンドウ！！
box-shadowの方法がすすめられていないってことは、何か問題はありそうな気はするけれど、とりあえず今のところ問題ないし。それよか手抜で使い回ししているクラスをちゃんと作るべきでわってくらい。スマホだとfixedにしてると下表示されない……。
てかあれ、オーバーレイの部分を半透明にするとかがあるところが違うのかも。
boxshadowで半透明とかすると、当然ウィンドウと背景は実質同じだからウィンドウまで半透明になるという制限はある。でもそれだけなら、導入の手間と比べれば重要かなという気もする。
モーダルウィンドウ（忘れないようにしよう。検索のためにも）、とりあえず自分的には今のでいい気がするからいいかな。
それよりCSSをもう少しお手入れ。
右上の×ボタン。これ今まで、divで右寄せしてたけれど。
ただそうなるとpaddingの都合でもう一つ入れ子のdivを作っていたけれど、これめんどくさい上にごちゃごちゃしてるなあとか。
てことで今更あちこちいじると危ないから今回はやらないけれど、最新版はsearch関連なので忘れないようにしよう。次のテンプレート作り時に。
変更したのは、divやめてspanに（inlineにした）。で、position:absoluteでtop,rightで指定。これだとウィンドウになっているdivにそのままpadding指定しても×ボタンの位置がおかしくならない。
最初にこれを思いつけばよかったけれど、まあしかたない。
スマホでも見きれないようにしたし（fixedだから見切れるなら見切れるけれど普通の設定なら見きれないという程度）、とりあえず検索関係はこれでいいかな。
次テンプレート作るとしたら、これもっと使いたい。
どうせJavaScript使わないとまともに表示されないってことは、また去年使ってたJavaScript、jQuery使おうかな。
今のデザインは、サイトタイトルとかがメインで、個別の記事へのリンクはめだたない。ただの1行だけ。最新記事だけは別にしても。
次はそうじゃなくて、ヘッダ画像みたいなのはなくてもいいから記事を1枠使ってしきつめるみたいなのがいいかなとか。
つまり、今回のはhtml版からの移植だから、そういう発想にほぼならないけど（これはこれでいいんだけど）。
WordPressネイティブで考えれば、1記事ごとに1枠使うみたいなのも楽なわけだし、またそういうの作ろうかなとか。
WordPressなら絵文字もわりと安定してきれいだから、サムネ代わりに絵文字ランダムとかでもいいし。しきつめる系のjQueryまた使いたい気分。
あ、あともう一個。
この前のWordPressテーマ（Novel）で使ったカラーピッカーのJavaScript。あれ、JavaScriptのlocalStorageで保存する仕様に変更して、背景色はともかくテーマカラーを設定できるようにしたらいいかも。とか思いついた。
モーダルウィンドウもどき、ランダムで色かえることもできそうだけど、とりあえず実用性はあんまりないから（完全ランダムはさすがに）それはいいか。
次はシアンマゼンタイエロー系（少し濃い目にして）と黒、白とかを考え中。
WordPress版のみなら（INDEXページのアイデアだから記事部分はほぼ流用だと思う、絵文字のときのを使うかもしれないけど）絵文字使ってもデザインかわりすぎってこともないし、絵文字とJavaScriptで来年も当面遊ぼうかな。
考えるの楽しいけれど冬休みは少なくとも書くのは禁止。
12.24🎄
今日はクリスマス、クリスマスイブ？まずは最近作りかけていたテンプレート、WordPress版、html版、php版それぞれ公開できたので何より。
最近の履歴はこんな感じ？
- 2016.12.24 「template-simplestyle（php版）」追加
- 2016.12.23 「template-simplestyle（html版）」追加
- 2016.12.20 「ワードプレステーマ-simplestyle」追加
- 2016.12.18 サイト引越 （新）http://atehstheme.medamayaki.xyz/
- 2016.12.18 サイトデザイン変更
ベース同じで3つ作ったけれど、使い回しがきくところもあるけれど細かいところであんまりきかないとも。WordPressは基本phpとはいえ、php版はどっちかというとhtml版に近いかなあ。php版はスタイルシートもphpにしているから、配色関連とかは同じphp製のWordPressに似ているかもしれないけれど。
それにしても、php版とhtml版はかなり見分けがつかないと思う。WordPress版も結構見た目似てるんじゃないかな。
てことで、テンプレートサイトの方を更新しているのか、php版のサンプルの方を更新しているのか混ざりそうになったり……。
サイトが一番古いから新しく追加したものが移植されていなかったりするけれどまあそれはそれ。
あと、同梱している画像。
unsplashのなんだけど、最初はクリスマスっぽい画像にしてた。wordpress版は今のところそのまま。まあ基本差し替えるものだしいいかなとか。
それと、status関連。
いらなければ使わなければいいんだし（メニューはhtml版もJavaScriptで読み込むようにしているから改装の手間は省ける感じ）、とりあえずこれも同梱してみた。
で、html版がJavaScriptのlocalStorageなのは当然として。php版は結構悩んだり。
別に、php+cookieで作ってあって、WordPressだとそっちの方が楽（前のWordPressコピペですむから）。とはいえ、cookieは正直扱いがめんどくさい。
てことで、php版はhtml版の移植でいいかなということで、こっちもJavaScript版にすることに。
無駄に項目多いけれど、作るのめんどくさいから作ったものはとりあえず置いてあるだけだし、これもカスタマイズすればいいんじゃないかなーとか。
てことで。
テンプレートいじりはこれで一段落かなあ。
リアルの方。
昨日23日、貴重な祝日に頭痛と熱で死にかけてた。
今日は持ち直してよかった。
クリスマス小説、公開まであと少しだしそっちがんばろうかなとか。
テンプレート自作しはじめたのは、そもそもそれをやれば小説書きが捗るんじゃないかと思ったからだったし……。
あと。
php版の方がWordPressより、同じサーバーにあるけれど軽い気がする。
WordPressだからなのか、自作のWordPressテーマが重たいのかは知らないけど……。
おわり。