Adobe AnimateCCは、Flash感覚でタイムラインアニメーションを作成し、canvas書き出しが出来る便利なソフトなのですが、レスポンシブの書きだしでちょっとハマってしまいました。同じことがまた起こると思われ…
ブロックのyoutube埋め込みをレスポンシブにする
ブロックエディターになってから、youtubeはiframeを自分で入力しなくても、URLを入れるだけで埋め込みに対応するようになりました。デフォルトのままではレスポンシブになりませんので、幅100%表示のレスポンシブに…
PHPのループで最初だけ別の処理
エンジニアではないので、PHPを利用するのはもっぱらwordpressのカスタマイズの時ですが、ループ処理の最初だけcurrentやactiveといったクラス名をつけたい場合があり、その場合の処理方法です。 下記はマルチ…
CSSアニメーションを可視領域に入ったら発火（inview.js その１）
cssアニメーションはとても便利なのですが、アニメーションをいつ発動させるかは、CSSだけでは操作できません。そこで要素が画面内に入ったことをシンプルに判定したい。そんな時は「inview.js」の出番です。 使用方法の…
楽天トラベルカスタマイズ覚書（2019春時点）
楽天がらみの仕事は管理画面の使い勝手に癖が有りすぎて、あまりやらないのですが、お付き合いのあるお客様のお仕事で継続的にお引き受けしているものがあります。年に数回しか行わない作業なので、その度にコツを忘れて泣かされる！です…
GutenbergでGalleryショートコードを使う
Gutenberg以前（Classicエディター）は、ギャラリーの挿入を使うとショートコードが生成されました。これをfunctionsで変更すると、ギャラリーの表示方法を、bxsliderなどに容易に変更できたのですが、…
Advanced custom fieldでショートコードを入力したい
カスタムフィールドを使って、TablePressのテーブルを表示した案件がありました。TablePressは表示にショートコードを使いますので、Advanced custom fieldでカスタムフィールドを作り、そこに…
Javascriptでエージェント判定をして、別のhtmlを書き出す
レスポンシブで作成したLPの電話番号をPCとスマホで別にする、という依頼が。CSSで対応しても良いのですが、電話番号の表示箇所の数が多いので、ソースが煩雑になりますし、CSSのメディアクエリは厳密にPCとスマホを分けてい…
マルチサイトの親サイトのURLを変更する
今回の事情 今回、凡ミスで非常に苦労したので、メモを残しておきます。事情は以下です。 サイトのリニューアルのために、実サーバ条のルートから1階層下にワードプレスをインストールして、テストアップしていた。 途中から事情があ…
クロスドメインでRSSを取得してhtmlで表示する
Google Feed API（終了）→YQLに変更→これも終了、という流れですっかり懲りてしまった私は、phpとjavascriptで取得表示する方法に、クライアントのサイトを切り替えました。既存サービスに頼る怖さはこ…