はてなブログの設定方法について、ブログ設定初心者である筆者が、分からないところを調べて、実践した内容をまとめたシリーズの3回目。今回は「デザイン」の「カスタマイズ」設定画面の後半、サイドバーの設定だ。
1回目の「設定」画面の設定方法はこちら。
2回目の「デザイン、背景、タイトル画像」の設定方法はこちら。
1.サイドバーとデザインCSSの設定(デザイン→カスタマイズ)
「デザイン」の3つのマークのタブのうち、「カスタマイズ」は左から2番目のスパナのアイコン。(マークを押すとタブが切り替えられる。)
(1)プロフィール
PCサイト上に表示するプロフィールはサイドバーに表示されるので、ここから編集する。(スマホ用は第4回参照)
HTMLは使えないが、改行や1行空けは可能。
IDとプロフィールアイコンは「about」ページの入口になっている。
(2)twitterの最新記事(追加する場合)
サイドバーの項目は削除も追加も可能。順番はドラッグで並び替えられる。
ここでは「twitterの最新記事」として、タイムラインを追加した。
ツイッターのタイムラインの追加方法。
i) 次のwebサイトへ移動→ https://publish.twitter.com/
ii) 自分のツイート(もしくは希望)のタイムラインのアドレスをコピーする。
iii) 「Embedded Timeline」を選ぶ。
iv) 高さ(上下の長さ)、テーマ(明るいか暗いか)、リンクの色は設定可能
v) 「Copy Code」を押して埋め込み設定をしたら、URLをコピペ。サイドバーの「モジュールを追加」→「HTML」にURLが貼れる。
(3)デザインCSS
小さなボックスに現在の設定が書かれている。クリックすると編集できる。
背景画像や目次のデザインなど、デザインテーマで設定されている以上のことをしたい時には、コピペ用のCSSが書かれているサイトを見付けて、ここにコピー。どこに貼ればいいか分からない時には、最後の「 } 」の前に追加。
(4)お問合せフォーム
Googleフォームを利用。aboutページかサイドバーなどのHTMLが書き込める場所に貼り付ける。
サイドバーに貼るときは、サイドバーの「モジュールを追加」→「HTML」。
記事に貼る場合は、埋もれてしまうので、サイドバーのリンクにアドレスを書いておくか、カテゴリーなどで見付けやすくする。
お問合せはgoogleフォームに入るのでメール連絡が来るように設定する。
次回はスマホの設定と記事ごとの設定です。