月別アーカイブ: 2020年3月

WPを4系から5系にアップデートしたら投稿や固定ページの新規アップが画面真っ白になるよ

そのまんまですが、WPアップデート成功!よしエラーも無事だったね。

と思いながら新規追加すると発生する悲しさ。

エラー状況的にはrest apiがうんたらかんたら。
これなんだっけ?と調べてみると外部からゴニョゴニョするためのモノでWPに搭載された当初 脆弱性の問題で停止したほうがよいというしろもの。

ただ、何かしらのプラグインで最近では使われることも多く(ContactForm7とか)やみくもに停止してしまうとよろしくない。

なのでいろいろなサイトを参考に例外処理をするわけです。
https://nelog.jp/deny-restapi-except-plugins
詳細は参考サイト先で。

で、それだけだとGutenbergもREST APIを利用しているのでエラーになるのでした。
上記の参考サイトの内容に
https://www.webdesignleaves.com/pr/wp/wp_user_enumeration.html
で書いてある

    //permit Gutenberg(ユーザーが投稿やページの編集が可能な場合)
    if ( current_user_can( 'edit_posts' ) || current_user_can( 'edit_pages' )) {
      return $result;
    }

を追記するとログインしているときだけはREST APIを有効化できるわけですな。

ざっくりとした認識なので間違っていることもあるでしょうし、セキュリティ的に懸念が増える可能性もあるのでシステム担当者にヒアリングしながら対応したほうがよさげですが。

iphoneなどのスマホで動画をinline再生させる方法

普通だとYoutubeとかはモーダルぽく、もしくはアプリに飛んでしまうもよう。
パラメータとして

playsinline="1"

を設定すればよいらしい。
Youtube APIならば

playerVars: {
    controls: 0,
    showinfo: 0,
    playsinline :1
},

こんなかんじ、
ロゴやら関連動画を消したいけどそれはもうできない。

ちなみにインライン再生って思いつくまで、コンテンツ内再生、youtube モーダルさせない、WEB内再生
とかあほくさい言葉でググってしまった。
ググリワード力って大切。。。

CSS Gridの中でSlickを利用すると画像がとんでもなく大きくはみ出る

ずっと避けてきたGrid。
ついに着手。
良く分からないけど参考サイトを見つつ column rowを設定してその中に各要素を収める設定完了。

grid-column: 1/2;
grid-row: 2/3;

こんな感じで各divに設定をいれていく。

良し完成と思いつつプレビュするとSlickがとんでもないことに。

display: grid;
grid-template-columns: repeat(2,1fr);
 grid-template-rows: repeat(6,auto);

こんな感じで横2 縦6のGridを作っていて右側にSlick用のDivを配置しておりましたが、それだとだめで

display: grid;
grid-template-columns: repeat(2,minmax(0, 1fr));
grid-template-rows: repeat(6,auto);

こうする必要があり。
ちょっとまだ良く分かっていない。もっと勉強しないとだ。
レイアウトはかなり自由度が上がるけどCSSの可読性はかなり低いなぁ。