小規模Webサイト向け CMS 「すぐ使えるCGI」のサポート情報

記事ごとにページのファイル名(URL)を指定する方法

最終更新日: 2016-04-22

詳細ページのファイル名変更機能

詳細ページファイル名の変更

「すぐ使えるCGI」の Ver. 5.0 からは、記事ごとに、登録時に詳細ページ(個別ページ、記事ページ)のファイル名を指定できるようになりました。初期設定ではこの機能はオフになっていますので、必要な場合はテンプレートを変更して有効にして下さい。

ファイル名変更のSEO効果

詳細ページのファイル名を記事の内容に合致したキーワードを含むものに変更すると、URLにもキーワードが含まれる事になりますのでSEO効果が期待できます。

対応製品

2016年4月現在の対応製品は下記の通りです。

ファイル名変更機能を有効にする方法

記事ごとにファイル名を指定する入力欄は、初期設定のテンプレートに隠されています。スタイル指定で「display: none;」が設定されていますので、これを削除して管理画面に表示させて下さい。編集するファイルとその内容は以下の通りです(青字取り消し線部分)。

編集対象ファイル

templates/admin/2.html
templates/admin/3.html

templates/admin/2.html の削除箇所

<!-- admin option -->
<fieldset>
<legend>記事ページファイル名の設定</legend>

    <!-- 記事ページファイル名 -->
    <div class="pure-g sugu-control-group" id="sugu-t-article_filename" style="display: none;">
        <label class="pure-u pure-u-1 pure-u-sm-1 pure-u-md-1-3 pure-u-lg-1-4 pure-u-xl-1-5 sugu-label sugu-label-right" for="article_filename">ファイル名</label>
        <div class="pure-u pure-u-1 pure-u-sm-1 pure-u-md-2-3 pure-u-lg-3-4 pure-u-xl-3-5">
            <input type="text" name="article_filename" id="article_filename" value="%_article_filename_%" class="imeauto pure-input-1">
            <div class="">
                :(省略:詳細後述)
            </div>
        </div>
    </div>
</fieldset>

templates/admin/3.html の削除箇所

<!-- admin option -->
<fieldset>
<legend>記事ページファイル名の設定</legend>

    <!-- 記事ページファイル名 -->
    <div class="pure-g sugu-control-group" id="sugu-t-article_filename" style="display: none;">
        <label class="pure-u pure-u-1 pure-u-sm-1 pure-u-md-1-3 pure-u-lg-1-4 pure-u-xl-1-5 sugu-label sugu-label-right">ファイル名</label>
        <div class="pure-u pure-u-1 pure-u-sm-1 pure-u-md-2-3 pure-u-lg-3-4 pure-u-xl-3-5">
            <span id="sugu-t-article_filename_parsed">%_article_filename_parsed_html_% <span id="article_filename-holder">(%_article_filename_html_%)</span></span>
        </div>
    </div>
</fieldset>

削除個所が見つからない場合

初期設定のテンプレートに上記の表示が見つからない場合、Ver. 4.8 以下用に編集されたテンプレートをお使いです。同様の要素をお使いのテンプレートに追加して下さい。追加する要素は太字で示した部分です。その他の部分はお使いのテンプレートに元々あるHTMLコードをコピーして編集して構いません。

アップロードと確認

ファイルを編集したら、サーバの同じ位置に上書きアップロードして下さい。管理画面にアクセスすると、ファイル名指定欄が追加されています。

詳細ページのファイル名指定方法

詳細ページのファイル名としては、文字で指定する固定のファイル名を直接指定する他、日付情報などに置き換わるテンプレート変数も使えます。また、その組み合わせも可能です。

詳細ページのファイル名として指定できる文字

詳細ページのファイル名には、「specific-topic-of-today.html」など、固定のファイル名を指定できます。「4月の新製品情報.html」など日本語も使用可能です。

詳細ページのファイル名に指定できるテンプレート変数

ファイル名には「テンプレート変数」を指定して記事の日付情報や記事番号を組み合わせる事もできます。例えば、以下のような指定です。

テンプレート変数を使用したファイル名指定の例

指定作成されるファイル名(例)
%_yyyy_%-%_mm_%月の新製品情報.html2016-04月の新製品情報.html
important-news-%_d_%.htmlimportant-news-1.html

ファイル名の指定に含めることができるテンプレート変数

ファイル名の指定に使える記号(テンプレート変数)は以下の通りです。

テンプレート変数置き換わる値
%_d_%記事の管理用連番
%_yyyy_%記事の年(入力された値。以下同様。)
%_mm_%記事の月
%_dd_%記事の日

ファイル名を初期設定に戻す方法

ファイル名欄を空欄にすると、初期設定の webdir/1.html、2.html、... という名前で書き出されます。

詳細ページを作らない方法

ファイル名欄に「.none」と入力すると、その記事については詳細ページを書き出しません。

ファイル名指定のコツ

SEO対策として記事のキーワードをファイル名(URL)に含める場合で英単語など分かち書き表記の言語を使う場合、単語の区切りは半角ハイフンを使って下さい。半角ハイフンは単語の区切りとして検索エンジンに解釈されます。半角スペースもファイル名の指定に含めることができますが、URLになった時に半角スペースは「%20」という記号に置換されてしまい、読みにくくなります。

ファイル名指定のクリックでの入力

初期設定の管理画面テンプレートには、上記のようなテンプレート変数をクリックで入力する機能が含まれています(下記例)。適宜いらないものを削除し、よく使う指定があれば追加して下さい。

[<a href="javascript: set_value('article_filename', '', '')">初期設定</a>]
[<a href="javascript: set_value('article_filename', '.none', '')">記事ページなし</a>]
<br>テンプレート: 
[<a href="javascript: set_value('article_filename', '&#x25;_yyyy_&#x25;', 1)" id="sugu-t-template-js-yyyy">年</a>]
[<a href="javascript: set_value('article_filename', '&#x25;_mm_&#x25;', 1)" id="sugu-t-template-js-mm">月</a>]
[<a href="javascript: set_value('article_filename', '&#x25;_dd_&#x25;', 1)" id="sugu-t-template-js-dd">日</a>]
[<a href="javascript: set_value('article_filename', '&#x25;_d_&#x25;', 1)" id="sugu-t-template-js-id">番号</a>]
[<a href="javascript: set_value('article_filename', '.html', 1)" id="sugu-t-template-js-ext">.html</a>]
例えば、「年-月-日」を使う事が多ければ、以下のように足して下さい。
[<a href="javascript: set_value('article_filename', '&#x25;_yyyy_&#x25;-&#x25;_mm_&#x25;-&#x25;_dd_&#x25;', 1)">年-月-日</a>]

関連リンク

さらに詳しく