ブログには「続きを読む…」というリンクは付き物です。もし、デフォルト表示の[Read More...]を日本語表示にしたい要望があれば、以下のように変更しましょう。この設定が言語設定のデータ中にあるのかと探したのですが、これはプラグインの中にハードコピーされておりました。
このファイルを見つけて、"Read More..."を好みの日本語(utf-8)に変えればOKです。3か所あります。
/flatpress.world/fp-plugins/readmore/plugin.readmore.php
if ($MODE == 'auto' || $MODE == 'semiauto' ) {
if (strlen($string) > $CHOP_AT) {
return substr($string, 0, $CHOP_AT).
"… <span class=\"readmore\"><a href=\"".
get_permalink($id)."#readmore-{$id}\">[続きを読む…]</a></span>";
}
}
if ($MODE == 'manual' || $MODE == 'semiauto' ) {
if (($p = strpos($string, '[more]'))!==false){
return substr($string, 0, $p).
"<span class=\"readmore\"><a href=\""
.get_permalink($id)."#readmore-{$id}\">[続きを読む…]</a></span>";
}
} elseif ($MODE == 'sentence') {
$matches = array();
if ($v=preg_match_all('|[.!?]\s|', $string, $matches, PREG_OFFSET_CAPTURE)) {
if (count($matches[0]) > $CHOP_AT) {
$string = substr($string, 0, $matches[0][$CHOP_AT-1][1]).
". <span class=\"readmore\"><a href=\""
.get_permalink($id)."#readmore-{$id}\">[続きを読む…]</a><]span>";
}
}
}
どのような感じに変わるかは、下記の変更前と変更後をご覧ください。
<変更前の英語版＞
<変更後の日本語版＞
FlatPress は、bbcode という文法(Markdown)でブログや記事が書けます。まずは、基本の書き方（文法）をまとめておきます。なお、後からわかったことですが、PHP スクリプトや HTML の文法を混ぜ合わせるプラグインを利用することができます。そのあたりは別記事として紹介したいと思います。この時点では、記事入力部分をカスタマイズする計画した場合に、まずは「基本的な書き方」を理解しておく必要がありました。
検索窓をヘッダー部分へ移動する
今回は検索窓をヘッダー部分に内蔵させて、縦長の画面構成をあくまでも短縮する作戦を立てました。まずは、テンプレートの当該部分をヘッダー部分に作りかえます。検索窓自体はウィジェットなので、好みで右メニュー部の下方に置いておいてもよいでしょうし、ウィジェットを動作しないようにしておくことも好みでよいと思います。
ヘッダー部分への追記(<!-- 2014-8-23-->以下の７行分）
(/flatpress.world/fp-interface/themes/leggero/header.tpl)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>{$flatpress.title|tag:wp_title:'«'}</title>
<meta http-equiv="Content-Type" content="text/html; charset={$flatpress.charset}" />
{action hook=wp_head}
</head>
<body>
<div id="body-container">
<div id="head">
<h1><a href="/{$smarty.const.BLOG_BASEURL}">{$flatpress.title}</a></h1>
<p class="subtitle">{$flatpress.subtitle}</p>
</div> <!-- end of #head -->
<!-- 2014-8-23-->
<div id=topsearch>
<form id="search" method="get" action="{$smarty.const.BLOG_BASEURL}search.php" enctype="multipart/form-data">
<input type="text" name="q" id="keywords" value="" />
<input type="hidden" name="stype" value="full" />
<span class="search_btn"><input type="submit" name="submit" id="submit" value="{$lang.search.submit}" title="Title Search" /></span>
</form>
</div>
<!-- 2014-8-20 -->
<div id="toppanel">
{widgets pos=top}
<div id="{$id}">
{$content}
</div>
{/widgets}
</div>
<div id="outer-container">
<!-- 2014-8-17 -->
<div id=servername>
{if ($servername == "flatpress.world")}
{$servername}
{/if}
</div>
また、スタイルファイルも合わせて以下のように調整しておきます。 (/flatpress.world/fp-interface/themes/leggero/leggero/res/common.css)
/* new search position */
#topsearch {
margin-top: -60px;
padding-bottom: 11px;
padding-left: 570px;
}
#topsearch input {
background-color: #fff;
border: 1px solid #637C3E;
color: #5B6D3A;
opacity: 0.7;
}
#topsearch .search_btn {
position: relative;
right: 4px;
}
#topsearch .search_btn input{
color: #fff;
background-color: #637C3E;
padding: 2px;
cursor: pointer;
}
なお、改造の痕跡を残す目的で、変更部分をそれぞれに紹介していく方針なので、この他にプチ修正もしておきます。以下は従来のヘッダー画像が一旦表示されてから、今般の画像が表示れるまで若干時間がかかると、ちらっと前の画像が見えます。これを消しておきましょう。
/* ===== HEAD ===== */
#head {
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px;
margin: 10px;
/* 2014-8-27 */
/* background: #c37676 url('../imgs/shade.png') repeat-x; */
border: #bbb 1px solid
}
カスタマイズを施した結果はこんな感じになってます。ヘッダー部に検索窓が移動されてます。
カテゴリ表示のカスタマイズ
相変わらず、現実験サイトは縦長に思えてなりません。そこで、カテゴリ部分の圧縮を考えてみたいと思います。まず、今回のスタート地点での画面の様相は次のようです。また、引き続く画面は、天井部の空白を除去したものになります。
天井部の空白を除去
/flatpress.world/fp-interface/themes/leggero/leggero/res/style.css
/* FlatPress.info 2014-8-23 */
/* body { margin: 80px 0 0 0 } */
body{margin: 0}
カテゴリの一部をリスト表現解除にする
カテゴリ部分を表示させているのは次のプログラムが担当しています。また、このプログラムは「カテゴリ表示」全般を担当しているので、ブログ投稿(記事作成)画面でのカテゴリ選択の表示(デザイン)へも同様の影響を与えます。この図はデフォルトの状況での「ブログ投稿」時のカテゴリ選択のスナップです。