【JINテーマ】カスタマイズ

WordPressテーマ「JIN」コンテンツマガジンに広告入れるカスタマイズ

WordPressの有料テーマ【JIN】のカスタマイズです。
最新記事しか広告が表示されないので、タブをクリックすることでカテゴリー別記事内にも広告を入れたいと思ったのでカスタマイズしてみました。

【JIN】にはマガジンタイプとベーシックタイプの2種類の表示方法があります。
それぞれのカスタマイズ方法を載せました。

カスタマイズしようと思った理由

デフォルトでは最新記事のみ広告が挿入され、ユーザーがタブでコンテンツを切り替えると広告がないので、どうしたものかなーと思っていました。

出来ることなら、コンテンツを切り替えた時も広告を表示したい。
という訳でカスタマイズしてみました。

使用している方を修正しても良いですし、後で切り替えられるように両方修正してしまうのも手です。

修正する前に子テーマを作ってください。

子テーマならミスをしても、ミスしたファイルを親テーマからコピペして持ってくれば良いので。

親テーマを修正すると、親テーマがアップデートした場合に修正箇所が全て消えてしまいます。

【JIN】の子テーマのダウンロードは、【JIN】の公式サイトで入手できます。
※親テーマがないと動作しません。
※責任は負えませんので、自己責任でカスタマイズしてください。

下記のソースは、部分部分で【JIN】の元々のソースを修正していたりします。
例:【JIN】テーマのスマホPC切り分けの独自関数is_mobile→WordPressに元々ある関数wp_is_mobileなど。
その上でご利用ください。

マガジンタイプの場合の修正するファイル【post-list-mag.php】

ファイルの場所は、親テーマのjin/include/liststyle/post-list-mag.phpにあります。
post-list-mag.php内のL96行目にある下記のソースを目安にしてください。

$the_query = new WP_Query( $args );

修正前のソースをごっそり修正後のファイルと入れ替えます。

post-list-mag.phpの修正前

<?php while ( $the_query->have_posts() ) : $the_query->the_post() ?>
			<?php
				// カテゴリー情報を取得
				$category = get_the_category();
				$cat_id   = $category[0]->cat_ID;
				$cat_name = $category[0]->cat_name;
			?>

			<?php get_template_part('include/liststyle/parts/post-list-mag-parts'); ?>

post-list-mag.phpの修正後

			<?php
				$ad_infeed_pc_num = get_option('ad_infeed_pc_num');
				$ad_infeed_sp_num = get_option('ad_infeed_sp_num');
				$infeed_ad_pc = explode(",", $ad_infeed_pc_num);
				$infeed_ad_sp = explode(",", $ad_infeed_sp_num);
				$infeed_ad_count = 1;
				$infeed_ad_sp_num = 0;
				$infeed_ad_num = 0;
			?>
			<?php while ( $the_query->have_posts() ) : $the_query->the_post() ?>
				<?php
					// カテゴリー情報を取得
					$category = get_the_category();
					if(isset($category[0])){
					$cat_id   = $category[0]->cat_ID;
					$cat_name = $category[0]->cat_name;
					$cat_slug = $category[0]->category_nicename;
					$cat_url = get_category_link($cat_id);
					}else{
						$cat_name = "";
					}
				?>

			<?php if( isset($ad_infeed_pc_num) || isset($ad_infeed_sp_num) ) :?>

				<?php if( ! wp_is_mobile() && isset($infeed_ad_pc[$infeed_ad_num]) && $infeed_ad_pc[$infeed_ad_num] == $infeed_ad_count ): ?>

					<?php if( ! get_option('ad_infeed_magazine') == null ) : ?>
						<div class="post-list-item pconly">
							<div class="post-list-inner-infeed">
								<?php echo get_option('ad_infeed_magazine'); ?>
							</div>
						</div>

					<?php endif; ?>

					<?php $infeed_ad_num++; $infeed_ad_count++;  ?>

					<?php if( isset($infeed_ad_pc[$infeed_ad_num]) && $infeed_ad_pc[$infeed_ad_num] == $infeed_ad_count ): ?>

						<?php if( ! get_option('ad_infeed_magazine') == null ) : ?>
							<div class="post-list-item pconly">
								<div class="post-list-inner-infeed">
									<?php echo get_option('ad_infeed_magazine'); ?>
								</div>
							</div>
						<?php endif; ?>
						<?php $infeed_ad_num++; $infeed_ad_count++;?>
					<?php endif; ?>

				<?php endif; ?>

				<article class="post-list-item" itemscope itemtype="https://schema.org/BlogPosting">
					<a class="post-list-link" rel="bookmark" href="<?php the_permalink() ?>" itemprop='mainEntityOfPage'>
						<div class="post-list-inner">
							<div class="post-list-thumb" itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
								<?php if (has_post_thumbnail()): ?>
									<?php the_post_thumbnail('small_size'); ?>
									<meta itemprop="url" content="<?php cps_thumb_info('url'); ?>">
									<meta itemprop="width" content="640">
									<meta itemprop="height" content="360">
								<?php else: ?>
									<img src="<?php bloginfo('template_url'); ?>/img/noimg320.png" width="480" height="270" alt="no image" />
									<meta itemprop="url" content="<?php bloginfo('template_url'); ?>/img/noimg320.png">
									<meta itemprop="width" content="640">
									<meta itemprop="height" content="360">
								<?php endif; ?>
							</div>
							<div class="post-list-meta vcard">
								<?php if( ! $cat_name == "") :?>
								<span class="post-list-cat category-<?php echo $cat_slug; ?>" style="background-color:<?php cps_category_color(); ?>!important;" itemprop="keywords"><?php echo $cat_name ?></span>
								<?php endif; ?>

								<h2 class="post-list-title entry-title" itemprop="headline"><?php echo $post->post_title; ?></h2>

								<?php if( is_date_style() != 'none' ) : ?>
									<span class="post-list-date date updated ef" itemprop="datePublished dateModified" datetime="<?php the_time('Y-m-d'); ?>" content="<?php the_time('Y-m-d'); ?>"><?php the_time( get_option( 'date_format' ) ) ;?></span>
								<?php endif; ?>

								<span class="writer fn" itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name"><?php the_author(); ?></span></span>

								<div class="post-list-publisher" itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
									<span itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
									   <span itemprop="url" content="<?php echo get_topnavi_logo_image_url(); ?>">
										  <img src="<?php echo get_topnavi_logo_image_url(); ?>">
									   </span>
									</span>
									<span itemprop="name"><?php bloginfo('name'); ?></span>
								</div>
							</div>
						</div>
					</a>
				</article>
				<?php $infeed_ad_count++;?>

			<?php else: ?>
				<?php while (have_posts()) : the_post(); ?>
				<?php get_template_part('include/liststyle/parts/post-list-mag-parts'); ?>
				<?php endwhile; ?>
			<?php endif; ?>

ベーシックタイプの場合の修正するファイル【post-list.php】

ファイルの場所は、親テーマのjin/include/liststyle/post-list.phpにあります。
post-list.php内のL93行目にある下記のソースを目安にしてください。

$the_query = new WP_Query( $args );

post-list.phpの修正前

				$the_query = new WP_Query( $args ); 
			?>
			<?php while ( $the_query->have_posts() ) : $the_query->the_post() ?>
			<?php
				// カテゴリー情報を取得
				$category = get_the_category();
				$cat_id   = $category[0]->cat_ID;
				$cat_name = $category[0]->cat_name;
			?>

			<?php get_template_part('include/liststyle/parts/post-list-parts'); ?>

			<?php endwhile; ?>

post-list.phpの修正後

				$the_query = new WP_Query( $args ); 

				$ad_infeed_pc_num = get_option('ad_infeed_pc_num');
				$ad_infeed_sp_num = get_option('ad_infeed_sp_num');
				$infeed_ad_pc = explode(",", $ad_infeed_pc_num);
				$infeed_ad_sp = explode(",", $ad_infeed_sp_num);
				$infeed_ad_count = 1;
				$infeed_ad_sp_num = 0;
				$infeed_ad_num = 0;
			?>
			<?php while ( $the_query->have_posts() ) : $the_query->the_post() ?>

			<?php
				// カテゴリー情報を取得
				$category = get_the_category();
				if(isset($category[0])){
				$cat_id   = $category[0]->cat_ID;
				$cat_name = $category[0]->cat_name;
				$cat_slug = $category[0]->category_nicename;
				$cat_url = get_category_link($cat_id);
				}else{
					$cat_name = "";
				}
			?>

			<?php if( isset($ad_infeed_pc_num) || isset($ad_infeed_sp_num) ) :?>

				<?php if( wp_is_mobile() && isset($infeed_ad_sp[$infeed_ad_sp_num]) && $infeed_ad_sp[$infeed_ad_sp_num] == $infeed_ad_count ) :?>
									
					<?php if( ! get_option('ad_infeed_sp') == null ) : ?>
						<div class="post-list-item">
							<div class="post-list-inner-infeed">
								<?php echo get_option('ad_infeed_sp'); ?>
							</div>
						</div>
					<?php endif; ?>
					<?php $infeed_ad_sp_num++; $infeed_ad_count++; ?>

					<?php if( isset($infeed_ad_sp[$infeed_ad_sp_num]) && $infeed_ad_sp[$infeed_ad_sp_num] == $infeed_ad_count ): ?>
						<?php if( ! get_option('ad_infeed_sp') == null ) : ?>
							<div class="post-list-item">
								<div class="post-list-inner-infeed">
									<?php echo get_option('ad_infeed_sp'); ?>
								</div>
							</div>
						<?php endif; ?>
						<?php $infeed_ad_sp_num++; $infeed_ad_count++;?>
					<?php endif; ?>

					<?php elseif( ! wp_is_mobile() && isset($infeed_ad_pc[$infeed_ad_num]) && $infeed_ad_pc[$infeed_ad_num] == $infeed_ad_count ): ?>
						<?php if( ! get_option('ad_infeed_basic') == null ) : ?>
							<div class="post-list-item">
								<div class="post-list-inner-infeed">
									<?php echo get_option('ad_infeed_basic'); ?>
								</div>
							</div>
						<?php endif; ?>
						<?php $infeed_ad_num++; $infeed_ad_count++;  ?>

					<?php if( isset($infeed_ad_pc[$infeed_ad_num]) && $infeed_ad_pc[$infeed_ad_num] == $infeed_ad_count ): ?>
						<?php if( ! get_option('ad_infeed_basic') == null ) : ?>
							<div class="post-list-item">
								<div class="post-list-inner-infeed">
									<?php echo get_option('ad_infeed_basic'); ?>
								</div>
							</div>
						<?php endif; ?>
						<?php $infeed_ad_num++; $infeed_ad_count++;?>
					<?php endif; ?>

				<?php endif; ?>
					<article class="post-list-item" itemscope itemtype="https://schema.org/BlogPosting">
						<a class="post-list-link" rel="bookmark" href="<?php the_permalink() ?>" itemprop='mainEntityOfPage'>
							<div class="post-list-inner">
								<div class="post-list-thumb" itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
									<?php if (has_post_thumbnail()): ?>
										<?php the_post_thumbnail('small_size'); ?>
										<meta itemprop="url" content="<?php cps_thumb_info('url'); ?>">
										<meta itemprop="width" content="480">
										<meta itemprop="height" content="270">
									<?php else: ?>
										<img src="<?php bloginfo('template_url'); ?>/img/noimg480.png" width="480" height="270" alt="no image" />
										<meta itemprop="url" content="<?php bloginfo('template_url'); ?>/img/noimg320.png">
										<meta itemprop="width" content="480">
										<meta itemprop="height" content="270">
									<?php endif; ?>
									<?php if( ! $cat_name == "") :?>
									<span class="post-list-cat category-<?php echo $cat_slug; ?>" style="background-color:<?php cps_category_color(); ?>!important;" itemprop="keywords"><?php echo $cat_name ?></span>
									<?php endif; ?>
								</div>
								<div class="post-list-meta vcard">
									<h2 class="post-list-title entry-title" itemprop="headline"><?php echo $post->post_title; ?></h2>
									<?php if( is_date_style() != 'none' ) : ?>
									<span class="post-list-date date ef updated" itemprop="datePublished dateModified" datetime="<?php the_time('Y-m-d'); ?>" content="<?php the_time('Y-m-d'); ?>"><?php the_time( get_option( 'date_format' ) ) ;?></span>
									<?php endif; ?>
									<span class="writer fn" itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name"><?php the_author(); ?></span></span>

									<div class="post-list-publisher" itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
										<span itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
										   <span itemprop="url" content="<?php echo get_topnavi_logo_image_url(); ?>">
											  <img src="<?php echo get_topnavi_logo_image_url(); ?>">
										   </span>
										</span>
										<span itemprop="name"><?php bloginfo('name'); ?></span>
									</div>
									<?php if( ! wp_is_mobile() ) : ?>
										<span class="post-list-desc" itemprop="description"><?php if(mb_strlen($post->post_title)>22) { echo cps_excerpt( get_the_content(), 70); } else{ echo cps_excerpt( get_the_content(), 90);} ?>&nbsp;…</span>
									<?php endif; ?>
								</div>
							</div>
						</a>
					</article>
					<?php $infeed_ad_count++;?>
				<?php else: ?>
					<?php get_template_part('include/liststyle/parts/post-list-parts'); ?>
				<?php endif; ?>
			<?php endwhile; ?>

まとめ

カスタマイズ内容は以上です。
修正が終わったら、サーバーにアップロードしてください。

ソースが長いので修正時は気をつけてくださいね。

ソースを追っていかなければいけないので、カスタマイズは大変です(^_^;)

ABOUT ME
奏音桃
WordPress1X歴のテーマ開発者がWordPressの有料テーマを購入したのがキッカケで、WordPressのカスタマイズTipsを纏めています。