見出し画像

コーディングできないディレクターがWordpress.comでサイトを作るメモ

aisanです。
今回は福祉の内容ではなく、現在自分のサイトをWordPress.comで制作しているWebディレクターとしての技術的な覚え書き日記になります。

まず自分の情報

  1. Webディレクター歴約10年・でも最近のツールに弱い

  2. フルスクラッチコーディングはできないが開発ツールを使ってどこに何が当たっているか読むことはできる。カスタマイズくらいはなんとかできる

  3. 自分のポートフォリオ・仕事受付サイトとして利用したい

  4. デザインやコンテンツ制作はできる

  5. Wordpressは何年もさわってきたけどできれば避けたかった

  6. 本当はSTUDIOかFramerあたりで構築したかった

Wordpress疲れ

Wordpressを使う人は自分でサーバーを借りてインストールして運用する人がほぼほぼだと思います。この運用や立ち上げは自分も何回も経験していて、仕事として請け負うことはディレクターとして十分経験があるレベルだと思います。

が、Wordpressを運用・保守する手間が本当にキツい。
自分の仕事用のサイトはほぼ最初に作りこんでしまえばあとは情報更新をするだけの用途なのですが、そのサイトを維持するためにWordpressにインストールしたプラグインやテーマファイルをアップデートし、デザインのカスタマイズが壊れていないかチェックし、Jetpackの言うままにメンテナンスし続けたり、SEO対策やOGP設定などSNSの仕様変更による対応を常にアンテナ張ってやり続けなきゃいけないことが「自分のためだけ」のサイト運用として私にはエネルギー過剰に感じていました。

PHPのバージョンをアップデートするためにWordpressをバックアップして対応する等サーバー側対応もたびたび発生するため、これを仕事として請け負うならともかく、自分が作って自分で運用するサイトはできるかぎりメンテナンスコストをおさえて、情報更新だけをしていればいいローカロリーな仕様を目指したいと思っています。

そこで候補に挙がったのがSTUDIOでした。
ある程度デザインも今風のテンプレートが揃っていて、更新する側はほとんどコードをさわらなくても運用が可能。
ノーコードツールとして今イケイケのSTUDIOに魅力を感じ、正直今でもSTUDIOを使いたい。が、予算がどうしても折り合わず。
その他のノーコードツールも検討しましたが、デザイン面やカスタマイズ性で折り合わず…

あきらめかけて、自分でfigmaを使って見様見真似でワイヤーフレームを作っているとき、ふと思い出したことがありました。

なぜWordpress.comを選んだか

それは、Wordpressはホスティング型サービスもあったなということでした。サーバーにWordpressをアップロードしてインストールするのではなく、ブログサービスのように自分のアカウントを登録したら既に構築されたWordpressを提供してくれるサービス、それがWordpress.comです。

はるかなるいにしえの昔、無料プランで個人ブログをWordpress.comで運用していたこともあり、基本的な操作はすぐにわかりました。

インストール型のWordpressはすべて自分の自由にカスタマイズできる反面、CMSを維持するためのメンテナンスの手間がとても煩雑です。
ここを、ホスティング型のWordpress.comを使うことで解決できると急に思いついたのでした。
ホスティング型のWordpressであれば、CMSとしてアップデートしたりサーバー部分の保守コストをすべて運営側に委ねることができ、サイトを作りこんでしまえばあとは更新するだけで事が済みます(一部細かい手間がかかる部分もあり)
問題は以前にくらべてどの程度デザインを自由に変えられて、カスタマイズ性が良くなっているのか。
Wordpress.comでノーコードツール的な使い方ができるかどうかが私の基準ポイントでした。

ブロックエディターとパターン

いにしえのアカウントを呼び起こし、プチ黒歴史だったもう非公開にしているブログを削除した後、Wordpress.comで無料で新しいブログを作成しました。

確認したかったのは、どんなテーマファイル(外観)があるか、テーマファイルにどの程度のカスタマイズができるのか。
私が利用していたいにしえの時代と大きく変わったことは、ブロックエディターが実装されていたことでした。

取り急ぎ無料テーマで気に入った「Lativ」を使って色々カスタマイズしてみることに。

Wordpress.comで気に入った無料テーマ「Lativ」

昔のWordpress.comだと、テーマをカスタマイズするには有料プランにアップグレードした上で、一部のCSSのみカスタマイズできるという仕様だったと覚えてるんですが(いにしえすぎて違ったらごめんなさい)
現在のWordpress.comは無料プランでもブロックエディターを使うことができ、直感的にデザインをカスタマイズできる仕様に変わっていました。これはうれしい。

Wordのような直感的な感覚でテーマファイルをカスタマイズできるブロックエディターモード

もうひとつ魅力的だと感じたのは、パターンというアセットが用意されており、自分でカスタマイズするだけでなく、一般的なWebサイトで使われやすいパーツをテンプレートとして使用できることでした。

ブロックエディターで直感的に挿入できるパターン。十分すぎる。

Wordpressでテーマファイルのカスタマイズが面倒な理由のひとつに、例えばここに最新情報を自動で3行くらい入れてくれるデザインだと助かるのに…という時、そのカスタマイズをするためにプラグインを導入したり、phpファイルをカスタマイズする必要があり、アップデートのたびに上書きされないか気を揉む作業が多くありました。
この「パターン」の中には最新のブログ投稿をサムネイルだったりテキストだったりをブロックエディターを使って簡単に挿入できるアセットも入っており、いにしえのWordpressをいじっていた私としては大変感動しました。

そんなこんなで自分の求めているメンテナンスコストを抑えつつ、予算に見合った仕事サイト構築ツールとして、Wordpress.comをノーコードツール的に使って製作してみようという運びになりました。

このシリーズはほぼ自分のメモのために日記をつけていく形式にするので、文章をあまり見直しせず脳内とっちらかった内容になりがちだと思いますがご容赦ください。

現段階でのWordpress.comのデメリット

重い
表示速度は致命的に重いことはないんですが、ログインしてカスタマイズしてる時の挙動が重い。エラーもよく起こりやすい気がします。

こまめに保存しないとつらい目に合う
当たり前のことなんですが、自動で保存される機能がついてるとはいえ急にエラーが起こってしまい、ブロックエディター使用中にちょっと集中して小1時間くらいしていた作業がぶっとんで復帰しなかったことがすでに2回ほどありました。
しつこいくらい保存ボタンを押していきたいと思います。

ほぼ自分のためのメモ運用になりますが、今後も気付いたことや挫折したこと、制作メモを今後更新していきたいと思います。

この記事が気に入ったらサポートをしてみませんか?