[yutty]

トピックを新しく立てる方は次の項目も記述してください（要望トピックの場合は不要です）。

【お使いの Snow Monkey のバージョン】10.4.1
【お使いのブラウザ】chrome
【当該サイトのURL】https://buzz-reach.net/trepo/

===

お世話になっております。

https://liginc.co.jp/member

上記のようなライター一覧ページを作成したいと考えています。

一覧で表示させたい内容は

• プロフィール画像
• ニックネーム

となります。

また、現状のライターの書いた記事一覧ページは、記事の一覧が表示されるだけだと思いますが

• プロフィール写真
• プロフィール文

をページの最初に表示させたいです。

my snow monkeyへの記述で実装できますでしょうか。

ご返信お待ちしております。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

上記のようなライター一覧ページを作成したいと考えています。

簡単にやるとしたら、一覧を表示するショートコードをつくって固定ページに貼り付ける方法でしょうか。探したらプラグインがあるかもしれませんが、一覧をショートコードで出すだけならそう複雑なコードではないのでちょっと書いてみようと思います（CSS でのデザインの調整は必要になります）。

また、現状のライターの書いた記事一覧ページは、記事の一覧が表示されるだけだと思いますが

プロフィール写真
プロフィール文
をページの最初に表示させたいです。

こちら、別トピックにわけてもらえますか？ 1トピック1要件にしたほうが、同じカスタマイズをしたい人がフォーラムで探すときに見つけやすいので！

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

下記試してみてください！

1. My Snow Monkey に下記のコードを追加

スマホでは2列、それより大きいときは4列にしています。変更したい場合は c-row__col c-row__col--1-2 c-row__col--md-1-4 の数字の部分を変更してみてください（例：1-3 だと3列になります）。

add_shortcode(
	'userlist',
	function( $atts = [] ) {
		$users = get_users();
		if ( ! $users ) {
			return;
		}

		ob_start();
		?>
		<div class="userlist">
			<div class="c-row c-row--margin">
				<?php
				foreach ( $users as $user ) {
					$avatar       = get_avatar( $user->ID );
					$display_name = get_the_author_meta( 'display_name', $user->ID );
					?>
					<div class="c-row__col c-row__col--1-2 c-row__col--md-1-4">
						<div class="userlist__item">
							<a href="<?php echo get_author_posts_url( $user->ID ); ?>">
								<div class="userlist__item__avatar">
									<?php echo wp_kses_post( $avatar ); ?>
								</div>
								<div class="userlist__item__name">
									<?php echo esc_html( $display_name ); ?>
								</div>
							</a>
						</div>
					</div>
					<?php
				}
				?>
			</div>
		</div>
		<?php
		return ob_get_clean();
	}
);

2. カスタマイザー → 追加 CSS に下記の CSS を追加

最低限の装飾だけしているので、お好みで調整してください。

.userlist__item {
  text-align: center;
}
.userlist__item > a {
  display: inline-block;
  text-decoration: none;
  color: #111;
}

3. 適当なページにショートコード [userlist] を貼り付け

♥ 2

いいねをした人: 居ません

[yutty]

コードを貼り付けたら無事に実装できました！

ありがとうございます！

こちら、別トピックにわけてもらえますか？ 1トピック1要件にしたほうが、同じカスタマイズをしたい人がフォーラムで探すときに見つけやすいので！

別トピックに分けさせていただきます。

再度よろしくお願い致します。

♥ 1

いいねをした人: 居ません

[投稿者]

投稿