その9:カッコ良すぎるBlogger最強の有料テンプレートGeek Pressを使い倒す

おすすめ記事ピックアップ

Geek Pressの記事を書き続けてから、アクセスが落ちてきているのですが、前回(http://www.furimuke.com/2014/05/8bloggergeek-press.html)に続き、日本語表示の調整をしてゆきたいと思います。

ちょっとその前に、私よりGeek Pressを使い倒しまくっている方がいました。CSSの変更でここまで出来るんですね。すごい!参考にどうぞ。

http://blog.nagiko.me/

さて、投稿サムネイルの本文引用のところは、こんなように見切れていると思います。これを修正します。この部分のCSSを見てみます。margin部分の調整して、見切れないようにします。

.post-archive .inner .post-body-snippet {
font-size: 14px;
margin: 10px 0 0 0;
}

こんな初期設定になっています。黄色の10px部分を丁度良い数値に変更します。ブラウザーで、Chromeの「要素を検証」で確認して調整すると分かりやすいでしょう。

適当に37pxが良さそうです。

.post-archive .inner .post-body-snippet {
font-size: 14px;
margin: 37px 0 0 0;
}

テンプレートに入って「.post-archive .inner .post-body-snippet」で検索しましょう。330行ぐらいに対象のCSSが出てくると思います。marginを37に設定して完了です。

この設定は大雑把に、多くの場合はズレない設定です。見出しが3行になるとズレたりします。フォントのサイズや種類によっても、ズレ具合は変わります。

どうしても、このズレが許せない場合は、本文の引用を削除する方法もあります。本文の引用を表示しているのは、この部分です。

   <p CLASS='post-body-snippet'><data:post.snippet/></p>

テンプレートで検索すると、3000行目ぐらいにあります。黄色い部分のpost.snippetを削除します。

こんな感じに。

スッキリしました。引用文章が無いので、もうズレる心配もありません。

スライド部分もズレます。この部分は、表示文字数を指定できますので、その機能を使いましょう。

この黄色い部分を例えば60とかに変更しましょう。

var SUMMARY_LEN = 150;// length of summary for feed data

3700行ぐらいに設定する部分が出てきます。

var SUMMARY_LEN = 60;// length of summary for feed data

はい、すっきりしました。

投稿記事の部分もどこかに、lengthを指定する設定(100文字で省略される設定になっている)があるはずですが、探しても見つけられませんでした。たぶんBlogger独自の仕様なのかなと思いつつ。何か方法がありそうな気がします。



次回に続く。
http://www.furimuke.com/2014/05/10bloggergeek-press.html



「Geek Press」は20$の有料テンプレートです。購入すれば、ずーっと使えます。Live Previewを押せば動くデモみれます。
Geek Press - Responsive News & Magazine Template









いいね!と思ったらお願いします。


名前

AddToAny adsence adwords Amazon AmazonFBA Calculator Analytics Blogger BMAG chrome CODEPREP Eclipse envato facebook FAQ feedly Font Awesome Geek Press Gifzo Illustrator kindle LinkWithin Logaster myfonts NAVER Photoshop PHP picasa Premiere Similarweb TOPSY tumblr Wordpress wpX XAMPP zenback ウェブマスターツール ウハウハモウケタイ カスタマイズ ゲストシリーズ ココナラ サイト制作 ドメイン はじめに プレスリリース プレスリリース作成 プレスリリース利点 まとめ ランディングページ リリース送付先の見つけ方 レビュー 考察 子孫セレクタ 思いつきサイト制作 書評 足成 台湾 通販 日記 忍者おまとめボタン 文章の基本
false
ltr
item
ふりむけばコウホウ : その9:カッコ良すぎるBlogger最強の有料テンプレートGeek Pressを使い倒す
その9:カッコ良すぎるBlogger最強の有料テンプレートGeek Pressを使い倒す
http://3.bp.blogspot.com/-W6KcpcFKHLM/U4BWO9wUE1I/AAAAAAAASEY/t6y8HsjixtE/s1600/chicks.png
http://3.bp.blogspot.com/-W6KcpcFKHLM/U4BWO9wUE1I/AAAAAAAASEY/t6y8HsjixtE/s72-c/chicks.png
ふりむけばコウホウ
http://www.furimuke.com/2014/05/9bloggergeek-press.html
http://www.furimuke.com/
http://www.furimuke.com/
http://www.furimuke.com/2014/05/9bloggergeek-press.html
true
8618648785166852656
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All 関連記事:もっと見るはクリック→ LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy