カテゴリー: posterous

Posterous Headline (copy) CSS カスタマイズ


Headline (copy)の ポストと引用のフォント変更メモ

ポストと引用のフォントがデカすぎなので小さめにして、
引用のイタリックをノーマルに変更。
style type=”text/css” の中に以下を加えた
*追記 – &文字間広げた

p{font-size: 12px; line-height: 18px; margin: 0px 0px 8px;}
blockquote, blockquote p{font-size: 12px; line-height: 18px; letter-spacing: 1px; margin: 0px 0px 8px; font-style:normal; !important;}

*追記 – コメントもでかい文字なので以下も加えて変更した

body{font-size: 12px; !important;}

Posted via clipclip drop

カテゴリー: posterous

斜体文字を普通の字体に変更 – posterous theme M82


M82のテーマが気に入って使ってるんだけど、
引用のフォントが斜体文字のitalicでとても読みにくい。
Advancedからカスタマイズすればいいのだけど、
なーんと、外部CSSになってて手を加えられない。

<link rel="stylesheet" href="/themes/m82/screen.css" type="text/css" media="screen, projection"/>

んじゃCSS書きなおしてこっちの外部CSSから・・と思ったが、
たぶんこの media= ってのがミソかデザインが崩れまくってしまう。

このcssのページの引用部分のソース

blockquote {background-color:#eee;margin: 20px 0; padding: 20px;font-style:italic;}

この状態のまま italicを否定して
別のフォントを指定するにはどうしたらいいか。

ツイッターでつぶやいたらたまたま見てくれてたらしく、
@qiring さんから
“normal !important;”でできるかも、とアイデア頂いて
早速やってみたら普通のフォントに変更できました。

以下作業メモ

■ posterousのtheme、M82をAdvancedでカスタマイズ

headの中のcss欄に以下を加えた

(追記:“!important”の部分外してもOK)

/* typography */
blockquote {background-color:#eee;margin: 20px 0; padding: 20p
x;font-style:normal !important;}
デフォルト italic
ノーマルフォント
カテゴリー: posterous

Autopost Options test


Advanced Options »

Posted via {{post_url}} にするとどうだろう

やった!! これでよかったみたい

ということで、Tumblrもこの設定に書き換え

これ美しくないのでこっちに書き換えた ↓

*「<」「>」は全角に書いてる

Posted via <a href=”{{post_url}}”>{{site_name}}</a>

Posted via clipclip drop

カテゴリー: posterous

Obox Theme + font, taglist, star, blogparts customize


posterousのテーマ変更したばかりなのに、早くも飽きてきそうで
メモがてらこちらに全文コピペ用リンクおきます よかったらどうぞ。
(コピペしてうまくいくかどうか試してないのでわかりません・汗
というか、これ欲しい人いるんだろうか・・)

こちらのページの中身をコピペしてテーマのタグと入れ替える↓
Obox Theme + font, taglist, …
http://docs.google.com/View?id=dcbr8j6g_280g5c8mhdc


関連記事: Obox Design テーマにタグリスト、スターボタン、ブログパーツ追加
– kisato posterous
http://kisato.posterous.com/obox-design-creates-awesome-new-themes-for-po-1

カスタマイズページは、Posterous customize 浮き立たせるフォント にあるように、
「setting」から「Theme and customize my site」
Advancedをクリックして Enable advanced theming » をクリックすると
「なんたらかんたら for your new creation?」のポップアップをOKするとカスタマイズ画面です

フォント変更、タグリスト、参照数、スター表示追加部分は赤文字部分
ブログパーツ追加部分はピンク色の部分

*注意
ブログパーツを貼らなくても、この//– ブログパーツ –//消してください。

ブログパーツ追加するとき、
ピンク色の「//– ブログパーツ –//」を消して追加してください
(あくまでも画像などのリンクや「画像表示用ついめ~じ」で、スクリプトは貼れません)。

参考画像- フォント小さめ、サイドバーにタグリストとブログパーツ、
各エントリー下部に参照数、スター表示

Posted via web from kisato posterous

カテゴリー: posterous

Obox Design テーマにタグリスト、ブログパーツ追加


The guys at Obox Design have been working hard to bring new designs to your Posterous site. We’re excited to release Mad Men, MyList, and Post Press to you today.

Click “Theme and customize my site” on the Manage page to see the new themes.

1 of 3

新しいテーマが追加されてる

– タグリスト追加

タグリストが無いのは心細い、というか、サーチボックスの機能が素晴らしいんだけど
わざわざ打ち込むのは面倒でしょうということで

<div class=“sidebarunit”>

<div class=“social clearfix”>{ProfileExternalLinks}</div>

のすぐ下に以下を追加

{block:TagList}
<div class=“tags”>
<h5>Tags</h5>
<ul class=“tag”>
{block:TagListing collapsible=’true’ count=’10’ action_id=’seemore_link’}

{block:TagListingMore}
<li style=“font-size:0;”><a href=“#” id=“seemore_link” class=“more-tags”>View all {NumTags} tags&nbsp;&raquo;</a></li>
{/block:TagListingMore}

{block:TagItem}
<li><a href=“{TagLink}”>{TagName}</a> ({TagCount})</li>
{/block:TagItem}

{block:TagItemSelected}
<li class=“tag_item_selected”><strong>{TagName}</strong> ({TagCount})</li>
{/block:TagItemSelected}

{/block:TagListing}
</ul>
</div>
{/block:TagList}

– ブログパーツ追加

ついめ~じなどのブログパーツは、以下のすぐ下に追加

{/block:NotSearchOrTag}

<a href=http://obox-design.com/&#8221; class=“visit-obox”><img src=http://posterous.com/themes/madmen/images/layout/obox-logo.png&#8221; alt=“Obox Signature Series”/></a>

– 引用部分のフォント変更

さらに、引用部分のフォントがでかすぎたりで読みにくいので
以下の部分に赤色部分追加

<style type=“text/css”>
div.posterous_bar { float: right; margin-top: 10px; }
div.posterous_header { margin-left: 150px; width: 100px; }
div.posterous_flash { margin-left: 150px; width: 500px; }

blockquote, blockquote p{font-family: Arial, Helvetica, sans-serif; font-style: Arial, Helvetica, sans-serif; font-weight: lighter; color: #777; font-size: 12px; line-height: 24px;}

– スターボタン表示タグ追加
どこに入れたらいいか嵌ってしまった。
よくわからなかったので、そのページのRetweetボタンのある場所に入れた。
{RetweetButton}
{/block:Retweet}
</li>
<li>
<fb:like href=”{Permalink}” layout=”button_count”></fb:like>
</li>
</ul>

の下に、以下追加

<br />

{block:Show}
<p style=”margin: 30px 0px; font-size: 14px;”>« Back to blog</p>
<div class=”sidebar-block” style=”margin-top: 30px;”>
<div><span class=”metricLabel”>Viewed </span><span class=”metricValue”>{PostViews} times</span></div>
<div style=”margin-top: 5px;” id=”favorite_fans”>
<span class=”metricLabel”>Favorited </span>
<span class=”metricValue”> {FavoriteCount} times</span>
</div>
<div id=”fan_hidden” class=”sidebarunit” style=”display: none; margin-top: 20px;”>
{block:Fans}
<h5>Fans of this post</h5>
<ul class=”fans”>
{block:Fan}
<li>
<a href=”{FanProfileLink}” rel=’nofollow’>
<img src=”{FanPortraitURL-20}” width=”20″ height=”20″ class=’profile_border’/>
</a>
<a href=”{FanProfileLink}” rel=’nofollow’>
{FanName}
</a>
</li>
{/block:Fan}
</ul>
{/block:Fans}
</div>                    {block:ShowOnClick action_id=’favorite_fans_link’ hidden_div=’fan_hidden’/}
</div>
{/block:Show}
<br />

Posted via web from kisato posterous