tamasaburo

得する役立つものをお届けする情報サイト

はてなブログのスマホサイトカスタマイズ - 不要な部分を非表示にし軽快な動作を実現

スマホサイトのカスタマイズで、表示の速さを格段に上げた方が閲覧するユーザーにとっては有り難い筈。スマホサイトの必要のない部分を非表示にすることで動作を軽快にすることが大切です。サイト表示スピードの違いで検索ランクも変わってくるので速いことに越したことはありません。

http://www.flickr.com/photos/34580986@N03/4875536837

photo by JonathanCohen

 

はてなブログスマホサイトカスタマイズ方法

下記のCSSを 設定➡デザイン➡スマートフォン➡ヘッダ➡タイトル下

に記述する。

 

<style type="text/css">

 

body {font-family:"Avenir Next", sans-serif;}

.list-entry-article .thumb-image 
{
width: 100px; /*サムネイル画像の横幅*/
height: 100px; /*サムネイルが画像の縦幅*/
border-radius: 0em; /*サムネイル画像の角の丸みをなくす*/
border: solid 3px rgb(61, 61, 61); /*画像の枠線をつける*/
}
.date
{
color: white; /*日付の文字色*/
background: #444B99;/*日付の背景色*/
padding: 0px 10px;/*日付の文字まわりのスペース*/
}

#globalheader-container {
display: none;
}

 

.header-blog-icon {
display: none;
}

 

#blog-description {
display: none;
}

 

.entry-footer-section {
display: none;
}

 

.footer-action-wrapper {
display: none;
}

 

.touch-item-list {
display: none;
}

 

#footer-menu {
display: none;
}

 

.profile {
display: none;
}

 

</style>

 

上記のCSSは、はてなProユーザーのみができ、無料ユーザーの方はできないようです。

 

参考ブログ

tsukuruiroiro.hatenablog.com

Literallyさんに感謝!

Copyright © 2017 tamasaburo.com. All rights reserved.