カテゴリのURLを変更してウィジェットで表示したい

ご希望の内容が詳細に分からないのですが、「カスタム HTML 」ウィジェットに HTML を書くのではだめなのでしょうか。

<ul>
    <li><a href="#">カテゴリー 1</a></li>
    <li><a href="#">カテゴリー 2</a></li>
    <li><a href="#">カテゴリー 3</a></li>
    <li><a href="#">カテゴリー 4</a></li>
    <li><a href="#">カテゴリー 5</a></li>
</ul>

返信有難う御座います。

分かりづらくで申し訳ないです。

（例　ここから）

記事タイトル
2018/6/27　カテゴリ1　カテゴリ2　カテゴリ3　カテゴリ4

本文

カテゴリ1　カテゴリ2　カテゴリ3　カテゴリ4

関連記事

（例　ここまで）

本文内に記事ごとのカテゴリを表示してリンク先を同じカテゴリで
姉妹サイトの同じカテゴリに飛ばしたいです。

本文のカテゴリリンクを

https:自分のサイトURL/category/%e6%9c%aa%e5%88%86%e9%a1%9e/

https:姉妹のサイトURL/category/%e6%9c%aa%e5%88%86%e9%a1%9e/

のように変更したい。

これをクラシックテキストのウィジェットで好きな位置に設置したいです。

うまく伝わるか分かりませんが宜しくお願い致します。

理解できました。投稿ページが属するカテゴリーの取得が必要なんですね。

1 つの条件さえ満たせば、いけると思います。その条件は、カスタマイズをされるサイトと、姉妹サイトのカテゴリーのスラッグが一致していることです。

一致している場合には、下記の 4 ステップでカスタマイズができます。

ただし、今回のカスタマイズだけでは、記事タイトル下のカテゴリーリンクは姉妹サイトに飛びません。飛ばしたい場合には、親テーマのテンプレートの変更が必要です。

●ステップ 1 ●

子テーマの直下に 1 つファイルを作成し、ファイル名を link-to-sister-site.php とします。そのファイルに、下記のコードを追加します。

<div class="sister-wrap">
    <?php
    $cats = get_the_category();
    foreach( $cats as $cat ) { ?>
    <div>
        <a class="sisters" href="姉妹サイトのURL/category/<?php echo $cat->category_nicename; ?>"><?php echo $cat->cat_name; ?></a>
    </div>
    <?php } ?>
</div>

「姉妹サイトのURL」の部分は、ご変更ください。

●ステップ 2 ●

ウィジェットでは PHP を動かせないため、動かせるようにします。

「 WordPress でプラグイン使わずにウィジェットで PHP コード動かす」の見出し「 functions.php 」のコードを、子テーマの function.php に追加します。

追加後は、 2 行目の ahoaho を link-to-sister-site に変更します。

●ステップ 3 ●

ウィジェット管理画面より、「投稿本文下」ウィジェットエリアに「カスタム HTML 」ウィジェットを放り込み、 [link-to-sister-site] と書きます。これで本文下にカテゴリーリンクが表示されます。

●ステップ 4 ●

CSS で装飾し終わりです。例えば、下記の CSS で横並びになります。

.sister-wrap {
  display: flex;
  flex-wrap: wrap;
}

.sisters {
  margin: 0 8px;
}

返信有難う御座います。

引用ここから

●ステップ 1 ●
子テーマの直下に 1 つファイルを作成

引用ここまで

1.　ここでつまづいているのですが、1 つファイルを作成はワードプレス内でできるのでしょうか？

（子テーマは使用していなくて親テーマのテンプレートを直接変更しています）

2.　試しにfunctions.phpに記述したのですが

引用ここから

<div class=”sister-wrap”>
<?php
$cats = get_the_category();
foreach( $cats as $cat ) { ?>
<div>
category_nicename; ?>”><?php echo $cat->cat_name; ?>
</div>
<?php } ?>
</div>

引用ここまで

wp-content/themes/simplicity2/functions.php ファイルの42行目のエラーのため、PHP コードの変更をロールバックしました。修正し、もう一度保存してください。
syntax error, unexpected ‘<‘

のようになります。ファイルを作成したものに記述すればエラーがでないのでしょうか？

宜しくお願い致します。

返信有難う御座います。

引用ここから

●ステップ 1 ●
子テーマの直下に 1 つファイルを作成

引用ここまで

1.　ここでつまづいているのですが、1 つファイルを作成はワードプレス内でできるのでしょうか？
（子テーマは使用していなくて親テーマのテンプレートを直接変更しています）

2.　試しにfunctions.phpに記述したのですが

引用ここから

<div class=”sister-wrap”>
<?php
$cats = get_the_category();
foreach( $cats as $cat ) { ?>
<div>
category_nicename; ?>”><?php echo $cat->cat_name; ?>
</div>
<?php } ?>
</div>

引用ここまで

wp-content/themes/simplicity2/functions.php ファイルの42行目のエラーのため、PHP コードの変更をロールバックしました。修正し、もう一度保存してください。
syntax error, unexpected ‘<‘

のようになります。

ファイルを作成したものに記述すればエラーがでないのでしょうか？

宜しくお願い致します。

2.　のcategory_nicename;の前にURLが記述してあるのですが表示されていないです。

●ステップ 1 ●
子テーマの直下に 1 つファイルを作成

FTP ソフトやサーバーのファイルマネージャーを使い、テーマフォルダの直下にファイルを作成するというものです。

親テーマをお使いとのことですので、 simplicity2 フォルダの直下に作成します。

simplicity2 フォルダの直下には、このページで確認できるフォルダやファイルがあります。これらと同じ階層に作成すれば OK です。

ファイルを作成したものに記述すればエラーがでないのでしょうか？

でないです。動作は確認済みです。

ステップ 1 のコードを function.php に追加してはダメです。それは絶対にエラーが出ます。

返信有難う御座います。

表示する事ができました。

何度も大変有難う御座いました。

『投稿記事のカテゴリをウィジェットで表示』有難う御座いました。

1.　更に下記のようにカテゴリの画像を呼び出して2列のカテゴリ画像リンクにしたいです。

（カテゴリの画像が無理な場合、メディア画像をランダムでもOKです。）

記事タイトル
2018/6/27　カテゴリ1　カテゴリ2　カテゴリ3　カテゴリ4
本文

画像　　　　画像
カテゴリ1　カテゴリ2　

画像　　　　画像
カテゴリ3　カテゴリ4

関連記事

宜しくお願い致します。

1 つ分からない部分があるため、質問致します。

「カテゴリの画像」とは何でしょうか。 WordPress や Simplicity のデフォルトでは、カテゴリーに画像を設定できないです。

返信有難う御座います。

「カテゴリの画像」⇒カテゴリの記事のアイキャッチ画像

同じカテゴリの記事のアイキャッチ画像をランダムで呼び出したいのですが
可能なのでしょうか？

宜しくお願い致します。

link-to-sister-site.php のコードを、下記のものに書き換えます。

<div class="sister-wrap">
    <?php
    $cats = get_the_category();
    foreach( $cats as $cat ) {
        $args = array(
            'category' => array( $cat->cat_ID ),
            'orderby'  => 'rand',
            'posts_per_page' => 1,
        );
        $posts = get_posts( $args );
        foreach( $posts as $post ) {
        ?>
        <div class="sister-in">
            <a class="sisters" href="姉妹サイトのURL/category/<?php echo $cat->category_nicename; ?>">
                <div class="sisters-thum"><?php echo get_the_post_thumbnail( $post->ID, 'thumbnail' ); ?></div>
                <div class="sisters-name"><?php echo $cat->cat_name; ?></div>
            </a>
        </div>
        <?php
        }
    }
    ?>
</div>

画像のサイズを変更する場合には、 'thumbnail' を変更します。詳しくは「サムネイルサイズ」をご参考ください。もし、中サイズにされるのなら、 'medium' です。

動作確認はしましたが、 CSS は試していません。

返信有難う御座います。

表示する事ができました。

画像を

the_post_thumbnail( array(100,100) ); // 他のサイズ

でサイズ変更して元画像の大きさ以内なら変更できるのですが

元画像より大きいサイズには変更できないようです。

元画像より大きいサイズを指定して変更する方法はあるのでしょうか？

(例)　

元画像が横500 縦300は横100 縦100に変更できる

元画像が横100 縦100は横500 縦300に変更できない

宜しくお願い致します。

元画像より大きいサイズを指定して変更する方法はあるのでしょうか？

残念ながら方法はないです。

大きいサイズの画像をアップロードするしかありません。

WordPress の仕様上、メディア設定や function.php でどのようなサイズを設定していても、アップロードした画像より大きなサイズの画像ファイルは作成されません。

もしかすると、プラグインを使えばできるかもしれませんが、どのプラグインならできるかまでは申し訳ないですが知りません。

返信有難う御座います。

画像の件、了解しました。

カテゴリが10個ある場合でも任意の指定した数を表示する事は可能なのでしょうか？

（例）

【今のコード】　記事のカテゴリ数10の場合⇒10個表示

【変更したい表示】記事のカテゴリ数10の場合でも⇒４個表示

宜しくお願い致します。
　

link-to-sister-site.php を下記のコードに書き換えると、いけると思います。

<div class="sister-wrap">
    <?php
    $cats = get_the_category();
    $num = 0;
    foreach( $cats as $cat ) {
        if( $num === 4 ) {
            break;
        } else {
            $args = array(
                'category' => array( $cat->cat_ID ),
                'orderby'  => 'rand',
                'posts_per_page' => 1,
            );
            $posts = get_posts( $args );
            foreach( $posts as $post ) {
            ?>
            <div class="sister-in">
              <a class="sisters" href="姉妹サイトのURL/category/<?php echo $cat->category_nicename; ?>">
                <div class="sisters-thum"><?php echo get_the_post_thumbnail( $post->ID, 'thumbnail' ); ?></div>
                <div class="sisters-name"><?php echo $cat->cat_name; ?></div>
              </a>
            </div>
            <?php
            }
            $num++;
        }
    }
    ?>
</div>

$num === 4 の 4 を変更することで、最大表示数を変更できます。 4 であれば、最大 4 件の表示です。

返信有難う御座います。

表示できました。

何度も大変有難う御座いました。