ベースHTMLテンプレート2023

サイトタイトル 見出し1 © サイトタイトル

Wordpress Gutebergのフルスクリーンモードを恒久的に常時OFFにする方法

下記のコードをテーマのfunctions.phpに記載しておけば、フルスクリーンモードをずっと停止しておけます。 ・・・テーマごとではなく、設定でできるようにしてほしいですね。 if (is_admin()) { function jba_disable_editor_fullscreen_by_default() { $scr…

【Wordpress5.8 Gutenberg エラー不具合】「このブロックでエラーが発生したため、プレビューできません」

Gutebergでこんなエラーが起きたらSnowMonkeyプラグインをいったんOFFしてみよう「このブロックでエラーが発生したため、プレビューできません」 このエラーが当方の環境で起きたので、プラグインのON/OFFで解消しないか調べてみると、 「SnowMonkeyプラグイ…

【JS】Javascript/正規表現/全角チェック/全角文字を含むかの判定方法

ネットで調べるも、「/^[^\x01-\x7E\xA1-\xDF]+$/」となっているサンプルが多いが、 先頭・末尾の^と$を指定すると、jsでは、「あa」は全角を含む、「aあ」は全角を含まない判定になってしまったので、先頭の^ 末尾の$ を外し、以下の表現で、文章中のどの位…

IE11対応・IE11で上下の位置ずれを治す。Swiper.js5系 prev/nextボタン

IE11では、Swiper6系以降は動作しない。 IE11対応するにはSwiper5系を利用する。Swiper5系でも、PREV/NEXTの左右の矢印ボタンが表示されないので、現象があるためCSSのカスタムが必要。IE11で ・swiperの左右ボタンが表示されない ・swiperの左右ボタンが上…

IE11対応・IE11で上下の位置ずれを治す。Swiper.js5系 prev/nextボタン

IE11で ・swiperの左右ボタンが表示されない ・swiperの左右ボタンが上下の中央より少し下にずれてしまう現象を治すcssサンプル .swiper-button-next { background-image: url(static_images/swiper_arrow.svg); background-repeat: no-repeat; background-s…

IE11対応・IE11で上下の位置ずれを治す。Swiper.js5系 prev/nextボタン

IE11で上下の位置ずれを治すcss .swiper-button-next { background-image: url(static_images/swiper_arrow.svg); background-repeat: no-repeat; background-size: 100%; width: 44px; height: 44px; right: 0; position: absolute; z-index: 10; transform…

content.bundle.js:33 Uncaught (in promise) TypeError: Failed to construct 'URL': Invalid URL at y (content.bundle.js:33)

chrome(バージョン: 88.0.4324.192(Official Build) (x86_64)) /Mac Big sur 11.2.1(20D74)Axe - Web Accessibility Testing4.8.4 Accessibility Checker for Developers in Chromeという機能拡張を有効にしていたら、chromeのconsoleに以下のエラーが…

chrome(バージョン: 88.0.4324.192(Official Build) (x86_64)) /Mac Big sur 11.2.1(20D74)Axe - Web Accessibility Testing4.8.4 Accessibility Checker for Developers in Chromeという機能拡張を有効にしていたら、chromeのconsoleに以下のエラーが…

chrome(バージョン: 88.0.4324.192(Official Build) (x86_64)) /Mac Big sur 11.2.1(20D74)Axe - Web Accessibility Testing4.8.4 Accessibility Checker for Developers in Chromeという機能拡張を使用していたら、chromeのconsoleに以下のエラーが出…

content.bundle.js:33 Uncaught (in promise) TypeError: Failed to construct 'URL': Invalid URL at y (content.bundle.js:33)

CSS:flexの最後の要素を下揃えする方法(もっと見るボタンなど)

.parent{ display:flex flex-direction: column } .parent > *:last-child{ margin-top:auto }

レスポンシブCSSでスマホとPCを切り替える場合に、displayを元の値のまま保持する方法

レスポンシブなCSSでPC/SPの表示を切り替えたい場合、以下のように、 display:none display:block を指定しなおすことで実現するのが一般的だが、 例えばpcでdisplay:flexだった要素をspでdisplay:none にした場合は、一律にdisplay:blockに戻してしまうと表…

WordpressのGutenberg Block Editerがカスタム投稿タイプで使えない

カスタム投稿タイプに属する記事の一覧・編集画面で、ブロックエディタでの編集ができない場合は、 そのカスタム投稿タイプの、REST API機能が無効になっているため。私の場合は、Custom Post Type UIというプラグインでカスタム投稿タイプを運用しているの…

Wordpress Block Editer (Gurenberg)がエラーで公開・プレビューできない。「更新に失敗しました。 返答が正しい JSON レスポンスではありません。」エラー、または更新中のまま進まない

Wordpress Block Editer (Gurenberg)がエラーで公開・プレビューできない。 「更新に失敗しました。 返答が正しい JSON レスポンスではありません。」エラーがエディタの上部に赤く表示される場合に 過去に解決できた方法の覚書。 ★サイトのルートディレクト…

Adobe XDにAdobeFontsでアクティベートしたフォント(NotosansCJKJP)が反映されない[Mac]

解決方法Macを再起動し、SHIFTキーを押しながら起動する。 その後再度再起動し、command+option+P+Rキーを同時押しして起動する。フォントキャッシュが削除され、反映されるようになる。

CSS/flexで固定+可変

.flex_parent{ display:flex; } .flex_parent>*:nth-child(1) { width:45%; /*width:400px;*/ }.flex_parent>*:nth-child(2) { flex: 1; }

AndroidのMessengerのスレッドでPDFやxlsxなどのリンクをタップしてもファイルがダウンロードされない(ダウンロードされる場所がわからない/画面が真っ白)

AndroidのMessengerのスレッドでPDFやxlsxなどのリンクをタップしたとき、 ・ファイルがダウンロードさできない ・ダウンロードのダイアログでダウンロードをタップしても真っ白な画面が開くだけでダウンロードされた場所がわからない ・真っ白な画面を閉じ…

Github+Plesk自動デプロイのやり方

★手順1--GitHub側 Githubアカウントを作成する。 repositryを新規作成する。repositryのトップページ>Code>UseSSH>Clone with SSHのgitレポジトリのアドレスをメモしておく git@github.com:[USERNAME]/[REPOSITRYNAME].git ★手順2--Gitクライアントでローカ…

CSSグリッドレイアウト(IE11はflexboxとして表示)

.gridlayout{ display: grid; display: -ms-flexbox; gap: 8px; -ms-flex-direction: row; -ms-flex-wrap: wrap; -ms-flex-pack: left; -ms-flex-align: stretch; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }

モーダルウィンドウ表示用Javascript覚書

var scrollPosition; function toggleSpmenu() { var modal = document.getElementById('modal'); var togglebtn = document.getElementById('togglebtn'); var modalbg = document.getElementById('modalbg'); if (modal.classList.contains('show')) { /*C…

モーダルウィンドウ

>|python| import numpy as np arr = np.array([1, 2, 3]) ||

IEでonerrorは発火しないことがある

IEでonerrorは発火しないことがある

JSで:beforeのbackground-imageを取得し、その中のURL()を取得する

var bg_url = window.getComputedStyle(document.querySelector('div'), ':before').getPropertyValue('background-image'); var app_path = appbg_url.slice(4, -1).replace(/"/g, "");

position:stickyが動かない

親要素にOverflow:hiddenがあると動かない。 IE11では動かないので、polyfillを使おう。

GUIでフォルダのメタデータ( Cache-Controlなど)を一括で変更する

S3

フォルダにチェックをいれる。 右上の「actions」から「change metadata」を選び、変更してSAVE

atom Macで謎の制御文字(不可視文字)が入る

macでatomでhtmlを書いていたら、Windows chromeやEDGEで豆腐が表示されてたので、調べた。 Windowsでは秀丸、 やsublime textで開き削除すると消える。 atomでほ、空白などのメジャーな制御文字以外は表示もされないので削除できない。

Sparkメールアプリでスマート検索・クエリ一覧

<h3>Small/short/large/oneline</h3>メールをサイズで検索<h3>Forwarded/replied, forward/reply</h3>返信、転送されたメール<h3>Starred/flaggedスターつき、フラグつきのメールNot repliedinsubjectattachmentsdocument attachmentsdocumentsLast weektodayyesterdaythis weekthi</h3>…

IE11で使えないCSS/JavascriptをつかえるようにするPolyfills

よく使うIE11のPolyfills JS CSSのスムーズスクロール(scroll-behavior: smooth)をIE11で使えるようにする github.com JSのPromiseをIEで使えるようにする github.com CSSのobject-fitをIEで使えるようにする github.com CSSのposition:stickyをIEで使えるよ…

CSS object-fitはIEで使えない

CSS object-fitはIEで使えない polyfillはいくつかあるが、ソースにコードを加えなければならないのであまり実用的ではない。