サイト型トップページの作り方を公開しています!Check
アフィリエイト

Pochipp Pro(ポチッププロ)|無料版との違い・価格・導入手順まで詳しく紹介

アフィリエイトリンクを簡単・おしゃれに表示できる人気プラグイン、ポチップ。Pochipp Proにアップグレードすると、無料版では使えないセール情報の自動取得やAmazon口コミリンク表示など、ブログ収益を伸ばす機能が使えるように!さらに、...
アフィリエイト

ポチップ対応ASP一覧と選び方・設定方法|Amazon・楽天・Yahoo提携できるサービスを比較

商品リンクをまとめて表示できる「ポチップ」は、アフィリエイト初心者にも大人気。この記事では、始めに迷いそうな疑問に答えながら自分に合ったASP選びのコツを紹介します。どのASPに登録すればいい?Amazonアソシエイト楽天アフィリエイトバリ...
テーマ共通

Webデザインの強い味方!ChromeデベロッパーツールでCSSセレクタを調べる方法

このような方向けの記事ですCSSを使ったカスタマイズに興味があるHTMLとCSSの基本を知りたいデベロッパーツールの使い方を学びたいWebデザインやサイトカスタマイズにおいて、「要素のCSSセレクタを調べる」ことは必須スキルです。「デベロッ...
Cocoon

Cocoonカスタマイズの基本|HTML・CSSの編集方法

「もう少し見やすくしたいな」「デザインをちょっと変えてみたい…」WordPressを使っていると、そんなふうに感じることがありますよね。そんなときに役立つのがHTMLやCSSの編集です。ほんの少し手を加えるだけでもサイトの見た目や使いやすさ...
Cocoon

Cocoonサイドバー目次を固定して垂直スクロールバーを設置する方法

Cocoonでサイドバーの目次追従したときに見切れてしまうときの対策をご紹介。
Cocoon

Cocoonで作るサイト型トップページ|オシャレなSWELL風(HTML、CSS使用)

そろそろトップページをサイト型デザインにしたい!けど具体的にどう作ろう...そんなお悩み、ありませんか?この記事では、WordPressテーマ「Cocoon」で固定ページとHTML・CSSを活用した「サイト型トップページ」の作り方を、初心者...
Cocoon

【Cocoon】SNSでURLをシェアしたときの画像、ちゃんと設定できてる?OGP設定方法

SNSでサイトや記事をシェアしたときにOGP画像を表示する方法をご紹介します。意外と設定していないデフォルトの方が多いのでは?イメージを伝えて読者に訪れてもらえるようなサイトにしましょう。
テーマ共通

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

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

【コピペOK】おしゃれなボックスデザイン!ブログを彩るCSS囲み枠集

ブログで使えるボックスデザイン(囲み枠)を厳選してご紹介します。コードはコピペ対応で簡単!!
Cocoon

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

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

WordPressのカラーパレットを自由に変更・追加する方法【Cocoon対応】

WordPressのブロックエディタ(Gutenberg)では、文字色や背景色の変更に便利な「カラーパレット」が用意されています。しかし、標準で用意されている色は原色に近いビビッドなカラーが多く、自分のサイトに合わないと感じることがあるかも...
テーマ共通

簡単おしゃれ!CSSで見出しデザインをカスタマイズする方法【コピペOK】

見出しを好きなデザインに変えたいな~ウェブサイトの見出しデザインをカスタマイズすると、読みやすさや視認性が向上しサイト全体のデザイン性も高まります。この記事では、簡単に実装できる見出しデザインのサンプルを紹介します。CSSを活用して、自分の...
テーマ共通

箇条書きリストの点の色を変えるCSS|ul要素のカスタマイズでデザイン性アップ

Webサイトやブログで使われる箇条書きリスト(ul要素)は、デフォルトではシンプルな黒い点(ディスク)で表示されますが、デザインにこだわりたい場合は少し味気なく感じることもあります。この記事では、CSSを使って箇条書きの点(マーカー)の色を...
Cocoon

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

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

CSSで疑似要素に影をつける方法|box-shadowとdrop-shadowの違いを比較

この記事では、CSSを使って疑似要素に影をつける方法を紹介します。使用するCSSプロパティは、以下の2つです。box-shadowfilter: drop-shadow一般的に要素に影をつけるにはbox-shadowプロパティがよく使われま...
テーマ共通

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

必要な情報へ迅速にアクセスするために便利なのが「タブ切り替え」機能。この記事では、JavaScriptを使わずにHTMLとCSSだけでタブ切り替えを実現する方法をご紹介します。フォーム要素であるラジオボタンを応用することで、軽量かつシンプル...
テーマ共通

WordPressでテキストリンクをおしゃれに装飾する方法|ブロックエディタ&CSSで簡単カスタマイズ

この記事では、WordPressのブロックエディタとCSSを使ってテキストリンクをスタイリッシュに装飾する方法をわかりやすく解説します。テーマによって標準のボタンブロックがありますが、今回はあくまで普通のテキストリンクの装飾です。いつものコ...
テーマ共通

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

この記事では、CSSを使って要素をなめらかに点滅させる方法を紹介します。要素を点滅させるアニメーションは視認性を高め、注目を引く際に便利です。\例えばこの部分の文字を点滅/ゆっくりなめらかに点滅するイメージですこのように文字を点滅させたい方...
設定

Googleアドセンス審査に合格するには|必要な対策&コード貼り付け方法

ブロガーブログで収益を得たい!そんな夢を叶える第一歩として、Googleアドセンスは多くのブロガーやウェブサイト運営者に大人気のツールです。でも、審査を通過するにはちょっとしたコツが必要。この記事では、Googleアドセンスの基本的な仕組み...
スポンサーリンク