| 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 |
てがろぐ
https://www.nishishi.com/cgi/tegalog/
自鯖にマイクロブログを置けるCGI。何とも懐かしいデザイン(CGI自体が懐かしい)だが2017年作で、更新も精力的になされている。Spotify等の埋め込みにも対応している最新スクリプトである。
CSSとスキン(懐かしい)で自由にデザイン出来るという事で、WordPress製サイトの一部として馴染むように設置を試みた。
skin-cover.htmlにWordPressのヘッダとフッタを読み込ませたい。
ヘッダ内サイドバーには最新記事リスト等があるので自動生成したい。
skin-cover.htmlへのinclude記述はPHP、SSI共に無効。
テキストリンクの下線が英字のディセンダや( )でブツブツ途切れる。
気になるのでCSSで調整。
a {
text-decoration-skip-ink: none;
text-underline-offset: 2px;
text-decoration-color: #999;
}text-decoration-skip-ink: none | 下線を繋げる |
text-underline-offset: _px | 下線の位置を下げる |
text-decoration-color: #___ | 下線の色を変える |
従来はtext-decoration: noneした上でborder-bottomを付けていたが、CSS3で下線を直接スタイリング可能になった。ただし線の太さは指定出来ない。
主張が強すぎるログイン時のadmin bar。
CSSで完全非表示、プラグインでマウスオーバー表示などに出来るが、利便性を求めて「小型化して必要なボタンのみ常時表示」にする。
何故右なのかというと、検索フォームが左に伸びる為。
#wpadminbar {
top: 50%;
left: auto;
right: 0;
transform: translateY(-50%);
width: 40px;
min-width: 40px;
height: auto;
padding: 6px 0;
}
@media screen and (max-width: 782px) {
html #wpadminbar {
display: none;
}
}
#wp-admin-bar-site-name,
#wp-admin-bar-customize,
#wp-admin-bar-new-content,
#wp-admin-bar-edit {
width: 30px;
overflow: hidden;
}
#wpadminbar .quicklinks > ul > li > a {
padding: 0 10px;
}
#wpadminbar .ab-top-menu > li.hover > .ab-item, #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus, #wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item, #wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus {
background: transparent;
}
#wp-admin-bar-wp-logo,
#wp-admin-bar-updates,
#wp-admin-bar-comments,
#wp-admin-bar-my-account {
display: none;
}
#wpadminbar .quicklinks .ab-top-secondary > li {
padding: 0 3px;
}画面幅782px以下は非表示。
function.phpに以下を追加。
上部に32px確保されるのを阻止する。
function remove_adminbarsp()
{
remove_action('wp_head', '_admin_bar_bump_cb');
}
add_action('get_header', 'remove_adminbarsp');
IDEによくあるミニマップ。近年どんどん細く掴みにくくされるスクロールバーの代わりになり大変便利。
Vivaldiのページアクション機能でWebページにも適用出来て感動し、検索するとスクリプトが配布されていたのでWordPressに設置してみた。
配布元: pagemap · mini map for web pages · larsjung.de
設置は簡単で、JSを読み込み、<canvas>タグとスクリプトを一行追加し、CSSで調整。同梱のdemoからコピーできる。
WordPressテーマの「Sass編集・コンパイル・プレビュー・アップロード」を全てVSCodeで完結する。サーバはVALUE/CORE SERVER。
(特にWordPress限定ではない。)
大体標準で対応。SASS記法のシンタックスハイライトは拡張機能Sassを入れる。
拡張機能Live Sass Compilerを入れる。ステータスバーWatch Sassで監視開始。.sass/.scss保存時に.cssが自動生成される。