Loading…

記事内にプロモーションが含まれています。

Stinger6 WordPress カスタマイズ

記事の上に今日の人気記事を表示する方法

今日の人気記事

所要時間目安:3

This session is using  IPv4  is established in

この記事は2016年2月28日のものです。現在は状況が異なる可能性がありますのでご注意ください。

Stinger6 WordPress カスタマイズ

  • 本日
  • 週間
  • 月間
  1. 年末年始渋滞予想

    年末年始の渋滞予測・渋滞予想は、名神・東名は1月2日、3日がピークで55km…。 2PV

    さてさてもうそろそろ、年末年始の帰省ラッシュ時期に近づいてきました。年に幾度となくこの帰省ラッシュという言葉が踊るのでしょうか。 まずは今回のように年末年始、そして夏のお盆時期の会社が夏休みの時期が大…

    もっと読む

  2. 間違いメールと迷惑メールとフィッシング詐欺メール判断方法

    免責事項 2PV

    免責事項当サイトを利用することで発生した損失や損害・その他トラブルに関しては一切の責任を負いかねます。あらかじめご了承くださいますようお願いいたします。 掲載しているコンテンツの内容が間違っている場合…

    もっと読む

  3. スマホファースト

    スマホファースト用にStinger6Stinger7をカスタマイズ 2PV

    WordPressはカスタマイズ性が優れているのは周知の事実だと思います。function.php内にしていする関数?などによっていろいろな事が出来るようになります。 また、テーマによってカスタマイズ…

    もっと読む

  1. カーナビテレビが見れなくなったICカードが正常に動作しませんでした

    ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法 74PV

    本日ではなく昨日になってしまいますが、それまでカーナビで地デジ対応のナビで突然エンジンをかけなおしたら・・・・・・。 「ICカードが正常に動作しませんでした。販売店にお問い合わせください。」 なんてい…

    もっと読む

  2. エンジンスターターリモコン

    カーメイトのエンジンスターターでエラー15表示と対処方法 26PV

    夏冬に特に重宝するのが、エンジンスターターです。 メーカーはCARMATEやCOMTECユピテルなど各社ありますが、一番のオススメはリモコンから多くの情報を得ることができるカーメイト製品です。 なぜか…

    もっと読む

  3. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 23PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

  1. カーナビテレビが見れなくなったICカードが正常に動作しませんでした

    ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法 74PV

    本日ではなく昨日になってしまいますが、それまでカーナビで地デジ対応のナビで突然エンジンをかけなおしたら・・・・・・。 「ICカードが正常に動作しませんでした。販売店にお問い合わせください。」 なんてい…

    もっと読む

  2. エンジンスターターリモコン

    カーメイトのエンジンスターターでエラー15表示と対処方法 26PV

    夏冬に特に重宝するのが、エンジンスターターです。 メーカーはCARMATEやCOMTECユピテルなど各社ありますが、一番のオススメはリモコンから多くの情報を得ることができるカーメイト製品です。 なぜか…

    もっと読む

  3. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 23PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

目次に行く・戻る

メルカリ招待コード:

今日の人気記事

のように、
個別記事のタイトルの上に「本日の人気記事」というものを表示する方法です。

 

WordPressにおいては、
WordPress Popular Postsという人気記事のプラグインがあります。

そのWordPress Popular Postsという人気記事のプラグインを利用して、
個別記事の上部にサイドバーとは異なる期間の人気記事(今回は今日一日の)を表示させる方法です。

 

やり方は簡単なのですが、

 


この記事を読む方へのオススメ


single.phpの表示したい部分に以下のphpコードを記載するだけです。

アドセンス336pxPC閲覧記事下表示1つ目コード


<div class="top_ranking">
 <?php if ( wp_is_mobile() ) : ?>
 <p style="padding:10px 0;">本日の人気記事</p>
 <?php else: ?>
 <p>本日の人気記事</p>
 <?php endif; ?>
 <?php
 $wpp = array (
 'range' => 'daily', /*集計期間の設定(daily,weekly,monthly)*/
 'limit' => 10, /*表示数*/
 'post_type' => 'post', /*投稿のみ指定(固定ページを除外)*/
 'stats_views' => '1', /*閲覧数を表示させる*/
 'post_html' => '<li><span>{title}</span></li>', /*表示されるhtmlの設定*/
 ); ?>
 <?php wpp_get_mostpopular($wpp); ?>
 </div>

 

具体的には、以下の画像の部分に追加します。

 

今日の人気記事挿入箇所

 

ポイントは、
ちゃんと、<div class="post">の中に挿入するということです。

でないと、
とんでもない表示になってしまいます。

 

そして、
CSSにて調整します。

 

参考に当ブログの現段階のCSSは以下になります。

(ちょっときたないですが(*゜.゜)ゞポリポリ))

 

/*--単一記事上に今日の記事ランキング-----------------------------------------------------*/


 .top_ranking p {
 padding: 0;
 margin: 0;

 color: rgb(0, 0, 0);
 box-shadow: rgba(0, 0, 0, 0.4) 1px 2px 10px, rgba(0, 0, 0, 0.0980392) 0px 0px 10px inset;
 border-left: 5px solid rgb(0, 0, 0);
 margin: 5px 0px;
 padding: 5px 0px 5px 10px;
 background: rgb(255, 255, 255);
 border-top: 1px dotted rgb(0, 0, 0);
 border-bottom: 1px dotted rgb(0, 0, 0);
 border-right: 1px dotted rgb(0, 0, 0);

}


 }


 .top_ranking ul{padding: 0!important;}
 .top_ranking li{border-top: 1px #ccc dashed;}
 .top_ranking li:last-child { border-bottom: 1px #ccc dashed; }
 .top_ranking p{padding: 0;margin: 0;} 
 .top_ranking a{display: block;}
 .top_ranking a:hover{background-color: #f5f5f5;}

 

自分で調整もしくは変更してみてください。

 

以上、
個別記事の上に今日一日の記事ランキングを表示する方法でした。

これで、
アクセスアップにつながるといいのですが…。

追記)

 

当ブログはテーマにStinger6を使用させていただいていますが、
Stinger系ですと、
トップページのdiscDescription部分がh1にての構造になっています。

なので、
トップページのみのh1のDescriptionのみCSSにて再調整する必要があります。

 

当ブログにおいては、
背景色などカスタマイズ済みなので、
それに合わせて以下のようにCSSを追加しています。

 

header .descr {
 color: #ffffff;
 font-size: 12px;
 font-weight: normal;
 margin-bottom: 0px;
 line-height: 20px;
 padding-bottom: 10px;
 background-color: #000;
 border-bottom: none;
 border-left: none;
 border-top: none;
 border-right: none;
 }

あなたにおすすめな関連記事

YouTube

WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録

YouTube動画が重い時や遅い時に遅くならない簡単解決方法(続)

以前の記事にYouTubeの動画が重い時や遅い時に、ページの表示速度やサイト自体が重くなってしまわないようにする方法を記載しました。ですが、WordPressにおいてのショートコード化で動画IDのクイ…

もっと読む

インフィード広告アドセンス

アドセンス新コード遅延読み込みモバイルでページスピード最高値

AdSense WordPress カスタマイズ 伝えたいこと 備忘録

AdSense(アドセンス)新コードの遅延読み込み2つの方法

Googleのサービスを利用されている方々は多いと思います。さまざまサービスがありますが、今回はグーグルアドセンス(Google AdSense)の新しいコードの遅延読み込みコードの2種類の方法につい…

もっと読む

インフィード広告アドセンス

ページ表示速度高速化

Stinger6 Stinger7 WordPress インターネット カスタマイズ テーマ 伝えたいこと 備忘録

ページ表示速度高速化方法で子テーマに@import使用しない方法と画像圧縮

以前からページ表示速度が気になっている私です。今回は大きく分けて2つの事を実施しました。 ちょっとなぐり書きですが、備忘録として残しておきたいと思います。     ページ速度高速化…

もっと読む

インフィード広告アドセンス

SearchConsoleから404増加メール

カスタマイズ 伝えたいこと 備忘録

SearchConsoleから「404」ページの増加とメール

 当ブログでは、 以前以下の記事を投稿しました。 attachmentIDというWordPressの仕様?による添付ファイルに画像のリンクをした場合の対処方法です。 が、…

もっと読む

インフィード広告アドセンス

カエレバをCSSでカスタマイズ

Stinger6 Stinger7 WordPress カスタマイズ

カエレバ・ヨメレバをCSSでカスタマイズする方法

  アフィリエイトリンクを作成してくれるカエレバブックマークレットやヨメレバブックマークレットを使用している方々は多いと思います。 私は、 カエレバ。というサイト?を知りはじめは意味がわかり…

もっと読む

インフィード広告アドセンス

インフィード広告挿入方法

AdSense AFFINGER4Pro STINGER PLUS+ Stinger6 Stinger7 WordPress カスタマイズ 伝えたいこと 備忘録

インフィード広告を記事一覧の間に表示させる方法

今月初頭に(上旬)アドセンスの広告表示方法に通常のコンテンツ連動型広告にプラスで、インフィード広告と記事内広告が解禁されました。 以前に、トップページの記事一覧にきれいにアドセンス広告を挿入する方法を…

もっと読む

Stinger6, WordPress, カスタマイズ」同じカテゴリーの記事一覧

おすすめの記事一部広告

お小遣い稼ぎにアンケート。

Multiplex 広告

Total361


アドセンス336pxPC閲覧記事下表示1つ目コード

目次に戻る

よろしかったらシェアよろしくお願いします。

-Stinger6, WordPress, カスタマイズ
-

目次に戻る

目次に戻る


コメントを閉じる
  1. […] 記事の上に今日の人気記事を表示する方法 ↑ のように、 個別記事のタイトルの上に「本日の人気記事」というものを表示する方法です。 WordPressにおいては、 WordPress Popula2016-02-28 08:28 […]

comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

You may choose to prevent this website from aggregating and analyzing the actions you take here. Doing so will protect your privacy, but will also prevent the owner from learning from your actions and creating a better experience for you and other users.