top of page
Rectangle 1711.png
Group-39215.jpg
Pink Poppy Flowers

最新Wixコラム

学校・空手の先生を辞めて、29歳でWebディレクターへ。ノコド道場とWix Studioの可能性に感じた理由とは? 

Shop Now

Wixで簡単に表を作成する活用術!Wixテーブルマスターアプリを使った表の作成とカスタマイズ方法をご紹介

Shop Now

【機能面動画】Wix Studioコンテンツ編集モード&カスタムモード

Shop Now

Wix studioでスマホサイトのレイアウトが崩れてしまう原因とは?Wix studio崩れにくいPC版の作成方法をご紹介!

Shop Now

HP制作会社が教える、この内部SEOだけはおさえて

Shop Now

Wix studioで制作したホームページ事例をご紹介!【弊社作成事例も転載】

Shop Now
Group 163232.jpg

お気軽にご相談ください

お問い合わせはこちら
Group 163231 (1).png

詳細はコチラからご確認ください

資料ダウンロード

関連記事

Wix コラム

2025年6月19日

【Wix2025年最新版】Webサイトにニュース機能を設置する方法を徹底解説!

Send
Wix コラム

2025年6月19日

電話で対応してくれるの?Wixサポートセンターへ電話で問い合わせしよう!

Send
Wix コラム

2025年6月9日

2025年最新!【プロが伝える】Wixの使い方と機能を解説!ここだけは抑えてほしい「初心者」にもおすすめ完全ガイド

Send

Wixエディタでページ幅をカスタマイズする方法初心者向け完全解説

  • 2025年10月26日
  • 読了時間: 4分


こんにちは!ラジャのけんいちです。


今回は「ページ幅のカスタマイズ」について徹底解説していきます。

WixのPC版・モバイル版のサイズというのは固定値のため変更ができません。

そんな時の為に→ストリップを使ってページ幅を自由に変更しているような形を演出させる事が可能です。



Wixとは?


Wixのご紹介

Wix(ウィックス)とは、2006年にイスラエルで生まれ、2010年に日本語版がリリースされ、現在全世界で 2.6億人以上の登録ユーザーを有する人気ホームページ作成ツールです。


CMでこのキャッチフレーズを見たことがある方も多いのではないでしょうか。

「1.2秒に1人が Wixを使ってHPを作っています」


直感的にHPを作成・ドラッグ&ドロップにて変更が簡単にできる為、幅広いユーザーから支持を受けています。


Wixを使用してページ幅を調整したいが、どうすればよいのかわからない方へ。この記事では、Wixエディタを使ってページ幅を変更する方法を解説します。幅の引き延ばしやスマホ、モバイル対応など、全幅の調整からレスポンシブサイトの設計までを網羅しています。



ページ幅を整えると何がいいの?


ページ幅についてご紹介しますと下記となっています。


・PC版:980px・モバイル版:320px

PC版は、タブレットやデスクトップで見る方もいるので、この980pxの中に収めることによって、ある程度どのデバイスでみても綺麗に見えるpx数となっています。

全幅は1400px以上あります。

モバイル版の横幅は全幅にて編集画面が構築されており、320px全幅使うことができます。

ページ幅を整えて、ある一定の数値を基準としてサイトを制作することによって、洗練されたデザインに、見えるので制作にとってページ幅はとても大切になります。


各デバイスのオススメ横幅設定方法


■PC版

PC版については、まず参考サイトを見つけてサイト制作を進めることを強くオススメします。



参考サイトを見つけたら絶対に規則性があるはずです、それを見つけた上で、サイト制作を進めます。


ルーラーを設定


「ルーラー」とは?


サイトの基準線を設定できる機能です。

左右に同じ幅のピクセル数で「ルーラー」を設定することにより基準ができるので基準に合わせたコンテンツ配置をすることで一段階プロのデザインに近いサイト制作を行う事ができます。

また、参考サイトをもとにどのくらいのコンテンツ数、列は何列で何段のカラムに設定したら洗練したデザインに見えるかというところをまるパクリして作成することをオススメします。


■モバイル版

モバイル版はより「ルーラー」が重要になり、

左右から20px離したところに「ルーラー」を設定して基準を作って、ルーラー内でコンテンツを配置することによってみやすいモバイル版を作る事が可能です。



ページ幅の変更方法について

結論ページ幅をコントロールすることはできません。

先ほど紹介した「ルーラー」をうまく利用してサイト幅を自身でコントロール必要があります。

サイトの幅をコントロールするポイントとして、次に「ストリップ」が出てきます。

ストリップとは?という方はこちらの記事からご覧ください>>>


ストリップを使った幅調整について


ストリップを追加したのちに、

両矢印のボタンをクリックします。クリックするとストリップの幅を調整することができるので、

「全幅」を選択→「間隔」でpx値を調整できるので数値を大きくするとストリップの横幅が狭まり横幅をコントロールすることができます。


ストリップの大きさは上下に自在にコントロールできるので、ストリップという基準の上にコンテンツを配置することによってデザイン性の統一ができると思います。



まとめ

今回は、Wixの「ページ幅」についてご紹介しました。


Wixではページ幅の数値は各デバイスによって決定していますが、ストリップなどを駆使することによってある程度の自由は聞きます

他の記事もご覧いただいて、 Wixの機能をフル活用して Wixっぽさから脱却してみてください。

弊社では制作面でのお困りごと・貴社のHPをプロの目線で現行サイトを分析して、アドバイスさせて頂く「無料相談会」を実施しております。


ご興味がある方は下記のボタンより、弊社「株式会社ラジャ」までお問い合わせください。


bottom of page