波打際を歩いて行く(仕事ブログ)

輸出ビジネス&海外コミュニケーションを支援します!

はてなブログの設定方法(3.サイドバーの設定)初心者が悩むポイントをクイックレビュー

はてなブログの設定方法について、ブログ設定初心者である筆者が、分からないところを調べて、実践した内容をまとめたシリーズの3回目。今回は「デザイン」の「カスタマイズ」設定画面の後半、サイドバーの設定だ。

1回目の「設定」画面の設定方法はこちら。

namiuchigiwa.hatenablog.jp

2回目の「デザイン、背景、タイトル画像」の設定方法はこちら。

namiuchigiwa.hatenablog.jp

1.サイドバーとデザインCSSの設定(デザイン→カスタマイズ)

f:id:namiuchigiwa:20190712104821j:plain

「デザイン」の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フォームに入るのでメール連絡が来るように設定する。

 

次回はスマホの設定と記事ごとの設定です。

namiuchigiwa.hatenablog.jp