Cocoon 【Cocoon】SNSでURLをシェアしたときの画像、ちゃんと設定できてる？OGP設定方法
SNSでサイトや記事をシェアしたときにOGP画像を表示する方法をご紹介します。意外と設定していないデフォルトの方が多いのでは？イメージを伝えて読者に訪れてもらえるようなサイトにしましょう。
Cocoon 
Cocoon Cocoon人気記事ランキング｜表示方法とラベルの色やスタイルを変更するカスタマイズ
Cocoonテーマには独自のアクセス集計機能が搭載されており、そのデータを元に人気記事ランキングを簡単に作成できます。サイドバーやトップページに設置すれば、読者...
Cocoon Cocoonナビカードの使い方｜目立たせたい記事をピックアップ表示する方法、リボンのカスタマイズ
Cocoonテーマには、特定の記事を目立たせたいときに便利な 「ナビカード」 機能が標準で搭載されています。新着記事や人気記事のような自動表示とは違い、「読んで...
CSSの基礎 CSSで疑似要素に影をつける！box-shadowとfilter: drop-shadowの使い分けを徹底解説
CSSを使って疑似要素に影をつける方法を初心者にもわかりやすく解説します。特に、吹き出しのような複雑な形状の要素に影を適用する際のテクニックを紹介します。使用す...
Cocoon 超簡単！Cocoonのブロック機能でサイト型トップページを作る方法
更新情報：読者の実例集に以下のサイトを掲載しました。2025.10.10｜MakalikaMalama2025.10.09｜ちあログ2025.10.02｜手帳と...
アフィリエイト ポチップの使い方と機能まとめ｜商品リンク・セール表示・インラインの活用法を解説
ポチップは、Amazon・楽天市場・Yahoo!に加えて、メルカリやカスタムリンクもまとめて扱える物販アフィリエイト向けプラグインです。直感的に操作できる編集画...
アフィリエイト 【ポチップ対応】物販ASPの選び方・設定方法｜Amazon・楽天・Yahoo提携できるサービスを比較
見出し2025.11.28_PA-API（Amazon）利用についての内容を一部更新しました。アフィリエイトを始めたときにまず迷うのが、「どのASP（アフィリエ...
サイト設定 途中でパーマリンク変更できる？エックスサーバーでの設定方法｜日付を消して投稿名に
途中からパーマリンクを変更しても大丈夫なの？そんな不安を感じていませんか。WordPressでは、日付入りパーマリンクから「投稿名」への変更は可能です。ただし、...
テーマ共通 CSSコピペOK！見出しをカスタマイズ｜おしゃれデザインサンプル集【Cocoon対応】
見出しデザインを工夫するだけで、記事の読みやすさや視認性がぐっと向上しサイト全体の印象も大きく変わります。この記事では、WordPress（一部無料ブログ）全般...
Cocoon 【Cocoon】CTAボックスの作り方と活用法｜アフィリエイトリンクを効果的に配置
成果を出すサイトには欠かせないのが「CTA（Call to Action）」。「今すぐ登録」「購入する」といった行動を促すボタンやメッセージがあるだけで、読者の...
CSSの基礎 WordPress「追加CSSクラス」活用法｜特定ブロックだけデザインを変える方法
WordPressのブロックエディタで、特定のブロックだけにデザインを追加できることをご存知ですか？「ボタンの色を変えたい」「箇条書きリストに下線を引きたい」「...
テーマ共通 動きで魅せる！ホバーアニメーションボタン・おしゃれな矢印リンク＆下線スライド（CSS付き）
他のサイトで見かける「このリンクデザインおしゃれ！」や「ボタンの動きがいいな」といった演出。どうやって作られているの？実は、CSSだけで簡単に再現できるデザイン...
Cocoon Cocoon白抜きボックスをおしゃれにカスタマイズ！複数デザインの使い分け方法
Cocoonの段落装飾は便利ですが、箇条書きなどのブロック要素を入れられない弱点があります。「注意書きをまとめたいのにリストが使えない…」「ボックス内に複数の要...
Cocoon Cocoon検索ボックスをアピールエリアに表示する方法｜HTMLテンプレート化で簡単実装
2025.12.04 手順をよりシンプル（簡単）に修正しました。Cocoonの「アピールエリア」、そのまま使っていませんか？ここに検索フォームを設置すると、ユー...
Cocoon Cocoonカスタマイズ｜HTML・CSS・JavaScript・PHPの使い分けと編集方法
Cocoonは無料テーマの中でも柔軟にカスタマイズできるテーマですが、「どこを編集すればいいの？」「HTMLとCSSとPHPの違いがわからない…」という初心者は...
Cocoon Cocoonアピールエリア｜画面いっぱいのフルスクリーン＋スクロール矢印・ズーム演出するカスタマイズ
Cocoonの「アピールエリア」はサイトの第一印象を決める重要なパーツ。ここを整えるだけでトップページの見栄え・ブランド感・読者の滞在率が大きく変わります。この...
テーマ共通 複数画像を切り替えるフェードスライダーの作り方｜CSSアニメーション（JavaScript不要）
トップページにスライダーを置くと、ファーストビューが一気に引き締まりサイトの印象を大きく高められます。なかでも、CSSで作るスライダーはJavaScript不要...
Cocoon Cocoon「タブ見出しボックス」を自由にデザイン｜コピペで使える8種のオリジナルスタイル
見出し2025.11.04更新：選べるデザインに「マスキングテープ風」を追加しました。Cocoonの「タブ見出しボックス」は、自由に見出しや色設定ができる汎用性...
テーマ共通 タブ切り替えをHTMLとCSSで実装（JavaScriptなし）
通常タブ切り替えはJavaScriptを使って実装するケースが多いですが、実は CSSだけ でも作れます。この記事では、:checked 疑似クラスや :has...
CSSの基礎 【初心者向け】CSSカスタマイズの基本｜WEBデザインを自由に変える方法
ブログデザインをもっと自分らしく作りたいと感じたことはありませんか？自分好みにカスタマイズするためには、テーマ独自の設定を使う以外には基本的にCSS（Casca...