Q.投稿ページのh1の内容を記事のタイトルにしたい
記事タイトルがそのままh1になるようにしたいのですが、どこを変更すればよいのでしょうか?
A.下記の手順でカスタマイズしてください。
①トップページでは<h1>、それ以外では<div>でロゴを表示するための変更
編集するファイル:functions/logo.php
編集する箇所:
if(!is_mobile()) { //if is pc if(!empty($logo_image)){ ?> <div id="logo_image"> <h1 class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>" data-label="<?php echo $title; ?>"><img src="<?php echo $logo_image[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </h1> </div> <?php } else { ?> <div id="logo_text"> <h1 class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></h1> </div> <?php }; } else { //if is mobile device if(!empty($logo_image_mobile)){ ?> <div id="logo_image_mobile"> <h1 class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>"><img src="<?php echo $logo_image_mobile[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </h1> </div> <?php } else { ?> <div id="logo_text"> <h1 class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></h1> </div> <?php }; };
↓↓↓
if(!is_mobile()) { //if is pc if(!empty($logo_image)){ ?> <div id="logo_image"> <?php if(is_home()||is_front_page()){ ?> <h1 class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>" data-label="<?php echo $title; ?>"><img src="<?php echo $logo_image[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </h1> <?php }else{ ?> <div class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>" data-label="<?php echo $title; ?>"><img src="<?php echo $logo_image[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </div> <?php } ?> </div> <?php } else { ?> <div id="logo_text"> <?php if(is_home()||is_front_page()){ ?> <h1 class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></h1> <?php }else{ ?> <div class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></div> <?php } ?> </div> <?php }; } else { //if is mobile device if(!empty($logo_image_mobile)){ ?> <div id="logo_image_mobile"> <?php if(is_home()||is_front_page()){ ?> <h1 class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>"><img src="<?php echo $logo_image_mobile[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </h1> <?php }else{ ?> <div class="logo"> <a href="<?php echo $url; ?>/" title="<?php echo $title; ?>"><img src="<?php echo $logo_image_mobile[0]; ?>?<?php echo time(); ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>" /></a> </div> <?php } ?> </div> <?php } else { ?> <div id="logo_text"> <?php if(is_home()||is_front_page()){ ?> <h1 class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></h1> <?php }else{ ?> <div class="logo rich_font"><a href="<?php echo $url; ?>/"><?php echo $title; ?></a></div> <?php } ?> </div> <?php }; };
②記事の見出しをh1に変更
編集するファイル:single.php
編集する箇所:
<h2 id="post_title" class="rich_font"><?php the_title(); ?></h2>
↓
<h1 id="post_title" class="rich_font"><?php the_title(); ?></h1>
③CSSを追記
編集するファイル:responsive.css
編集する箇所:
#logo_text h1 { font-weight:normal; height:55px; line-height:56px; }
↓
#logo_text h1 { font-weight:normal; height:55px; line-height:56px; } #logo_text .logo { font-weight:normal; height:55px; line-height:56px; }
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!