2019年3月12日 / Last updated : 2020年12月20日くまはちLAB HTMLPHPStingerWordPressテーマ無料テーマ

WordPress無料テーマ Stinger8で投稿者名を消してソーシャルアイコンを手直し

この記事のURLとタイトルをコピーする

この記事を読むのに必要な時間は約 10 分です。
(専門用語などにはポップアップする説明をつけているので時間が長く表示されることがあります。
ツールチップの機能については、こちら)

WordPressのテーマを変更した時にはじめに確認して修正したい部分は、投稿者名の表示に関する部分です。
このStinger8 でも投稿と固定ページで表示されているので最初に消しておきたいところですね。
また、ソーシャルアイコンで既に使わないものがそのまま表示されていたりアイコンが表示できなくなっているのでまずその部分を修正します。

目　次

カスタマイズには子テーマの使用が必須？
投稿者名を消す方法
なぜ、ソーシャルボタンのアイコンが表示されないのか？
表示されるためには？
使わないソーシャルアイコンとは？
feedlyを追加するには？

カスタマイズには子テーマの使用が必須？

テーマをカスタマイズしたり修正をしたりする場合は、Stinger8 に限らず子テーマを使うということをオススメします。
投稿者名を消すということとソーシャルアイコンの手直しをするということについては、 PHPのファイルをカスタマイズする必要があります。
親テーマをそのまま残しておく方が何かあったときに対処できたりすることも多いということと最初からダウンロードできるようになっているので使ってください。

今回のカスタマイズでは下記のファイルを親テーマから子テーマにコピペしてアップロードしておきます。アップロードは、FTPソフトでアップロードしてください。

FTPソフトの使い方

https://wp908.com/2018/06/20/ftp%e3%82%bd%e3%83%95%e3%83%88%e3%81%ae%e4%bd%bf%e3%81%84%e6%96%b9/

目　次 FTPとは？ FTPソフトとは？ FFFTPをインストールする FFFTPに接続するサーバーを設定するFTPとは？File Transfer Protocol（ファイル・トランスファー・プロトコル、FTP、ファイル転送プロトコル）は、ネットワークでファイルの転送を行うための通信プロトコルの1つである。参考： WiKiペディア FTPソフトとは？基本的にパソコン側のファイルとサーバー側のファイルを同期させるソフトです。WordPressの管理画面だけで操作するのもいいですが、時にはこのソフトが必要になる場合もあります。Windowsユー...

WEB How to くまはちLAB

2018-06-20 14:37:02

header.php
page.php
single.php
sns.php
sns-top.php

投稿者名を消す方法

投稿者名が表示されるとWordPressのIDがわかってしまいます。総当り攻撃などを受けないためにも表示させないようにしておきたいところです。また、画像にも記載していますが、Edit Author Slug を使ったとしてもWordPressのIDがオーナーリンクに反映されてしまいます。表示させないことが安全です。

上記は、single.phpになりますが、110行目の選択部分を削除します。削除後に1行スペースを詰めます。
また、page.phpの76行目を削除します。

              <p>執筆者：<?php the_author_posts_link(); ?></p>

1	<p>執筆者：<?php the_author_posts_link(); ?></p>

削除後は、上書き保存しておきます。Windowsの場合は、文字コードがUTF-8になっていることをちゃんと確認しておいてください。

なぜ、ソーシャルボタンのアイコンが表示されないのか？

Stinger8 をインストールしたらこのような表示になっていました。画像にあるようにGoogle+は、既に投稿もできずに消えるのを待つだけなのでボタンの必要がありません。また、ほかのアイコンも表示されておりません。
これは、以前書いたLightning での記事と同じ理由でした。中にはそのまま表示されている方もいるはずです。

Lightningでアイコンフォントが文字化けする原因と修正方法

https://wp908.com/2019/02/02/lightning-iconfonts-recovery/

目　次 Font Awesome のバージョン変更についてなぜ正しく表示されないのか？バージョンが合わなくなる経緯 Lightnning & ExUnit 固有の記法の違い修正方法Font Awesome のバージョン変更についてLightning 及び ExUnit ではいろんなアイコンが簡単に使えるようにアイコンフォントのライブラリ「Font Awesome」が予め利用出来るようになっています。その Font Awesome の 5 がリリースされていますが、4.7 からの移行は作業が必要となるため、そのまま運用されている方も多いですね。しかしながら他のプラグインなど...

WEB How to くまはちLAB

2019-02-02 03:37:08

要は、読み込んだスタイルシートと表示部分のスタイルシートの記述方法があってないということです。
Awesome Font Icon を使用しているのですが、そのバージョンによって記述方法が違うのでその部分を修正しないと表示できないということです。それは、インストールされているプラグインの影響もあるので今は、以前のバージョン4.7の記述方法よりはバージョン5系の記述方法を使う必要があるのです。

表示されるためには？

はてブ以外のアイコンを表示させるためには、Awesome Font Icon の記述をバージョン5系の記述に変更する必要があります。画像で選択されている部分は、バージョン4.7の記述方法になっているためこれを書き換えします。

    <ul class="clearfix">
        <!--ツイートボタン-->
        <li class="twitter">
        <a onclick="window.open('//twitter.com/intent/tweet?url=<?php echo $url_encode ?>&text=<?php echo $title_encode ?>&tw_p=tweetbutton', '', 'width=500,height=450'); return false;"><i class="fab fa-twitter-square"></i><span class="snstext <?php echo $plug; ?>" >Twitter</span>
        <?php
        if(function_exists('get_scc_twitter')) {
            if( scc_get_share_twitter( array( 'post_id' => 'home' ) ) !== 0){
                echo '<span class="snscount">'.scc_get_share_twitter( array( 'post_id' => 'home' ) ).'</span>';
            }else{
                echo '<span class="snstext pcnone" >Twitter</span>';
            }
        }?></a>
        </li>
        <!--Facebookボタン-->
        <li class="facebook">
        <a target="_blank" href="//www.facebook.com/sharer.php?src=bm&u=<?php echo $url_encode;?>&t=<?php echo $title_encode;?>"><i class="fab fa-facebook"></i><span class="snstext <?php echo $plug; ?>" >Facebook</span>
        <?php
        if(function_exists('get_scc_facebook')) {
            if( scc_get_share_facebook( array( 'post_id' => 'home' ) ) !== 0){
                echo '<span class="snscount">'.scc_get_share_facebook( array( 'post_id' => 'home' ) ).'</span>';
            }else{
                echo '<span class="snstext pcnone" >Facebook</span>';
            }
        }?></a>
        </li>
        <!--ポケットボタン-->
        <li class="pocket">
        <a onclick="window.open('//getpocket.com/edit?url=<?php echo $url_encode;?>&title=<?php echo $title_encode;?>', '', 'width=500,height=350'); return false;" ><i class="fab fa-get-pocket"></i><span class="snstext <?php echo $plug; ?>" >Pocket</span>
        <?php
        if(function_exists('get_scc_pocket')) {
            if( scc_get_share_pocket( array( 'post_id' => 'home' ) ) !== 0){
                echo '<span class="snscount">'.scc_get_share_pocket( array( 'post_id' => 'home' ) ).'</span>';
            }else{
                echo '<span class="snstext pcnone" >Pocket</span>';
            }
        }?></a></li>
        <!--はてブボタン-->
        <li class="hatebu">
            <a href="//b.hatena.ne.jp/entry/<?php home_url(); ?>" class="hatena-bookmark-button" data-hatena-bookmark-layout="simple" title="<?php bloginfo('name'); ?>"><span style="font-weight:bold" class="fa-hatena">B!</span><span class="snstext <?php echo $plug; ?>" >はてブ</span>
<?php if(function_exists('get_scc_hatebu')) {
            if( scc_get_share_hatebu( array( 'post_id' => 'home' ) ) !== 0){
                echo '<span class="snscount">'.scc_get_share_hatebu( array( 'post_id' => 'home' ) ).'</span>';
            }else{
                echo '<span class="snstext pcnone" >はてブ</span>';
            }
        }?></a><script type="text/javascript" src="//b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>
        </li>
        <!--LINEボタン-->
        <li class="line">
            <a target="_blank" href="//line.me/R/msg/text/?<?php echo $title_encode . '%0A' . $url_encode;?>"><i class="fab fa-line"></i><span class="snstext" >LINE</span></a>
        </li>
        <!--FEEDLYボタン-->
        <li class="line">
            <a href='https://feedly.com/i/subscription/feed%2Fhttp%3A%2F%2Fsocial908.com%2Fnormal%2Ffeed%2F'  target='blank'><i class="fas fa-rss-square"></i><span class="snstext" >FEEDLY</span></a>
        </li>
    </ul>

<a onclick="window.open('//twitter.com/intent/tweet?url=<?php echo $url_encode ?>&text=<?php echo $title_encode ?>&tw_p=tweetbutton', '', 'width=500,height=450'); return false;">" >Twitter

<?php

if(function_exists('get_scc_twitter')) {

if( scc_get_share_twitter( array( 'post_id' => 'home' ) ) !== 0){

echo ''.scc_get_share_twitter( array( 'post_id' => 'home' ) ).'';

}else{

echo 'Twitter';

}

}?></a>

</li>

<a target="_blank" href="//www.facebook.com/sharer.php?src=bm&u=<?php echo $url_encode;?>&t=<?php echo $title_encode;?>">" >Facebook

<?php

if(function_exists('get_scc_facebook')) {

if( scc_get_share_facebook( array( 'post_id' => 'home' ) ) !== 0){

echo ''.scc_get_share_facebook( array( 'post_id' => 'home' ) ).'';

}else{

echo 'Facebook';

}

}?></a>

</li>

<a onclick="window.open('//getpocket.com/edit?url=<?php echo $url_encode;?>&title=<?php echo $title_encode;?>', '', 'width=500,height=350'); return false;" >" >Pocket

<?php

if(function_exists('get_scc_pocket')) {

if( scc_get_share_pocket( array( 'post_id' => 'home' ) ) !== 0){

echo ''.scc_get_share_pocket( array( 'post_id' => 'home' ) ).'';

}else{

echo 'Pocket';

}

}?></a></li>

<a href="//b.hatena.ne.jp/entry/<?php home_url(); ?>" class="hatena-bookmark-button" data-hatena-bookmark-layout="simple" title="<?php bloginfo('name'); ?>">B!" >はてブ

<?php if(function_exists('get_scc_hatebu')) {

if( scc_get_share_hatebu( array( 'post_id' => 'home' ) ) !== 0){

echo ''.scc_get_share_hatebu( array( 'post_id' => 'home' ) ).'';

}else{

echo 'はてブ';

}

}?></a><script type="text/javascript" src="//b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>

</li>

</li>

<a href='https://feedly.com/i/subscription/feed%2Fhttp%3A%2F%2Fsocial908.com%2Fnormal%2Ffeed%2F' target='blank'>FEEDLY</a>

</li>

</ul>

上記のソースをsns.phpとsns-top.phpで書き換えます。ただ、feedlyについては、後で自分のアドレスに変更する必要があります。そのまま使うと当サイトのテストサイトのフィードが購読されてしまいます。

使わないソーシャルアイコンとは？

先述にもあるようにGoogle+は、廃止されるのでもう投稿ができません。4月でしたか完全に消えるとのことでソーシャルボタンは、必要なくなりました。通常ですとアップデートなどで変更される部分なのですが、Stinger8 ではアップデートがないので自分で修正するしかないということです。前の項目で表示しているソースでGoogle+は、削除されています。代りにfeedlyを追加して3X2でバランスよくしています。

feedlyを追加するには？

カスタマイズソースでは、feedly を追加しています。feedly のボタンを追加する方法を解説します。これは、フェレットさんのサイトで紹介されていた方法を参考にしています。

リピーターをつけるために！Feedlyボタンの設置方法と購読者数の確認方法

https://ferret-plus.com/5902

今回は、自社のホームページやブログなどにFeedlyを設置する方法をご紹介します。購読者数を計測するためのツールも合わせてご紹介しますので、ツールを使用して購読者数を把握しておくようにしましょう。

ferret-plus.com

https://www.feedly.com/factory.html
上記のサイトでリンクを作成します。

最初にボタンを選ぶのですが、ボタンは無視してOKです。初期のスタイルと合わせるためにボタンは、使用しません。

feedのURLを入力します。
WordPressの場合は、カスタマイズなどしていない場合は、下記の通りです。
http://あなたのドメイン/feed/

上記で生成されたコードを一部で使ってカスタマイズします。これは、元々のStinger8 スタイルに合わせるためのカスタマイズが必要だからです。
というわけで最初のリンク部分だけをコピペします。

      <!--FEEDLYボタン-->
        <li class="line">
            <a href='https://feedly.com/i/subscription/feed%2Fhttp%3A%2F%2F*****.com%2Fnormal%2Ffeed%2F'  target='blank'><i class="fas fa-rss-square"></i><span class="snstext" >FEEDLY</span></a>
        </li>