トップページの一覧の中にバナーを表示する方法

0
いいねをした人: 居ません
  • このトピックには4件の返信、2人の参加者があり、最後にcourierにより3年、 11ヶ月前に更新されました。
5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • 投稿者
    投稿
  • #60777
    courier
    参加者
    1

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

    【お使いの Snow Monkey のバージョン】 11.7.5
    【お使いのブラウザ】chrome 86
    【当該サイトのURL】構築中のため非公開でお願いします。

    ===

    トップページ設定で最近の投稿を選択し、

    基本デザイン>記事一覧レイアウトにてシンプルを選択することにより

    御社のブログページのようなデザインを作成しています。

    記事表示数は30件と設定し、

    5件目と6件目の間にバナーを表示

    10件目と11件目の間にバナーを表示

    15件目と16件目の間にバナーを表示

    20件目と21件目の間にバナーを表示

    25件目と26件目の間にバナーを表示

    とカスタマイズしたく考えております。

    その画像をウィジットで管理したいと考えているのですが、可能でしょうか。

    お手数ですがご教授お願いします。

    0
    いいねをした人: 居ません
    #60999
    アバター画像キタジマ タカシ
    参加者
    2421

    ウィジェットで管理はわかりませんが、画像を突っ込むこと自体はできます。下記のコードを試してみてください。

    /**
     * ブログ一覧に画像を追加する処理
     */
    function my_infeed_img( $html, $post_types, $entries_layout ) {
    	// 投稿タイプが post 以外のときは中止
    	$post_types = (array) $post_types;
    	if ( ! in_array( 'post', $post_types, true ) ) {
    		return $html;
    	}
    
    	// 一覧レイアウトが「シンプル」以外のときは中止
    	if ( 'simple' !== $entries_layout ) {
    		return $html;
    	}
    
    	$count = 0;
    
    	return preg_replace_callback(
    		'|(<li class="c-entries__item)|s',
    		function( $matches ) use ( &$count ) {
    			$count ++;
    			if ( 0 !== $count % 6 ) {
    				return $matches[0];
    			}
    
    			ob_start();
    			?>
    			<li class="c-entries__item">
    				ここに画像
    			</li>
    			<?php
    			return ob_get_clean() . $matches[0];
    		},
    		$html
    	);
    }
    
    /**
     * ブログ一覧ページに画像を追加して表示
     */
    add_filter(
    	'snow_monkey_template_part_render_template-parts/archive/entry/content/content',
    	function( $html ) {
    		$post_type      = get_post_type() ? get_post_type() : 'post';
    		$post_type      = is_home() ? 'post' : $post_type;
    		$entries_layout = get_theme_mod( $post_type . '-entries-layout' );
    
    		return my_infeed_img( $html, $post_type, $entries_layout );
    	}
    );
    0
    いいねをした人: 居ません
    #61087
    courier
    参加者
    1

    ご回答ありがとうございます。

    早速試しました。

    2つ目のバナー以降の位置が一つづつずれてしまいました。

    こちらの編集間違いでしょうか。

    また説明不足ですいませんが、

    5件目と6件目の間にAバナーを表示

    10件目と11件目の間にBバナーを表示

    15件目と16件目の間にCバナーを表示

    20件目と21件目の間にDバナーを表示

    25件目と26件目の間にEバナーを表示

    と違う画像を表示したいです。

    お手数ですが、ご確認よろしくお願いします。

    0
    いいねをした人: 居ません
    #61131
    アバター画像キタジマ タカシ
    参加者
    2421

    あれ、すみません。コード書き直してみました。先のコードは消して、下記に差し替えてください。

    add_filter(
    	'snow_monkey_template_part_render_template-parts/archive/entry/content/content',
    	function( $html ) {
    		$post_type      = get_post_type() ? get_post_type() : 'post';
    		$post_type      = is_home() ? 'post' : $post_type;
    		$entries_layout = get_theme_mod( $post_type . '-entries-layout' );
    
    		if ( 'post' !== $post_type ) {
    			return $html;
    		}
    
    		if ( 'simple' !== $entries_layout ) {
    			return $html;
    		}
    
    		$count = 0;
    
    		return preg_replace_callback(
    			'|(<li class="c-entries__item)|s',
    			function( $matches ) use ( &$count ) {
    				$add = '';
    
    				if ( 5 === $count ) {
    					ob_start();
    					?>
    					画像1
    					<?php
    					$add = ob_get_clean();
    				} elseif ( 10 === $count ) {
    					ob_start();
    					?>
    					画像2
    					<?php
    					$add = ob_get_clean();
    				} elseif ( 15 === $count ) {
    					ob_start();
    					?>
    					画像3
    					<?php
    					$add = ob_get_clean();
    				} elseif ( 20 === $count ) {
    					ob_start();
    					?>
    					画像4
    					<?php
    					$add = ob_get_clean();
    				} elseif ( 25 === $count ) {
    					ob_start();
    					?>
    					画像5
    					<?php
    					$add = ob_get_clean();
    				}
    
    				if ( $add ) {
    					ob_start();
    					?>
    					<li class="c-entries__item"><?php echo wp_kses_post( $add ); ?></li>
    					<?php
    					$add = ob_get_clean();
    				}
    
    				$count ++;
    				return $add . $matches[0];
    			},
    			$html
    		);
    
    		return $html;
    	}
    );
    0
    いいねをした人: 居ません
    #62177
    courier
    参加者
    1

    ご連絡遅くなりすいません。

    綺麗に表示されました。

    ありがとうございました。

    1
    いいねをした人: 居ません
5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • トピック「トップページの一覧の中にバナーを表示する方法」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。