AIにコードを書かせるとき、テーマの中身を知らないまま進むと的外れな答えが返ってきます。
「SWELLのふきだしを出して」と頼んでも、ブロックの名前が loos/balloon だと知らなければ書けません。
そこで SWELL 2.19.0 を解析して、外から呼べるものを全部一覧にしました。
この記事をそのままAIに渡せば、テーマの輪郭を把握させられます。
| 種類 | 数 |
|---|---|
| ブロック | 32種 |
| ショートコード | 21種 |
| アクションフック | 4種 |
| フィルターフック | 76種 |
| テーマ設定 | 538項目(43群) |
| 記事ごとの設定 | 32種 |
| CSS変数 | 58種 |
| テンプレート部品 | 54個 |
数え方は記事の最後に書いています。
テーマのソースコードは載せていません。ここに並べたのは、外から呼ぶための名前だけです。
ブロック(32種)
SWELLが追加するブロックです。
接頭辞はすべて loos/ です。本文のHTMLでは <!-- wp:loos/balloon --> の形で入ります。
| ブロック名 | 表示名 | 属性の数 |
|---|---|---|
loos/ab-test | ABテスト | 3 |
loos/accordion | アコーディオン | 3 |
loos/ad-tag | 広告タグ | 2 |
loos/balloon | ふきだし | 12 |
loos/banner-link | バナーリンク | 20 |
loos/blog-parts | ブログパーツ | 3 |
loos/box-menu | ボックスメニュー | 10 |
loos/button | SWELLボタン | 16 |
loos/cap-block | キャプションボックス | 5 |
loos/columns | リッチカラム | 7 |
loos/dl | 説明リスト(DL) | 1 |
loos/faq | FAQ | 5 |
loos/full-wide | フルワイド | 18 |
loos/link-list | リンクリスト | 9 |
loos/post-link | 関連記事 | 17 |
loos/post-list | 投稿リスト | 34 |
loos/restricted-area | 制限エリア | 11 |
loos/review | 商品レビュー | 13 |
loos/rss | RSS | 14 |
loos/step | ステップ | 6 |
loos/tab | タブ | 8 |
親の中でしか使えないもの
次のブロックは、単体では置けません。
| ブロック名 | 表示名 | 親 |
|---|---|---|
loos/ab-test-a | Aブロック | loos/ab-test |
loos/ab-test-b | Bブロック | loos/ab-test |
loos/accordion-item | 項目 | loos/accordion |
loos/box-menu-item | リンクボックス | loos/box-menu |
loos/column | カラム項目 | loos/columns |
loos/dd | 項目の説明(DD) | loos/dl |
loos/dt | 項目のタイトル(DT) | loos/dl |
loos/faq-item | 項目 | loos/faq |
loos/link-list-item | リンクリスト項目 | loos/link-list |
loos/step-item | ステップ項目 | loos/step |
loos/tab-body | タブコンテンツ | loos/tab |
AIにブロックを書かせるときは、親子の関係を先に伝えないと入れ子が壊れます。
ショートコード(21種)
日本語名と英語名の両方が登録されているものがあります。
どちらで書いても同じ動きです。
| ショートコード | 日本語名 |
|---|---|
[ad] | — |
[ad_tag] | — |
[blog_parts] | [ブログパーツ] |
[custom_banner] | [カスタムバナー] |
[full_wide_content] | — |
[html] | — |
[icon] | [アイコン] |
[only_login] | — |
[only_logout] | — |
[pcbr] | — |
[post_link] | — |
[post_list] | — |
[pr_notation] | — |
[review_stars] | — |
[spbr] | — |
[speech_balloon] | [ふきだし] |
[swell_toc] | — |
フック
テーマの動きを外から変える口です。
子テーマの functions.php かコードスニペットに書きます。
アクション(4種)
アクションは4つしかありません。出力を差し込める場所は限られています。
| フック名 | 場所 |
|---|---|
swell_after_copyright | parts/footer/footer_contents.php |
swell_before_post_head | single.php |
swell_before_post_thumb | single.php |
swell_inner_main_visual | parts/top/main_visual.php |
フィルター(76種)
値を書き換える口です。用途ごとに分けて並べます。
構造化データ(JSON-LD)(7種)
swell_json_ldswell_json_ld__articleswell_json_ld__authorswell_json_ld__collectionpageswell_json_ld__organizationswell_json_ld__webpageswell_json_ld__website
表示する・しないの判定(8種)
swell_is_separate_cssswell_is_show_commentsswell_is_show_indexswell_is_show_page_linksswell_is_show_pickup_bannerswell_is_show_sidebarswell_is_show_toc_adswell_is_show_ttltop
部品の差し替え(7種)
swell_parts_catchphraseswell_parts_head_logoswell_parts_page_titleswell_parts_post_thumbnailswell_parts_scroll_arrowswell_parts_term_titleswell_parts_toc_ad
投稿リスト・関連記事(11種)
swell_is_show_pickup_bannerswell_pickup_post_argsswell_post_list_404_textswell_post_list_cat_dataswell_post_list_type_on_archiveswell_post_list_type_on_authorswell_post_list_type_on_searchswell_post_list_type_on_termswell_related_post_404_textswell_related_post_argsswell_related_post_maxnum
取得するデータ(8種)
swell_get_archive_dataswell_get_search_terms_statusswell_get_search_titleswell_get_sns_cta_dataswell_get_svgswell_get_tax_of_post_typeswell_get_the_term_linksswell_get_the_terms_data
遅延読み込み(7種)
swell_delay_js_listswell_delay_js_prevent_pagesswell_mv_single_lazy_offswell_post_slider_lazy_offswell_post_thumbnail_lazy_offswell_term_thumbnail_lazy_offswell_top_area_lazy_off
タグの属性(6種)
swell_body_attrsswell_content_attrsswell_frame_classswell_lp_content_attrsswell_post_content_classswell_root_attrs
その他(23種)
swell_blocks_rss_cache_timeswell_breadcrumb_list_dataswell_code_meta_screensswell_custom_format_setsswell_custom_formatsswell_do_blog_partsswell_head_logoswell_head_logo_sizesswell_head_logo_topswell_hide_fse_blocksswell_infobar_dataswell_pager_rangeswell_posts_404_textswell_remove_url_to_cardswell_searchform_placeholderswell_show_term_navigationswell_side_meta_screensswell_sns_cta_messageswell_table_scroll_hintswell_term_meta_screensswell_toc_targetswell_twitter_to_xswell_update_json_name
使い方は普通のWordPressのフィルターと同じです。
// 目次を出すかどうかを、記事ごとに決める
add_filter( 'swell_is_show_index', function ( $show ) {
if ( is_page() ) { return false; } // 固定ページでは出さない
return $show;
} );
// パンくずの中身を書き換える
add_filter( 'swell_breadcrumb_list_data', function ( $list ) {
return $list;
} );テーマ設定(538項目)
管理画面のスイッチの実体です。
43つの群に分かれています。
| 群 | 項目数 |
|---|---|
| 投稿ページ設定 | 76 |
| 各スライド | 65 |
| ヘッダー設定 | 40 |
| デザイン・レイアウト設定 | 30 |
| 記事スライダー設定 | 25 |
| footer | 23 |
| 投稿リスト | 22 |
| カラー設定 | 21 |
| SWELL機能の停止 | 19 |
| カスタムセット | 14 |
| 動画 | 14 |
| SNS | 13 |
| CORE機能の停止 | 12 |
| アイコンボックスカラー | 12 |
| ボタン | 11 |
| メインビジュアル設定 | 11 |
| ふきだしカラーセット | 10 |
| スライダー設定 | 9 |
| カラーパレット | 8 |
| タブ切り替え | 8 |
読むときは SWELL_Theme::get_setting( 'キー名' ) を使います。
$setting = SWELL_Theme::get_setting(); // 全部まとめて
$show = SWELL_Theme::get_setting( 'show_toc' ); // 1つだけ停止できる機能が31あります。WordPress本体の出力を止めるものが12、SWELLの機能を止めるものが19です。
速度を詰めるときは、まずここを見ます。
記事ごとの設定(32種)
投稿ごとに持つ設定です。
REST APIには出ていません。外から書き換えるには register_post_meta で公開する必要があります。
| メタキー | 中身 |
|---|---|
swell_meta_css | その記事だけのCSS |
swell_meta_js | その記事だけのJS |
swell_meta_show_index | 目次を出すか |
swell_meta_show_related | 関連記事を出すか |
swell_meta_hide_sharebtn | シェアボタンを隠すか |
swell_meta_hide_autoad | 自動広告を止めるか |
swell_btn_cv_data | ボタンのクリック計測 |
lp_use_swell_header | LPでヘッダーを使うか |
全部で次のとおりです。
lp_body_stylelp_content_widthlp_thumb_poslp_title_poslp_use_swell_footerlp_use_swell_headerlp_use_swell_styleswell_btn_cv_dataswell_meta_cssswell_meta_css_planeswell_meta_hide_autoadswell_meta_hide_before_indexswell_meta_hide_sharebtnswell_meta_hide_widget_ctaswell_meta_jsswell_meta_js_planeswell_meta_no_mbswell_meta_related_postsswell_meta_show_authorswell_meta_show_commentsswell_meta_show_indexswell_meta_show_pickbnrswell_meta_show_pr_notationswell_meta_show_relatedswell_meta_show_sidebarswell_meta_show_thumbswell_meta_subttlswell_meta_thumb_captionswell_meta_toc_targetswell_meta_ttl_posswell_meta_ttlbgswell_meta_youtube
CSS変数(58種)
余白や幅を外から上書きするときの鍵です。
接頭辞は --swl- です。
| 変数 | 使われている回数 |
|---|---|
--swl-minwidth-cell | 24 |
--swl-fw_inner_pad | 18 |
--swl-list-padding--left | 13 |
--swl-mediatext--space | 12 |
--swl-mediatext--gap | 12 |
--swl-mediatext--offsetX | 12 |
--swl-clmn-pddng | 12 |
--swl-faq_icon_radius | 12 |
--swl-pad_container | 10 |
--swl-sidebar_width | 9 |
--swl-sidebar_margin | 9 |
--swl-list-padding--has_bg | 9 |
--swl-clmn-mrgn--y | 8 |
--swl-dt-width | 8 |
--swl-pad_lp_post | 8 |
--swl-cell1-width | 7 |
--swl-fz--root | 7 |
--swl-fz--side | 7 |
たとえば表のセルの最低幅は、この変数で決まっています。
:root {
--swl-minwidth-cell: 8em; /* 表のセルの最低幅 */
--swl-pad_container: 16px; /* 外側の余白 */
}テンプレート部品(54個)
parts/ の中にあります。
子テーマに同じ場所・同じ名前で置けば、差し替えられます。
| 場所 | 主な部品 |
|---|---|
parts/header/ | fix_header、head_bar、header_contents、info_bar、sp_btns、sp_head_nav、sp_menu |
parts/footer/ | before_footer、fix_btns、fix_menu、foot_widget、footer_contents、modals |
parts/post_list/ | infeed_ad、date、pagination、rss_meta、thumb、loop_by_slider、loop_by_widget、loop_main |
AIに渡すときの書き方
そのまま貼るより、何をしたいかと一緒に渡すほうが精度が上がります。
当方が使っている頼み方です。
前提:WordPressテーマ SWELL 2.19.0
ブロックの接頭辞は loos/ (例:loos/balloon, loos/step, loos/faq)
親子のあるブロック:
loos/step → loos/step-item
loos/faq → loos/faq-item
loos/columns → loos/column
loos/accordion → loos/accordion-item
loos/tab → loos/tab-body
loos/dl → loos/dt, loos/dd
loos/box-menu → loos/box-menu-item
loos/link-list → loos/link-list-item
loos/ab-test → loos/ab-test-a, loos/ab-test-b
設定の読み出し:SWELL_Theme::get_setting( 'キー' )
フィルターの接頭辞:swell_
アクションは4つだけ:swell_after_copyright / swell_before_post_head /
swell_before_post_thumb / swell_inner_main_visual
やりたいこと:(ここに書く)親子の関係を書いておくのが効きます。
これを渡さないと、loos/step の中に段落を直接入れるような壊れたHTMLが返ってきます。
この記事の数え方
配布ファイルを展開して、機械で数えました。
- ブロックは
block.jsonから。srcとbuildに同じものがあるので重複を除いています - フックは
do_actionとapply_filtersの呼び出しから。同梱の更新確認ライブラリぶんは除いています(テーマの機能ではないため) - テーマ設定は
classes/Data/Default_Settings.phpの初期値一覧から - CSS変数は
--swl-で始まるものを数えました
対象は SWELL 2.19.0 です。
バージョンが上がると増減しますので、使うときはお手元のバージョンを確かめてください。
まとめ
SWELLは、ブロックが32種、フックが80種あります。
アクションが4つしかないのが特徴で、出力を差し込むより、フィルターで値を書き換える設計になっています。
AIに書かせるときは、ブロックの親子関係とフィルターの接頭辞を先に渡すと外しません。
テーマの設定そのものについては、SWELL│デザイン設定のまとめもあわせてご覧ください。


