WordPress Font Awesomeを高速導入する手順

サイトの表示が遅くてアイコンが崩れると困りますよね。

WordPressでのFont Awesome導入は簡単に見えて、CDNや不要な読み込みがパフォーマンス低下や表示トラブルを招くことが多いです。

この記事では読み込み方法の選び方から最適化、トラブル対応まで、実践的な手順をわかりやすく解説します。

CDN、プラグイン、ローカル化、必要アイコン抽出、サブセット化、遅延読み込みやプリロード設定まで網羅しています。

読み込み高速化と不要な通信削減でCore Web Vitalsの改善も期待できます。

次章で具体手順を順に紹介しますので、まずは自分に合う読み込み方式を確認してください。

ゆき

専業ブロガー兼アフィリエイター。
AIライティングツール「ラクリン」の開発者です。
ブログでご飯を食べるまでのお話を、プロフィールで詳しく書いています。良かったら読んでみてください。

詳しいプロフィール

WordPress Font Awesomeを高速導入する手順と最適化

Googleサーチコンソールのデータを確認しながら作業する男性の手元とノートパソコン

Font AwesomeをWordPressに導入する際は、読み込み方法と最適化を両立させることが重要です。

ここではCDN、プラグイン、ローカル設置の違いと、実際に速度を改善するための具体策をわかりやすく解説します。

CDN読み込み

CDNを使うと初期設定が簡単で、世界中のエッジから配信されるため応答が速くなる利点があります。

ただし外部依存が増えるため、レイテンシや外部サービスの障害に注意が必要です。

簡単な導入例として、公式のCSSをヘッダーに読み込む方法があります。

CDN	特徴
Font Awesome 公式	最新リリースの即時配信
jsDelivr	高速かつ複数のミラー
CDNJS	広く利用される安定配信

CDNを利用する場合はHTTPヘッダーでキャッシュ期間を考慮し、バージョン固定のURLを使用してください。

プラグイン導入

プラグインは手軽さが魅力で、初心者でも安全に導入できます。

以下のようなプラグインを検討すると作業が楽になります。

Font Awesome Official
Better Font Awesome
Asset CleanUp
WP Rocket

プラグイン選定のポイントは、必要アイコンだけ読み込めるか、遅延読み込みに対応しているかです。

ローカルホスト

フォントをサーバーに置くローカル設置は外部依存を減らせるメリットがあります。

ダウンロードしたフォントファイルをテーマや子テーマのフォルダに置き、functions.phpでenqueueする方法が一般的です。

ローカル化する際はCORS設定と適切なキャッシュヘッダーを忘れないでください。

必要アイコン抽出

使わないアイコンまで読み込むとファイルサイズが大きくなり、表示に時間がかかります。

まずはサイト内で実際に使うアイコンを洗い出し、リスト化してください。

Font Awesomeのキット機能やオンラインのサブセットツールを利用すると、必要なグリフだけを抽出できます。

サブセット化

サブセット化は不要なグリフを削除してフォントサイズを小さくする最も効果的な手法です。

公式のKitで自動生成する方法と、Glyphhangerやfonttoolsで手動生成する方法があります。

生成したサブセットはwoff2形式で配信すると、圧縮効率が高く速度改善に直結します。

遅延読み込み

重要でないアイコンはページ表示後に読み込むことで初期表示を高速化できます。

実装方法としてはJavaScriptでDOMContentLoaded後にCSSやフォントを挿入する方法がシンプルです。

またwebfontの場合はfont-displayプロパティを利用し、テキストやアイコンの表示切替をコントロールしてください。

プリロード設定

重要なアイコンフォントはプリロードすることでレンダリングブロックを回避できます。

ローカルのwoff2を使う場合は<link rel=”preload” href=”/fonts/fa-solid-900.woff2″ as=”font” type=”font/woff2″ crossorigin>のように指定します。

CDN配信のフォントをプリロードする場合はサーバー側でAccess-Control-Allow-Originを適切に設定する必要があります。

プリロードは適切に使えばLCPやCLSの改善に寄与しますが、乱用すると初期読み込みが逆に重くなるため注意してください。

読み込み方法の選び方

ガラスのテーブルでノートパソコンを操作しながらウェブ解析データを確認する男性の手元

Font AwesomeをWordPressに導入する場合、読み込み方法でサイトの表示速度や保守性が大きく変わります。

ここではプラグイン、functions.phpでのenqueue、テーマヘッダー直書きの三つを比較し、用途に応じた選び方を解説します。

プラグイン利用

手軽さを重視するならプラグイン導入が最も簡単です。

自動更新やGUIでの設定が使えますので、コードに自信がない方にも向いています。

導入が簡単
自動アップデート対応
アイコン選択機能
最適化オプションあり

ただし、プラグインによっては不要な機能や全アイコンを読み込むため、ページが重くなることがあります。

導入前に読み込まれるリソースやCDN利用の有無を確認してください。

functions.phpでenqueue

一番バランスが良い方法は、functions.phpで必要なスタイルやスクリプトをenqueueすることです。

これにより読み込みの制御やバージョン指定が容易になり、不要な読み込みを減らせます。

手法	特徴
enqueue	管理しやすい
CDN直接	高速配信可能
ローカル配備	安定性高い

具体的にはwp_enqueue_styleでFont AwesomeのURLを指定し、条件分岐で読み込むページを絞ります。

この方法なら子テーマでも安全に運用できますので、本番環境でも安心して使えます。

テーマヘッダー直書き

header.phpに直接linkタグを埋め込む方法は最も単純ですが、推奨はしません。

テーマのアップデートで上書きされる危険があり、管理が煩雑になりがちです。

ただし、テストや一時的な確認用としては有用で、素早く動作確認したい場合に向いています。

本番導入するなら子テーマを使うか、enqueueに移行することをおすすめします。

パフォーマンス改善の具体手順

インテリアデザインのウェブサイトが表示されたノートパソコンがカフェのテーブルに置かれている様子

Font Awesomeを導入したあと、アイコン読み込みがボトルネックになることが多いです。

ここでは具体的な手順を順に説明し、実運用での高速化を目指します。

必要アイコンのみ抽出

最初に行うべきは、実際に使っているアイコンだけを特定することです。

不要なグリフを省くことで読み込むフォントのサイズを劇的に減らせます。

方法は自動と手動の両方があり、目的やサイト規模で選んでいただけます。

ブラウザ検査で使用箇所を確認
Font Awesome Kitで選択
IcoMoonでカスタムセット作成
SVGスプライト化

Webフォントのサブセット化

抽出したアイコンだけを含むサブセットフォントを作成します。

woff2形式で出力すると、サイズと互換性のバランスが良好です。

ツールは複数あり、pyftsubsetやGlyphhangerでUnicode範囲を指定できます。

手順としてはSVGまたはGlyphリストを用意して、サブセット化→woff2変換という流れになります。

フォントのプリロード

重要なアイコンフォントはheadでプリロードすると初期表示が安定します。

rel=”preload”とas=”font”に加え、crossorigin属性を忘れず指定してください。

また、CDNから読み込む場合はpreconnectで接続準備をしておくと効果が高いです。

遅延読み込みの実装

すべてのページでアイコンが必要とは限らないため、遅延読み込みを検討します。

font-display:swapをCSSで指定するとテキスト表示が遅延しにくくなります。

画面外要素に使うアイコンはIntersectionObserverで必要時に読み込む実装が有効です。

また、非同期でCSSを読み込むLoadCSSのような手法と組み合わせると高速化効果が増します。

CDNキャッシュ設定

CDN側で適切なキャッシュ設定を行うことは高速化に直結します。

Cache-Controlや長期キャッシュ、ファイル名にハッシュを入れる運用をおすすめします。

設定項目	推奨値
Cache-Control	max-age=31536000
Expires	1 year
Vary	Accept-Encoding
ファイル命名	ハッシュ付き

また、CDNのエッジキャッシュとオリジンサーバーのTTLを整合させるとキャッシュミスが減ります。

公開後はキャッシュの挙動をログやブラウザ開発ツールで確認して、必要に応じて調整してください。

表示トラブル別の対処法

Font Awesomeを導入した際に発生しやすい表示トラブルを分類して、原因と対処を丁寧に解説します。

各項目には検証手順と具体的な修正方法を載せますので、順に確認していただければ問題の所在が明確になります。

アイコンが□になる

いわゆる「豆腐文字」になる場合は、フォントファイルが読み込まれていないか、フォントのマッピングがずれていることが多いです。

まずはネットワークタブでfontファイルのステータスを確認してください。403や404が出ていれば読み込み経路に問題があります。

原因	対処
フォント未読み込み	読み込みを追加
ファイルブロック	CORS設定修正
バージョン差異	クラス名を揃える

テーブルで挙げた項目を順に潰していくと、原因が短時間で特定できます。

特にCORSはサーバー側のレスポンスヘッダー調整が必要になりますので、ホスティング管理画面や.htaccessを確認してください。

CSS競合

テーマやプラグインのCSSとFont Awesomeのスタイルが競合すると、アイコンサイズや表示位置が崩れることがあります。

まずはブラウザの要素検査で該当アイコンに適用されているスタイルを確認してください。

競合箇所が判明したら、より具体性の高いセレクタで上書きする、またはFont Awesome側のCSSを先に読み込むなどで解決できます。

場合によっては!importantを一時的に使って挙動を確認し、その後に適切なセレクタ整理で落ち着かせると安全です。

プロトコル混在

httpとhttpsが混在しているとブラウザが外部リソースをブロックし、アイコンが読み込まれないことがあります。

外部CDNを利用している場合は、httpsで読み込むかプロトコル相対URLを使うようにしてください。

WordPressではwp_enqueue_styleでget_stylesheet_directory_uriやplugins_urlを使えば、正しいスキームで読み込めます。

サイト全体をhttpsに移行している場合は、ソース内のハードコードされたhttpをすべて見直すことが重要です。

キャッシュ誤動作

キャッシュが古い状態だと修正を反映できず、原因追跡が難しくなります。

次の手順を順に実行してキャッシュ問題を排除してください。

ブラウザキャッシュの強制更新
WordPressキャッシュプラグインのクリア
CDNのキャッシュ無効化
サーバーキャッシュの再起動
オブジェクトキャッシュのフラッシュ

これらを行っても反映されない場合は、キャッシュの階層をもう一度洗い出し、どの層が原因かを切り分けると効果的です。

バージョン不整合

Font Awesomeはメジャーバージョンごとにクラス体系やアイコン名が変わるため、古いクラス名を使っていると表示できません。

テーマやプラグインが読み込んでいるバージョンと、実際に参照しているドキュメントを照合してください。

互換性シムが用意されている場合は一時的に導入して動作確認を行い、その後でクラス名を新仕様へ置換すると安全です。

最終的には使用中のすべてのテンプレートとウィジェットを最新のアイコン名に合わせ、不要な古い読み込みを削除してください。

カスタマイズの実践テクニック

この章ではWordPressでFont Awesomeを扱う際に、見た目と使い勝手を高める具体的なテクニックを紹介します。

サイズ、色、アニメーション、疑似要素での挿入、そしてSVGへの置換まで、実務で使える工夫を解説します。

サイズ調整

アイコンのサイズ調整は視認性とデザイン整合性に直結します。

基本はfont-sizeでサイズを指定する方法です、レスポンシブ対応も考えてemやremを使うことをおすすめします。

Font Awesomeにはfa-xsやfa-lgなどのユーティリティクラスが用意されており、手早く統一感を出せます。

クラス	推奨サイズ
fa-xs	0.75em
fa-sm	0.875em
fa-lg	1.33em
fa-2x	2em

細かい微調整は個別のCSSクラスで行うと柔軟性が高まります。

行間やラインハイトとの兼ね合いにも気を配ってください。

色変更

色はCSSのcolorプロパティで簡単に変更できますが、用途に応じて使い分けると良いです。

currentColorを使えば親要素の文字色を継承させられるため、テーマ色に自動的に馴染ませられます。

ホバーやフォーカスで色を変えるときはアクセシビリティを意識し、コントラスト比を確保してください。

状態変化時の色はトランジションを付けることで滑らかに見せられます、ただし過度な演出は避けてください。

アニメーション

アニメーションを加えるとアイコンに動きを与え、ユーザーの注意を誘導できます。

軽いアニメーションはUIを活性化しますが、頻繁に動くと逆に煩わしく感じさせることがあります。

回転
フェードイン
スケール
色変化
バウンス

CSSのみで実装する場合はtransformとopacityを中心に使うとパフォーマンスが安定します。

ユーザーの設定でアニメーションを控える場合があるため、prefers-reduced-motionに配慮してください。

疑似要素での利用

疑似要素を使うとHTMLを汚さずに見た目だけでアイコンを追加できます。

::beforeや::afterでcontentにFont AwesomeのUnicodeを指定し、font-familyをFont Awesomeにする使い方が一般的です。

ただし、バージョンによってUnicodeが変わることがあるため、公式のコードを確認しながら実装してください。

スクリーンリーダー向けにはaria-hiddenやroleを適切に設定し、読み上げ上の混乱を避けることをおすすめします。

SVGへの置換

フォントアイコンからSVGへ置換すると、拡大縮小時のシャープさや詳細なスタイリングが得られます。

Font AwesomeのSVG版を使う方法や、必要なアイコンだけをダウンロードしてインラインSVGにする方法があります。

SVGではfillやstrokeを使って細かく色や線幅を制御できるため、アニメーション表現も豊富になります。

ただし、SVGを多数配置するとリクエスト数やファイル管理が増えるため、スプライト化やSVGスプライトの導入で最適化してください。

アクセシビリティ対策としてroleやaria-hidden、必要に応じてを付与することを忘れないでください。</p> <h2><span id="toc31">本番導入の最終確認項目</span></h2> <img src="https://affiben.com/wp-content/uploads/pc-img21.jpg" alt="Acerのノートパソコンで画像ギャラリーを表示しカフェ風のデスクにカップとノートが置かれている様子" class="aligncenter size-full" /> <p>本番導入前に確認すべき項目を簡潔にまとめます。</p> <p>ここで挙げるチェックリストを順に確認すれば、表示崩れやパフォーマンス問題を未然に防げます。</p> <p>実際の運用環境で動作確認を忘れないでください。</p> <ul> <li>Font Awesomeのバージョン整合性（CDNとローカルを一致）</li> <li>使用アイコンの最小化（必要なアイコンだけ）</li> <li>Webフォントのサブセット化とサイズ確認</li> <li>プリロード設定の有無と優先度</li> <li>遅延読み込みの挙動チェック（ファーストビュー含む）</li> <li>ブラウザとHTTPSでのプロトコル整合</li> <li>キャッシュ設定とCDN TTLの確認</li> <li>テーマ・プラグインとのCSS競合確認</li> <li>フォールバック（SVGまたは画像）準備</li> <li>ロールバック手順と公開前のバックアップ</li> </ul> </div> <footer class="article-footer entry-footer"> <div class="entry-categories-tags ctdt-one-row"> <div class="entry-categories"><a class="cat-link cat-link-12" href="https://affiben.com/category/wordpress/"><span class="fas fa-folder cat-icon tax-icon" aria-hidden="true"></span>WordPress</a></div> </div> <div class="footer-meta"> <div class="author-info"> <span class="fas fa-pencil-alt" aria-hidden="true"></span> <a href="https://affiben.com" class="author-link"> <span class="post-author vcard author" itemprop="editor author creator copyrightHolder" itemscope itemtype="https://schema.org/Person"> <meta itemprop="url" content="https://affiben.com"> <span class="author-name fn" itemprop="name">ゆきブログ</span> </span> </a> </div> </div> </footer> </article> <div class="under-entry-content"> <aside id="related-entries" class="related-entries rect-entry-card"> <h2 class="related-entry-heading"> <span class="related-entry-main-heading main-caption"> 関連記事 </span> </h2> <div class="related-list"> <a href="https://affiben.com/wordpress-unable-to-insert-line-breaks/" class="related-entry-card-wrap a-wrap border-element cf" title="WordPressで改行できないときの原因と解決策｜初心者でも今すぐできるエディタ別・トラブル解消マニュアル"> <article class="post-4948 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img8-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img8-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img8-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img8-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img8-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WordPressで改行できないときの原因と解決策｜初心者でも今すぐできるエディタ別・トラブル解消マニュアル </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> WordPressで改行できない悩みを抱える方必見。ビジュアルエディタやテーマ、プラグインの影響による原因とそれぞれの対処法を詳しく解説し、PCやスマホでの表示差にも対応した実用的な解決策を紹介します。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.10.15</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> <a href="https://affiben.com/wordpress-line-spacing/" class="related-entry-card-wrap a-wrap border-element cf" title="WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード"> <article class="post-1624 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img6-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img6-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img6-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img6-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img6-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> WordPressで行間を詰める方法を知りたい方へ、エディタやCSS、テーマ設定、プラグインを使った具体的な調整方法から、トラブル対処や見やすいテキストデザインのコツまで丁寧に解説。スマホ表示や可読性にも配慮したポイントも紹介します。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.23</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> <a href="https://affiben.com/wordpress-character-count/" class="related-entry-card-wrap a-wrap border-element cf" title="WordPressの文字数をカウントする7つの方法｜プラグイン対応も可能！"> <article class="post-1477 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img31-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img31-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img31-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img31-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img31-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WordPressの文字数をカウントする7つの方法｜プラグイン対応も可能！ </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> WordPressでの文字数カウント方法を詳しく解説。ブロックエディターやクラシックエディター、プラグインやWebサービス、functions.phpによるカスタマイズから、SEO対策やライター管理に役立つ実践的な使い方まで幅広く紹介します。カウントに関するトラブルや日本語特有の注意点もカバーし、記事制作の質向上をサポート。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> <a href="https://affiben.com/blog-ranking-wordpress/" class="related-entry-card-wrap a-wrap border-element cf" title="ブログランキングをWordPressで作る方法｜人気記事表示やアクセスアップのコツを徹底解説"> <article class="post-3408 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img14-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img14-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img14-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img14-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img14-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> ブログランキングをWordPressで作る方法｜人気記事表示やアクセスアップのコツを徹底解説 </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> ブログのランキングをWordPressで手軽に実現する方法から、おすすめのプラグインやテーマ選び、人気ブログランキングサービスへの登録手順までを詳しく解説。ランキング機能の設置による集客アップのコツやトラブル対策も、初心者から上級者までしっかりサポートします。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.08.21</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> <a href="https://affiben.com/wordpress-diary/" class="related-entry-card-wrap a-wrap border-element cf" title="WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン"> <article class="post-5213 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img37-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img37-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img37-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img37-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img37-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> WordPress日記を短期間で軌道に乗せるための実践ガイド。目的・ターゲット設定からドメイン・テーマ選び、投稿テンプレ、画像最適化、モバイル対策、内部SEO、収益化手法、運用効率化プラグイン、初動30日の優先タスクまで、今すぐ使えるチェックリスト付で具体的な手順を示します。初心者も続けやすい運用ルールやタイトル例、見出しテンプレも収録。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> <a href="https://affiben.com/embed-wordpress-source-code/" class="related-entry-card-wrap a-wrap border-element cf" title="WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装"> <article class="post-5211 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <img width="160" height="90" src="https://affiben.com/wp-content/uploads/pc-img1-160x90.jpg" class="related-entry-card-thumb-image card-thumb-image wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img1-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img1-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img1-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img1-376x212.jpg 376w" sizes="(max-width: 160px) 100vw, 160px" /> <span class="cat-label cat-label-12">WordPress</span> </figure> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装 </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> WordPressにソースコードを埋め込む方法を、GutenbergコードブロックやClassicエディタでの貼り付け、pre・codeのエスケープ、プラグイン（PrismJS、SyntaxHighlighter等）やプラグイン不要の実装、GitHub GistやCodePenの活用例、行番号・ハイライト・コピー機能、XSS対策やCSP、プレビュー確認や負荷対策、読みやすい表示のためのカスタムCSSも含めて実践的に解説。 </div> <div class="related-entry-card-meta card-meta e-card-meta"> <div class="related-entry-card-info e-card-info"> <span class="post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.24</span></span> </div> <div class="related-entry-card-categorys e-card-categorys"><span class="entry-category cat-label-12">WordPress</span></div> </div> </div> </article> </a> </div> </aside> </div> </main> <div id="sidebar" class="sidebar nwa cf" role="complementary"> <aside id="search-2" class="widget widget-sidebar widget-sidebar-standard widget_search"><form class="search-box input-box" method="get" action="https://affiben.com/"> <input type="text" placeholder="サイト内を検索" name="s" class="search-edit" aria-label="input" value=""> <button type="submit" class="search-submit" aria-label="button"><span class="fas fa-search" aria-hidden="true"></span></button> </form> </aside><aside id="author_box-3" class="widget widget-sidebar widget-sidebar-standard widget_author_box"><h3 class="widget-sidebar-title widget-title"><i class="fas fa-marker icon-img-blue"></i>プロフィール</h3> <div class="author-box border-element no-icon cf"> <figure class="author-thumb circle-image"> <img alt='ゆき' src='https://affiben.com/wp-content/uploads/yuki-profile-img1.jpg' class='avatar avatar-200 photo' height='200' width='200' /> </figure> <div class="author-content"> <div class="author-name"> <a rel="noopener" target="_self" href="https://affiben.com/b7s9">ゆき</a> </div> <div class="author-description"> <p>専業ブロガー兼アフィリエイター。<br /> AIライティングツール「<a rel="noopener" target="_self" href="https://affiben.com/jqyu">ラクリン</a>」の開発者です。<br /> ブログでご飯を食べるまでのお話を、プロフィールで詳しく書いています。良かったら読んでみてください。</p> <p style="text-align: center;"><a rel="noopener" target="_self" class="btn btn-light-blue btn-l" href="https://affiben.com/b7s9" style="margin-top: 10px;">詳しいプロフィール</a></p> </div> <div class="profile-follows author-follows">  <div class="sns-follow bc-brand-color fbc-hide sf-profile"> <div class="sns-follow-message">ゆきをフォローする</div> <div class="sns-follow-buttons sns-buttons"> <a href="https://affiben.com/zubo" class="sns-button follow-button twitter-button twitter-follow-button-sq x-corp-button x-corp-follow-button-sq" target="_blank" title="Xをフォロー" rel="nofollow noopener noreferrer" aria-label="Xをフォロー"><span class="icon-x-corp-logo"></span></a> <a href="//feedly.com/i/discover/sources/search/feed/https%3A%2F%2Faffiben.com" class="sns-button follow-button feedly-button feedly-follow-button-sq" target="_blank" title="feedlyで更新情報を購読" rel="nofollow noopener noreferrer" aria-label="feedlyで更新情報を購読"><span class="icon-feedly-logo"></span><span class="follow-count feedly-follow-count"></span></a> <a href="https://affiben.com/feed/" class="sns-button follow-button rss-button rss-follow-button-sq" target="_blank" title="RSSで更新情報を購読" rel="nofollow noopener noreferrer" aria-label="RSSで更新情報を購読"><span class="icon-rss-logo"></span></a> </div> </div> </div> </div> </div> </aside><aside id="new_entries-2" class="widget widget-sidebar widget-sidebar-standard widget_new_entries"><h3 class="widget-sidebar-title widget-title"><i class="fas fa-ship icon-img-blue"></i>新着記事</h3> <div class="new-entry-cards widget-entry-cards no-icon cf"> <a href="https://affiben.com/message-sending-failed-please-try-again-later/" class="new-entry-card-link widget-entry-card-link a-wrap" title="メッセージの送信に失敗しました。後でまたお試しください。が出る原因と即効対処｜5分で試せる優先対応で即復旧！"> <div class="post-5217 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img44-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img44-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img44-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img44-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img44-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">メッセージの送信に失敗しました。後でまたお試しください。が出る原因と即効対処｜5分で試せる優先対応で即復旧！</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/uninstall-wordpress/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPressアンインストール手順｜レンタルサーバー別・ローカル環境の残留データまで完全削除！"> <div class="post-5215 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img29-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img29-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img29-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img29-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img29-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPressアンインストール手順｜レンタルサーバー別・ローカル環境の残留データまで完全削除！</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/wordpress-diary/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン"> <div class="post-5213 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img45-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img45-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img45-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img45-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img45-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/embed-wordpress-source-code/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装"> <div class="post-5211 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img30-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img30-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img30-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.24</span></span></div> </div> </div> </a> <a href="https://affiben.com/wordpress-font-awesome/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPress Font Awesomeを高速導入する手順｜表示速度を最適化"> <div class="post-5209 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img38-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img38-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img38-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img38-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img38-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPress Font Awesomeを高速導入する手順｜表示速度を最適化</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.24</span></span></div> </div> </div> </a> </div> </aside> <aside id="popular_entries-2" class="widget widget-sidebar widget-sidebar-standard widget_popular_entries"><h3 class="widget-sidebar-title widget-title"><i class="fas fa-crown icon-img-blue"></i>人気記事</h3> <div class="popular-entry-cards widget-entry-cards no-icon cf ranking-visible"> <a href="https://affiben.com/filezilla-cannot-connect/" class="popular-entry-card-link widget-entry-card-link a-wrap no-1" title="FileZillaがサーバーに接続できない原因を総まとめ｜全解決策を網羅した問題解決はこちら！"> <div class="post-269 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-server-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img7-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img7-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img7-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img7-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img7-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">FileZillaがサーバーに接続できない原因を総まとめ｜全解決策を網羅した問題解決はこちら！</div> <span class="popular-entry-card-pv widget-entry-card-pv">65527 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/wordpress-ftp-settings/" class="popular-entry-card-link widget-entry-card-link a-wrap no-2" title="WordPressのFTP設定のやり方全手順｜FileZillaを使った接続方法は？"> <div class="post-252 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-server-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img38-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img38-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img38-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img38-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img38-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">WordPressのFTP設定のやり方全手順｜FileZillaを使った接続方法は？</div> <span class="popular-entry-card-pv widget-entry-card-pv">21012 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/all-in-one-wp-migration-error/" class="popular-entry-card-link widget-entry-card-link a-wrap no-3" title="All-in-One WP Migrationの全エラー解決策｜インポートできない・エクスポートが終わらないetc..."> <div class="post-1125 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-plugin-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img46-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img46-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img46-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img46-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img46-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">All-in-One WP Migrationの全エラー解決策｜インポートできない・エクスポートが終わらないetc...</div> <span class="popular-entry-card-pv widget-entry-card-pv">16353 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.08.21</span></span> </div> </div> </div> </a> <a href="https://affiben.com/wordpress-line-spacing/" class="popular-entry-card-link widget-entry-card-link a-wrap no-4" title="WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード"> <div class="post-1624 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img23-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img23-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img23-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img23-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img23-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード</div> <span class="popular-entry-card-pv widget-entry-card-pv">14213 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.23</span></span> </div> </div> </div> </a> <a href="https://affiben.com/all-in-one-wp-migration-capacity/" class="popular-entry-card-link widget-entry-card-link a-wrap no-5" title="All-in-One WP Migrationの容量制限の増やし方｜無料で増やせる簡単な方法を画像付きで解説！"> <div class="post-1121 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-plugin-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img26-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img26-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img26-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img26-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img26-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">All-in-One WP Migrationの容量制限の増やし方｜無料で増やせる簡単な方法を画像付きで解説！</div> <span class="popular-entry-card-pv widget-entry-card-pv">10971 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/clickable-elements-are-too-close-together/" class="popular-entry-card-link widget-entry-card-link a-wrap no-6" title="「クリック可能な要素同士が近すぎます」の発生ページの探し方と解決方法！"> <div class="post-1594 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-adsense-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img1-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img1-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img1-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img1-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img1-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">「クリック可能な要素同士が近すぎます」の発生ページの探し方と解決方法！</div> <span class="popular-entry-card-pv widget-entry-card-pv">10730 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/wordpress-character-count/" class="popular-entry-card-link widget-entry-card-link a-wrap no-7" title="WordPressの文字数をカウントする7つの方法｜プラグイン対応も可能！"> <div class="post-1477 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img34-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img34-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img34-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img34-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img34-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">WordPressの文字数をカウントする7つの方法｜プラグイン対応も可能！</div> <span class="popular-entry-card-pv widget-entry-card-pv">10520 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2020.01.17</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/what-is-ping-sending/" class="popular-entry-card-link widget-entry-card-link a-wrap no-8" title="ping送信とは？Googleに対するSEO効果と10のサーバーリスト！"> <div class="post-604 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-seo-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img8-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img8-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img8-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img8-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img8-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">ping送信とは？Googleに対するSEO効果と10のサーバーリスト！</div> <span class="popular-entry-card-pv widget-entry-card-pv">9284 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> </div> </aside> <aside id="categories-3" class="widget widget-sidebar widget-sidebar-standard widget_categories"><h3 class="widget-sidebar-title widget-title"><i class="fas fa-window-restore icon-img-blue"></i>カテゴリー</h3> <ul> <li class="cat-item cat-item-9"><a href="https://affiben.com/category/adsense/"><span class="list-item-caption">Googleアドセンス</span></a></li> <li class="cat-item cat-item-13"><a href="https://affiben.com/category/analytics/"><span class="list-item-caption">Googleアナリティクス</span></a></li> <li class="cat-item cat-item-5"><a href="https://affiben.com/category/seo/"><span class="list-item-caption">SEO</span></a></li> <li class="cat-item cat-item-12"><a href="https://affiben.com/category/wordpress/"><span class="list-item-caption">WordPress</span></a></li> <li class="cat-item cat-item-8"><a href="https://affiben.com/category/affiliate/"><span class="list-item-caption">アフィリエイト</span></a></li> <li class="cat-item cat-item-11"><a href="https://affiben.com/category/server/"><span class="list-item-caption">サーバー</span></a></li> <li class="cat-item cat-item-4"><a href="https://affiben.com/category/start/"><span class="list-item-caption">ブログの始め方</span></a></li> <li class="cat-item cat-item-10"><a href="https://affiben.com/category/plugin/"><span class="list-item-caption">プラグイン</span></a></li> <li class="cat-item cat-item-6"><a href="https://affiben.com/category/writing/"><span class="list-item-caption">記事制作</span></a></li> <li class="cat-item cat-item-7"><a href="https://affiben.com/category/management/"><span class="list-item-caption">運営ノウハウ</span></a></li> </ul> </aside> <div id="sidebar-scroll" class="sidebar-scroll"> <aside id="toc-2" class="widget widget-sidebar widget-sidebar-scroll widget_toc"><h3 class="widget-sidebar-scroll-title widget-title"><i class="fas fa-mouse-pointer icon-img-blue"></i>クリックできる目次</h3> <div class="toc-widget-box"> <div class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-3" checked><label class="toc-title" for="toc-checkbox-3">目次</label> <div class="toc-content"> <ol class="toc-list open"><li><a href="#toc1" tabindex="0">WordPress Font Awesomeを高速導入する手順と最適化</a><ol><li class="display-none"><a href="#toc2" tabindex="0">CDN読み込み</a></li><li class="display-none"><a href="#toc3" tabindex="0">プラグイン導入</a></li><li class="display-none"><a href="#toc4" tabindex="0">ローカルホスト</a></li><li class="display-none"><a href="#toc5" tabindex="0">必要アイコン抽出</a></li><li class="display-none"><a href="#toc6" tabindex="0">サブセット化</a></li><li class="display-none"><a href="#toc7" tabindex="0">遅延読み込み</a></li><li class="display-none"><a href="#toc8" tabindex="0">プリロード設定</a></li></ol></li><li><a href="#toc9" tabindex="0">読み込み方法の選び方</a><ol><li class="display-none"><a href="#toc10" tabindex="0">プラグイン利用</a></li><li class="display-none"><a href="#toc11" tabindex="0">functions.phpでenqueue</a></li><li class="display-none"><a href="#toc12" tabindex="0">テーマヘッダー直書き</a></li></ol></li><li><a href="#toc13" tabindex="0">パフォーマンス改善の具体手順</a><ol><li class="display-none"><a href="#toc14" tabindex="0">必要アイコンのみ抽出</a></li><li class="display-none"><a href="#toc15" tabindex="0">Webフォントのサブセット化</a></li><li class="display-none"><a href="#toc16" tabindex="0">フォントのプリロード</a></li><li class="display-none"><a href="#toc17" tabindex="0">遅延読み込みの実装</a></li><li class="display-none"><a href="#toc18" tabindex="0">CDNキャッシュ設定</a></li></ol></li><li><a href="#toc19" tabindex="0">表示トラブル別の対処法</a><ol><li class="display-none"><a href="#toc20" tabindex="0">アイコンが□になる</a></li><li class="display-none"><a href="#toc21" tabindex="0">CSS競合</a></li><li class="display-none"><a href="#toc22" tabindex="0">プロトコル混在</a></li><li class="display-none"><a href="#toc23" tabindex="0">キャッシュ誤動作</a></li><li class="display-none"><a href="#toc24" tabindex="0">バージョン不整合</a></li></ol></li><li><a href="#toc25" tabindex="0">カスタマイズの実践テクニック</a><ol><li class="display-none"><a href="#toc26" tabindex="0">サイズ調整</a></li><li class="display-none"><a href="#toc27" tabindex="0">色変更</a></li><li class="display-none"><a href="#toc28" tabindex="0">アニメーション</a></li><li class="display-none"><a href="#toc29" tabindex="0">疑似要素での利用</a></li><li class="display-none"><a href="#toc30" tabindex="0">SVGへの置換</a></li></ol></li><li><a href="#toc31" tabindex="0">本番導入の最終確認項目</a></li></ol> </div> </div> </div> </aside> </div> </div> </div> </div> <footer id="footer" class="footer footer-container nwa" itemscope itemtype="https://schema.org/WPFooter"> <div id="footer-in" class="footer-in wrap cf"> <div class="footer-widgets cf"> <div class="footer-left"><aside id="custom_html-7" class="widget_text widget widget-footer-left widget_custom_html"><div class="textwidget custom-html-widget"><div style="margin-top: 1.4em; text-align: center;"> <a rel="noopener" target="_self" href="/"> <img src="/wp-content/uploads/header-logo.png" alt=""> </a> </div></div></aside><aside id="nav_menu-6" class="widget widget-footer-left widget_nav_menu"><h3 class="widget-footer-left-title footer-title widget-title">提供サービス</h3><div class="menu-%e6%8f%90%e4%be%9b%e3%82%b5%e3%83%bc%e3%83%93%e3%82%b9-container"><ul id="menu-%e6%8f%90%e4%be%9b%e3%82%b5%e3%83%bc%e3%83%93%e3%82%b9" class="menu"><li id="menu-item-3763" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3763"><a href="https://affiben.com/c74f">公式LINE</a></li> <li id="menu-item-3647" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3647"><a href="https://affiben.com/tools/">ブログツール</a></li> <li id="menu-item-3648" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3648"><a href="https://affiben.com/school/">ブログスクール</a></li> </ul></div></aside></div> <div class="footer-center"><aside id="new_entries-3" class="widget widget-footer-center widget_new_entries"><h3 class="widget-footer-center-title footer-title widget-title">新着記事</h3> <div class="new-entry-cards widget-entry-cards no-icon cf"> <a href="https://affiben.com/message-sending-failed-please-try-again-later/" class="new-entry-card-link widget-entry-card-link a-wrap" title="メッセージの送信に失敗しました。後でまたお試しください。が出る原因と即効対処｜5分で試せる優先対応で即復旧！"> <div class="post-5217 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img30-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img30-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img30-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">メッセージの送信に失敗しました。後でまたお試しください。が出る原因と即効対処｜5分で試せる優先対応で即復旧！</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/uninstall-wordpress/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPressアンインストール手順｜レンタルサーバー別・ローカル環境の残留データまで完全削除！"> <div class="post-5215 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img43-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img43-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img43-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img43-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img43-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPressアンインストール手順｜レンタルサーバー別・ローカル環境の残留データまで完全削除！</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/wordpress-diary/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン"> <div class="post-5213 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img29-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img29-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img29-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img29-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img29-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPress日記の始め方と運用設計｜初動30日でアクセスと収益を伸ばす実践プラン</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.25</span></span></div> </div> </div> </a> <a href="https://affiben.com/embed-wordpress-source-code/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装"> <div class="post-5211 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img46-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img46-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img46-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img46-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img46-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPressにソースコードを埋め込む手順と注意点｜プラグイン不要で行番号・コピー機能を簡単実装</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.24</span></span></div> </div> </div> </a> <a href="https://affiben.com/wordpress-font-awesome/" class="new-entry-card-link widget-entry-card-link a-wrap" title="WordPress Font Awesomeを高速導入する手順｜表示速度を最適化"> <div class="post-5209 new-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="new-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img45-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img45-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img45-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img45-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img45-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="new-entry-card-content widget-entry-card-content card-content"> <div class="new-entry-card-title widget-entry-card-title card-title">WordPress Font Awesomeを高速導入する手順｜表示速度を最適化</div> <div class="new-entry-card-date widget-entry-card-date display-none"> <span class="new-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2025.11.24</span></span></div> </div> </div> </a> </div> </aside> </div> <div class="footer-right"><aside id="popular_entries-3" class="widget widget-footer-right widget_popular_entries"><h3 class="widget-footer-right-title footer-title widget-title">人気記事</h3> <div class="popular-entry-cards widget-entry-cards no-icon cf ranking-visible"> <a href="https://affiben.com/filezilla-cannot-connect/" class="popular-entry-card-link widget-entry-card-link a-wrap no-1" title="FileZillaがサーバーに接続できない原因を総まとめ｜全解決策を網羅した問題解決はこちら！"> <div class="post-269 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-server-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img40-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img40-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img40-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img40-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img40-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">FileZillaがサーバーに接続できない原因を総まとめ｜全解決策を網羅した問題解決はこちら！</div> <span class="popular-entry-card-pv widget-entry-card-pv">65527 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/wordpress-ftp-settings/" class="popular-entry-card-link widget-entry-card-link a-wrap no-2" title="WordPressのFTP設定のやり方全手順｜FileZillaを使った接続方法は？"> <div class="post-252 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-server-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img35-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img35-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img35-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img35-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img35-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">WordPressのFTP設定のやり方全手順｜FileZillaを使った接続方法は？</div> <span class="popular-entry-card-pv widget-entry-card-pv">21012 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> <a href="https://affiben.com/all-in-one-wp-migration-error/" class="popular-entry-card-link widget-entry-card-link a-wrap no-3" title="All-in-One WP Migrationの全エラー解決策｜インポートできない・エクスポートが終わらないetc..."> <div class="post-1125 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-plugin-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img34-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img34-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img34-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img34-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img34-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">All-in-One WP Migrationの全エラー解決策｜インポートできない・エクスポートが終わらないetc...</div> <span class="popular-entry-card-pv widget-entry-card-pv">16353 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.08.21</span></span> </div> </div> </div> </a> <a href="https://affiben.com/wordpress-line-spacing/" class="popular-entry-card-link widget-entry-card-link a-wrap no-4" title="WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード"> <div class="post-1624 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-wordpress-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img27-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img27-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img27-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img27-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img27-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">WordPressの改行を詰める設定｜空きすぎの段落を狭くするコピペで使えるCSSコード</div> <span class="popular-entry-card-pv widget-entry-card-pv">14213 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.23</span></span> </div> </div> </div> </a> <a href="https://affiben.com/all-in-one-wp-migration-capacity/" class="popular-entry-card-link widget-entry-card-link a-wrap no-5" title="All-in-One WP Migrationの容量制限の増やし方｜無料で増やせる簡単な方法を画像付きで解説！"> <div class="post-1121 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-plugin-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <img width="120" height="68" src="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://affiben.com/wp-content/uploads/pc-img30-120x68.jpg 120w, https://affiben.com/wp-content/uploads/pc-img30-160x90.jpg 160w, https://affiben.com/wp-content/uploads/pc-img30-320x180.jpg 320w, https://affiben.com/wp-content/uploads/pc-img30-376x212.jpg 376w" sizes="(max-width: 120px) 100vw, 120px" /> </figure> <div class="popular-entry-card-content widget-entry-card-content card-content"> <div class="popular-entry-card-title widget-entry-card-title card-title">All-in-One WP Migrationの容量制限の増やし方｜無料で増やせる簡単な方法を画像付きで解説！</div> <span class="popular-entry-card-pv widget-entry-card-pv">10971 views</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date"><span class="far fa-clock" aria-hidden="true"></span><span class="entry-date">2021.08.28</span></span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update"><span class="fas fa-history" aria-hidden="true"></span><span class="entry-date">2025.07.24</span></span> </div> </div> </div> </a> </div> </aside> </div> </div> <div class="footer-bottom fdt-up-and-down fnm-text-width cf"> <div class="footer-bottom-logo"> <div class="logo logo-footer logo-image"><a href="https://affiben.com/" class="site-name site-name-text-link" itemprop="url"><span class="site-name-text"><img class="site-logo-image footer-site-logo-image" src="https://affiben.com/wp-content/uploads/header-logo.png" alt="ゆきブログ"><meta itemprop="name about" content="ゆきブログ"></span></a></div> </div> <div class="footer-bottom-content"> <nav id="navi-footer" class="navi-footer"> <div id="navi-footer-in" class="navi-footer-in"> <ul id="menu-%e7%a7%81%e3%81%9f%e3%81%a1%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6" class="menu-footer"><li id="menu-item-4904" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-4904"><a href="https://affiben.com/">ホーム</a></li> <li id="menu-item-3302" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-3302"><a rel="privacy-policy" href="https://affiben.com/privacy/">プライバシーポリシー</a></li> <li id="menu-item-3304" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3304"><a href="https://affiben.com/about/">会社概要</a></li> <li id="menu-item-3303" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3303"><a href="https://affiben.com/contact/">お問い合わせ</a></li> </ul> </div> </nav> <div class="source-org copyright">© 2018-2025 ゆきブログ.</div> </div> </div> </div> </footer> <ul id="menu-%e3%82%b0%e3%83%ad%e3%83%bc%e3%83%90%e3%83%ab%e3%83%8a%e3%83%93-1" class="mobile-footer-menu-buttons mobile-menu-buttons"><li class="navi-menu-button menu-button"><a href="https://affiben.com/profile/" class="menu-button-in"><span class="custom-menu-icon menu-icon"><span class="fas fa-star"></span></span><span class="custom-menu-caption menu-caption"><i class="fas fa-user-graduate icon-img-orange"></i><br><span class="gnav-title">プロフィール</span><br><span class="gnav-subtitle-orange">Profile</span></span></a></li> <li class="navi-menu-button menu-button"><a href="https://affiben.com/tools/" class="menu-button-in"><span class="custom-menu-icon menu-icon"><span class="fas fa-star"></span></span><span class="custom-menu-caption menu-caption"><i class="fas fa-gem icon-img-blue"></i><br><span class="gnav-title">ブログツール</span><br><span class="gnav-subtitle-blue">Tools</span></span></a></li> <li class="navi-menu-button menu-button"><a href="https://affiben.com/school/" class="menu-button-in"><span class="custom-menu-icon menu-icon"><span class="fas fa-star"></span></span><span class="custom-menu-caption menu-caption"><i class="fas fa-school icon-img-blue"></i><br><span class="gnav-title">スクール</span><br><span class="gnav-subtitle-blue">School</span></span></a></li> <li class="navi-menu-button menu-button"><a href="https://affiben.com/about/" class="menu-button-in"><span class="custom-menu-icon menu-icon"><span class="fas fa-star"></span></span><span class="custom-menu-caption menu-caption"><i class="fas fa-building icon-img-blue"></i><br><span class="gnav-title">会社概要</span><br><span class="gnav-subtitle-blue">About</span></span></a></li> <li class="navi-menu-button menu-button"><a href="https://affiben.com/contact/" class="menu-button-in"><span class="custom-menu-icon menu-icon"><span class="fas fa-star"></span></span><span class="custom-menu-caption menu-caption"><i class="fas fa-envelope icon-img-blue"></i><br><span class="gnav-title">問い合わせ</span><br><span class="gnav-subtitle-blue">Contact</span></span></a></li> </ul> <div id="go-to-top" class="go-to-top"> <button class="go-to-top-button go-to-top-common go-to-top-hide go-to-top-button-icon-font" aria-label="トップへ戻る"><span class="fas fa-angle-double-up"></span></button> </div> <script type="speculationrules">{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/cocoon-child-master\/*","\/wp-content\/themes\/cocoon-master\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}</script> <script src="https://affiben.com/wp-includes/js/dist/hooks.min.js?ver=4d63a3d491d11ffd8ac6&fver=20250204103046" id="wp-hooks-js"></script> <script src="https://affiben.com/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6&fver=20250204103045" id="wp-i18n-js"></script> <script id="wp-i18n-js-after">wp.i18n.setLocaleData({'text direction\u0004ltr':['ltr']})</script> <script>(()=>{"use strict";var t={d:(e,i)=>{for(var s in i)t.o(i,s)&&!t.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:i[s]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function i(t){if(this.formData={},this.tree={},!(t instanceof FormData))return this;this.formData=t;const e=()=>{const t=new Map;return t.largestIndex=0,t.set=function(e,i){""===e?e=t.largestIndex++:/^[0-9]+$/.test(e)&&(e=parseInt(e),t.largestIndex<=e&&(t.largestIndex=e+1)),Map.prototype.set.call(t,e,i)},t};this.tree=e();const i=/^(?<name>[a-z][-a-z0-9_:]*)(?<array>(?:\[(?:[a-z][-a-z0-9_:]*|[0-9]*)\])*)/i;for(const[t,s]of this.formData){const o=t.match(i);if(o)if(""===o.groups.array)this.tree.set(o.groups.name,s);else{const t=[...o.groups.array.matchAll(/\[([a-z][-a-z0-9_:]*|[0-9]*)\]/gi)].map((([t,e])=>e));t.unshift(o.groups.name);const i=t.pop();t.reduce(((t,i)=>{if(/^[0-9]+$/.test(i)&&(i=parseInt(i)),t.get(i)instanceof Map)return t.get(i);const s=e();return t.set(i,s),s}),this.tree).set(i,s)}}}t.r(e),t.d(e,{all:()=>D,any:()=>M,date:()=>m,dayofweek:()=>u,email:()=>r,enum:()=>h,file:()=>d,maxdate:()=>z,maxfilesize:()=>j,maxitems:()=>v,maxlength:()=>x,maxnumber:()=>y,mindate:()=>A,minfilesize:()=>$,minitems:()=>w,minlength:()=>g,minnumber:()=>b,number:()=>c,required:()=>n,requiredfile:()=>a,stepnumber:()=>I,tel:()=>l,time:()=>f,url:()=>p}),i.prototype.entries=function(){return this.tree.entries()},i.prototype.get=function(t){return this.tree.get(t)},i.prototype.getAll=function(t){if(!this.has(t))return[];const e=t=>{const i=[];if(t instanceof Map)for(const[s,o]of t)i.push(...e(o));else""!==t&&i.push(t);return i};return e(this.get(t))},i.prototype.has=function(t){return this.tree.has(t)},i.prototype.keys=function(){return this.tree.keys()},i.prototype.values=function(){return this.tree.values()};const s=i;function o({rule:t,field:e,error:i,...s}){this.rule=t,this.field=e,this.error=i,this.properties=s}const n=function(t){if(0===t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).length)throw new o(this)},a=function(t){if(0===t.getAll(this.field).length)throw new o(this)},r=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>{if(t.length<6)return!1;if(-1===t.indexOf("@",1))return!1;if(t.indexOf("@")!==t.lastIndexOf("@"))return!1;const[e,i]=t.split("@",2);if(!/^[a-zA-Z0-9!#$%&\'*+\/=?^_`{|}~\.-]+$/.test(e))return!1;if(/\.{2,}/.test(i))return!1;if(/(?:^[ \t\n\r\0\x0B.]|[ \t\n\r\0\x0B.]$)/.test(i))return!1;const s=i.split(".");if(s.length<2)return!1;for(const t of s){if(/(?:^[ \t\n\r\0\x0B-]|[ \t\n\r\0\x0B-]$)/.test(t))return!1;if(!/^[a-z0-9-]+$/i.test(t))return!1}return!0})))throw new o(this)},p=function(t){const e=t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t));if(!e.every((t=>{try{return(t=>-1!==["http","https","ftp","ftps","mailto","news","irc","irc6","ircs","gopher","nntp","feed","telnet","mms","rtsp","sms","svn","tel","fax","xmpp","webcal","urn"].indexOf(t))(new URL(t).protocol.replace(/:$/,""))}catch{return!1}})))throw new o(this)},l=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>(((t=(t=t.replace(/[#*].*$/,"")).replaceAll(/[()/.*#\s-]+/g,"")).startsWith("+")||t.startsWith("00"))&&(t=`+${t.replace(/^[+0]+/,"")}`),!!/^[+]?[0-9]+$/.test(t)&&5<t.length&&t.length<16))))throw new o(this)},c=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>!!/^[-]?[0-9]+(?:[eE][+-]?[0-9]+)?$/.test(t)||!!/^[-]?(?:[0-9]+)?[.][0-9]+(?:[eE][+-]?[0-9]+)?$/.test(t))))throw new o(this)},m=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>{if(!/^[0-9]{4,}-[0-9]{2}-[0-9]{2}$/.test(t))return!1;const e=new Date(t);return!Number.isNaN(e.valueOf())})))throw new o(this)},f=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>{const e=t.match(/^([0-9]{2})\:([0-9]{2})(?:\:([0-9]{2}))?$/);if(!e)return!1;const i=parseInt(e[1]),s=parseInt(e[2]),o=e[3]?parseInt(e[3]):0;return 0<=i&&i<=23&&0<=s&&s<=59&&0<=o&&o<=59})))throw new o(this)},d=function(t){if(!t.getAll(this.field).every((t=>t instanceof File&&this.accept?.some((e=>/^\.[a-z0-9]+$/i.test(e)?t.name.toLowerCase().endsWith(e.toLowerCase()):(t=>{const e=[],i=t.match(/^(?<toplevel>[a-z]+)\/(?<sub>[*]|[a-z0-9.+-]+)$/i);if(i){const t=i.groups.toplevel.toLowerCase(),s=i.groups.sub.toLowerCase();for(const[o,n]of(()=>{const t=new Map;return t.set("jpg|jpeg|jpe","image/jpeg"),t.set("gif","image/gif"),t.set("png","image/png"),t.set("bmp","image/bmp"),t.set("tiff|tif","image/tiff"),t.set("webp","image/webp"),t.set("ico","image/x-icon"),t.set("heic","image/heic"),t.set("asf|asx","video/x-ms-asf"),t.set("wmv","video/x-ms-wmv"),t.set("wmx","video/x-ms-wmx"),t.set("wm","video/x-ms-wm"),t.set("avi","video/avi"),t.set("divx","video/divx"),t.set("flv","video/x-flv"),t.set("mov|qt","video/quicktime"),t.set("mpeg|mpg|mpe","video/mpeg"),t.set("mp4|m4v","video/mp4"),t.set("ogv","video/ogg"),t.set("webm","video/webm"),t.set("mkv","video/x-matroska"),t.set("3gp|3gpp","video/3gpp"),t.set("3g2|3gp2","video/3gpp2"),t.set("txt|asc|c|cc|h|srt","text/plain"),t.set("csv","text/csv"),t.set("tsv","text/tab-separated-values"),t.set("ics","text/calendar"),t.set("rtx","text/richtext"),t.set("css","text/css"),t.set("htm|html","text/html"),t.set("vtt","text/vtt"),t.set("dfxp","application/ttaf+xml"),t.set("mp3|m4a|m4b","audio/mpeg"),t.set("aac","audio/aac"),t.set("ra|ram","audio/x-realaudio"),t.set("wav","audio/wav"),t.set("ogg|oga","audio/ogg"),t.set("flac","audio/flac"),t.set("mid|midi","audio/midi"),t.set("wma","audio/x-ms-wma"),t.set("wax","audio/x-ms-wax"),t.set("mka","audio/x-matroska"),t.set("rtf","application/rtf"),t.set("js","application/javascript"),t.set("pdf","application/pdf"),t.set("swf","application/x-shockwave-flash"),t.set("class","application/java"),t.set("tar","application/x-tar"),t.set("zip","application/zip"),t.set("gz|gzip","application/x-gzip"),t.set("rar","application/rar"),t.set("7z","application/x-7z-compressed"),t.set("exe","application/x-msdownload"),t.set("psd","application/octet-stream"),t.set("xcf","application/octet-stream"),t.set("doc","application/msword"),t.set("pot|pps|ppt","application/vnd.ms-powerpoint"),t.set("wri","application/vnd.ms-write"),t.set("xla|xls|xlt|xlw","application/vnd.ms-excel"),t.set("mdb","application/vnd.ms-access"),t.set("mpp","application/vnd.ms-project"),t.set("docx","application/vnd.openxmlformats-officedocument.wordprocessingml.document"),t.set("docm","application/vnd.ms-word.document.macroEnabled.12"),t.set("dotx","application/vnd.openxmlformats-officedocument.wordprocessingml.template"),t.set("dotm","application/vnd.ms-word.template.macroEnabled.12"),t.set("xlsx","application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"),t.set("xlsm","application/vnd.ms-excel.sheet.macroEnabled.12"),t.set("xlsb","application/vnd.ms-excel.sheet.binary.macroEnabled.12"),t.set("xltx","application/vnd.openxmlformats-officedocument.spreadsheetml.template"),t.set("xltm","application/vnd.ms-excel.template.macroEnabled.12"),t.set("xlam","application/vnd.ms-excel.addin.macroEnabled.12"),t.set("pptx","application/vnd.openxmlformats-officedocument.presentationml.presentation"),t.set("pptm","application/vnd.ms-powerpoint.presentation.macroEnabled.12"),t.set("ppsx","application/vnd.openxmlformats-officedocument.presentationml.slideshow"),t.set("ppsm","application/vnd.ms-powerpoint.slideshow.macroEnabled.12"),t.set("potx","application/vnd.openxmlformats-officedocument.presentationml.template"),t.set("potm","application/vnd.ms-powerpoint.template.macroEnabled.12"),t.set("ppam","application/vnd.ms-powerpoint.addin.macroEnabled.12"),t.set("sldx","application/vnd.openxmlformats-officedocument.presentationml.slide"),t.set("sldm","application/vnd.ms-powerpoint.slide.macroEnabled.12"),t.set("onetoc|onetoc2|onetmp|onepkg","application/onenote"),t.set("oxps","application/oxps"),t.set("xps","application/vnd.ms-xpsdocument"),t.set("odt","application/vnd.oasis.opendocument.text"),t.set("odp","application/vnd.oasis.opendocument.presentation"),t.set("ods","application/vnd.oasis.opendocument.spreadsheet"),t.set("odg","application/vnd.oasis.opendocument.graphics"),t.set("odc","application/vnd.oasis.opendocument.chart"),t.set("odb","application/vnd.oasis.opendocument.database"),t.set("odf","application/vnd.oasis.opendocument.formula"),t.set("wp|wpd","application/wordperfect"),t.set("key","application/vnd.apple.keynote"),t.set("numbers","application/vnd.apple.numbers"),t.set("pages","application/vnd.apple.pages"),t})())("*"===s&&n.startsWith(t+"/")||n===i[0])&&e.push(...o.split("|"))}return e})(e).some((e=>(e="."+e.trim(),t.name.toLowerCase().endsWith(e.toLowerCase())))))))))throw new o(this)},h=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>this.accept?.some((e=>t===String(e))))))throw new o(this)},u=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>{const e=0===(i=new Date(t).getDay())?7:i;var i;return this.accept?.some((t=>e===parseInt(t)))})))throw new o(this)},w=function(t){if(t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).length<parseInt(this.threshold))throw new o(this)},v=function(t){const e=t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t));if(parseInt(this.threshold)<e.length)throw new o(this)},g=function(t){const e=t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t));let i=0;if(e.forEach((t=>{"string"==typeof t&&(i+=t.length)})),0!==i&&i<parseInt(this.threshold))throw new o(this)},x=function(t){const e=t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t));let i=0;if(e.forEach((t=>{"string"==typeof t&&(i+=t.length)})),parseInt(this.threshold)<i)throw new o(this)},b=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>!(parseFloat(t)<parseFloat(this.threshold)))))throw new o(this)},y=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>!(parseFloat(this.threshold)<parseFloat(t)))))throw new o(this)},A=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>!(/^[0-9]{4,}-[0-9]{2}-[0-9]{2}$/.test(t)&&/^[0-9]{4,}-[0-9]{2}-[0-9]{2}$/.test(this.threshold)&&t<this.threshold))))throw new o(this)},z=function(t){if(!t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)).every((t=>!(/^[0-9]{4,}-[0-9]{2}-[0-9]{2}$/.test(t)&&/^[0-9]{4,}-[0-9]{2}-[0-9]{2}$/.test(this.threshold)&&this.threshold<t))))throw new o(this)},$=function(t){const e=t.getAll(this.field);let i=0;if(e.forEach((t=>{t instanceof File&&(i+=t.size)})),i<parseInt(this.threshold))throw new o(this)},j=function(t){const e=t.getAll(this.field);let i=0;if(e.forEach((t=>{t instanceof File&&(i+=t.size)})),parseInt(this.threshold)<i)throw new o(this)},I=function(t){const e=t.getAll(this.field).map((t=>t.trim())).filter((t=>""!==t)),i=parseFloat(this.base),s=parseFloat(this.interval);if(!(0<s))return!0;if(!e.every((t=>{const e=(parseFloat(t)-i)%s;return"0.000000"===Math.abs(e).toFixed(6)||"0.000000"===Math.abs(e-s).toFixed(6)})))throw new o(this)},O=({ruleObj:t,options:i})=>{const{rule:s,...o}=t;return"function"==typeof e[s]&&("function"!=typeof e[s].matches||e[s].matches(o,i))},E=({ruleObj:t,formDataTree:i,options:s})=>{const{rule:o}=t;e[o].call(t,i,s)},k=[],F=t=>[...k].reduce(((t,e)=>i=>e(i,t)),t),D=function(t,e={}){const i=(this.rules??[]).filter((t=>O({ruleObj:t,options:e}))),s=F(E);if(!i.every((i=>{try{s({ruleObj:i,formDataTree:t,options:e})}catch(t){if(!(t instanceof o))throw t;if(void 0!==t.error)throw t;return!1}return!0})))throw new o(this)},M=function(t,e={}){const i=(this.rules??[]).filter((t=>O({ruleObj:t,options:e}))),s=F(E);if(!i.some((i=>{try{s({ruleObj:i,formDataTree:t,options:e})}catch(t){if(!(t instanceof o))throw t;return!1}return!0})))throw new o(this)};var L;window.swv={validators:e,validate:(t,e,i={})=>{const n=(t.rules??[]).filter((t=>O({ruleObj:t,options:i})));if(!n.length)return new Map;const a=F(E),r=new s(e),p=n.reduce(((t,e)=>{try{a({ruleObj:e,formDataTree:r,options:i})}catch(e){if(!(e instanceof o))throw e;if(void 0!==e.field&&!t.has(e.field)&&void 0!==e.error)return t.set(e.field,e)}return t}),new Map);for(const t of r.keys())p.has(t)||p.set(t,{validInputs:r.getAll(t)});return p},use:t=>{k.push(t)},...null!==(L=window.swv)&&void 0!==L?L:{}}})()</script> <script id="contact-form-7-js-translations">(function(domain,translations){var localeData=translations.locale_data[domain]||translations.locale_data.messages;localeData[""].domain=domain;wp.i18n.setLocaleData(localeData,domain)})("contact-form-7",{"translation-revision-date":"2025-10-29 09:23:50+0000","generator":"GlotPress\/4.0.3","domain":"messages","locale_data":{"messages":{"":{"domain":"messages","plural-forms":"nplurals=1; plural=0;","lang":"ja_JP"},"This contact form is placed in the wrong place.":["\u3053\u306e\u30b3\u30f3\u30bf\u30af\u30c8\u30d5\u30a9\u30fc\u30e0\u306f\u9593\u9055\u3063\u305f\u4f4d\u7f6e\u306b\u7f6e\u304b\u308c\u3066\u3044\u307e\u3059\u3002"],"Error:":["\u30a8\u30e9\u30fc:"]}},"comment":{"reference":"includes\/js\/index.js"}})</script> <script id="contact-form-7-js-before">var wpcf7={"api":{"root":"https:\/\/affiben.com\/wp-json\/","namespace":"contact-form-7\/v1"}}</script> <script>(()=>{"use strict";const e=window.wp.i18n,t=e=>Math.abs(parseInt(e,10)),a=(e,t,a)=>{const n=new CustomEvent(`wpcf7${t}`,{bubbles:!0,detail:a});"string"==typeof e&&(e=document.querySelector(e)),e.dispatchEvent(n)},n=(e,t)=>{const n=new Map([["init","init"],["validation_failed","invalid"],["acceptance_missing","unaccepted"],["spam","spam"],["aborted","aborted"],["mail_sent","sent"],["mail_failed","failed"],["submitting","submitting"],["resetting","resetting"],["validating","validating"],["payment_required","payment-required"]]);n.has(t)&&(t=n.get(t)),Array.from(n.values()).includes(t)||(t=`custom-${t=(t=t.replace(/[^0-9a-z]+/i," ").trim()).replace(/\s+/,"-")}`);const r=e.getAttribute("data-status");if(e.wpcf7.status=t,e.setAttribute("data-status",t),e.classList.add(t),r&&r!==t){e.classList.remove(r);const t={contactFormId:e.wpcf7.id,pluginVersion:e.wpcf7.pluginVersion,contactFormLocale:e.wpcf7.locale,unitTag:e.wpcf7.unitTag,containerPostId:e.wpcf7.containerPost,status:e.wpcf7.status,prevStatus:r};a(e,"statuschanged",t)}return t},r=e=>{const{root:t,namespace:a="contact-form-7/v1"}=wpcf7.api;return c.reduceRight(((e,t)=>a=>t(a,e)),(e=>{let n,r,{url:c,path:o,endpoint:s,headers:i,body:l,data:p,...d}=e;"string"==typeof s&&(n=a.replace(/^\/|\/$/g,""),r=s.replace(/^\//,""),o=r?n+"/"+r:n),"string"==typeof o&&(-1!==t.indexOf("?")&&(o=o.replace("?","&")),o=o.replace(/^\//,""),c=t+o),i={Accept:"application/json, */*;q=0.1",...i},delete i["X-WP-Nonce"],p&&(l=JSON.stringify(p),i["Content-Type"]="application/json");const f={code:"fetch_error",message:"You are probably offline."},u={code:"invalid_json",message:"The response is not a valid JSON response."};return window.fetch(c||o||window.location.href,{...d,headers:i,body:l}).then((e=>Promise.resolve(e).then((e=>{if(e.status>=200&&e.status<300)return e;throw e})).then((e=>{if(204===e.status)return null;if(e&&e.json)return e.json().catch((()=>{throw u}));throw u}))),(()=>{throw f}))}))(e)},c=[];function o(e,t={}){const{target:a,scope:r=e,...c}=t;if(void 0===e.wpcf7?.schema)return;const o={...e.wpcf7.schema};if(void 0!==a){if(!e.contains(a))return;if(!a.closest(".wpcf7-form-control-wrap[data-name]"))return;if(a.closest(".novalidate"))return}const p=r.querySelectorAll(".wpcf7-form-control-wrap"),d=Array.from(p).reduce(((e,t)=>(t.closest(".novalidate")||t.querySelectorAll(":where( input, textarea, select ):enabled").forEach((t=>{if(t.name)switch(t.type){case"button":case"image":case"reset":case"submit":break;case"checkbox":case"radio":t.checked&&e.append(t.name,t.value);break;case"select-multiple":for(const a of t.selectedOptions)e.append(t.name,a.value);break;case"file":for(const a of t.files)e.append(t.name,a);break;default:e.append(t.name,t.value)}})),e)),new FormData),f=e.getAttribute("data-status");Promise.resolve(n(e,"validating")).then((n=>{if(void 0!==swv){const n=swv.validate(o,d,t);for(const t of p){if(void 0===t.dataset.name)continue;const c=t.dataset.name;if(n.has(c)){const{error:t,validInputs:a}=n.get(c);i(e,c),void 0!==t&&s(e,c,t,{scope:r}),l(e,c,null!=a?a:[])}if(t.contains(a))break}}})).finally((()=>{n(e,f)}))}r.use=e=>{c.unshift(e)};const s=(e,t,a,n)=>{const{scope:r=e,...c}=null!=n?n:{},o=`${e.wpcf7?.unitTag}-ve-${t}`.replaceAll(/[^0-9a-z_-]+/gi,""),s=e.querySelector(`.wpcf7-form-control-wrap[data-name="${t}"] .wpcf7-form-control`);(()=>{const t=document.createElement("li");t.setAttribute("id",o),s&&s.id?t.insertAdjacentHTML("beforeend",`<a href="#${s.id}">${a}</a>`):t.insertAdjacentText("beforeend",a),e.wpcf7.parent.querySelector(".screen-reader-response ul").appendChild(t)})(),r.querySelectorAll(`.wpcf7-form-control-wrap[data-name="${t}"]`).forEach((e=>{const t=document.createElement("span");t.classList.add("wpcf7-not-valid-tip"),t.setAttribute("aria-hidden","true"),t.insertAdjacentText("beforeend",a),e.appendChild(t),e.querySelectorAll("[aria-invalid]").forEach((e=>{e.setAttribute("aria-invalid","true")})),e.querySelectorAll(".wpcf7-form-control").forEach((e=>{e.classList.add("wpcf7-not-valid"),e.setAttribute("aria-describedby",o),"function"==typeof e.setCustomValidity&&e.setCustomValidity(a),e.closest(".use-floating-validation-tip")&&(e.addEventListener("focus",(e=>{t.setAttribute("style","display: none")})),t.addEventListener("click",(e=>{t.setAttribute("style","display: none")})))}))}))},i=(e,t)=>{const a=`${e.wpcf7?.unitTag}-ve-${t}`.replaceAll(/[^0-9a-z_-]+/gi,"");e.wpcf7.parent.querySelector(`.screen-reader-response ul li#${a}`)?.remove(),e.querySelectorAll(`.wpcf7-form-control-wrap[data-name="${t}"]`).forEach((e=>{e.querySelector(".wpcf7-not-valid-tip")?.remove(),e.querySelectorAll("[aria-invalid]").forEach((e=>{e.setAttribute("aria-invalid","false")})),e.querySelectorAll(".wpcf7-form-control").forEach((e=>{e.removeAttribute("aria-describedby"),e.classList.remove("wpcf7-not-valid"),"function"==typeof e.setCustomValidity&&e.setCustomValidity("")}))}))},l=(e,t,a)=>{e.querySelectorAll(`[data-reflection-of="${t}"]`).forEach((e=>{if("output"===e.tagName.toLowerCase()){const t=e;0===a.length&&a.push(t.dataset.default),a.slice(0,1).forEach((e=>{e instanceof File&&(e=e.name),t.textContent=e}))}else e.querySelectorAll("output").forEach((e=>{e.hasAttribute("data-default")?0===a.length?e.removeAttribute("hidden"):e.setAttribute("hidden","hidden"):e.remove()})),a.forEach((a=>{a instanceof File&&(a=a.name);const n=document.createElement("output");n.setAttribute("name",t),n.textContent=a,e.appendChild(n)}))}))};function p(e,t={}){if(wpcf7.blocked)return d(e),void n(e,"submitting");const c=new FormData(e);t.submitter&&t.submitter.name&&c.append(t.submitter.name,t.submitter.value);const o={contactFormId:e.wpcf7.id,pluginVersion:e.wpcf7.pluginVersion,contactFormLocale:e.wpcf7.locale,unitTag:e.wpcf7.unitTag,containerPostId:e.wpcf7.containerPost,status:e.wpcf7.status,inputs:Array.from(c,(e=>{const t=e[0],a=e[1];return!t.match(/^_/)&&{name:t,value:a}})).filter((e=>!1!==e)),formData:c};r({endpoint:`contact-forms/${e.wpcf7.id}/feedback`,method:"POST",body:c,wpcf7:{endpoint:"feedback",form:e,detail:o}}).then((t=>{const r=n(e,t.status);return o.status=t.status,o.apiResponse=t,["invalid","unaccepted","spam","aborted"].includes(r)?a(e,r,o):["sent","failed"].includes(r)&&a(e,`mail${r}`,o),a(e,"submit",o),t})).then((t=>{t.posted_data_hash&&(e.querySelector('input[name="_wpcf7_posted_data_hash"]').value=t.posted_data_hash),"mail_sent"===t.status&&(e.reset(),e.wpcf7.resetOnMailSent=!0),t.invalid_fields&&t.invalid_fields.forEach((t=>{s(e,t.field,t.message)})),e.wpcf7.parent.querySelector('.screen-reader-response [role="status"]').insertAdjacentText("beforeend",t.message),e.querySelectorAll(".wpcf7-response-output").forEach((e=>{e.innerText=t.message}))})).catch((e=>console.error(e)))}r.use(((e,t)=>{if(e.wpcf7&&"feedback"===e.wpcf7.endpoint){const{form:t,detail:r}=e.wpcf7;d(t),a(t,"beforesubmit",r),n(t,"submitting")}return t(e)}));const d=e=>{e.querySelectorAll(".wpcf7-form-control-wrap").forEach((t=>{t.dataset.name&&i(e,t.dataset.name)})),e.wpcf7.parent.querySelector('.screen-reader-response [role="status"]').innerText="",e.querySelectorAll(".wpcf7-response-output").forEach((e=>{e.innerText=""}))};function f(e){const t=new FormData(e),c={contactFormId:e.wpcf7.id,pluginVersion:e.wpcf7.pluginVersion,contactFormLocale:e.wpcf7.locale,unitTag:e.wpcf7.unitTag,containerPostId:e.wpcf7.containerPost,status:e.wpcf7.status,inputs:Array.from(t,(e=>{const t=e[0],a=e[1];return!t.match(/^_/)&&{name:t,value:a}})).filter((e=>!1!==e)),formData:t};r({endpoint:`contact-forms/${e.wpcf7.id}/refill`,method:"GET",wpcf7:{endpoint:"refill",form:e,detail:c}}).then((t=>{e.wpcf7.resetOnMailSent?(delete e.wpcf7.resetOnMailSent,n(e,"mail_sent")):n(e,"init"),c.apiResponse=t,a(e,"reset",c)})).catch((e=>console.error(e)))}r.use(((e,t)=>{if(e.wpcf7&&"refill"===e.wpcf7.endpoint){const{form:t,detail:a}=e.wpcf7;d(t),n(t,"resetting")}return t(e)}));const u=(e,t)=>{for(const a in t){const n=t[a];e.querySelectorAll(`input[name="${a}"]`).forEach((e=>{e.value=""})),e.querySelectorAll(`img.wpcf7-captcha-${a.replaceAll(":","")}`).forEach((e=>{e.setAttribute("src",n)}));const r=/([0-9]+)\.(png|gif|jpeg)$/.exec(n);r&&e.querySelectorAll(`input[name="_wpcf7_captcha_challenge_${a}"]`).forEach((e=>{e.value=r[1]}))}},m=(e,t)=>{for(const a in t){const n=t[a][0],r=t[a][1];e.querySelectorAll(`.wpcf7-form-control-wrap[data-name="${a}"]`).forEach((e=>{e.querySelector(`input[name="${a}"]`).value="",e.querySelector(".wpcf7-quiz-label").textContent=n,e.querySelector(`input[name="_wpcf7_quiz_answer_${a}"]`).value=r}))}};function w(e){const a=new FormData(e);e.wpcf7={id:t(a.get("_wpcf7")),status:e.getAttribute("data-status"),pluginVersion:a.get("_wpcf7_version"),locale:a.get("_wpcf7_locale"),unitTag:a.get("_wpcf7_unit_tag"),containerPost:t(a.get("_wpcf7_container_post")),parent:e.closest(".wpcf7"),get schema(){return wpcf7.schemas.get(this.id)}},wpcf7.schemas.set(e.wpcf7.id,void 0),e.querySelectorAll(".has-spinner").forEach((e=>{e.insertAdjacentHTML("afterend",'<span class="wpcf7-spinner"></span>')})),(e=>{e.querySelectorAll(".wpcf7-exclusive-checkbox").forEach((t=>{t.addEventListener("change",(t=>{const a=t.target.getAttribute("name");e.querySelectorAll(`input[type="checkbox"][name="${a}"]`).forEach((e=>{e!==t.target&&(e.checked=!1)}))}))}))})(e),(e=>{e.querySelectorAll(".has-free-text").forEach((t=>{const a=t.querySelector("input.wpcf7-free-text"),n=t.querySelector('input[type="checkbox"], input[type="radio"]');a.disabled=!n.checked,e.addEventListener("change",(e=>{a.disabled=!n.checked,e.target===n&&n.checked&&a.focus()}))}))})(e),(e=>{e.querySelectorAll(".wpcf7-validates-as-url").forEach((e=>{e.addEventListener("change",(t=>{let a=e.value.trim();a&&!a.match(/^[a-z][a-z0-9.+-]*:/i)&&-1!==a.indexOf(".")&&(a=a.replace(/^\/+/,""),a="http://"+a),e.value=a}))}))})(e),(e=>{if(!e.querySelector(".wpcf7-acceptance")||e.classList.contains("wpcf7-acceptance-as-validation"))return;const t=()=>{let t=!0;e.querySelectorAll(".wpcf7-acceptance").forEach((e=>{if(!t||e.classList.contains("optional"))return;const a=e.querySelector('input[type="checkbox"]');(e.classList.contains("invert")&&a.checked||!e.classList.contains("invert")&&!a.checked)&&(t=!1)})),e.querySelectorAll(".wpcf7-submit").forEach((e=>{e.disabled=!t}))};t(),e.addEventListener("change",(e=>{t()})),e.addEventListener("wpcf7reset",(e=>{t()}))})(e),(e=>{const a=(e,a)=>{const n=t(e.getAttribute("data-starting-value")),r=t(e.getAttribute("data-maximum-value")),c=t(e.getAttribute("data-minimum-value")),o=e.classList.contains("down")?n-a.value.trim().length:a.value.trim().length;e.setAttribute("data-current-value",o),e.innerText=o,r&&r<a.value.length?e.classList.add("too-long"):e.classList.remove("too-long"),c&&a.value.length<c?e.classList.add("too-short"):e.classList.remove("too-short")},n=t=>{t={init:!1,...t},e.querySelectorAll(".wpcf7-character-count").forEach((n=>{const r=n.getAttribute("data-target-name"),c=e.querySelector(`[name="${r}"]`);c&&(c.value=c.defaultValue,a(n,c),t.init&&c.addEventListener("keyup",(e=>{a(n,c)})))}))};n({init:!0}),e.addEventListener("wpcf7reset",(e=>{n()}))})(e),window.addEventListener("load",(t=>{wpcf7.cached&&e.reset()})),e.addEventListener("reset",(t=>{wpcf7.reset(e)})),e.addEventListener("submit",(t=>{wpcf7.submit(e,{submitter:t.submitter}),t.preventDefault()})),e.addEventListener("wpcf7submit",(t=>{t.detail.apiResponse.captcha&&u(e,t.detail.apiResponse.captcha),t.detail.apiResponse.quiz&&m(e,t.detail.apiResponse.quiz)})),e.addEventListener("wpcf7reset",(t=>{t.detail.apiResponse.captcha&&u(e,t.detail.apiResponse.captcha),t.detail.apiResponse.quiz&&m(e,t.detail.apiResponse.quiz)})),e.addEventListener("change",(t=>{t.target.closest(".wpcf7-form-control")&&wpcf7.validate(e,{target:t.target})})),e.addEventListener("wpcf7statuschanged",(t=>{const a=t.detail.status;e.querySelectorAll(".active-on-any").forEach((e=>{e.removeAttribute("inert"),e.classList.remove("active-on-any")})),e.querySelectorAll(`.inert-on-${a}`).forEach((e=>{e.setAttribute("inert","inert"),e.classList.add("active-on-any")}))}))}document.addEventListener("DOMContentLoaded",(t=>{var a;if("undefined"!=typeof wpcf7)if(void 0!==wpcf7.api)if("function"==typeof window.fetch)if("function"==typeof window.FormData)if("function"==typeof NodeList.prototype.forEach)if("function"==typeof String.prototype.replaceAll){wpcf7={init:w,submit:p,reset:f,validate:o,schemas:new Map,...null!==(a=wpcf7)&&void 0!==a?a:{}},document.querySelectorAll("form .wpcf7[data-wpcf7-id]").forEach((t=>{const a=document.createElement("p");a.setAttribute("class","wpcf7-form-in-wrong-place");const n=document.createElement("strong");n.append((0,e.__)("Error:","contact-form-7"));const r=(0,e.__)("This contact form is placed in the wrong place.","contact-form-7");a.append(n," ",r),t.replaceWith(a)})),document.querySelectorAll(".wpcf7 > form").forEach((e=>{wpcf7.init(e),e.closest(".wpcf7").classList.replace("no-js","js")}));for(const e of wpcf7.schemas.keys())r({endpoint:`contact-forms/${e}/feedback/schema`,method:"GET"}).then((t=>{wpcf7.schemas.set(e,t)}))}else console.error("Your browser does not support String.replaceAll().");else console.error("Your browser does not support NodeList.forEach().");else console.error("Your browser does not support window.FormData().");else console.error("Your browser does not support window.fetch().");else console.error("wpcf7.api is not defined.");else console.error("wpcf7 is not defined.")}))})()</script> <script src="https://affiben.com/wp-content/themes/cocoon-master/plugins/highlight-js/highlight.min.js?ver=6.8.3&fver=20251015121912" id="code-highlight-js-js"></script> <script id="code-highlight-js-js-after">(function($){$(".entry-content pre").each(function(i,block){hljs.highlightBlock(block)})})(jQuery)</script> <script>!function(e,t){"use strict";"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t():e.baguetteBox=t()}(this,function(){"use strict";var r,l,u,c,d,f='<svg width="44" height="60"><polyline points="30 10 10 30 30 50" stroke="rgba(255,255,255,0.5)" stroke-width="4"stroke-linecap="butt" fill="none" stroke-linejoin="round"/></svg>',g='<svg width="44" height="60"><polyline points="14 10 34 30 14 50" stroke="rgba(255,255,255,0.5)" stroke-width="4"stroke-linecap="butt" fill="none" stroke-linejoin="round"/></svg>',p='<svg width="30" height="30"><g stroke="rgb(160,160,160)" stroke-width="4"><line x1="5" y1="5" x2="25" y2="25"/><line x1="5" y1="25" x2="25" y2="5"/></g></svg>',b={},v={captions:!0,buttons:"auto",fullScreen:!1,noScrollbars:!1,bodyClass:"baguetteBox-open",titleTag:!1,async:!1,preload:2,animation:"slideIn",afterShow:null,afterHide:null,onChange:null,overlayBackgroundColor:"rgba(0,0,0,.8)"},m={},h=[],o=0,n=!1,i={},a=!1,y=/.+\.(gif|jpe?g|png|webp|avif)$/i,w={},k=[],s=null,x=function(e){-1!==e.target.id.indexOf("baguette-img")&&j()},E=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,D()},C=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,X()},B=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,j()},T=function(e){i.count++,1<i.count&&(i.multitouch=!0),i.startX=e.changedTouches[0].pageX,i.startY=e.changedTouches[0].pageY},N=function(e){if(!a&&!i.multitouch){e.preventDefault?e.preventDefault():e.returnValue=!1;var t=e.touches[0]||e.changedTouches[0];40<t.pageX-i.startX?(a=!0,D()):t.pageX-i.startX<-40?(a=!0,X()):100<i.startY-t.pageY&&j()}},L=function(){i.count--,i.count<=0&&(i.multitouch=!1),a=!1},A=function(){L()},P=function(e){"block"===r.style.display&&r.contains&&!r.contains(e.target)&&(e.stopPropagation(),Y())};function S(e){if(w.hasOwnProperty(e)){var t=w[e].galleries;[].forEach.call(t,function(e){[].forEach.call(e,function(e){W(e.imageElement,"click",e.eventHandler)}),h===e&&(h=[])}),delete w[e]}}function F(e){switch(e.keyCode){case 37:D();break;case 39:X();break;case 27:j();break;case 36:!function t(e){e&&e.preventDefault();return M(0)}(e);break;case 35:!function n(e){e&&e.preventDefault();return M(h.length-1)}(e)}}function H(e,t){if(h!==e){for(h=e,function s(e){e=e||{};for(var t in v)b[t]=v[t],"undefined"!=typeof e[t]&&(b[t]=e[t]);l.style.transition=l.style.webkitTransition="fadeIn"===b.animation?"opacity .4s ease":"slideIn"===b.animation?"":"none","auto"===b.buttons&&("ontouchstart"in window||1===h.length)&&(b.buttons=!1);u.style.display=c.style.display=b.buttons?"":"none";try{r.style.backgroundColor=b.overlayBackgroundColor}catch(n){}}(t);l.firstChild;)l.removeChild(l.firstChild);for(var n,o=[],i=[],a=k.length=0;a<e.length;a++)(n=J("div")).className="full-image",n.id="baguette-img-"+a,k.push(n),o.push("baguetteBox-figure-"+a),i.push("baguetteBox-figcaption-"+a),l.appendChild(k[a]);r.setAttribute("aria-labelledby",o.join(" ")),r.setAttribute("aria-describedby",i.join(" "))}}function I(e){b.noScrollbars&&(document.documentElement.style.overflowY="hidden",document.body.style.overflowY="scroll"),"block"!==r.style.display&&(U(document,"keydown",F),i={count:0,startX:null,startY:null},q(o=e,function(){z(o),V(o)}),R(),r.style.display="block",b.fullScreen&&function t(){r.requestFullscreen?r.requestFullscreen():r.webkitRequestFullscreen?r.webkitRequestFullscreen():r.mozRequestFullScreen&&r.mozRequestFullScreen()}(),setTimeout(function(){r.className="visible",b.bodyClass&&document.body.classList&&document.body.classList.add(b.bodyClass),b.afterShow&&b.afterShow()},50),b.onChange&&b.onChange(o,k.length),s=document.activeElement,Y(),n=!0)}function Y(){b.buttons?u.focus():d.focus()}function j(){b.noScrollbars&&(document.documentElement.style.overflowY="auto",document.body.style.overflowY="auto"),"none"!==r.style.display&&(W(document,"keydown",F),r.className="",setTimeout(function(){r.style.display="none",document.fullscreen&&function e(){document.exitFullscreen?document.exitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen&&document.webkitExitFullscreen()}(),b.bodyClass&&document.body.classList&&document.body.classList.remove(b.bodyClass),b.afterHide&&b.afterHide(),s&&s.focus(),n=!1},500))}function q(t,n){var e=k[t],o=h[t];if(void 0!==e&&void 0!==o)if(e.getElementsByTagName("img")[0])n&&n();else{var i=o.imageElement,a=i.getElementsByTagName("img")[0],s="function"==typeof b.captions?b.captions.call(h,i):i.getAttribute("data-caption")||i.title,r=function d(e){var t=e.href;if(e.dataset){var n=[];for(var o in e.dataset)"at-"!==o.substring(0,3)||isNaN(o.substring(3))||(n[o.replace("at-","")]=e.dataset[o]);for(var i=Object.keys(n).sort(function(e,t){return parseInt(e,10)<parseInt(t,10)?-1:1}),a=window.innerWidth*window.devicePixelRatio,s=0;s<i.length-1&&i[s]<a;)s++;t=n[i[s]]||t}return t}(i),l=J("figure");if(l.id="baguetteBox-figure-"+t,l.innerHTML='<div class="baguetteBox-spinner"><div class="baguetteBox-double-bounce1"></div><div class="baguetteBox-double-bounce2"></div></div>',b.captions&&s){var u=J("figcaption");u.id="baguetteBox-figcaption-"+t,u.innerHTML=s,l.appendChild(u)}e.appendChild(l);var c=J("img");c.onload=function(){var e=document.querySelector("#baguette-img-"+t+" .baguetteBox-spinner");l.removeChild(e),!b.async&&n&&n()},c.setAttribute("src",r),c.alt=a&&a.alt||"",b.titleTag&&s&&(c.title=s),l.appendChild(c),b.async&&n&&n()}}function X(){return M(o+1)}function D(){return M(o-1)}function M(e,t){return!n&&0<=e&&e<t.length?(H(t,b),I(e),!0):e<0?(b.animation&&O("left"),!1):e>=k.length?(b.animation&&O("right"),!1):(q(o=e,function(){z(o),V(o)}),R(),b.onChange&&b.onChange(o,k.length),!0)}function O(e){l.className="bounce-from-"+e,setTimeout(function(){l.className=""},400)}function R(){var e=100*-o+"%";"fadeIn"===b.animation?(l.style.opacity=0,setTimeout(function(){m.transforms?l.style.transform=l.style.webkitTransform="translate3d("+e+",0,0)":l.style.left=e,l.style.opacity=1},400)):m.transforms?l.style.transform=l.style.webkitTransform="translate3d("+e+",0,0)":l.style.left=e}function z(e){e-o>=b.preload||q(e+1,function(){z(e+1)})}function V(e){o-e>=b.preload||q(e-1,function(){V(e-1)})}function U(e,t,n,o){e.addEventListener?e.addEventListener(t,n,o):e.attachEvent("on"+t,function(e){(e=e||window.event).target=e.target||e.srcElement,n(e)})}function W(e,t,n,o){e.removeEventListener?e.removeEventListener(t,n,o):e.detachEvent("on"+t,n)}function G(e){return document.getElementById(e)}function J(e){return document.createElement(e)}return[].forEach||(Array.prototype.forEach=function(e,t){for(var n=0;n<this.length;n++)e.call(t,this[n],n,this)}),[].filter||(Array.prototype.filter=function(e,t,n,o,i){for(n=this,o=[],i=0;i<n.length;i++)e.call(t,n[i],i,n)&&o.push(n[i]);return o}),{run:function K(e,t){return m.transforms=function n(){var e=J("div");return"undefined"!=typeof e.style.perspective||"undefined"!=typeof e.style.webkitPerspective}(),m.svg=function o(){var e=J("div");return e.innerHTML="<svg/"+">","http://www.w3.org/2000/svg"===(e.firstChild&&e.firstChild.namespaceURI)}(),m.passiveEvents=function i(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});window.addEventListener("test",null,t)}catch(n){}return e}(),function a(){if(r=G("baguetteBox-overlay"))return l=G("baguetteBox-slider"),u=G("previous-button"),c=G("next-button"),void(d=G("close-button"));(r=J("div")).setAttribute("role","dialog"),r.id="baguetteBox-overlay",document.getElementsByTagName("body")[0].appendChild(r),(l=J("div")).id="baguetteBox-slider",r.appendChild(l),(u=J("button")).setAttribute("type","button"),u.id="previous-button",u.setAttribute("aria-label","Previous"),u.innerHTML=m.svg?f:"<",r.appendChild(u),(c=J("button")).setAttribute("type","button"),c.id="next-button",c.setAttribute("aria-label","Next"),c.innerHTML=m.svg?g:">",r.appendChild(c),(d=J("button")).setAttribute("type","button"),d.id="close-button",d.setAttribute("aria-label","Close"),d.innerHTML=m.svg?p:"×",r.appendChild(d),u.className=c.className=d.className="baguetteBox-button",function n(){var e=m.passiveEvents?{passive:!1}:null,t=m.passiveEvents?{passive:!0}:null;U(r,"click",x),U(u,"click",E),U(c,"click",C),U(d,"click",B),U(l,"contextmenu",A),U(r,"touchstart",T,t),U(r,"touchmove",N,e),U(r,"touchend",L),U(document,"focus",P,!0)}()}(),S(e),function s(e,a){var t=document.querySelectorAll(e),n={galleries:[],nodeList:t};return w[e]=n,[].forEach.call(t,function(e){a&&a.filter&&(y=a.filter);var t=[];if(t="A"===e.tagName?[e]:e.getElementsByTagName("a"),0!==(t=[].filter.call(t,function(e){if(-1===e.className.indexOf(a&&a.ignoreClass))return y.test(e.href)})).length){var i=[];[].forEach.call(t,function(e,t){var n=function(e){e.preventDefault?e.preventDefault():e.returnValue=!1,H(i,a),I(t)},o={eventHandler:n,imageElement:e};U(e,"click",n),i.push(o)}),n.galleries.push(i)}}),n.galleries}(e,t)},show:M,showNext:X,showPrevious:D,hide:j,destroy:function e(){!function n(){var e=m.passiveEvents?{passive:!1}:null,t=m.passiveEvents?{passive:!0}:null;W(r,"click",x),W(u,"click",E),W(c,"click",C),W(d,"click",B),W(l,"contextmenu",A),W(r,"touchstart",T,t),W(r,"touchmove",N,e),W(r,"touchend",L),W(document,"focus",P,!0)}(),function t(){for(var e in w)w.hasOwnProperty(e)&&S(e)}(),W(document,"keydown",F),document.getElementsByTagName("body")[0].removeChild(document.getElementById("baguetteBox-overlay")),w={},h=[],o=0}}})</script> <script id="baguettebox-js-js-after">(function($){baguetteBox.run(".entry-content")})(jQuery)</script> <script>(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.ScrollHint=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";function assign(target,firstSource){if(target===undefined||target===null){throw new TypeError("Cannot convert first argument to object")}var to=Object(target);for(var i=1;i<arguments.length;i++){var nextSource=arguments[i];if(nextSource===undefined||nextSource===null){continue}var keysArray=Object.keys(Object(nextSource));for(var nextIndex=0,len=keysArray.length;nextIndex<len;nextIndex++){var nextKey=keysArray[nextIndex];var desc=Object.getOwnPropertyDescriptor(nextSource,nextKey);if(desc!==undefined&&desc.enumerable){to[nextKey]=nextSource[nextKey]}}}return to}function polyfill(){if(!Object.assign){Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:assign})}}module.exports={assign:assign,polyfill:polyfill}},{}],2:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1;descriptor.configurable=!0;if("value"in descriptor)descriptor.writable=!0;Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){if(protoProps)defineProperties(Constructor.prototype,protoProps);if(staticProps)defineProperties(Constructor,staticProps);return Constructor}}();var _es6ObjectAssign=require("es6-object-assign");var _util=require("./util");function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function")}}var defaults={suggestClass:"is-active",scrollableClass:"is-scrollable",scrollableRightClass:"is-right-scrollable",scrollableLeftClass:"is-left-scrollable",scrollHintClass:"scroll-hint",scrollHintIconClass:"scroll-hint-icon",scrollHintIconAppendClass:"",scrollHintIconWrapClass:"scroll-hint-icon-wrap",scrollHintText:"scroll-hint-text",scrollHintBorderWidth:10,remainingTime:-1,enableOverflowScrolling:!0,applyToParents:!1,suggestiveShadow:!1,offset:0,i18n:{scrollable:"scrollable"}};var ScrollHint=function(){function ScrollHint(ele,option){var _this=this;_classCallCheck(this,ScrollHint);this.opt=(0,_es6ObjectAssign.assign)({},defaults,option);this.items=[];var elements=typeof ele==="string"?document.querySelectorAll(ele):ele;var applyToParents=this.opt.applyToParents;[].forEach.call(elements,function(element){if(applyToParents){element=element.parentElement}element.style.position="relative";element.style.overflow="auto";if(_this.opt.enableOverflowScrolling){if("overflowScrolling"in element.style){element.style.overflowScrolling="touch"}else if("webkitOverflowScrolling"in element.style){element.style.webkitOverflowScrolling="touch"}}var item={element:element,scrolledIn:!1,interacted:!1};document.addEventListener("scroll",function(e){if(e.target===element){item.interacted=!0;_this.updateItem(item)}},!0);(0,_util.addClass)(element,_this.opt.scrollHintClass);(0,_util.append)(element,'<div class="'+_this.opt.scrollHintIconWrapClass+'" data-target="scrollable-icon">\n <span class="'+_this.opt.scrollHintIconClass+(_this.opt.scrollHintIconAppendClass?" "+_this.opt.scrollHintIconAppendClass:"")+'">\n <span class="'+_this.opt.scrollHintText+'">'+_this.opt.i18n.scrollable+"</span>\n </span>\n </div>");_this.items.push(item)});window.addEventListener("scroll",function(){_this.updateItems()});window.addEventListener("resize",function(){_this.updateItems()});this.updateItems()}_createClass(ScrollHint,[{key:"isScrollable",value:function isScrollable(item){var offset=this.opt.offset;var element=item.element;var offsetWidth=element.offsetWidth;return offsetWidth+offset<element.scrollWidth}},{key:"checkScrollableDir",value:function checkScrollableDir(item){var _opt=this.opt,scrollHintBorderWidth=_opt.scrollHintBorderWidth,scrollableRightClass=_opt.scrollableRightClass,scrollableLeftClass=_opt.scrollableLeftClass;var element=item.element;var child=element.children[0];var width=child.scrollWidth;var parentWidth=element.offsetWidth;var scrollLeft=element.scrollLeft;if(parentWidth+scrollLeft<width-scrollHintBorderWidth){(0,_util.addClass)(element,scrollableRightClass)}else{(0,_util.removeClass)(element,scrollableRightClass)}if(parentWidth<width&&scrollLeft>scrollHintBorderWidth){(0,_util.addClass)(element,scrollableLeftClass)}else{(0,_util.removeClass)(element,scrollableLeftClass)}}},{key:"needSuggest",value:function needSuggest(item){var scrolledIn=item.scrolledIn,interacted=item.interacted;return!interacted&&scrolledIn&&this.isScrollable(item)}},{key:"updateItems",value:function updateItems(){var _this2=this;[].forEach.call(this.items,function(item){_this2.updateItem(item)})}},{key:"updateStatus",value:function updateStatus(item){var _this3=this;var element=item.element,scrolledIn=item.scrolledIn;if(scrolledIn){return}if((0,_util.getOffset)(element).top+element.offsetHeight/2<(0,_util.getScrollTop)()+window.innerHeight){item.scrolledIn=!0;if(this.opt.remainingTime!==-1){setTimeout(function(){item.interacted=!0;_this3.updateItem(item)},this.opt.remainingTime)}}}},{key:"updateItem",value:function updateItem(item){var opt=this.opt;var element=item.element;var target=element.querySelector('[data-target="scrollable-icon"]');this.updateStatus(item);if(this.isScrollable(item)){(0,_util.addClass)(element,opt.scrollableClass)}else{(0,_util.removeClass)(element,opt.scrollableClass)}if(this.needSuggest(item)){(0,_util.addClass)(target,opt.suggestClass)}else{(0,_util.removeClass)(target,opt.suggestClass)}if(opt.suggestiveShadow){this.checkScrollableDir(item)}}}]);return ScrollHint}();exports.default=ScrollHint;module.exports=exports["default"]},{"./util":3,"es6-object-assign":1}],3:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var append=exports.append=function append(element,string){var div=document.createElement("div");div.innerHTML=string;while(div.children.length>0){element.appendChild(div.children[0])}};var addClass=exports.addClass=function addClass(element,className){if(element.classList){element.classList.add(className)}else{element.className+=" "+className}};var removeClass=exports.removeClass=function removeClass(element,className){if(element.classList){element.classList.remove(className)}else{element.className=element.className.replace(new RegExp("(^|\\b)"+className.split(" ").join("|")+"(\\b|$)","gi")," ")}};var getScrollTop=exports.getScrollTop=function getScrollTop(){return window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0};var getScrollLeft=exports.getScrollLeft=function getScrollLeft(){return window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0};var getOffset=exports.getOffset=function getOffset(el){var rect=el.getBoundingClientRect();return{top:rect.top+getScrollTop(),left:rect.left+getScrollLeft()}}},{}]},{},[2])(2)})</script> <script id="scrollhint-js-js-after">(function($){new ScrollHint(".scrollable-table",{suggestiveShadow:!0,i18n:{scrollable:"スクロールできます"}})})(jQuery)</script> <script>!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.lozad=e()}(this,function(){"use strict";var g=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},r="undefined"!=typeof document&&document.documentMode,l={rootMargin:"0px",threshold:0,load:function(t){if("picture"===t.nodeName.toLowerCase()){var e=document.createElement("img");r&&t.getAttribute("data-iesrc")&&(e.src=t.getAttribute("data-iesrc")),t.getAttribute("data-alt")&&(e.alt=t.getAttribute("data-alt")),t.appendChild(e)}t.getAttribute("data-src")&&(t.src=t.getAttribute("data-src")),t.getAttribute("data-srcset")&&t.setAttribute("srcset",t.getAttribute("data-srcset")),t.getAttribute("data-background-image")&&(t.style.backgroundImage="url('"+t.getAttribute("data-background-image")+"')"),t.getAttribute("data-toggle-class")&&t.classList.toggle(t.getAttribute("data-toggle-class"))},loaded:function(){}};function f(t){t.setAttribute("data-loaded",!0)}var b=function(t){return"true"===t.getAttribute("data-loaded")};return function(){var r,o,a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:".lozad",t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},e=g({},l,t),n=e.root,i=e.rootMargin,d=e.threshold,u=e.load,c=e.loaded,s=void 0;return window.IntersectionObserver&&(s=new IntersectionObserver((r=u,o=c,function(t,e){t.forEach(function(t){(0<t.intersectionRatio||t.isIntersecting)&&(e.unobserve(t.target),b(t.target)||(r(t.target),f(t.target),o(t.target)))})}),{root:n,rootMargin:i,threshold:d})),{observe:function(){for(var t=function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:document;return t instanceof Element?[t]:t instanceof NodeList?t:e.querySelectorAll(t)}(a,n),e=0;e<t.length;e++)b(t[e])||(s?s.observe(t[e]):(u(t[e]),f(t[e]),c(t[e])))},triggerLoad:function(t){b(t)||(u(t),f(t),c(t))},observer:s}}})</script> <script id="lazy-load-js-js-after">const observer=lozad(".lozad",{rootMargin:"0px 500px 500px"});observer.observe()</script> <script>window.addComment=function(v){var I,C,h,E=v.document,b={commentReplyClass:"comment-reply-link",commentReplyTitleId:"reply-title",cancelReplyId:"cancel-comment-reply-link",commentFormId:"commentform",temporaryFormId:"wp-temp-form-div",parentIdFieldId:"comment_parent",postIdFieldId:"comment_post_ID"},e=v.MutationObserver||v.WebKitMutationObserver||v.MozMutationObserver,r="querySelector"in E&&"addEventListener"in v,n=!!E.documentElement.dataset;function t(){d(),e&&new e(o).observe(E.body,{childList:!0,subtree:!0})}function d(e){if(r&&(I=g(b.cancelReplyId),C=g(b.commentFormId),I)){I.addEventListener("touchstart",l),I.addEventListener("click",l);function t(e){if((e.metaKey||e.ctrlKey)&&13===e.keyCode&&"a"!==E.activeElement.tagName.toLowerCase())return C.removeEventListener("keydown",t),e.preventDefault(),C.submit.click(),!1}C&&C.addEventListener("keydown",t);for(var n,d=function(e){var t=b.commentReplyClass;e&&e.childNodes||(e=E);e=E.getElementsByClassName?e.getElementsByClassName(t):e.querySelectorAll("."+t);return e}(e),o=0,i=d.length;o<i;o++)(n=d[o]).addEventListener("touchstart",a),n.addEventListener("click",a)}}function l(e){var t,n,d=g(b.temporaryFormId);d&&h&&(g(b.parentIdFieldId).value="0",t=d.textContent,d.parentNode.replaceChild(h,d),this.style.display="none",n=(d=(d=g(b.commentReplyTitleId))&&d.firstChild)&&d.nextSibling,d&&d.nodeType===Node.TEXT_NODE&&t&&(n&&"A"===n.nodeName&&n.id!==b.cancelReplyId&&(n.style.display=""),d.textContent=t),e.preventDefault())}function a(e){var t=g(b.commentReplyTitleId),t=t&&t.firstChild.textContent,n=this,d=m(n,"belowelement"),o=m(n,"commentid"),i=m(n,"respondelement"),r=m(n,"postid"),n=m(n,"replyto")||t;d&&o&&i&&r&&!1===v.addComment.moveForm(d,o,i,r,n)&&e.preventDefault()}function o(e){for(var t=e.length;t--;)if(e[t].addedNodes.length)return void d()}function m(e,t){return n?e.dataset[t]:e.getAttribute("data-"+t)}function g(e){return E.getElementById(e)}return r&&"loading"!==E.readyState?t():r&&v.addEventListener("DOMContentLoaded",t,!1),{init:d,moveForm:function(e,t,n,d,o){var i,r,l,a,m,c,s,e=g(e),n=(h=g(n),g(b.parentIdFieldId)),y=g(b.postIdFieldId),p=g(b.commentReplyTitleId),u=(p=p&&p.firstChild)&&p.nextSibling;if(e&&h&&n){void 0===o&&(o=p&&p.textContent),a=h,m=b.temporaryFormId,c=g(m),s=(s=g(b.commentReplyTitleId))?s.firstChild.textContent:"",c||((c=E.createElement("div")).id=m,c.style.display="none",c.textContent=s,a.parentNode.insertBefore(c,a)),d&&y&&(y.value=d),n.value=t,I.style.display="",e.parentNode.insertBefore(h,e.nextSibling),p&&p.nodeType===Node.TEXT_NODE&&(u&&"A"===u.nodeName&&u.id!==b.cancelReplyId&&(u.style.display="none"),p.textContent=o),I.onclick=function(){return!1};try{for(var f=0;f<C.elements.length;f++)if(i=C.elements[f],r=!1,"getComputedStyle"in v?l=v.getComputedStyle(i):E.documentElement.currentStyle&&(l=i.currentStyle),(i.offsetWidth<=0&&i.offsetHeight<=0||"hidden"===l.visibility)&&(r=!0),"hidden"!==i.type&&!i.disabled&&!r){i.focus();break}}catch(e){}return!1}}}}(window)</script> <script id="cocoon-js-js-extra">var cocoon_localize_script_options={"is_lazy_load_enable":"1","is_fixed_mobile_buttons_enable":"1","is_google_font_lazy_load_enable":"1"}</script> <script>(function($){var prevScrollTop=-1;var $window=$(window);$window.scroll(function(){var scrollTop=$window.scrollTop();var threashold=600;var s1=(prevScrollTop>threashold);var s2=(scrollTop>threashold);if(s1^s2){if(s2){$('.body').addClass('go-to-top-visible')}else{$('.go-to-top-common').removeClass('go-to-top-up');$('.body').removeClass('go-to-top-visible')}} prevScrollTop=scrollTop});$('.go-to-top-common').click(function(){$(this).addClass('go-to-top-up');$('body,html').animate({scrollTop:1},800)});$('.go-to-toc-common').click(function(){$('body,html').animate({scrollTop:$('.entry-content .toc').offset().top},800)});$('#search-menu-input').change(function(e){var searchEdit=$('#search-menu-content .search-edit').first();if(e.target.checked){searchEdit.focus()}else{searchEdit.blur()}});var adminMenu=$("#admin-panel");var adminHeight=adminMenu.outerHeight();var adminStartPos=0;$(window).scroll(function(){var adminCurrentPos=$(this).scrollTop();if(adminCurrentPos>adminStartPos){if(adminCurrentPos>=200){adminMenu.css("bottom","-"+adminHeight+"px")}}else{adminMenu.css("bottom",0)} adminStartPos=adminCurrentPos});if(cocoon_localize_script_options.is_fixed_mobile_buttons_enable!=1){var headerMenu=$('.mobile-header-menu-buttons');var headerHight=headerMenu.outerHeight();var headerStartPos=0;$(window).scroll(function(){var headerCurrentPos=$(this).scrollTop();if(headerCurrentPos>headerStartPos){if(headerCurrentPos>=100){headerMenu.css('top','-'+headerHight+'px')}}else{headerMenu.css('top',0)} headerStartPos=headerCurrentPos});var footerMenu=$(".mobile-footer-menu-buttons");var footerHeight=footerMenu.outerHeight();var footerStartPos=0;$(window).scroll(function(){var footerCurrentPos=$(this).scrollTop();if(footerCurrentPos>footerStartPos){if(footerCurrentPos>=100){footerMenu.css("bottom","calc( -1 * (env(safe-area-inset-bottom) + "+footerHeight+"px) )")}}else if(footerCurrentPos-footerStartPos<-8){footerMenu.css("bottom",0)} footerStartPos=footerCurrentPos});var headerButtons=$(".mobile-header-menu-buttons");var footerButtons=$(".mobile-footer-menu-buttons");headerButtons.click(function(){headerButtons.css("z-index","3");footerButtons.css("z-index","2")});footerButtons.click(function(){headerButtons.css("z-index","2");footerButtons.css("z-index","3")})} const clickEventType=((window.ontouchstart!==null)?'click':'touchend');$(document).on(clickEventType,'#comment-reply-btn, .comment-reply-link',function(){$('#comment-reply-btn').slideUp();const respond=document.getElementById('respond');const styles={inset:'auto',position:'static',visibility:'visible'};Object.entries(styles).forEach(([key,value])=>{respond.style[key]=value});$('#respond').slideDown()});$('.sbtn').click(function(){var w=$(this).prev('.sform').text();if(w)window.open('https://www.google.co.jp/search?q='+encodeURIComponent(w),'_blank');});$('.sidebar-menu-content .widget_archive select').change(function(){document.location.href=this.options[this.selectedIndex].value});$('.sidebar-menu-content .widget_categories select').change(function(){if(this.options[this.selectedIndex].value>0){this.parentNode.submit()}});function drawerCloser(selecter,checkbox){$(selecter).click(function(){$(checkbox).prop('checked',!1)})} drawerCloser('.menu-drawer .menu-item a','#navi-menu-input');drawerCloser('#slide-in-sidebar a','#sidebar-menu-input');$('.mobile-menu-buttons').each(function(){if($(this).has('.logo-menu-button').length){$(this).addClass('has-logo-button')}});$(window).on('load',function(){$('#carousel').addClass('loaded')});$('.is-style-accordion > .faq > .faq-answer').hide();$('.is-style-accordion > .faq > .faq-question').click(function(){$(this).next('.is-style-accordion .faq-answer').slideToggle();$(this).toggleClass('active')});$(document).on("change",'#sidebar-menu-input',function(){if($(this).prop('checked')){$('#sidebar').appendTo('#sidebar-menu-content');$('#sidebar').attr('id','slide-in-sidebar');$('#sidebar').addClass('slide-in-sidebar');drawerCloser('#slide-in-sidebar a','#sidebar-menu-input')}else{$('#sidebar').removeClass('slide-in-sidebar');$('#slide-in-sidebar').attr('id','sidebar');$('#sidebar').insertAfter('#main')}});var vw=window.innerWidth;$(window).resize(function(){if(vw!=window.innerWidth){$('#sidebar-menu-input').prop('checked',!1).change()} vw=window.innerWidth})})(jQuery);(function(){var f=document.querySelectorAll(".video-click");for(var i=0;i<f.length;++i){f[i].onclick=function(){var iframe=this.getAttribute("data-iframe");this.parentElement.innerHTML='<div class="video"'+'>'+iframe+'</div'+'>'}}})()</script> <script></script> <script src="https://www.google.com/recaptcha/api.js?render=6LdDD48qAAAAAMpWTw2yDucIrt2HNnpnf2GOt_xC&ver=3.0" id="google-recaptcha-js"></script> <script src="https://affiben.com/wp-includes/js/dist/vendor/wp-polyfill.min.js?ver=3.15.0&fver=20250515010659" id="wp-polyfill-js"></script> <script id="wpcf7-recaptcha-js-before">var wpcf7_recaptcha={"sitekey":"6LdDD48qAAAAAMpWTw2yDucIrt2HNnpnf2GOt_xC","actions":{"homepage":"homepage","contactform":"contactform"}}</script> <script>document.addEventListener("DOMContentLoaded",(e=>{var t;wpcf7_recaptcha={...null!==(t=wpcf7_recaptcha)&&void 0!==t?t:{}};const c=wpcf7_recaptcha.sitekey,{homepage:n,contactform:a}=wpcf7_recaptcha.actions,o=e=>{const{action:t,func:n,params:a}=e;grecaptcha.execute(c,{action:t}).then((e=>{const c=new CustomEvent("wpcf7grecaptchaexecuted",{detail:{action:t,token:e}});document.dispatchEvent(c)})).then((()=>{"function"==typeof n&&n(...a)})).catch((e=>console.error(e)))};if(grecaptcha.ready((()=>{o({action:n})})),document.addEventListener("change",(e=>{o({action:a})})),"undefined"!=typeof wpcf7&&"function"==typeof wpcf7.submit){const e=wpcf7.submit;wpcf7.submit=(t,c={})=>{o({action:a,func:e,params:[t,c]})}}document.addEventListener("wpcf7grecaptchaexecuted",(e=>{const t=document.querySelectorAll('form.wpcf7-form input[name="_wpcf7_recaptcha_response"]');for(let c=0;c<t.length;c++)t[c].setAttribute("value",e.detail.token)}))}));</script> </div> </body> </html>