Macky1991’s blog

ブログを始めて3週間、アドセンスが合格しました!今後ともよろしくお願いいたしますm(__)m

サイドバーのTwitterを短くしたい【第4次ブログ改造計画】

f:id:Macky1991:20190805193742p:plain

 

どうもこんばんわ。

 

明日お休みなので帰宅後に以前より気になっていた

Amazonプライム・ビデオで配信されている

Amazonオリジナル作品の「高い城の男」を観始めました。

 

海外の小説が原作のドラマ作品ですが

もし第二次世界大戦でアメリカが敗戦して

ドイツと日本に分割統治されていたら...

というもしもの世界を描いてまして

鉤十字が町中に飾られたニューヨークや

日本の街並みを思わせるような街模様のロサンゼルスなど

手の込んだ完成度の高い背景セットと

その世界での社会情勢もうまく演出されています。

昨年までに3シーズンも配信されているので当分の間は楽しめそうです。

 

ブログに感じる違和感

 

今夜の記事はドラマの感想文ではなく

私のブログのカスタマイズになります。

少し前からブログのここんとこを直したいところが3つありました。

 

Twitterを短くしたい

ブログの背景を変えたい

ブログアイコンを設定したい

 

 

この3つをカスタムおよび設定をしていきます。

Twitterのサイドバーを短くしたい

 

f:id:Macky1991:20190805193755p:plain

 

私のブログトップにいき下までスクロールすると

サイドバーのTwitterだけページ下部を超えることに

前々から違和感を感じていました。

 

検索していく中でこちらの記事を見つけましたので

参考にしながら設定してみました。

 

souken-blog.com

 

f:id:Macky1991:20190805193824p:plain

 

私ははてなブログを使用しているので

「ダッシュボード」の「デザイン」にアクセスして

「カスタマイズ」の一覧の中にある「サイドバー」に

以前追加した「Twitter」の「編集」をクリックします。

 

f:id:Macky1991:20190805193828p:plain

 

このTwitterのウィジェットを追加した際に使用したコードが表示されました。

このコードをこちらの記事を参考に少しカスタマイズして

ブログトップで表示されるサイズを修正したいと思います。

 

f:id:Macky1991:20190805193833p:plain

 

"twitter-timeline"の隣に次のコードを打ちます。

「width="320px" height="800px"」

記事のものより縦長にしてみました。

 

f:id:Macky1991:20190805210741p:plain

 

画面のようにTwitterのウィジットが短くなりました。

しかし、思っていたよりも短いので50pxずつ長くしてみます。

 

f:id:Macky1991:20190805210734p:plain

 

結果的に1000pxで落ち着きました。

ページ下部が揃っていると視覚的に気持ちがいいですね。

 

ブログ背景を変える

 f:id:Macky1991:20190805193742p:plain

 

ブログを始めた当初はデザインテーマで充分だと思ってましたが

オリジナリティに欠けるので変えようと思いました。

ブログ背景の変更は簡単です。

「ダッシュボード」の「デザイン」にある

「カスタマイズ」まで来たら「背景画像」をクリックします。

「背景画像」はあらかじめ用意されているものが選べられ、

また自分であらかじめ用意した画像をアップロードして使うこともできます。

今回は手元にいい背景画像がないので

あらかじめ用意されているものから選びました。

 

ブログアイコンを設定する

 

f:id:Macky1991:20190805193721p:plain

 

 

ブログアイコンは「ダッシュボード」の「設定」から

アイコンにしたい画像をアップロードして設定します。

プロフィールに使用しているアイコンを流用して

そのまま使います。

 

今回のブログのカスタマイズは比較的簡単でしたが

備忘録も兼ねて記事にしました。

また何かブログをカスタマイズする時があれば

記事にしますのでお楽しみに。

 

ここまでお読みいただきありがとうございます。

次回の記事の更新をお楽しみに。