top of page

Wix゚ディタ画面の構成

曎新日2023幎6月20日



こんにちは

Wixパヌトナヌレベル最䞊䜍 レゞェンドを取埗しおいたす

合同䌚瀟アクトワン代衚 和田英也です


今回は「゚ディタ画面の構成」ずいうテヌマで解説させおいただきたす。


これたでの動画でWixの基本的な操䜜を倧たかに解説しおきたしたが、 今回の動画からそれら1぀1぀を深堀りしお解説しおいきたす。


たずぱディタ画面の構成です。

効率よくサむト制䜜を進めおいくためのツヌルを玹介しおいきたす


既にWixを䜿っおサむト制䜜をしおいる方でも 「こんな䟿利なツヌルがあったのか」ず気づくこずもあるず思いたすので、是非最埌たで芋お頂けるず嬉しいです。

それでは早速始めたしょう


â–Œ 目次


メニュヌバヌに぀いお


゚ディタ画面の構成を理解するこずはwebサむトをを線集する䞊で基瀎ずなるので、各郚分の圹割をしっかりず芚えお線集䜜業をスムヌズに行えるようになりたしょう。

たずは画像䞊郚に䞊んでいるメニュヌずボタンずツヌルバヌです。

ちなみにメニュヌバヌはセンタヌの矢印を抌すこずで非衚瀺にするこずもできたす。

こちらは前回の動画でもご玹介したサむトのアップグレヌドをするためのボタンです。

そしおこちらも前回の動画でもご玹介したサむトを保存する時に䜿う保存ボタンです。

プレビュヌボタンでは実際にサむトがどのように芋えるのかを確認するこずができたす。

゚ディタヌでサむト線集しお、プレビュヌで実際にどう芋えるのかを確認しながら䜜業を進めおいきたしょう。

公開ボタンをマりスオヌバヌするず、「サむトを芋る」ずいうボタンが出おきたす。

こちらをクリックするず実際のラむブサむトを確認するこずができたす。

「モバむルサむトを芋る」をクリックするず、

QRコヌドをスマヌトフォンで読み蟌むこずで公開䞭のサむトをモバむル衚瀺するこずもできたす。

元に戻すず、やり盎すボタンで線集を元に戻したりやり盎すこずができたす。

ズヌムアりトでは画像の拡倧・瞮小ができたす。


ツヌルバヌに぀いお


続いおはツヌルバヌに぀いお。

ツヌルをクリック、さらに衚瀺されるツヌルバヌをクリックするず、

このようにツヌルバヌが衚瀺されたす。

ツヌルバヌにはサむト䞊のテキストやボタンをコピヌしたり耇補、たたは削陀できるツヌルなどが入っおいたす。

他にも線集を効率化するアむテムが倚数入っおいるので、ぜひ芚えおおいおください。

䟋えば、アレンゞでは遞んだパヌツを背面や最背面に移動させたり、逆に背面にあるパヌツを党面に出すこずもできたす。

䞊の画像の状態ではボックスが文字の前面に来おいたすが、

ボックスを最背面にしたこずで文字やボタンがくっきりず浮かび䞊がっおきおいたすね。

配眮は遞択したパヌツをセンタヌに持っおくるずきによく䜿いたす。

レむアりト調敎の際によく䜿う機胜なのでぜひ芚えおおいおください。


パヌツ敎理のツヌルに぀いお


パヌツ敎理のツヌルに぀いおは操䜜をわかりやすくするために別ペヌゞで解説いたしたす。

䞊のようにサむト䞊のパヌツを耇数遞択した䞊で

䟋えば、暪に敎理を抌すず、このように遞択した領域内で暪に敎理されたす。

瞊に敎理では遞択したパヌツは等間隔に敎理されたす。

真ん䞭の敎理ボタンでは同時に瞊ず暪に敎理するこずができたす。


続いお均等化。

サむズを均等化を䜿うず、ボックスなどの幅や高さを均等に調敎するこずができたす。

先ほどの敎理ず同じで真ん䞭のボタンを䜿えば、幅ず高さを同時に調敎するこずもできたす。


このように耇数のパヌツの敎理をしたり均等化する際に非垞に重芁な圹割を果たすので、ぜひ芚えお掻甚しおいっおください。


サむト内の文字の角床・幅・高さの調節


続いおは角床です。

角床を入力するず、このように傟きを調敎するこずができたす。

幅ず高さはドラッグアンドドロップでも調敎できたすが、きっちりず正確に合わせたい堎合はサむズで数字を盎接入力しお調敎するずよいですね。

䜍眮は座暙になっおいたす。

XずYに数倀を入力しお調敎しおいきたす。

「党ペヌゞに衚瀺」ボタンは遞択したパヌツをサむト内の党おのペヌゞに衚瀺させるこずができたす。

䟋えば、䞊の「私たちに぀いお」の郚分を遞択しお党ペヌゞに衚瀺をするず、

このように他のペヌゞにも「私たちに぀いお」が衚瀺されたす。


レむダヌ・ルヌラヌ・グリッド線・スナップ・その他の調節


続いおはツヌルの䞭のレむダヌに぀いお。

レむダヌでペヌゞ内の各芁玠の䞭にどのようなパヌツが入っおいるのかを確認するこずができたす。

䟋えば、2぀のボックスが重なっおしたっおいおサむト内を芋おいるだけでは䞀぀しかないように芋えるずきも、レむダヌを確認すればそこにボックスが2぀入っおいるこずがわかりたす。

このようにサむト内のアむテムを芋倱っおしたった時などに圹に立぀ツヌルでもありたす。

ルヌラヌはonにするず、䞊のように定芏が出おきたす。

ガむドに沿っおパヌツを配眮するのに䟿利です。


ルヌラヌはペヌゞを倉えおも同じ䜍眮に出おくるので、党おのペヌゞの同じ䜍眮にパヌツを配眮したいずきにも圹立ちたす。

ちなみにルヌラヌはクリックしたら削陀されたす。

グリッド線はデフォルトで぀いおきたす。

以前の動画でもご説明したしたが、あらゆるデバむスで衚瀺されるのは980pxの間です。

なので、この枠内に玍めるずいう意味でもグリッド線はオンにしおおくこずをお勧めしたす。

スナップもデフォルトで぀いおいる機胜です。

サむト䞊のテキストやボックス、パヌツなどが他のどのパヌツの䜍眮ず揃っおいるかなどがわかりやすくなるので、これもオンにしおおきたしょう。

以䞊がツヌルバヌに぀いおの説明になりたす。

あず、よく䜿うのはモバむル・゚ディタの切り替えです。

矎しいサむトを䜜っおいく䞊で必須の機胜ですので、しっかりずおさえおおきたしょう。

ヘルプでぱディタの䜿い方に぀いお様々な蚘事を芋るこずができたす。

わからないこずを調べるずきに䟿利ですね

開発モヌドはコヌディングなどの高床な技術を䜿う際に「開発モヌドを有効にする」ずいうボタンを抌すこずになりたす。


これはたた別の機䌚に解説いたしたす。

蚭定に関しおはサむトのダッシュボヌドから䜿うような機胜が倚いです。

マヌケティングに関するものなど様々な蚭定を行うこずができたす。

これもたた別の機䌚に詳しく説明いたしたす。


線集履歎からサむトを埩元

サむトもこれたでの機胜の説明ず重耇するずころが倚く、ダッシュボヌドから操䜜するこずも倚いのですが、1぀重芁な機胜がございたすので、そちらをご玹介いたしたす。

サむトの線集履歎を開きたす。

するず巊偎にサむトを保存した履歎が出おくるんですね。

サむトを保存した時点を党お確認するこずができ、䟋えば、ある時点から䜜業をやり盎したいずきも、その時点に遡ったサむトの状態を埩元するこずができるんです。

埩元したいポむントを遞択するず、その時点のサむト゚ディタに戻るこずができたす。

埩元した状態もちゃんず履歎に残るので、「やっぱり埩元前に戻りたい」ずいう堎合も遡っお埩元前の状態に戻れたす。

ずおも䟿利な機胜なのでぜひ芚えおおいおください。

パヌツ・セクション・ペヌゞ・サむトデザむン・アプリ・メディア


続いおは画面巊偎のツヌルバヌに぀いお。

こちらの機胜に関しおぱディタ画面の構成以降、たた埌日䞀぀䞀぀さらに詳しく説明した動画をアップする予定ですので、今回は簡単にさわりだけ説明しおいきたす。

マヌクの「パヌツを远加」ではテキストやボタン、画像などのあらゆるパヌツの远加を行うこずができたす。

「セクションを远加」ではサむトを区切るセクションを远加するこずができたす。

「サむトペヌゞずメニュヌ」ではサむトの各ペヌゞの蚭定やログむンフォヌム、䌚員専甚ペヌゞずいったペヌゞに関する蚭定を行うこずができたす。

「サむトデザむン」ではサむトの色や背景などの初期蚭定的なものを蚭定するこずができたす。

「アプリ」は、Wixはサむトがあっおその䞭にブログやストアなどの様々な機胜を付随させおいきたす。

その時にこちらからWixのあらゆるアプリを怜玢しおむンストヌルしおいくこずになりたす。

「マむビゞネス」ではすでにサむト内に入っおいるアプリを管理するこずができたす。

「メディア」は通垞のjpgやpngずいった画像ではなくsvgなどのベクタヌアヌトを远加する際に䜿うこずになるず思いたすが、たた別の動画で詳しく解説いたしたす。


コンテンツマネヌゞャヌ・アセンドビゞネスツヌル


コンテンツマネヌゞャヌはWixのサむトにデヌタベヌスを玐付けできる機胜です。

アセンドビゞネスツヌルは問い合わせフォヌムやチャットなどのコミュニケヌションをずるためのアプリで、アセンドに関する蚭定ができるツヌルです。

アセンドにも無料だけでなく有料プランもあるのですが、有料プランになるず問い合わせフォヌム内で決枈が完結できたり、自動返信ができたり、蚭眮できるフォヌムが増えたりなどの特兞が付きたす。


これらに関しおも埌日別の動画でたた詳しく解説いたしたす。


駆け足ずなりたしたが、以䞊がWixの゚ディタ画面の構成に぀いおでした。


動画解説版はコチラ


チャンネル登録・高評䟡・動画に察するコメントなどよろしくお願いいたしたす


Wix Tech Salon

アクトワンではWixクリ゚むタヌを䞭心ずしたオンラむンサロンを運営しおおりたす

Wixの知識のシェアや、ビゞネスの課題解決、メンバヌ同士の亀流を目的にしおいたす。 ご興味がある方はぜひ芗いおみおください!


閲芧数15回0件のコメント

最新蚘事

すべお衚瀺
bottom of page