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

サイト型トップページ × フルワイド

2023年11月17日
記事内に広告が含まれています
  • ページタイプは「１カラム（広い）」です。（サイドバーは表示されません）
  • 以下のサイト型トップページ × フルワイド カスタマイズを組み合わせて作成しています。
Cocoonで作るサイト型トップページ｜オシャレなSWELL風（HTML、CSS使用）
2025.9.5 実例集にmomlog（まむろぐ）を掲載しました。トップページが平凡で、他のサイトと差がつかない…そんなお悩みありませんか？この記事では、Wor...
turicco.com
Cocoonで全幅（フルワイド）デザイン！幅いっぱいにする仕組みとおしゃれに仕上げるポイントを解説
Cocoonでも、有料テーマSWELL風のフルワイドデザインは作れます。この記事では、Cocoonでトップページをおしゃれに見せる 「全幅（フルワイド）セクショ...
turicco.com
New post新着記事
スクロールアニメーションの作り方｜CSSとIntersectionObserver（交差監視）でふわっと表示
Webサイトでよく見かける、スクロールに合わせてふわっと要素が表示されるフェードインやスライドアニメーション。「自分のサイトでも導入したいけど難しそう…」といっ...
Googleアドセンス審査用コードの貼り方｜WordPress・Cocoon対応ガイド
Googleアドセンスに申請するときには、審査用のコードを自分のサイトの <head> 内に貼り付ける必要があります。このコードを正しく設置できないと審査が始ま...

MORE

Categoryカテゴリーごとの記事
Cocoonタイムライン（ステップブロック）おしゃれ化カスタマイズ｜最大6種類のデザイン切り替え
カラム固定を解消！Cocoonボックスメニューを2〜6列に切り替える方法
Cocoon通知エリアをカスタマイズ！スライド表示＆ボタンで誘導力強化
Cocoonラベルボックスを使いやすく＆おしゃれにカスタマイズ！使い方・デザイン例・CSSコードまとめ
Cocoonアコーディオン（トグル）をカスタマイズ！10種類のデザインでスッキリ魅せる
Cocoonタブブロックの使い方＆おしゃれカスタマイズ｜ワンクリックで12デザイン切替

MORE

スクロールアニメーションの作り方｜CSSとIntersectionObserver（交差監視）でふわっと表示
動きで魅せる！おしゃれな矢印リンク＆下線スライド・ホバーアニメーションボタン（CSS付き）
CSS・PHP・JavaScriptのバックアップ方法まとめ｜WordPressカスタマイズ前に必須！
WordPressパターン機能でラクラク時短！再利用ブロックの使い方と同期・非同期の違い

MORE

Googleアドセンス審査用コードの貼り方｜WordPress・Cocoon対応ガイド
【ブログを始めたい初心者向け】WordPressの初期設定マニュアル｜必須＆おすすめ設定
サブドメインを常時SSL化（https化）リダイレクトする方法｜エックスサーバー設定
エックスサーバー｜サブドメイン設定で２つめのブログ（複数サイト）を作る方法

MORE

Popular人気記事
【コピペOK】おしゃれなボックスデザイン！ブログを彩るCSS囲み枠集
CSS・SVGで作る境界線と背景デザイン｜波、三角形、斜めラインを使ったおしゃれな装飾テクニック
CSSで実装！複数画像を切り替えるアニメーションの作り方
CSSコピペOK！見出しデザインをカスタマイズ｜おしゃれデザインサンプル集【Cocoon対応】
タブ切り替えをHTMLとCSSで実装（JavaScriptなし）
動きで魅せる！おしゃれな矢印リンク＆下線スライド・ホバーアニメーションボタン（CSS付き）
サイト型トップページのサンプル
  1. デフォルト：サイドバーあり
  2. １カラム（広い）：サイドバーなし
  3. フルワイド ＋ セクション背景色 当ページ

フルワイドの記事に戻る

トップページ作成の記事に戻る

スポンサーリンク
Turicco