twitterで知り合った方に無料でブログのヘッダー画像描いてもらっちゃった

f:id:qweasdzxc-green:20171226235934j:plain

ども～銀ちょす(@gintyous)ッス！

ちょくちょくブログに遊びに来てくれてるかたは気づいたかもしれません

ブログのヘッダー変えました！

僕自身はそんなにデザインの製作は得意ではありませんので、自作したわけではないです

tiwitterで知り合った「おぎ」さんに描いてもらいました

twitter.com

ある日おぎさんがこんなツイートしてました

ブログのヘッダー欲しいなぁ思ってた僕のストライクゾーンにドストレートなツイート

【ロゴ・画像作成承ります!!】

無料プランと有料プランをご用意します!!
依頼は3人まで枠アリでそれ以降は消化するまでお待ちしていただきます

無料プラン
・ブログで紹介
・その他(要相談)

有料プラン
・ロゴ(¥1000)⇠関連画像付
・アイキャッチ(ｻﾑﾈ)画像(¥1000/5枚)
・その他画像(値段要相談)
— おぎ (@atk420t) 2017年12月10日

連絡したらすぐ書いてもらえることになりました

描いてくれた「おぎ」さんとは
描いてもらったヘッダー
はてなブログ側で行ったヘッダーの設定
- 高さ調整
- 背景色を変更
感想

描いてくれた「おぎ」さんとは

東京の高専に通っているブロガーさんですね

彼のブログはこちら

ogilog.com

なぜ知り合ったのか正確には覚えてないんだけど、僕自身実は高専出身でして、そのつながりでフォローさせてもらった（してもらった）気がする

結構年下だと思うんだけど、かなりちゃんとしてる感があります

将来有望ですなぁ

ブログを見た感じ、僕よりちゃんとしてるのがヒシヒシと伝わってきて先輩恥ずかしいよ

また、学生ブログ部という団体の創設者であり、代表者的な何かをしてらっしゃいます

具体的な何かはわかんないや、笑

学生ブログ部はこちら

www.gakusei-blog.evolvery.net

「学生ブログ部」とは、

全国の学生ブロガーが集まり、学生向けの役に立つ情報やコンテンツを発信していく共同サイトです！

個人的にはたくさんのブロガーの文章が見れるという点が結構楽しみだったりします！

とのことです

お互いの情報の共有と、仲間という意味での横のつながりの強化を目的とした団体のようです

入りたい方は、おぎさんに気軽に連絡してみたらいいかも？

描いてもらったヘッダー

何も注文はせず、自由に描いてもらいました

さて、描いてもらったヘッダーがこちら

f:id:qweasdzxc-green:20171226233012j:plain

このブログのテーマカラーを考えた配色にしてくれてますね

実際、ブログのヘッダーに使ってみたところすごく馴染んでます

ところで、何となくですけどブログのテーマを次に変えるときはモノクロな感じにしようかと思ってます

ってことで、

モノクロバージョンも作ってくれないか・・・！？

って後だし無理やり注文したら、快くすぐ作ってくれました（優しい）

それがこちら

f:id:qweasdzxc-green:20171226233339j:plain

ええやん！

はてなブログ側で行ったヘッダーの設定

そのまま張り付けるだけで設定はええ感じになるやろ

って思ってました

ブログ素人でした

f:id:qweasdzxc-green:20171226234117p:plain

おいおいおい～画像の1/3しか写らへんやんけ

ってことで、いろいろググりました

高さ調整

こちらのサイトのＣＳＳコードを参考にさせてもらって調整しました

mshitech.hatenablog.com

基本的にはデザインＣＳＳの部分にコピペするだけ

簡単な説明のためにコードを引用させてもらいます

/* タイトルイメージ調整 */

#blog-title {

    padding-top: 5px; /* 画像上部の余白*/

    padding-bottom: 5px; /* 画像下部の余白*/

    height: initial;

}

.header-image-only #blog-title #blog-title-inner {

    height: 250px; /* 画像の高さ */

    background-size: contain;

}

@media (max-width: 480px) {

.header-image-only #blog-title #blog-title-inner {

    height: 150px; /* 画像の高さ */

}

}