WordPressのテーマにtheme.jsonを追加したら起きること | エビスコム - EBISUCOM
WordPress のテーマ（クラシックテーマ）に theme.json を追加したら何が起きるのか？ を調べていたところ、DOM の構造や適用される CSS の変化など、思った以上にたくさんの影響が起きていました。 影響（全 28 項目 ＋ すべてのテーマに影響する 1 項目）と、その影響が起きる条件（トリガーとなるもの）は一覧表にしてこの記事の最後に掲載しました。 これだけあると、影響を受けないテーマを探す方が大変です。 そのため、個々の影響の詳細や対策方法については、実例と合わせて『WordPress ノート クラシックテーマにおける theme.json の影響と対策 2023』にしっかりとまとめましたので、参考にしてください。 何が起きるかを調べようと思ったきっかけ 現在の WordPress ではブロックテーマがスタンダードとなり、theme.json で機能の有効化やレイアウ
WordPressテーマにtheme.jsonを入れるとsupportsLayoutがtrueになってしまう問題について
theme.jsonを入れるとインナーブロックで全幅、幅広が選択出来ないことをなんとかしろと言われたことがあったのでtheme.jsonについていろいろ調べました。 それについてメモです。 結論 以下のようにするとtheme.jsonを使用しているテーマでもインナーブロックで全幅、幅広が設定できた。 add_filter( 'block_editor_settings_all', __NAMESPACE__ . '\block_editor_settings_all' ); function block_editor_settings_all( $editor_settings ) { $editor_settings['supportsLayout'] = false; return $editor_settings; } コアのコード theme.jsonがあるかどうか判断している関数
WordPress：タイトルを自在にカスタマイズする方法 - コムテブログ
TL;DR WordPress4.4 以降において title タグを自動出力するには、非推奨の wp_title()関数の代わりに、テーマの機能を設定する関数add_theme_support( 'title-tag' );を functions.php に記述します。functions.php の中に書くことで保守性もよくなります。 WordPress4.4 以降の title の記述方法 functions.php function mytheme_set() { add_theme_support( 'title-tag' ); } add_action( 'after_setup_theme', 'mytheme_set' ); after_setup_themeは全てのテーマが読み込まれた後にテーマの機能を設定するフックです。タイトルが重複するので header.php には
【WordPress 入門】 WordPress のテーマ制作で欠かせない関数をまとめてみた
タグ関連 get_the_tags アーカイブページ・投稿ページで投稿につけられたタグ情報を配列として取得します。主にループ内で使用します。 /** * @param int $id 投稿ID */ (array|false|WP_Error) get_the_tags( int $id = 0 ) https://developer.wordpress.org/reference/functions/get_the_tags/ 使用例 <?php if ( get_the_tags() ) { ?> <div class="tags"> <i class="fas fa-tag"></i> <?php the_tags( '', ',', '' ); ?> </div> <?php } the_tags アーカイブページ・投稿ページで投稿につけられたタグが出力されます。主にループ内で使用
超爆速WordPressテーマ「Godios.」ってのを見つけた。マジ速い。 - 攻めは飛車角銀桂守りは金銀三枚
ちょっと最近暇になってきたので、作ろうと思って放置してたサイトを再検討してました。 これまで基本、WordPressのサイトは「AFFINGER」か「SANGO」って有料テーマを使ってます。 無料なのに爆速超爆速WordPressテーマ「Godios.」 そのサイトも「SNAGO」使って作ろうとセットアップしていたのですが、ちょっと気になるテーマを発見。 それが「Godios.」です。 見た目はデフォルトではシンプル。 カスタマイズはまだやってないので、難易度がわかってないのですが、とにかく描画速度が速い。 体感的には本当に「一瞬」で表示される感覚。 （サーバの能力や、回線の状況にもよるでしょうけど。） でも間違いなく「AFFINGER」か「SANGO」より体感は早い。 速いと話題の「Luxeritas」より速いかも。 SEOなどの実力の程はまだ2018年4月5日にリリースされたばかりなの
_sとFoundationを使ってWordPressのテーマを作ってみよう - Hatsuka
ブログのリニューアルをするすると言って早1年…。 今年こそは…！ということで、お正月からちょっとずつリニューアル準備をしています。 テーマを作成するにあたって、_sとFoundationを使っているので、その備忘録もかねてブログにも書いていこうと思います。 WordPressのテーマ作成について WordPressのテーマを作るにアプローチの方法が3つあります。 1. スクラッチ 自分で一からPHP・CSSを書いていく方法 自由度は高いけど、その分PHPの知識が必要 2. 子テーマ すでにあるテーマを使って、編集していく方法 親テーマに依存されるというデメリットはありつつも、既存のものをベースとして使うので制作時間は短縮できる 3. スターターテーマ(_s) 最低限のPHPが実装されているテーマをベースに、編集していく方法 スクラッチと子テーマは前に制作したことがあるのですが、_sでは作っ
WordPressテーマのCSSとJSをfunctions.phpで読み込む方法
WordPressテーマでは、CSSやJSなどの外部ファイルをfunctions.phpで読み込むことが推奨されています。外部ファイルの読み込みにはwp_enqueue_style関数、wp_enqueue_script関数を呼び出すアクションフックを作成します。 wp_head関数でCSSとJSを読み込むサンプルソース 下記のようにfunctions.phpに追記します。 functions.php /* CSSの読み込み ---------------------------------------------------------- */ function register_stylesheet() { //読み込むCSSを登録する wp_register_style('reset', get_template_directory_uri().'/css/reset.css');
WordPressのテーマ開発を初めて行う人に向けての制作フロー ｜https://wp.yat-net.com/name
WordPressでオリジナルのテーマを作成する際のフローをまとめました。サンプルも配布してるので、是非使ってみてください、 テーマ開発をやったことがない、それほどやってないという人でもなるべく分かるように書いていますので、手順通りにやっていただければ、テーマ開発をどうすれば良いのか？をわかってもらえると思います。 尚、執筆時点でのWordPressのバージョンは 4.8.2 です。 この記事を書くに当たり WordPress Codex日本語版と、WebDesign Recipes はじめてWordPressのオリジナルテーマを作るときの参考になればと思って書きました を参考にさせていただきました。 目次 テーマのデザインをパーツに パーツの種類 コーディング WordPressの環境構築 必要なファイル テンプレートの種類 トップページのテンプレート化 header.php の編集 i
無料でシンプルでオシャレ！Wordpressのブログ向けテンプレート10選
今回はブログ向けを中心に、レスポンシブウェブデザインで構築されたWordpressのテンプレートをご紹介します。 ブログ向けとはいえ記事を通じて情報を発信することはオウンドメディアや、サテライトサイトにも共通するため応用することもできます。 これから、新たにブログを作ろうと思っている方やテンプレートを変えたいとお考えの方はぜひ参考にしてみてください。 Wordpressのブログ向け無料テンプレート10選 1.アドラー https://pixelgrade.com/demos/adler/ 大きなバックグラウンド画像が印象的なWordpressのテンプレートです。 レスポンシブウェブデザインで構築されており、パソコン、タブレット、スマートフォンいずれも対応しています。 大きな画像を紹介するのに適しており、ファーストビューでインパクトのあるデザインにしたい時や写真を中心としたコンテンツに向いた
Tumblr（タンブラー）の高クオリティすぎて一目置かれるテンプレート32選
簡単にブログやWebマガジンが作れる「Tumblr」が最近人気を集めています。 Tumblrの特徴といえば、オシャレでデザイン性の高いテンプレートが豊富に揃っていることです。 クリエイターのポートフォリオに最適なものからブログにぴったりのものまで幅広いデザイン・レイアウトのものを選択することができます。 今回はTumblrの数あるテンプレートの中から、オススメのテンプレートを48個まとめてご紹介します。ご自身にぴったりのものを探してみてください。 Tumblrオススメのテンプレート32まとめ 1.Zen https://www.tumblr.com/theme/39508 画像、テキストを大きめに表示し見やすくレイアウトしてくれるテンプレートです。 ソーシャルボタンも用意されています。 2.Minimalism https://www.tumblr.com/theme/39633 画像収集
今までありがとうStinger3! WordPressのテーマをSEOに強い「Simplicity」に変更しました！(おまけあり）
当ブログで1年ほど使っていた無料のwordpressテーマ「Stinger3」から、これまた無料な「Simplicity」に変更してみました。変更理由や決め手を紹介してみます。 人一倍思い入れがあるStinger2 Stinger2との出会いも突然だった。 Twitterで流れた紹介記事を見かけて早速導入したが、一ヶ月でPVが3倍になるわ収益も上がるわで本当に驚いた。記事更新数も増やしてないのにテーマ変えた日からすぐに効果が出たんだもん。 全てテーマを変えただけが原因かというのは短絡すぎるけど、その効果を記事に紹介したところ大反響があった。当ブログ最大のヒット記事になったキッカケはまさしくStingeでした。 関連→とあるwordpressのテーマに変更して一ヶ月でPVが3倍になった件 思い出も思い入れも多い大好きなテーマですが、ほとんど更新しなくなったこのブログの再開のキッカケになれば
無料で使えるWordPressテーマ「Simplicity」が良い。
このブログはWordpressを使っているのですが、その中でSimplicityというテーマを使用しています。 ブログを開始するにあたって、自分で作ろうか有名どころのテーマをカスタマイズしようかどうしようかと迷っていたところ、調度良いタイミングで、フォロワーのわいひら(@MrYhira)さんという方がテーマを公開されていたので、「これはなかなかよさそう」だと思い、 ちなみに、わいひら(@MrYhira)さんは、頸髄損傷でほぼ寝たきりの生活をしつつ、寝ログというライフハック系ブログを運営されたり、テーマを公開したり、フリーソフトを公開していたりと、パワフルな方です。 ここからはSimplicityを簡単に紹介します。 Simplicityには主に、以下の7つの特徴があります。 シンプル 内部SEOの最適化 拡散のための仕掛けが施されている 端末に合わせた4つのレスポンシブスタイル 手軽に収益
Stinger3カスタマイズ！あると嬉しいclass,id構造早見表 -トップページ編-
Stingerのカスタマイズ楽しまれてますか？ テーマをカスタムしていくとき、まず変えたい部分のclassとidを調べると思います。 慣れてきた今でこそ「Developer Tools」からすんなり目的のものを見つけられますが、はじめの頃は大変でした。 また入れ子の階層構造がうまくつかめていないと思ったとおりに変更できなかったりしますよね。 今回はStingerのid,class構造がひと目で分かる早わかり画像を作ったのでご紹介します。 今回はトップページ編です。 【関連】Stingerカスタマイズ！あると嬉しいclass,id構造早見表2 -記事ページ編- 注意:id,classの範囲はわかりやすさのためデフォルメしている場合もあるのでご留意ください。画像が小さくて見えないときはクリックで拡大します。 ざっつりとしたファイル構造 まずざっくりとどの部分がどのファイルで管理されているのか説
40+ Best Free Bootstrap Templates & Themes
Bootstrap is the most popular CSS framework ever. It is currently used on over 20.4% of all sites on the web, and despite the rapid rise in popularity of front-end JavaScript frameworks, it continues to grow. And with each new version (currently v5), it gets better and better. Built on a mobile-first grid system, bundled with an endless list of components, utilities and helpers, and the fact that
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Pinegrow Theme Converter for WordPress
Check out these cool WP Themes to create websites with
VS Code Themes
100%GPL の有料テーマ販売をビジネスとして成立させるための挑戦
JIN（ジン）｜真の使いやすさを追求したWordPressテーマ
The Ultimate Guide to Web Accessibility & WordPress - WPMU DEV