Simplicityの特徴 › フォーラム › テーマファイルのカスタマイズに関する質問など › Simple GA Rankingを使用して、人気記事をSimplicityと同じサムネイル付きのデザインで掲載したい
- このトピックには13件の返信、2人の参加者があり、最後に小田により6年、 11ヶ月前に更新されました。
-
投稿者投稿
-
-
2017年5月12日 6:59 PM #52427小田ゲスト
いつもお世話になっております。
表題の件について、いろんなブログや過去のトピック#48238を確認したのですが、
どうあがいても自己解決できなさそうだったのでお力を貸してください。。
(#48238も、恐らく今回の質問に近いものだろうってくらいにしか理解できてないレベルです…)■主な読んだブログ
http://tabibitojin.com/wordpress-plugin-simple-ga-ranking/
https://wordpress.kimoota.net/simple-ga-ranking/—【質問本題】—
現在、人気記事一覧を「WordPress Popular Posts」を使って掲載しています。
しかし、今後サーバーを「wpXクラウド」に移転する予定で、WordPress Popular Postsとの相性が悪いため、
新たに「Simple GA Ranking」(wpX担当者推奨)を使用して人気記事を掲載したいと考えています。調べたところ、「Simple GA Ranking」プラグインの設定だけだと、ウィジェットを追加してテキストのみ一覧で表示することしかできないようです。
希望としては、Simplicityと同じようにサムネイル付きで表示させたいです。具体的には↓の条件です。
・表示位置:サイドバー(右)
・表示タイプ:デフォルト
・サイドバーの横幅:336px
・サムネイルの角の丸め具合:角を丸める
・可能であれば順位付き
※投稿数10記事、集計単位1週間(これはプラグイン側の設定となるようです)
※Simplicity2.2.9を使用中お手を煩わせて大変恐縮ですが、ウィジェットを追加した後、
【どこにどんなコードを追加すればよいのか】をご教示いただきたいです。なお、サーバー移転については、この件が実現可能なのか分かってからにしたかったので、まだ行っていません。
お手数おかけしますがよろしくお願いいたします。
-
2017年5月12日 8:06 PM #52440わいひらキーマスター
申し訳ないですが、サポート対象外のものにもあるように、個々のプラグインを利用したカスタマイズ方法までは、サポートできないです。
僕も、日々の仕事の中の空いた時間にしかサポートする時間がないため、申し訳ないです。 -
2017年5月13日 6:54 PM #52464小田ゲスト
わいひらさん、コメントありがとうございます。
「サポート対象外のもの」を確認せず相談してしまい申し訳ございませんでした。。ちなみに、プラグインを使わず、手動(任意で人気記事を選択)で掲載する方法をご教示いただくことは可能でしょうか。もし「あまりにも時間がかかるカスタマイズ方法」に該当するようでしたらヒントだけでも教えていただけますと幸いです。
お忙しいところ繰り返し相談してしまいすみませんが、どうぞよろしくお願いいたします。
-
2017年5月15日 5:36 PM #52487わいひらキーマスター
自分で人気記事を選ぶのであれば、以下のようにHTMLを直接書いてテキストウィジェットに表示させると、特にカスタマイズを必要とせずできるかと思います。
<aside class="widget widget_popular_ranking"><h3 class="widget_title sidebar_widget_title">人気記事</h3> <ul class="wpp-list"> <li><a href="https://wp-simplicity.com/simplicity-child-theme/" title="Simplicityの子テーマをインストールする方法" target="_self"><img src="https://wp-simplicity.com/wp-content/uploads/wordpress-popular-posts/259-featured-75x75.jpg" width="75" height="75" title="Simplicityの子テーマをインストールする方法" alt="Simplicityの子テーマをインストールする方法" class="wpp-thumbnail wpp_cached_thumb wpp_featured" /></a> <a href="https://wp-simplicity.com/simplicity-child-theme/" title="Simplicityの子テーマをインストールする方法" class="wpp-post-title" target="_self">Simplicityの子テーマをインストールする方法</a> </li> <li><a href="https://wp-simplicity.com/how-to-set-big-header-image/" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" target="_self"><img src="https://wp-simplicity.com/wp-content/uploads/wordpress-popular-posts/15369-featured-75x75.jpg" width="75" height="75" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" alt="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" class="wpp-thumbnail wpp_cached_thumb wpp_featured" /></a> <a href="https://wp-simplicity.com/how-to-set-big-header-image/" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" class="wpp-post-title" target="_self">Simplicityに画面幅いっぱいのヘッダー画像を設定する方法</a> </li> </ul> <div class="clear"></div> </aside>
-
2017年5月16日 3:28 AM #52519小田ゲスト
わいひらさんありがとうございます!
さっそくやってみたところ表示することはできたのですが、WordPress Popular Postsを削除したせいなのか、ランキングの数字が出なくなってしまいました。
度々申し訳ないのですが、数字を表示する方法を教えていたただきたいです。。 -
2017年5月16日 7:46 PM #52525わいひらキーマスター
ページを設定状態とソースコードを見たいので、URLを掲載していただいて良いですか?
-
2017年5月16日 8:22 PM #52530かうたっくゲスト
きまぐれに失礼します
さっそくやってみたところ表示することはできたのですが、WordPress Popular Postsを削除したせいなのか、ランキングの数字が出なくなってしまいました。
人気記事のウィジェットを開いたら、
集計期間の表示(人気記事のみ)
□集計単位の表示閲覧数の表示(人気記事のみ)
□閲覧数の表示ランキング順位の表示(人気記事のみ)
□ランキング順位の表示とあるので、□にチェックを入れると数字が表示されるかと思われます。
-
2017年5月17日 4:08 AM #52536小田ゲスト
わいひらさん>
大変恐縮ですが、個別にURLをお伝えしてもよいでしょうか。かうたっくさん>
今回の質問はWordPress Popular Postsと人気記事ウィジェットを使わず、
テキストウィジェットに直接HTMLを記載する方法なので、
その方法では表示することができないと認識しているのですが。。 -
2017年5月17日 11:55 AM #52539小田ゲスト
あと、キャッシュを削除した状態で改めて確認したら、
サムネイル画像も表示されていなかったです。大変お手数おかけしますがこちらも含めてご教示いただきたいです。
よろしくお願いいたします。 -
2017年5月17日 5:40 PM #52543わいひらキーマスター
ソースコードを改めて見返して気づいたのですが、#52487にて以下のように書いていた部分を、
<aside class="widget widget_popular_ranking">
以下のように変更すると多分ランキングが表示されるかと思います。おそらく。
<aside class="widget widget_popular_ranking ranking_list">
一応、修正したサンプルコードも改めて以下に掲載しておきます。
<aside class="widget widget_popular_ranking ranking_list"><h3 class="widget_title sidebar_widget_title">人気記事</h3> <ul class="wpp-list"> <li><a href="https://wp-simplicity.com/simplicity-child-theme/" title="Simplicityの子テーマをインストールする方法" target="_self"><img src="https://wp-simplicity.com/wp-content/uploads/wordpress-popular-posts/259-featured-75x75.jpg" width="75" height="75" title="Simplicityの子テーマをインストールする方法" alt="Simplicityの子テーマをインストールする方法" class="wpp-thumbnail wpp_cached_thumb wpp_featured" /></a> <a href="https://wp-simplicity.com/simplicity-child-theme/" title="Simplicityの子テーマをインストールする方法" class="wpp-post-title" target="_self">Simplicityの子テーマをインストールする方法</a> </li> <li><a href="https://wp-simplicity.com/how-to-set-big-header-image/" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" target="_self"><img src="https://wp-simplicity.com/wp-content/uploads/wordpress-popular-posts/15369-featured-75x75.jpg" width="75" height="75" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" alt="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" class="wpp-thumbnail wpp_cached_thumb wpp_featured" /></a> <a href="https://wp-simplicity.com/how-to-set-big-header-image/" title="Simplicityに画面幅いっぱいのヘッダー画像を設定する方法" class="wpp-post-title" target="_self">Simplicityに画面幅いっぱいのヘッダー画像を設定する方法</a> </li> </ul> <div class="clear"></div> </aside>
-
2017年5月17日 8:25 PM #52545小田ゲスト
わいひらさん>
修正してみましたが、やはりランキングが表示されませんでした。。ちなみに、サムネイル画像が表示されなかったのは、画像URLが、
img src=”http://〇〇〇.jp/wp-content/uploads/wordpress-popular-posts/1513-featured-75×75.jpg
と、「wordpress-popular-posts」が入っていたからだと思います。メディアライブラリから再度画像のURLをコピペしたらサムネイル画像は表示されました。
これと同じようにwordpress-popular-postsを削除したことでランキング表示にも影響がでているのでしょうか。。??
-
2017年5月17日 8:38 PM #52546小田ゲスト
連投失礼します><
あと、メディアライブラリの画像URLを張り付けることで画像表示はできたものの、画質が圧縮されてぼやけたような表示になってしまいます。これも治す方法を伺いたいです。
-
2017年5月17日 9:30 PM #52548わいひらキーマスター
やはり、ソースコードを見たいところですが、URLが公開が難しいとのことなので、申しわけないですが(不具合確認以外での)個別対応は現在行っていません。
スタイルシートで番号を表示する方法は以下なので、CSSセレクターを自前で設定してください。.ranking_list { counter-reset: wpp-ranking; } .ranking_list ul li{ position: relative; } .ranking_list ul li:before { background: none repeat scroll 0 0 #666; color: #fff; content: counter(wpp-ranking, decimal); counter-increment: wpp-ranking; font-size: 75%; left: 0; top: 3px; line-height: 1; padding: 4px 7px; position: absolute; z-index: 1; opacity: 0.9; border-radius: 2px; font-family: Arial; }
メディアファイルは、表示するサイズにキッチリとリサイズしたものをアップして利用すればよいかと思います。
-
2017年5月17日 10:02 PM #52550小田ゲスト
お忙しい中ありがとうございました!
-
-
投稿者投稿
- トピック「Simple GA Rankingを使用して、人気記事をSimplicityと同じサムネイル付きのデザインで掲載したい」には新しい返信をつけることはできません。