Memo

カテゴリ「サイト運営メモ」[119件](7ページ目)
急ごしらえではありますが、[ドールやハンドメイドについて投稿するページ]を実装しました。(>>138で構想していたもの)

20221224175339-admin.png

ハンドメイド関連は完全な写真ギャラリーにしてしまうと気楽な更新ができなくなると思ったのに加え、1投稿内に写真を複数枚載せながら簡単な説明文を書いたりすることも想定しているので、基本はブログベースにしつつ、写真は大きめのサムネイルで一覧表示してプチギャラリー的な役割も持たせることにより、ブログとギャラリーの中間のような運用ができる作りにしました。

Visual Portfolioというプラグインを使用することで、当初の予定よりかなり早期に実装ができましたが、カテゴリーや検索まわりなどが意図した挙動になっていないのでいずれは手直しがいるかもしれません。投稿を見るだけなら現状で問題ありません。

過去のハンドメイド作品も気が向いたらこちらに移動します。(たぶんしない;)

ついでにトップページもプチ改装。
トップページから入ってきた人はあまりにもカオスで混乱するかもしれない;
おそらく新規さんはブログ記事への検索流入がメインだと思うのであまり気にしなくて良さそうですが。


#Wordpress #自作テーマ
ブライスお迎え記事で「ドールと創作は自分の中で地続きなのでサイトを分ける予定は今のところありません。(キリッ」と言いましたが、別サイトを作るまではないというスタンスは変わらないものの、サイト内コンテンツとしてはやっぱり線引きをしたいと思ったので、カスタム投稿タイプを作って同サイト内で半分別ブログ兼別ギャラリーみたいなのを作ろうと思いました。

ついでにあみぐるみやハンドメイド全般の話題もそっちに分けようかなぁと。
創作・ハンドメイド・ドールはそれぞれ好き層がそれなりに被っているとはいえ別々に見たい人も多そうだし、自分としてもごちゃまぜだったのは以前からちょっぴり違和感というかやりにくさがありました。
いくらニッチな個人サイトとはいえ、全部趣味が合う方以外お帰り下さい!!というほど排他的になるつもりもなく、やっぱり多くの人にできるだけ快適にお目当てのコンテンツを閲覧してほしいと思っています。笑
とはいえ、ここ(Memo)では相変わらずすべてごちゃまぜでやっていきますが。

自分の技術で問題なく実装できれば年明け1月中くらいには実現したいです。
1月はちょっと忙しいので2月になるかも。
それまでサイト内が散らかり気味となりますがご容赦ください。

#備忘録 #自作テーマ #wordpress
アーカイブスギャラリーの分類方法を変更してみました。

年ごとに分類する形式から、イラストの種類(画風やモチーフなど)別の展示にしました。

年ごとの分類だと、「XX年はたくさん描いたな~」とか「XX年はあれにハマってたなぁ~」という目線で見ることができるのは楽しかったのですが、不特定多数に公開するギャラリーとしてはちょっと散漫で間延びした印象になってしまうのが気になっていました。

画風ごとの分類であれば、さらっと描いたものとしっかり描いたものが並んでケンカしてそれぞれの良いところを打ち消し合ってしまうこともなくなったので良い感じだと思います!

ついでに、トップページのギャラリーのホバーエフェクトをなくしました。
PCではさほど気にならなかったものの、スマホやタブレットでは指でスクロールするときに、ほんの少し画像に触れてしまうだけで絵に暗いオーバーレイがかかってしまうので、サクサクと見たいときにストレスになる仕様だったためです。

#Wordpress
創作サイトとはあまり親和性のない内容かつ継続して書きたい話題があったので、サブドメインを使って新しいブログサイトを作っています。
そちらはほぼ自分用メモのようなものですので、こことリンクをつなげるかは迷い中。

以前からデータベースを使わないCMSに興味があったこともあり、新ブログはgravというフラットファイルCMSを使ってみることにしました。
gravはデータベース不使用ですのでセキュリティ的な面での安心感や、バックアップ&リストアがフォルダのまるごとDL/アップロードだけで済む身軽さ、軽量なところ、本文編集時にHTMLタグがそのまま使える点などが魅力的だと思います。

巷では「gravは学習コストが低い」などと言われてるようですが、とんでもない罠です。

gravのハッシュタグを遡ってもらえればお分かりいただけるように、以前にも挑戦して挫折しています。
今回作ったのは超ドシンプルなメモブログサイト程度のものだったので何とか形になりましたが、それでも非常~~~~~に苦戦しました。
gravでポートフォリオサイトやてがろぐのような自由で多機能なミニブログを作るのは私には不可能でしょう。

バニラで使うことが前提だとしてもWordpressの方が圧倒的に直感的で簡単としか思えないんだけど、一体どこを指して学習コストが低いと言われてるんだろう…。

gravもインストールまではまぁ簡単なのですが、そこからブログ記事を書くまでが本当にややこしすぎるんです。(確かに、一度わかってしまえばファイルも簡潔でわかりやすくはあるのですが。)
使うテーマによってフォルダの構造(対応している機能)が違うので、Wordpressのように気軽なテーマ着せ替えもできなかったりします。
日本語の解説サイトもあるにはあるんですが、その多くがインストールまでの解説で終わってしまっており、記事を書く方法はスルーだったりと、非エンジニアでもすっとわかるほどの親切な情報は殆どありません。
(おそらく、そんなことみなまで言わなくてもわかる層しか使ってないのかなと思いました。)

自分がgravサイトを形にするまでの備忘録をブログに載せようかなとも考えてますが、gravの日本語解説はニーズに対して供給が少ないこともあり検索上位に食い込みやすそうですから、意図しないほどの量&方向からのアクセスが来たりしそうで怖いなぁと二の足を踏んでしまいます。


#grav
>>126 この絵は凄く気に入ったので、久々にトップページのギャラリーに追加しました。
今まで描いてきたものとは少し雰囲気が違うので、今後追加する作品と調和が取れないようなら下げますが。

ところで、トップページのギャラリーの装飾は、ちょっと美術館や展示会っぽい雰囲気を意識しています。
周りが白い紙の額縁?あるじゃないですか。あれのイメージです。(マット台紙というそうです。)

馬子にも衣装、らくがきにも額装です。

#カスタマイズ #自作テーマ #wordpress
[アーカイブスギャラリー]の最新アイテムに新着アイコンが付くようにしました。

最近はいったんMemoなどに作品を上げて、後から複数枚まとめてギャラリーに載せるスタイルが自分にとってはやりやすいので定着してきましたが、閲覧側からはどれが追加分なのかがわかりづらかったことと思います。
ギャラリーではアナログ絵やファンアートなどは下の方に分かれた形で展示していることもあり、必ずしも上の方ばかり更新しているというわけでもなく、なおさらどれが新しい作品なのかわかりづらかったのですが、新着アイコンが付くことで追加された作品がわかりやすくなりました。

また、私は左上ほど新着(降順)、という感覚に慣れていたので説明するまでもない気でいたのですが、右下が新着(昇順)というパターンも割と多いようなので、NEWアイコンがあれば各カテゴリ内で左上に行くほど新作であることが直感的にわかりやすくなったかと思います。

20221207014812-admin.png

自分用メモ:新着作品には手動でカスタムCSSクラスを付ける

#自作テーマ #Wordpress #カスタマイズ
サイトを公開しないと気が済まないのは何故か
先日公開したこの記事の追記というか後日談的なもの。

KJ法という名の発想法があるそうですが、この中に「記述し、口頭発表する」という手順があるようです。

個人サイトやブログでやっていることはまさに記述・発表(口頭ではないですが)ですよね。
サイトをやるというのは一見するとアウトプットの結果を置くための場所づくりのようでいて、その実は発想を広げるためのアクションでもあったわけです。

それに近いことはブログ記事の方でも既に思い至って書いていましたが、その裏付けになる客観的な証拠が一つ増えました。というお話。
公開しないと発表にはならないですからね。少なくとも私の場合は発想を広げたくてサイトを公開しているという動機が強そうだというのがわかってきました。

#アイデア #創作全般 #モチベーション
サイトを公開しないと気が済まないのは何故か考えたり

最近、「eポートフォリオ」というものを知りました。
大学生などが、学習したことの記録をオンラインで付けていくシステムのことで、学問版のライフログのようなものとも言えそうです。
eポートフォリオには学生同士や教員とコメントのやり取りができるものもあるようで、そのコメントのやりとり自体が新たな学習にもなって…そういうところはブログやSNSにも似ているのかな、と思いました。

それで、このeポートフォリオというものは、私が個人サイトでやりたいと潜在的に思っていることに近いような気がしました。
デザイン系でいう「ポートフォリオ」とはちょっと違うものなんですよね。

仕事を取る窓口やPR用の装備としての美しく整備されたきらびやかなポートフォリオ(デザイン系でいうところの)じゃなくて、自分の創作活動や思考の軌跡がパッチワークのように集まった記録と振り返りのできるデータベースみたいなものを作りたくて、そこにはダメだったテストの点数にあたるようなものとかもそのまま記録されちゃってて(笑)、それを完全オフラインで自己完結するのではなく、一部の同士や特定の層にはこっそりと公開しておきたい…という感じでしょうか。

eポートフォリオも同様だと思いますが、個人サイトやブログにも、”人に見られる”という前提があることで、完全に自己完結していた場合では得られない気づきがあることも多いです。
この文章も、自分だけが見られる日記に書いていたらおそらく、「eポートフォリオって私がサイトでやりたいことにちょっと似てるなぁ」と一言メモして終わりだったと思います。
(もちろん完全に自分専用のアウトプットの場があることには別のメリットがあるとも思ってます。)

このサイトのように、コメント欄がない一方通行のサイトやブログでも当然閲覧者の存在を意識しているわけですから、人に向けて書いて(描いて)いるというだけで多少なりとも双方向的な考え方をすることになり、自分ひとりで完結するよりも思考が広がる効果があるんじゃないでしょうか。そして私はそれを求めているということみたいです。

長年、「なぜ非公開では満足できず、公開サイトを作りたいんだろう」という疑問が自分の中にありましたが、その理由が今回ちょっとわかった気がします。

【追記】>>120


#モチベーション
プラグインを減らす&サイトデザインをシンプルにしたかったので、トップページのハイライトギャラリー下の、最新ブログ記事一覧のデザインをミニマル化しました。

▽変更後の状態
20221114151137-admin.png

▽変更前の状態(iPadでのスクショしか残ってなかったため全体的にデザインが縦に潰れてます)
20221114151538-admin.png

以前の状態は、これだけのためにSpectraというブロックエディタ強化プラグインを入れていたのですが、この度シンプル化したことで最新記事一覧の表示もデフォルトのブロックだけで済み、プラグインを一つ減らすことができました。

やっぱりシンプルな方がいいですね。
ブログオンリーサイトなら、カード型リンクもありだと思いますが、うちは作品展示しているサイトなので、オマケコンテンツであるブログ記事のリンクがトップページで異様に存在感あるのはちょっとイマイチでした。
カスタマイズが楽しかったのでついついいろいろ足し算したくなってしまったのです。

#自作テーマ #wordpress
スクロールしてもついてくるサイドバーのメモ

2カラムビューの状況(おおむねタブレット端末以上)で、スクロールしたときに付いてきて固定されるサイドバーを設定してみました。

20221105130655-admin.png

まず大前提として、スクロールしても追従させたい要素にはCSSでpositionをstickyに設定します。
position:sticky;
当サイトは骨組みとなる部分はグリッドレイアウトというCSS3の手法でレイアウトされているのですが、このグリッドレイアウトとstickyはなかなか食い合わせが悪かったようで一筋縄ではいかず苦労しました。

【参考】:CSS Gridでposition: sticky;のスティッキーが効かないときの原因とその対応方法 | コリス

グリッドレイアウトとstickyの共存には一工夫必要なようです。

ただ、私の場合それ以前の所で引っ掛かっていたようで、親要素に高さ指定がされていなかったことと、topの位置を指定していなかったことがstickyが効かない原因でした。

【参考】:【CSS】position:stickyが効かない時の原因と解決方法 - ジャングルオーシャン

最終的に以下のようなコードにすることで無事に追従するサイドバーが完成。
.myaside(親要素){
    height:100%;
    display:block; //サイドバー自体はグリッド上に配置する必要があるが、サイドバーの中はグリッドレイアウトでなくても良いのでblock要素に変更しました
       --以下略--
}
.mysticky(追従させたい要素){
    position:sticky;
    top:50px;
    display:block;
       --以下略--
}

ちなみにサイドバーのうち追従するウィジェットと追従しないウィジェットはそれぞれ別のウィジェットエリアとして設定しています。
テーマのソース(sidebar.php)で、下記のように追従させたい方のウィジェットエリアにのみ.mystickyというクラスを付与しています。

20221105132908-admin.png

line

主に目次を追従させたくて追従サイドバーエリアを作ったのですが、ついでに広告バナーも追従させています。
(とはいえ、よっぽど長い記事でなければ追従開始する前に記事の方が先に終わります。)

広告バナーはなるべく上品なものを選んでいるつもりですが、邪魔になっていたらすみません。
気になる方は各自アドブロ等で対応してください。

【追記】
ついでにここのMemoのサイドバーも追従にしてみました。(おおむねタブレット端末以上のみ)
ここにはいろいろ書き散らかしているので、検索性が上がって便利になったと思います。


#自作テーマ #wordpress #備忘録
1 2 3 6 7 8 10 11 12