忍者ブログ
13 March

Single Post Widget ウィジェットで任意の記事を出力する

https://firegoby.jp/wp/single-post-widget
https://wordpress.org/plugins/single-post-widget/

投稿記事のURL、画像のサイズを選択、テンプレートも自由
作者(日本人)のかたによるカスタマイズも書いてある

ただしまったく更新されてないため、WPの検索欄からでてこないのでDLしに行く必要がある



「ランキングに見せかけた任意の記事表示をしたい」っていうのがそれなりにいる
ほんとのpvが全然ないからそんなことをするサイトね

選択しただけでウィジェットにパッと表示してくれるプラグインがあるようでない。
カテゴリー内の~とかそんなんばっかで「任意の記事」選択が全然ない
手書きじゃ書き換えとかすげーめんどいし、スラッグで画像やタイトルとかも全部勝手に呼び出して出力してくんねーかなー。ついでに出力テンプレートは自由に書き換えたい

とか探してたときには見つかんなかったけど、なんでか忘れたがこのプラグインに出会った!
あーこれでいい。もうこれでいい。
1つ自分の思うとおりではないのは、1ウィジェットパネル=1記事なので、ウィジェット欄がなんかうぜえ。利点は順番を入れ替えたいときに便利ということか。

PR
12 March

WPでローディング画面 WP Smart Preloader

WP Smart Preloader
がよかった。これを入れた後、カスタムでcssやアニメーションを自分で設定もできるし、入ってるものをその場でcssやアニメーションを改変して書き込める



プラグイン使わないやつを色々やってみたけど、読込が変だったりうまくいかない
うまくいかないのはWPでjqueryとアニメーション使いまくってて重すぎルからだと思う

100%のバーが伸びるプラグインはIE11ではバーが動いてなかった

06 March

SVGアニメーション jQuery DrawSVG

SVGパスアニメーションを手軽に実装できる jQuery DrawSVG の使い方
http://arakaze.ready.jp/archives/3530

SVGファイルのためのイラレ設定
https://hatsuka.info/design/svg

SVGアニメーションが5分で作れる!jQuery DrawSVGの使い方
http://stand-4u.com/plugin/drawsvg.html
http://stand-4u.com/stand-4u/html/draw_svg.html



↑のコードをWP内にコピペしたがIE11で動かない。(実際動いてるhtmlのほうのコード)
「jQueryが動かないときに試すこと~」みたいな検索結果をみて、下記のようにオレンジの読込部分を足したら動いた。なんでなのかはよくわかんねー

あとからフワッと色付けされているのは、画像を表示している。
本来ならfillとかで色付け出来ると思うがIEでcssで出来るのか試す。
svgと画像を重ねてるんだがずれる。同じイラレデータから作成してるのにずれる
なんでだよ!!ともう嫌になったが、通常すぎて忘れていたbox-sizing:border-box;のせいだった
これをcontent-boxに変えたら直った
たまーにこれが影響すんだよな。レスポンシブにはborder-boxが必須なのによ


<script type="text/javascript">
jQuery(document).ready(function($){
  var mySVG = $('.svg1').drawsvg({
  duration:1000, 
  stagger:100,
  easing:'swing',
  reverse:false,
  callback: function() {
     //コールバックの処理を記述
     $("#s4u").fadeIn(5300);
     $(".svg1").fadeTo(1100, 0);
    }
  });
  mySVG.drawsvg('animate');
});
</script>


05 March

WP内でRSSfeedを取得する(プラグインや無料サービスを使用しない)

どこかのコードのコピペだと思う…

<?php
$rss = simplexml_load_file('http://フィードするURL/?feed=rss2');
$count = 0;
echo '<ul class="feed_list">';
foreach($rss->channel->item as $item){
    $title = $item->title;
    $date = date("Y/n/j", strtotime($item->pubDate));
    $link = $item->link;
    $description = mb_strimwidth (strip_tags($item->description), 0 , 70, "…", "utf-8");
?>
<li><a href="<?php echo $link; ?>" target="_blank">
<div class="title"><?php echo $title; ?></div>
<div class="text"><?php echo $description; ?></div>
<div class="date"><i class="fa fa-clock-o" aria-hidden="true"></i> <?php echo $date; ?></div>
<div class="ar"><i class="fa fa-angle-right" aria-hidden="true"></i> more</div>
</a></li>
<?php
 $count++;
 if ($count > 8){break;
 }
 
 }  echo '</ul>'; ?>  
02 March

WP 表示オプションの中身を個別に消したい

https://www.webantena.net/wordpress/functions-php-remove-post-metaboxes/

通常で表示されている表示オプションは remove_meta_box で消す
プラグインで追加されたものはこれで消すことができないため、
cssで無理やり消す