はてなブログのスマートフォン表示ではてなブログのヘッダーやフッターを非表示にする

はてなブログのスマートフォン表示で、以下の画像のようなはてなブログのリンクを削除する方法です。

before

CSSを使用する

正確にはCSSをあてて要素を見えなくします。

管理画面からデザイン 👉 スマホアイコン 👉 ヘッダ 👉 ブログタイトル下にCSSを記述します。

記述するCSSは以下の通りです。

<style>
/* ヘッダー非表示 */
#globalheader-container {
    display:none;
}

/* フッター非表示 */
#footer-menu {
    display:none;
}

/* 余白を調整 */
#container {
    padding-top:0px;
}
/* フッターのリンク非表示 */
.footer-service-link,
.footer-action-wrapper,
.footer-touch-item-list,
.profile,
.hatena-module-profile,
.footer-action-wrapper{
    display:none !important;
}
</style>