現在の接続環境は
です

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

Windows10サポート終了まで
国民総株主
¥1,650 （2024/11/30 16:49時点 | Amazon調べ）
Amazon
楽天市場
Yahooショッピング
メルカリ

プロモーションを含みます

Stinger6 WordPress カスタマイズ

今日の人気記事

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

所要時間目安：約3分

This session is using　 IPv4 　is established in

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

カーメンテナンスWAKO'S

2025年2月22日 (土曜日)↓における週間月間人気記事トップ３は？↓

  • 本日
  • 週間
  • 月間

  1. Windows11 24H2不具合エクスプローラーのツールバー詳細 (…)が下に表示でなく上に表示解決方法 4PV

    Windows11が正式リリースされてから早3年が経過します。毎年10月から11月にはWindows10の頃からメジャーアップデートが繰り返されてきています。今年2024年はWindows11バージョ…

    もっと読む

  2. ECUリセット

    ECUをリセットする方法。アイドリング不安定だったのでしょうがなく 3PV

    過去の記事で、車も人間と同じようにメンテナンスは大事です。 と記載しました。 ですが、メンテナンスのし過ぎもいかがなものかという感じになりました。（メンテナンスしないのはもっと悪いですが…。） その記…

    もっと読む

  3. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 2PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

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

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

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

    もっと読む

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

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

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

    もっと読む

  3. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 27PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

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

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

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

    もっと読む

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

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

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

    もっと読む

  3. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 27PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

今日は2025年2月22日です。

目次に行く･戻る

2025年2月22日 (土曜日)本日の人気記事トップ１０

メルカリ招待コード：

今日の人気記事

↑

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

 

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;
 }

「Stinger6, WordPress, カスタマイズ」の人気記事

ホワイトデーまであと…ホワイトデーはどんなPresent（プレゼント）でどのように過ごされますか？

ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。

おすすめ！！

世界中でNo.1のシャアを誇るAmazonでのお得なお買い物でお得をしよう！！ネット通販なので、もちろん24時間年中無休です。健康商品から食品、車カスタマイズ商品、大手家電メーカー商品やパソコンの自作サプライ商品、その他アマゾン・プライムでは映画やドラマなど多くの作品や番組を見ることができます。マスクなど衛生商品も今では必須アイテム。一番信用できて一番商品数の多いAmazonでの買い物が絶対にオススメ！！

詳細ページへ

No.1シェアAmazon

おすすめ2

楽天による季節特集です。それぞれの季節ごとにお得なお買い物商品やお得な旅行商品、その他にもAmazon同様に国内最大の買い物ポータルサイトです。楽天をメインにお買い物されている方はポイントやSPUも貯まりさらにお得に！！楽天カードや宇佐美系列のガソリンスタンドでも楽天ポイントが今では貯まります。それらのポイントを貯めてお得にお買い物や旅行商品その他にもパソコンサプライや車カスタマイズ商品など楽天も充実しています。

詳細ページへ

楽天市場

ブログサービスが始まってから:


カウントダウンタイマー

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

🎉 Counting Up! 🎉
Loading...
ブログカード

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

WordPressブログカードEmbedで実装方法

WordPressがバージョン4.4になってから、 はてなブログのようなブログカード風のリンク先が、 エディタのビジュアル画面の投稿画面にURLを入力するだけでブログカードを実装できるようになりました…

もっと読む

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

アイキャッチ画像自動設定

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

アイキャッチ画像を設定し忘れないように自動で設定する方法

WordPressやFC2ブログなどで、アイキャッチ画像を設定しなければならないのは意外と手間ですよね。 以前に、アイキャッチ画像を設定し忘れた時にランダムに表示させる方法を記事として紹介しました。 …

もっと読む

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

紅葉

php WordPress テーマ

WordPressテーマカスタマイズしてみた。

WordPressのテーマをカスタマイズしてみました。 カスタマイズしてみた内容は、 ちょっと試行錯誤し過ぎて明確には覚えていないのですが…。バックグラウンドの色の変更。新しい記事の表示件数の変更。（…

もっと読む

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

背景画像の設定方法

Stinger6 Stinger7 WordPress カスタマイズ カスタマイズ 備忘録

WordPressのStinger6とStinger7で背景画像を設定する方法

WordPressの無料テーマで有名なStingerがあります。 現在での一番新しいバージョンはStinger7ですが当ブログにおいては今のところStinger6を使用しています。 背景に画像を設定し…

もっと読む

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

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

CSS圧縮後（minify）にCSS整形方法カスタマイズの為

サイト運営しているうちにCSSがものすごい大きくなってしまうことがありますよね。昔使用していたCSSがそのままだったり、もしくはコメントアウトしたものが残っていたりなどです。そういった不要なCSSをサ…

もっと読む

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

WordPress

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

サイドバーのウィジェットにタイトルを表示させずに追加する方法

テーマにもよりますが、サイドバーにデフォルト（はじめから）で追加されている状態のウィジェットがあると思います。 もちろん、サイドバーにウィジェット追加用に多くのテーマは作られていると思います。 ですが…

もっと読む

あなたが訪問してから

⏰ 0 秒経過 🎉

おすすめの記事一部広告


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

Multiplex 広告

Total510


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

目次に戻る

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

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

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

目次に戻る

目次に戻る

コメントを閉じる
  1. 人気記事ランキングに順位を付けてCSSで丸く表示する方法 | WordPressデビュー津々浦々 より:
    2017年1月13日 6:35 AM

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

    返信

comment

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


This site uses Akismet to reduce spam. Learn how your comment data is processed.