- このトピックには8件の返信、2人の参加者があり、最後に
により7年、 8ヶ月前に更新されました。
-
投稿
-
GA popular posts WidgetをGoogle APIとGoogle Analiticsの設定を経て設置することができましたが、うまく表示されません。
具体的には
①順位・サムネイル・タイトルが横並びにならない
→下記部分の<p>タグが原因？
$string .= “<p>$title</p>”;
if ( $show_image && !empty($pthumb) ){
$string .= “<div class=’ga-pvp-graphwrap’>”;
}②code Prettyもそうなのですが、CeltisPack単体できれいに表示させるには
CSSが不足しているような気がします。できれば以上の点よろしくお願いします。
Celtispack プラグインは、Celtis_s テーマに合わせて使用することを想定しています
他テーマを使ってCSSが合わない場合は、ご自身でCSSを設定してください
ちなみにサムネイル、タイトルが横並びにならない場合は、p タグではなく サムネイルの img に設定している float left がうまく働いていないと思われます
/** GA popular posts Widget 開始 **/
.ga-pvp-table table{
border-collapse:collapse;
border-spacing:0`border-bottom:1px solid #ddd;
border-collapse:collapse;
border-spacing:0;
width:100%;
margin:18px 0
}.ga-pvp-table th,
.ga-pvp-table td {
padding: 2px;
vertical-align: middle;
border-top:1px solid #ddd;
font-size:93%;
font-weight:normal;
text-align:left;
padding:3px 8px
}.ga-pvp-table th{
font-weight:bold
}.ga-pvp-titlewrapper a img{
float: left;
margin: 0px 10px 10px 1px;
}
/** GA popular posts Widget 終了 **//** prettyprint 開始 **/
.prettyprint {
max-height: 530px;
overflow: auto;
}ol.linenums {
margin: 0 0 0 36px;
}
ol.linenums li {
padding-left: 10px;
line-height: 17px;
}/** prettyprint 終了 **/
上記のCSSを追加したところうまく表示されるようになりました。
一つ不満点があるとすれば、prettyprint 終了のコード部分の背景が縞々になる部分がありますね。
その部分が横に長いプログラムを書いた時にスクロールするように設定した場合、
はみ出した部分が縞々にならない点です。
これを解決するにはどうすれば良いのでしょうか？
code-prettify の設定については私自身よくわかっていないことも多いので、ご自身でいろいろやって見られるのがよいかと思います
また、オープンなプロジェクトですので下記サイトで質問すればなにか解決法がわかるかもしれません
googlearchive/code-prettify
An embeddable script that makes source-code snippets in HTML prettier. – googlearchive/code-prettify
GitHub上記の縞々についてのCSSについて調べて見ましたが有力な情報は得られませんでした。
おそらく無理なようなので諦めることにしました。
提案なのですが、GA popular posts Widgeのウィジェット上で
サムネイルのサイズを選択できるようにできませんか？
70×70は個人的には大きいような気がします。
参考までにWordpress Popular Postでは60×45のサムネイルを使用しています。
あと、画像がない場合に表示される画像の形がおかしくてサムネイルサイズに合致していないような気がします。
あと、年間タブや全期間タブを追加する予定はありませんか？
サムネイルのサイズは、celtispack の function.php ファイルの15行目
add_image_size('small', 70, 70, true );で指定していますので、カスタマイズしてください
画像がない場合の表示は celtislib.php 567行目で行っていますので、そこをカスタマイズしてください
また、年間タブ、全期間タブを追加する予定もありませんので、ご自身でチャレンジしてみてください
$imageurl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASIAAAAyBAMAAAAKMcuqAAAAMFBMVEXp+P71///+9/fZ7Prr7PTg5/PW4vL///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADr20u8AAACb0lEQVR42u2YMW/TQBiG33PiTJDcUZWBAWK1isSSRiAWBoTExpD+BU+w8lPyE9I/AAkDAwNiAoFEiAsLUutEQepAqH0gplgXc5/TEEfp0qhHPPgGO76zc4/f7/0+n82eIGOtyHi2gGIraxIhJ8qJcqKcKCfKiXKizBA9HxzTppXuCl5vVCMuWlheUDFW2mzUWANVpJGqm40aAyaZc/YeoLJFVGivdEWpLnWaHvncN01UhSzIZOJBeDzPuL714EMvaPWCj7p/ZOlsjHrBN/8I6FVv9o1r9AINDhcex7XbiT7kclFzWFOwCnDIId7ipWDXBYcSYFeME1VwgyQSvbK8S8c24tmAJtgC6qHPJnAIU8G72h1utU0TTSURdPmXgkwcFVH+JXH0E5f9rMtGJNRBWQ8J5Q4hjTtbbmsBHEUqLCYbl6HqdKh22/oVkOPZFNLinvFc06axSZOIrJRuJ8Avm4BG7BHXZ3yiMDLU1qqfFyGiSQfn1k3M6nhXGxvo6B6LdpVwub4b0EjbdX8+/XlTOfjxhgBLejPL+1PX/Gpk4R6ONFhE0VTvmzPNOigxHAixa75mT8+otF7z2++kSrar/y/GJHL0Ll4u56aI7JlGbYuvPt7a3FYj9Pdx7w9Zmj3E18f/YQ05IKrCfQ/eInj9M9tI9vtfWdBgt0LTuZaYhqztY9uZnqwM2iHiUJfJECEUnw51FF8ZJhrS3UuJ5gDxd3feRYYJk1974ZEXl3BnrBVzbV/G/sVTDezp5X/183VRGtfWvNjEV79Ip3/wbu3LiwZWgRzBzk6WiGxBz5L8nTYnyolyopzo0luR1g+Zan8BU3TCzYjaWUUAAAAASUVORK5CYII=";画像がない場合はceltislib.php 568行目の上記部分の””の中を自分で用意した画像のURLに書き換えればいいということですね。
サムネイルのサイズと年間タブ、全期間タブの実装方法は目処がたったのですが、
更新毎に書き換えるのは面倒なのが現状です。更新しても書き換えずに済む方法はありますか？
画像がない場合はceltislib.php 568行目の上記部分の””の中を自分で用意した画像のURLに書き換えればいいということですね。
そういうことです
更新しても書き換えずに済む方法はありますか？
Celtispackプラグインの更新？
方法としては、この GA popular posts のモジュールのソースコードをコピーしてそれをご自身でカスタマイズして別のプラグインとして作り直しことです。そうすれば Celtispack の更新と切り離せます
あるいは、Gitのようなバージョン管理システムを使ってソースコードを管理すればブランチやマージ等いろいろできるようになります
- このトピックに返信するにはログインが必要です。