アーカイブのレイアウト修正

問題を整理すると、アーカイブ（年と月）が縦に並んでいて天地に広がり過ぎています。恐らく、３年分を横に並べられるのではないでしょうか。

どの部分を治すかですが、例によって使われているテンプレートを調べると widget.pl　です。これはウィジェット機能（別途に調べることにしましょう）が利用されていることを示しています。そこで、[FlatPress/fp-plugins/archives/]のディレクトリが目に付くことになりました。

plugin.archives.php を修正

/FlatPress/fp-plugins/archives/plugin.archives.php を修正します。下の部分のハイライトしているところです。少ない修正ですが必要となります。

<p style=clear:both>

この１行です。

挿入部分は下のハイライトしているところです。

function plugin_archives_widget() {

    lang_load('plugin:archives');
    global $lang, $PLUGIN_ARCHIVES_MONTHLIST;


    return array(
        'subject' => $lang['plugin']['archives']['subject'],

        'content' => ($list = $PLUGIN_ARCHIVES_MONTHLIST->getHtmlList()) ?
                        '<ul>' . $list . '</ul><p style=clear:both>'
                        :
                        "<p>{$lang['plugin']['archives']['no_posts']}</p>"
                    );
}

アーカイブ部分の CSS の様相を見る

下の画面は、Firefox の CSS を調査するプラグイン(FireBug)を利用しているところです。このようにして調べると、青枠線の部分を縮小すればよいことがわかります。加えて、右へ右へと次の年が回り込みをするようにもしないといけませんね。そこでスタイルシートとしては[float: left]を使いましょう。クラスは何かをみると、[class=archive-year]に当たりを付けて確かめてみましょう。

（ソースを直さなくても、Firebug を上手に使えば、その場で変化を確かめられます）

FireBug 画面の右手には、対応するスタイル部分が無い様ですね。また、ソースをよく見ると

<div id="column">

の部分があります。これにより、修正すべきスタイルファイルは、column.css　になります。このファイルに以下の数行を加えました。前段の部分が「右へ右へと次の年が回り込みをさせる」部分で、

後段は西暦部分を見やすくするためです。

/flatpress.world/fp-interface/themes/leggero/leggero/res/column.css

/* FlatPress.world 2014-8-17 */
.archive-year {
        float: left;
        text-align: right;

}

.archive-year > a {
        float: left;
        text-align: left;
        font-style: italic;
}

このようにして、少しは合理的なレイアウトになった感じです。

FlatPress.info

Information & blog