WordPress – NILX.ORG

Prism.jsのSASSハイライトを修正

WordPressのHCBに言語を追加でSASSのシンタックスハイライトを追加したが、判定が不完全なので修正する。

疑似クラス、疑似要素の:にマッチしてセレクタ行がプロパティ判定されている(6,9行目)。

JS SASS Web制作 WordPress 拡張機能

WordPressのjQuery読込削除

WordPressのヘッダで古いjqueryとjquery-migrateが読み込まれているので、削除した上で高速なjsDelivrのCDNで新しいverを読み込む(プラグイン等で使用されている為)。

function.php編集

function enqueue_scripts() {
	wp_deregister_script('jquery');
	wp_enqueue_script('jquery-js', '//cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js');
}
add_action('wp_enqueue_scripts', 'enqueue_scripts');

参考

WordPressでjqueryとjquery-migrateの2つの読み込みを解除する方法 | Musible

JS Web制作 WordPress

WordPressで定義リストdlを使う

2カラム・内容に応じてサイズ可変のリストを、スペース連打やテーブルを使わずに作りたい。

dl(定義リスト)のグリッド化で実装。

肉: 食べる
野菜: 食べない

<dl class="grd">
  <dt>肉</dt>
  <dd>食べる</dd>
  <dt>野菜</dt>
  <dd>食べない</dd>
</dl>

dl.grd
	display: grid
	grid-template-columns: max-content 1fr
	column-gap: .5em

シンプルで理想的だが、WordPressで使えるリストブロックはol、ulのみ。
dlを作成出来るプラグインを探す。

CSS Web制作 WordPress

WordPressのHCBに言語を追加

Highlighting Code Blockプラグインに対応言語を追加する。

設定

管理画面の設定 > [HCB] 設定 > ヘルプ(最下部)のリンクにアクセス
追加したい言語にチェック
DOWNLOAD JSでprism.jsをDLし、テーマフォルダ以下にUP
HCB設定の使用する言語セットにクラスキー:”言語名”,形式で行を追加
- クラスキーはprism.jsの2行目で確認
独自prism.jsにパスを記入し、設定を保存

SASS、AutoHotKey、Batchを追加した。
CSSもDL出来るがHCBと競合した為使用せず。

AHK SASS Web制作 WordPress 拡張機能

WordPress覚書

パス取得定数・関数

ABSPATH	WordPressディレクトリのフルパス+`/`
TEMPLATEPATH get_template_directory()	親テーマディレクトリのフルパス
STYLESHEETPATH get_stylesheet_directory()	子テーマディレクトリのフルパス
get_theme_file_path	子テーマ(優先)、無ければ親テーマディレクトリのフルパス
home_url()	サイトのURL
site_url()	WordPressのURL
get_template_directory_uri()	親テーマディレクトリのURL
get_stylesheet_directory_uri()	子テーマディレクトリのURL
get_theme_file_uri()	子テーマ(優先)、無ければ親テーマディレクトリのURL