無料版お問い合わせフォーム
こんな感じのお問合せフォームを作りました。
こちらがお問い合わせフォームです。
現在は固定ページに移転しています。
タイトルや記事上や記事下を消していますがこれは無料版はてなブログなので固定ページではありません。
あと記事一覧にも出ないように設定しています。
今回はこのやり方を紹介します。
やり方
今回のカスタマイズは自己責任でお願いします。
何らかの不具合などが出たとしても責任は取れません。
コメントであればできる限りは対応はします。
Googleフォームでお問合せフォームの作成
Googleアカウントにログインした状態で上記のサイトにアクセスします。
そして空白を選択し
このようなレイアウトにします。
回答の検証という機能を使うとメールアドレスの形式が違う場合にエラーが出るようになっています。
完成したら右上にある送信を押してHTMLをコピーします。
はてなブログで記事を作成する
※今回は見たままモードのやり方になります。
はてなブログで新たに記事を作成し先程コピーしたHTMLをHTML編集に貼り付けます。
するとこのようになると思います。
ですがこのままだとタイトルや記事上、記事下が表示されたままになってしまいます。
これがあると記事っぽさが出てしまい個人的には気に入らないです。
これを消したい場合は下で解説してます。
ですがこのままでいい方はこのまま公開してしまいましょう。
投稿する時刻は初投稿の年より一年前の時間に投稿することをおすすめします。
要するに2020年が初投稿だったら2019年に投稿することにしておくということです。
そうすることで記事一覧で一番下に出るため固定ページのように使えます。
CSSでカスタマイズ
まず最初は記事のタイトルや記事上・記事下を消します。
<style><!--
/* タイトル・日付・記事上・記事下・コメントを削除 */
.entry-header,
.entry-footer {
display: none;
}
/* ページャー */
.pager {
display: none;
}
--></style>
これをお問い合わせフォームの記事のHTML編集の中に貼り付けます。
これだけです。
最新記事やアーカイブや記事一覧からお問い合わせフォームを削除
/* 月間アーカイブから2019年を消す */
.archive-module-year[data-year="2019"] {
display: none;
}
/* アーカイブページから特定の記事を消す */
.archive-entry[data-uuid="UUIDを指定"] {
display: none;
}
このコードを「デザイン」→「カスタマイズ」→「デザインCSS」に貼り付けます。
まず変更するところが2箇所あります。
「月間アーカイブから2019年を消す」についてですが先程書いた2020年が初投稿だったら2019年に投稿の部分です。
初投稿の年より一年前に投稿しておかないと初投稿のアーカイブまで消えてしまいます。
今回は2020年を初投稿とし2019年にお問合せフォームを投稿したことにしているため2019年を削除します。
年は[data-year="2019"] の2019の部分を書き換えればOKです。
「アーカイブページから特定の記事を消す」の「UUIDを指定」はデロッパーツールを使い確認します。
Chromeの場合はF12を押すことによって確認できます。
これがデロッパーツールです。
ここにUUIDが書いてあります。
あとdisplay: none;をかなり使用するのでSEO面ではあまりよくはないです。
参考
はてなブログのトップページをWordPressの固定フロントページっぽくし、ホームページとして活用する方法 - Minimal Green