Stinger plus2で、ヘッダー画像を下層ページにも表示させる方法…Q&A002/043

Stinger plus2で、ヘッダー画像を下層ページにも表示させる

1. プラグイン「One-Click Child Theme」がインストールされていなかったら、インストール⇒有効化する。
2. 「左サイドメニュー」⇒「外観」⇒「Child Thema」で、子テーマに親テーマの該当phpファイル「st-header-image.php」をコピーさせる。
3. 「外観」⇒「テーマの編集」⇒（編集中になっているテーマが子テーマだと確認してから）⇒「st-header-image.php」を選択。
4. コードが記述してあるどの部分でもいいので、クリックして、キーボード左下の「Ctrl」キーを押しながら「A」を押して、全文を選択⇒キーボードの「Delete」キーを押して全文削除。
5. 下のコードを下のコードをマウスドラッグで全文選択して、全文削除して空白となった４のスペースに、貼り付け、「ファイルを更新」ボタンを押す

ちなみにこのサイトも無料バージョンのStinger Plus2ですので、そのままですとヘッダー画像の表示はトップページのみで下層ページには表示されないのですが、子テーマで表示するように編集して表示するようにしてあります。

ヘッダー画像が見えないのは、背景画像を見せたくて、透過（透けて見えない）画像を、ヘッダー画像として登録してあります。
ご希望でしたら、ヘッダー画像の上でマウス右クリック、名前をつけて保存で、お持ち帰り下さい。

もちろん、ヘッダー画像はトップページのみで下層ページでの表示はいらない方は、この面倒な（苦笑）作業をする必要はありません。

コピーするコード

<?php

// 直接アクセスを禁止
if ( !defined( 'ABSPATH' ) ) {
     exit;
}?>

<?php
$show_on_all_pages = ( isset( $GLOBALS['stdata18'] ) && $GLOBALS['stdata18'] === 'yes' );
$show_as_slides    = ( isset( $GLOBALS['stdata30'] ) && $GLOBALS['stdata30'] === 'yes' );
//$could_be_shown    = ( is_home() or is_front_page() || ( !is_home() && $show_on_all_pages ) );
$could_be_shown    = ( is_home() || is_single()|| is_page() || is_archive() ); //if文変更

if ( trim($GLOBALS['stdata72']) !== '') {
	$header_img_link = esc_url($GLOBALS['stdata72']);
}else{
	$header_img_link = '';
}

if ( !$could_be_shown || ( !has_header_image() && !is_active_sidebar( 14 ) ) ) { //全て非表示の場合かヘッダーが無い且つウィジェットが無い場合
?>
<div id="gazou-wide">
	<?php get_template_part( 'st-header-menu' ); //カスタムヘッダーメニュー ?>
</div>
<?php
	return;
}

$header_images = get_uploaded_header_images();

shuffle($header_images);

$speed_ms    = (int) $GLOBALS['stdata32'];
$is_fade     = ($GLOBALS['stdata31'] === 'fade');
$is_rtl_lang = ($GLOBALS['stdata31'] === 'ltr');
$dir         = $is_rtl_lang ? ' dir="rtl"' : '';

$options = array(
	'slidesToShow'   => 1,
	'slidesToScroll' => 1,
	'autoplay'       => true,
	'autoplaySpeed'  => $speed_ms,
	'fade'           => $is_fade,
	'rtl'            => $is_rtl_lang,
);
?>

<?php if ( $show_as_slides ) : // スライドショーがONの場合 ?>
	<div id="gazou-wide">
		<?php if ( isset($GLOBALS['stdata35']) && $GLOBALS['stdata35'] === 'on' ) { //メニューを上に設定している場合
			get_template_part( 'st-header-menu' ); //カスタムヘッダーメニュー 
		} ?>

		<?php if ( trim($GLOBALS['stdata76']) === '' ) { //ヘッダー非表示に値がなければ ?>
			<?php if( st_is_mobile() && trim($GLOBALS['stdata71']) !== '' ) { //スマホで且つ非表示にチェックがある場合 ?>
			<?php }else{ ?>
				<?php if ( is_active_sidebar( 14 ) ) : //ウィジェットが設定されている場合?>
					<div id="st-headerbox"><div id="st-header">
						<?php if ( function_exists( 'dynamic_sidebar' ) && dynamic_sidebar( 14 ) ) : else : //トップ下部のウィジェット ?>
						<?php endif; ?>
					</div></div>
				<?php else: ?>
					<div id="st-headerbox"><div id="st-header">
						<?php if($header_img_link){ //リンクが設定されている場合 ?>
							<div id="header-slides"<?php echo $dir; ?> data-slick='<?php echo json_encode( $options, JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP ); ?>'>
								<?php foreach ($header_images as $header) : ?>
									<div class="header-slides-slide">
										<a href="<?php echo $header_img_link; ?>">
										<img src="<?php echo esc_url($header['url']); ?>" alt="*" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" >
										</a>
									</div>
								<?php endforeach; ?>
							</div>
						<?php }else{ //リンクが設定されていない場合 ?>
							<div id="header-slides"<?php echo $dir; ?> data-slick='<?php echo json_encode( $options, JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP ); ?>'>
								<?php foreach ($header_images as $header) : ?>
									<div class="header-slides-slide">
										<img src="<?php echo esc_url($header['url']); ?>" alt="*" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" >
									</div>
								<?php endforeach; ?>
							</div>
						<?php } ?>
					</div></div>
				<?php endif; ?>
			<?php } ?>
		<?php } ?>

		<?php if ( trim($GLOBALS['stdata35']) === '' ) { //メニューを下に設定している場合
			get_template_part( 'st-header-menu' ); //カスタムヘッダーメニュー 
		} ?>
	</div>

<?php else : // スライド設定していないヘッダー画像 ?>

	<div id="gazou-wide">
		<?php if ( isset($GLOBALS['stdata35']) && $GLOBALS['stdata35'] === 'on' ) { //メニューを上に設定している場合
			get_template_part( 'st-header-menu' ); //カスタムヘッダーメニュー 
		} ?>

		<?php if ( trim($GLOBALS['stdata76']) === '' ) { //ヘッダー非表示に値がなければ ?>
			<?php if( st_is_mobile() && trim($GLOBALS['stdata71']) !== '' ) { //スマホで且つ非表示にチェックがある場合 ?>
			<?php }else{ ?>
				
				<?php if ( is_active_sidebar( 14 ) ) : //ウィジェットが設定されている場合?>
					<div id="st-headerbox"><div id="st-header">
						<?php if ( function_exists( 'dynamic_sidebar' ) && dynamic_sidebar( 14 ) ) : else : //トップ下部のウィジェット ?>
						<?php endif; ?>
					</div></div>
				<?php else: ?>
					<?php if($header_img_link){ //リンクが設定されている場合 ?>
						<div id="st-headerbox">
							<a href="<?php echo $header_img_link; ?>">
								<div id="st-header"><img src="<?php header_image(); ?>" alt="*" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" ></div>
							</a>
						</div>
					<?php }else{ //リンクが設定されていない場合 ?>
						<div id="st-headerbox">
							<div id="st-header"><img src="<?php header_image(); ?>" alt="*" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" ></div>
						</div>
					<?php } ?>
				<?php endif; ?>


			<?php } ?>
		<?php } ?>

		<?php if ( trim($GLOBALS['stdata35']) === '' ) { //メニューを下に設定している場合
			get_template_part( 'st-header-menu' ); //カスタムヘッダーメニュー 
		} ?>
	</div>
<?php endif; ?>
<!-- /gazou -->

質問などありましたら、下のコメント欄にお書きください。