切り絵で可愛く404 Not Foundページを作る方法 - 切り絵Blog 影織文庫

切り絵で可愛く404 Not Foundページを作る方法

こんな感じで404 Not Foundのページを切り絵で表現してみました

私が使用しているBloggerでは、簡単に404ページをカスタマイズできます。
HTMLの知識がなくても大丈夫です。

404 Not Foundページの作り方

普段ブログを投稿するように新規ページを作成して、エラーメッセージを打ち込み、切り絵の写真を貼り付けます。
影織の404notfound切り絵の実装①



が、この「作成」ページで編集すると、選択できる文字の色や大きさが限られたものになってしまいます。
影織の404notfound切り絵の実装②
お探しの色は見つかりませんでした

こういう時は、「html」をクリックすると、詳細な編集ができるようになります。
影織の404notfound切り絵の実装⑤
赤線部"color"の部分で色が指定されているので、カラーコードを調べて書き換えます。

エラーメッセージを影織文庫のテーマカラーのえんじ色に変えました。
他にも、文字の大きさやフォントなどを適宜変えていきます。私は、この2つはとくにHTMLではいじらず、「作成」ページで選べる大きさ・フォントを指定しました。
影織の404notfound切り絵の実装④

完成したら、先ほどのhtmlをまるっとコピーしておきます。
画面左側の「設定」→「検索設定」→エラーとダイレクトのカスタム404ページの「編集」を開いて、コピーしたHTMLをそのままぺたっと貼り付けます。


完成ー!
影織の404notfound切り絵の実装⑥


※作成にあたっては、こちらの「Bloggerで404エラーページをカスタマイズして個性を出そう!」のページを参照させていただきました。

切り絵で可愛く404 Not Foundページを作る方法 切り絵で可愛く404 Not Foundページを作る方法 Reviewed by 影織 on 4月 12, 2017 Rating: 5