STORKのカテゴリーラベルを消す方法

こんにちは、パラレルブロガーのゆーすけ(@yusuke_plmrstn)です。

今回はSTORKでトップページなどを表示した時、サムネイル(アイキャッチ画像)の右上隅に表示されるカテゴリーラベルを消してすっきりさせる方法を紹介します。

カテゴリーラベルの問題

カテゴリーラベルがあると分類がわかりやすくなるかもしれませんが、サムネイルの一部が隠れてしまうんですよね。

せっかく力を入れて作ったアイキャッチが全部見えないのは前々から嫌だったので、カテゴリーラベルを消してすっきりさせました。

その方法を紹介しますね。

カテゴリーラベルを消す方法

STORKでカテゴリーラベルを消すためには.phpファイルに手を加える必要があります。

誤った操作をすると画面が真っ白になってしまう恐れがあるため、慎重に作業してください。

【1】記事の並び方を確認する

STORKでは記事の並び方を【シンプル】【マガジン】【カード】【ビッグ】から選べる機能があります。

あなたのブログでどれを採用しているかによって編集対象の.phpファイルが違ってくるため、自分のブログの表示方法を確認しておきましょう。

表示方法は [外観]-[カスタマイズ] – [グローバル設定] から確認することができます。

【2】FTPクライアントソフトを使う

FTPクライアントソフトから自分のブログにアクセスします。

ソフトは色々なものがありますが、僕はずっと「Cyberduck」を使っています。

Cyberduck

2,900円

(2018.10.26時点)

David Kocher

posted with ポチレバ

 

FTPソフトから自分のブログにアクセスし、[自分のドメイン] – [public_html] – [wp-content] – [thems] – [jstork] を開くとズラリとファイルが並んでいるので、ここからお目当ての.phpファイルを探します。

• シンプル→parts_archive_simple.php 
• マガジン→parts_archive_magazine.php 
• カード→parts_archive_card.php
• ビッグ→parts_archive_big.php

見つかったらコピーし、子テーマとして使いましょう。

mukutto.com

子テーマを使おう！STORK（ストーク）に子テーマをインストールする方法

続きを読む>>

【3】コードを書き換える

.phpファイルをエディタで開きます。

その中に、

<span class=”cat-name cat-id-<?php echo $cat->cat_ID;?>”><?php echo $cat->name; ?></span>

という記述が2箇所あるので、どちらも消してしまいましょう。

ちなみに、1箇所目は【サムネイルが設定されているときのカテゴリーラベルの表示】について。

2箇所目は【サムネイルが設定されていないときのカテゴリーラベルの表示】について書かれたコードです。

あとは上書き保存すればOK。

これでサムネイルからカテゴリーラベルがきれいに消えました。

カテゴリーラベルが消えない人は【シンプル】【マガジン】【カード】【ビッグ】を見誤っているか、編集する.phpファイルが誤っている可能性があるので、見直してみましょう。

【おまけ】タイトル下にカテゴリーラベルを表示する

ここから先はおまけです。

僕のように、タイトル下にカテゴリーラベルを表示する方法を紹介します。

先ほど編集した.phpファイルの中に、

<p class=”byline entry-meta vcard”> <span class=”date gf updated”><?php the_time(‘Y.m.d’); ?></span> <span class=”writer name author”><span class=”fn”><?php the_author(); ?></span></span>

という箇所があるので、それを

<p class=”byline entry-meta vcard”> <span class=”date gf updated”><?php the_time(‘Y.m.d’); ?></span> <span class=”cat-name cat-id-<?php echo $cat->cat_ID;?>”><?php echo $cat->name; ?></span> <span class=”writer name author”><span class=”fn”><?php the_author(); ?></span></span>

に書き換えて上書き保存します。

これでタイトル下にカテゴリーラベルが表示されるようになるので、CSSで表示位置を修正しましょう。

.byline .cat-name {
padding: 0.2em 0.4em;
margin-top: 0.3em;
margin-left: 0.9em;
font-size: 0.7em;
float: none;
}

これをCSSに追加するとラベルの位置が左寄りになり、これで完成です。

微妙な位置の調整は数値をいじってお好みで設定してください。

お疲れ様でした。

アレンジするともっとよくなるSTORK

STORKはオリジナルで十分に使えるテーマですが、差別化するにはアレンジが必須です。

どんどん自分好みに手を加えましょう。