studioで存在しないurlを指定した場合
- HOMEページを表示する仕様
- このページにurlを遷移させるjsを実装
上記ででやりたいことを実現しました。
404ページを作成した場合は、そちらのページが表示されるかもしれません。
今回はひとまず404を用意せず、検証を優先して実装しました。
jsを指定する場所
- デザインエディタを開き
- HOMEのページを表示
- 右側のメニューを表示
- ページタブにある「カスタムコード」の「head内の末尾」に新規コードを作成

コードの内容
今回は添付ファイルのようなコードを書きました。
コード自体はChatGPTのアシストを受けながら作成しています。
DOMContentLoaded イベントの扱いについて
https://help.studio.design/ja/articles/7890587-サイト-ページにカスタムコードを追加する#h_72b60e435b
こちらには
headにコードを書いた場合、DOMContentLoaded イベントは発火しますが、HTML documentの読み込みと解析が未完了のタイミングで発火します。
とありました。
今回はページ遷移のため、未完了のタイミングでも問題ありません。それらをふまえてheadにコードを記載しました。
実際の挙動
問題なくページ遷移が動作しました。
新機能「カスタムコード」のおかげで、実装までの手間が少なく、大変助かりました。
お困りごとをお聞かせください。
ウェブについてのご相談、ご依頼など。お気軽にお問い合わせください。
頂いた内容については、3営業日以内の返信を心がけております。
お困りごとに対して、事例やアイディアを持って返信を心がけております。
小さなことから、お気になさらずお気軽にご相談ください。
その他のWeb関連一覧
-
FileMaker
FileMakerのレイアウト移動を「共通化」して、開発効率を底上げする方法
以前、FileMakerのレイアウト移動を共通化するテクニックをFileMakerの自習室にてご紹介しました。ですが、思ったほどには反響はありませんでした。 ただ、自分の中ではかなり手応えがありました。文章だけ...
続きを読む
-
FileMaker
FileMaker の自習室にて「ポータルで作ったカンバン表示を、ドラッグ & ドロップで移動する(Claris FileMaker - 10分でスキルアップ)」が公開されました
動画内のサンプルがダウンロードできます。 ダウンロードはこちらから この動画のこぼれ話お客様からご依頼のあったカンバンをポータルで作成した時に「ドラッグで移動ができれば」というご要望をいただきました...
続きを読む
-
a-blog cms
a-blog cms勉強会に行ってきました!
今日は名古屋で開催されるa-blog cms勉強会に参加です。なぜ参加するの?新しいバージョンで色々と機能が追加されました。今年50歳が、もうひとがんばりするために。若い方にいろいろしがみついて教わるために😆...
続きを読む
-
FileMaker
FileMaker の自習室にて「レイアウト移動を記録して、便利に使う(Claris FileMaker - 10分でスキルアップ)」が公開されました
動画内のサンプルがダウンロードできます。 ダウンロードはこちらから この動画のこぼれ話開発をしていく中で「より便利に」と同じくらい「より簡単に」開発をしたいと思うことがあります。ですが、簡単にしてし...
続きを読む
-
a-blog cms
a-blog cms Training Camp 2025参加報告 (と、個人的な感情の驚き)
今回音声が全体的に小さくなってしまっております。 申し訳ございません。聞きづらいのですが、そのままアップさせていただきました。先日開催された「a-blog cms Training Camp 2025」に参加し、想像以上に多く...
続きを読む
-
a-blog cms
a-blog cms Training Camp 2025の感想レポート
a-blog cms Training Camp 2025に参加いたしました。参加の際にメモしたことを、ブログにて公開いたします。 今回のイベントの概要はこちらから確認できますので、ご覧ください。https://ablogcms.doorkeeper.jp/...
続きを読む