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

WordPress同期パターンの使い方(再利用ブロック)!テンプレで時短化

WordPressの「パターン」機能、使ったことはありますか?これは、特定のブロックやブロックグループを登録して他の投稿やページでも簡単に再利用できる便利な機能です。例えば、よく使う装飾ボックスやボタン付きのコールトゥアクションなどをパター...
Cocoon

Cocoonアコーディオン(トグル)をカスタマイズ!10種類のデザインでスッキリ魅せる

WordPressテーマ「Cocoon」のアコーディオンボックス、使っていますか?情報量の多いページでも、クリックで内容を折りたたんでスッキリ整理できる便利な機能です。でも、デフォルトのデザインは1種類だけ。アコーディオンコンテンツ左寄せデ...
テーマ共通

ワードプレスCSS・PHPバックアップ方法|FTPで安全カスタマイズ

CSSを編集してサイトのデザインをカスタマイズしたいけど「もし失敗したらどうしよう…」と不安に感じることがあるかと思います。ほんの少しのCSS編集でも、事前にバックアップを取っておくことでトラブルへの備えができ、安心して作業を進めることがで...
Cocoon

Cocoonでフルワイドデザイン!幅いっぱいのおしゃれなトップページの作り方

WordPressテーマ「Cocoon」はシンプルで使いやすい一方、SWELLのような洗練されたフルワイドデザインを再現するにはちょっとしたコツが必要です。「おしゃれなトップページにしたい」「全幅の背景色や画像で目を引くデザインを作りたい」...
Cocoon

Cocoonのタブ見出しボックスを簡単デザイン切り替え!有料テーマ風カスタマイズ

Cocoonテーマの「タブ見出しボックス」、もっとおしゃれに、もっと自由に使いこなしてみませんか?見出しCocoonのタブ見出しボックスこのボックスはシンプルで使いやすいのが魅力ですが、余白を持たせてすっきりとしたデザインにしたいページ内で...
Cocoon

Cocoonボックスメニューのカラム数をクリックで変更する|2〜6列対応のカスタマイズ方法

WordPressの無料テーマ「Cocoon」には、サイト内の導線設計に便利な「ボックスメニュー」機能があります。見た目がシンプルでアイコン付きのメニューをブロック形式で直感的に配置できるため使っているサイトを多く見かける定番機能。以下の3...
Cocoon

Cocoonのタブブロックをもっと便利に!サイドバーでデザインを選べる着せ替え機能

Cocoonテーマ(2.7.3~)に待望の「タブブロック」が標準搭載!直感的な操作でタブ切り替え表示ができるようになり、「情報をコンパクトにまとめたい」「見た目を整理したい」といった要望にも手軽に応えられるようになりました。Tab 1Tab...
Cocoon

Cocoonの白抜きボックスをカスタマイズ|複数スタイルと簡単切り替え方法を解説

Cocoonテーマの「白抜きボックス」、使っていますか?箇条書きリストなどのブロックが挿入できるボーダー色や背景色を自由に変更できるシンプルなデザインながら使い勝手の良さが抜群!視認性が高い万能ボックスですが...「もっとデザインにバリエー...
Cocoon

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

Cocoonテーマはとても便利。「新着記事」「人気記事」「ナビカード」などのブロック機能が用意されていて、トップページの作成も簡単です。ただ、こんなお悩みを感じたことはないでしょうか?記事カードを横並び(カラム形式)で見せたいカラム数を自由...
Cocoon

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

CTAボックス、使ってみませんか?CTA(Call to Action)は、読者に「次の一歩」を踏み出してもらうための大切なツール。例えば、「今すぐ登録」「詳しくはこちら」「購入する」といったボタンやメッセージがそれにあたります。特にアフィ...
テーマ共通

サイトに「動き」をつけるCSSアニメーション|基本的な指定方法を覚えよう

この記事では、CSSアニメーションの基本的な指定方法やプロパティの使い方について解説します。サイトに「動き」といえばJavascriptが必要?というイメージがあるかもしれませんが、アニメーションを使うことでCSSでもウェブページに動きをつ...
テーマ共通

同じページ内にジャンプ!HTMLを利用したアンカーリンクの設定方法

この記事では、アンカーリンクの設定方法と効果的な使い方について解説します。アンカーリンクはページ内の特定の位置や他のページの特定の場所に直接ジャンプするリンクのことです。ユーザーが目的の情報に素早くアクセスできるため、長いページやナビゲーシ...
テーマ共通

WordPressの「追加CSSクラス」が便利!特定のブロックにだけスタイルを適用する方法

WordPressのブロックエディタで、特定のブロックに独自のデザインを追加できることをご存知ですか?実は「追加CSSクラス」機能を使えばとても簡単に実現できます。この記事では、初心者でも分かりやすいようにクラス追加の基本と具体的な実例を交...
アフィリエイト

ポチップの使い方と機能まとめ|商品リンク・セール表示・インラインの活用法を解説

ポチップは、Amazon・楽天市場・Yahoo!の商品リンクはもちろん、メルカリやカスタムリンクまで自由に追加できる物販アフィリエイトに特化したプラグインです。デザインや機能を思いのままにカスタマイズでき、編集画面内で直感的にリンクを作れる...
Cocoon

ファーストビューをSWELL風に!Cocoonアピールエリアをフルスクリーン&動きのあるデザインにする方法

Cocoonのアピールエリアは背景画像やテキストを表示することでサイト全体の第一印象を決める大事なパーツ。ここをうまく活用すれば訪問者の関心をグッと引き寄せることができます。この記事では、有料テーマSWELL風にアピールエリアをフルスクリー...
テーマ共通

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

Webデザインにおいて視覚的なアクセントを加える方法は多くあります。その中でも、「境界線」や「背景スタイル」を工夫することでより洗練されたデザインを実現できます。この記事では、【SVG】とCSSプロパティの【clip-path】【linea...
Cocoon

Cocoon「アイコンボックス」のカスタマイズ方法|12種類のスタイルをサイドバーで切り替え

もっと手軽に、ブロックのデザインを変えられたらいいのに…そんな“あったらいいな”を叶えるカスタマイズを考えました。この記事では、Cocoonテーマの「アイコンボックス」ブロックに12種類のカスタムスタイルを追加し、クリックだけで切り替え可能...
設定

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

もうひとつブログを作りたいな~ブログを運営してしばらくすると、別のジャンルに方向転換したい、雑記ブログだけど伸びているジャンルを特化して別サイトに独立させたいなどなど...新しく別サイトを作りたいと思うことがあるのではないでしょうか。選択肢...
Cocoon

Cocoonナビカードの使い方|目立たせたい記事をピックアップ表示する方法、リボンのカスタマイズ

Cocoonテーマには、特定の記事やコンテンツを目立たせたいときに便利な『ナビカード』機能が標準搭載されています。ピックアップしたい記事を表示できるだけでなく、リボンの装飾や表示形式の選択など自由度の高いカスタマイズもできます。新着記事や人...
Cocoon

Cocoon人気記事ランキング|表示方法とラベルの色やスタイルを変更するカスタマイズ

Cocoonテーマには独自のアクセス集計機能が搭載されており、そのデータを元に簡単に人気記事ランキングを作成できます。サイドバーやトップページに設置すれば、読者の目を引きやすく記事の回遊率アップにもつながります。この記事では以下の2点につい...
スポンサーリンク