サイト型トップページの作り方を公開しています!Check
Cocoon

Cocoonブログカードの表示要素を編集画面で切替|クリック率が上がる12スタイル(コピペOK)

更新情報2026/1/7 テキストリンクスタイル:アイコン・フォントの微調整をおこないました縦型スタイルを1種類追加しましたCocoonでブログカードを使ってい...
テーマ共通

CSS・SVGで作る境界線と背景デザイン|波、三角形、斜めラインを使ったおしゃれな装飾テクニック

Webデザインでは、ちょっとした工夫で見た目の印象を大きく変えることができます。その中でもおすすめなのが「境界線」や「背景スタイル」のデザイン。線や背景にアクセ...
サイト設定

Googleアドセンス審査用コードの貼り方|WordPress・Cocoon対応ガイド

Googleアドセンスに申請するときには、審査用のコードを自分のサイトの <head> 内に貼り付ける必要があります。このコードを正しく設置できないと審査が始ま...
Cocoon

Cocoonサイト型トップページの作り方|シンプル&おしゃれデザイン【HTML・CSSコピペOK】

トップページの第一印象が平凡で、他サイトと似てしまう……そんなお悩みありませんか?この記事では、Cocoonの固定ページとHTML・CSSで作る「サイト型トップ...
テーマ共通

複数画像を切り替えるフェードスライダーの作り方|CSSアニメーション(JavaScript不要)

トップページにおしゃれな画像スライダーを置きたいけれど、「表示が重くなる」「JavaScriptの管理が不安」「できるだけシンプルに実装したい」と感じている方も...
テーマ共通

タブ切り替えをHTMLとCSSで実装(JavaScriptなし)

通常タブ切り替えはJavaScriptを使って実装するケースが多いですが、実は CSSだけ でも作れます。この記事では、:checked 疑似クラスや :has...
Cocoon

Cocoonで全幅(フルワイド)デザイン!幅いっぱいにする仕組みとおしゃれに仕上げるポイントを解説

Cocoonでも、有料テーマSWELLのようなフルワイド(全幅)デザインは再現できます。「SWELLのように幅いっぱいに表示したい」「でもCocoonだと余白調...
Cocoon

【Cocoon】CTAボックスの作り方と活用法|アフィリエイトリンクを効果的に配置

成果の出るサイト運営で見落とせないのが CTA(Call to Action)。「今すぐ見る」「この記事をチェック」など、読者の行動を後押しする導線があるだけで...
テーマ共通

CSSでなめらかに点滅させる方法(コピペOK)

要素を「点滅」させるアニメーションは、注意を引きたいときセールやキャンペーンの強調警告や注意メッセージの表示などに効果的です。この記事では、「ゆっくり、なめらか...
Cocoon

超簡単!Cocoonブロック機能でサイト型トップページを作る方法|コード最小限・初心者向け

Cocoonでオリジナルのトップページを作りたいけど、どこから始めればいいの?そんなふうに迷っている方も多いのではないでしょうか。この記事では、WordPres...
Cocoon

Cocoonナビカードの設定と使い方|記事ピックアップ・レイアウト調整・リボンカスタマイズ

Cocoonテーマには、特定の記事を目立たせたいときに便利な 「ナビカード」 機能が標準で搭載されています。新着記事や人気記事のような自動表示とは違い、「読んで...
Cocoon

Cocoon新着・人気記事・ナビカードを横並びに!カラム数をワンクリックで変更する方法

Cocoonの新着記事・人気記事・ナビカードを横並びに表示する方法を解説。PC3列・スマホ2列などカラム数もワンクリックで切り替え可能。コピペで簡単導入できます。
Cocoon

Cocoonタイムライン(ステップブロック)おしゃれ化カスタマイズ|最大6種類のデザイン切り替え

Cocoonの「タイムライン」ブロックは、手順解説や申し込みフローの表示にぴったり。しかし、デフォルトのままだと「見た目がシンプルすぎる」「ブロックごとに変えら...
アフィリエイト

ポチップ|Amazon商品検索まとめ(PA-API・Pochipp Assist・もしもアフィリエイトの違いを比較)

見出し2025.11.28_PA-API利用についての内容を一部更新しました。ポチップを使ってAmazonの商品を検索したいけれど、最初に戸惑いやすいのが「PA...
Cocoon

Cocoon「見出しボックス」リストマーカー(点)の色を自動調整&デザイン切り替えカスタマイズ

Cocoonの「見出しボックス」をもっとおしゃれに、もっと便利に。「リストの点がテーマカラーと合わない」「記事の内容に合わせて、デザインを切り替えたい」そんな方...
Cocoon

Cocoonウィジェット・ショートコードで新着記事・人気記事に日付を表示する方法(投稿日・更新日)

Cocoonでは、新着記事・人気記事をブロック/ウィジェット/ショートコードの3通りで表示できます。投稿日や更新日の日付はデフォルトでは非表示ですが、表示方法に...
CSSの基礎

WordPress「追加CSSクラス」活用法|特定ブロックだけデザインを変える方法

WordPressのブロックエディタで、特定のブロックだけにデザインを追加できることをご存知ですか?「ボタンの色を変えたい」「箇条書きリストに下線を引きたい」「...
サイト設定

エックスサーバー|サブドメイン設定で2つめのブログ(複数サイト)を作る方法

もうひとつブログを作りたいな~と思うことはありませんか?今のブログとは別のジャンルに挑戦したいときや、雑記ブログから人気のジャンルだけを切り分けたいときなど、運...
テーマ共通

同じページ内にジャンプ!HTMLアンカーリンクの正しい設定方法と使い方ガイド

長い記事の中で「ここを読みたいのにスクロールが面倒…」という経験はありませんか?そんな問題を解決してくれるのが アンカーリンク(ページ内リンク) です。目次・F...
サイト設定

ブログ初心者必見!Googleアドセンス審査に通る条件と合格のコツ

Googleアドセンスの仕組みと審査合格のポイントを解説。必要な準備や注意点、不合格時の対処法もまとめています。
スポンサーリンク