見出し画像

WordPressサイトの仕上げ完了(画面の最上部に戻るボタンのスムーズ化)

(約 1,700文字の記事です。)

今日は夜もまだ更けていないがこれで今日の作業は終わりにする。

先ほど、自分にとっては大きなブレークスルーを果たした。

他人からすれば「え?たったそれだけ?」と思うかも知れないことだが、自分にとってはとても大切なことだった。


画面の最上部に戻るボタンをスムーズ化

このボタン「▲上に戻る」は自分で実装したオリジナルなものだ。WordPressテーマのテンプレにあったものじゃない。

だがこのボタンをクリックすると一瞬で画面が最上部に遷移する。スライドしたという印象はみじんもない。パッと画面が変わるのだ。

これをどうにかしてヌルリとスライドさせて画面の最上部に移動させたかったのだ。

jQueryやらJavaScriptやらを調べてみたが、サッパリ分からん😭

悪魔の囁き:「どうせクリックで画面の最上部に移動出来るならそれでいいじゃん?別にコンテンツの内容に変わりはないんだし。このままでいいのでは?」

確かにそうだ。これがヌルリとスライド移動したところで「コンテンツの情報」そのものに変化はない。だがユーザー体験が異なる。ページの最上部に移動したことを理解しやすいかどうか。

悪魔の囁き:「でもさ、読者は理解した上で『▲上に戻る』をクリックしたんだぜ?ページの最上部に移動するに決まってんじゃん?わかりきってんじゃん?」

……、その通りです。全くその通りです。

だがしかし!

画面の右下のこのボタンを押すとヌルリと移動するんです😭

だったら『▲上に戻る』をクリックしたときも同じ挙動にならないとおかしいんじゃねぇの?と思ったわけで。

そして小一時間格闘した結果。

無事に実装完了😭 たった1行のコード追加で実装完了なのです。。。

試しにこちらのページをマウスホイールで下げてみて下さい。

『▲上に戻る』をクリックしてみて下さい。滑らかにページ上部にスライドするでしょ?


……、うん、たったこれだけ。

でもこれが欲しかったんだ。パッと画面が移動するのじゃなくて、スライドして欲しかったんだ……😭



新サイトのフロントエンド側の実装完了

この不満を解消できたおかげで、現時点でのフロントエンド側の実装に不満はなくなった。

ようやくコンテンツの整備に入ることができる。

長い、長い、長かった😭取り組み初めが9月20日だったと記憶しているので、ほぼ1ヶ月かかった。それだけ自分のためのコンテンツ作りというものに対しては時間とエネルギーが必要だったわけだ。結果論として。

だが満足だ。あとはコンテンツの取捨選択とブラッシュアップ、マネタイズに集中できる。


ようやく自由の空が手に入った瞬間


長かったわぁ~。ホント、長かった。

現時点でほぼほぼ執筆者の自分から見ても管理しやすく、読者側からしてもアクセスしやすい仕組み作りが整ったと感じる。今日までの4週間は果てしなく長かったし、そもそも「上手く行く保証など誰もしてくれない状況」での孤軍奮闘は、とても辛かった

ここからは私のターンだ。

やるべきことが山積みだが、希望はある。ここからが起死回生のスタートだ。反撃の狼煙(のろし)が今上がった。

今までnote、ブログサイト、BOOTH、この3者の連携を取るために色々工夫してきたが今後はかなりスマートに連携できそうだ。気軽な日記も、駄文も、有料記事も、全てを1つのプラットフォームで融通できる。この可用性は半端ない。そのステージにようやく辿り着けた。

もちろんnoteにはnoteなりのいいところがたくさんある。だが今の私のマネタイズにとってはnoteは足かせの要素が大きかった。だからその部分ではnoteを卒業することになった。

そして今後もnoteはただの駄文置き場ではなくなる。書き散らかすことには変わりはないが、その後工程もきちんと予定している。noteを使い倒すつもりだ。


とりあえず今日はこの辺で終了。ちょっとオーバーテイク気味だったので少し休憩しよう。


クマも白黒になるだけで愛されキャラになるという、世の中の理不尽さよ。



今回の創作活動は約5時間30分(累積 約3,502時間)
(958回目のnote更新)


読んでくれてありがとう。気長にマイペースに書いてます。この出会いに感謝😊