Wixの最新情報を届けるメディア

「見出しの文字にグラデーションをかけたいのに、Wix Studioでやり方が見つからない」。 そんな相談をよくいただきます。 デザインカンプではきれいにグラデーションがかかっているのに、いざWixで再現しようとすると通常の文字設定にはグラデーションの項目がなく、結局「文字を画像として書き出して貼り付ける」しかない、と諦めてしまうケースです。 実はWix Studioには、文字を画像化せずにグラデーションを流し込める「テキストマスク」という機能が用意されています。 この記事では、なぜ普通の設定ではグラデーションがかけられないのかという原因から、テキストマスクを使った具体的な手順、そして画像化しないことで得られるメリットまで、お客様の視点で順を追って解説します。 Wix Studioで文字にグラデーションがかけられない原因とは まず知っておきたいのは、Wix Studioの「通常の文字設定」にはグラデーションを直接指定する項目が用意されていない、という点です。 タイトルや段落を「クイック追加」から置いて文字色を変えようとしても、選べるのは基本的に単色

Wix Studioでサイトを作っていて、PC表示ではきれいに見えるのに、タブレットに切り替えた途端に文字が読めないほど小さくなっていた、という経験はありませんか。 実際に「タブレット表示だと本文が9pxくらいになってしまう」というつまずきは、Wix Studioを使い始めた方からよく聞く悩みです。 この記事では、Wix Studioのタブレット文字サイズがなぜ極端に小さくなるのか、その原因から、見やすい推奨サイズ、そしてPC・タブレット・スマホをまたいだデバイス別のフォントサイズの決め方までを、実際の制作現場の考え方にそって整理します。 数値の目安がわかれば、どのデバイスで見ても読みやすいサイトに近づけられます。 Wix Studioでタブレット表示の文字が9pxなど極端に小さくなる原因 まず押さえておきたいのは、Wix Studioのタブレットで文字が小さくなるのは不具合ではなく、レスポンシブデザインの仕組みが働いた結果だということです。 Wix Studioはレスポンシブデザイン、つまりPC・タブレット・スマホという画面サイズの違いに合わせ

Wix Studioでアニメーションを設定したのに、なぜか安っぽく見える。 プレビューを再生すると、画像もタイトルも文章もボタンも、全部が同じ瞬間にドンと出てくる。 動いているのに、なぜか野暮ったい。 そんな経験はありませんか。 その正体は、多くの場合「遅延（ディレイ）」を使えていないことにあります。 アニメーションの種類を選ぶだけで満足してしまい、表示するタイミングまで作り込めていない状態です。 実は、Wix Studioには各パーツの表示開始時間を秒単位でずらせる「遅延」という設定があり、ここを整えるだけで、同じアニメーションでも印象がまるで変わります。 この記事では、Wix Studio アニメーション 遅延 設定の考え方と具体的な手順を、画像とタイトルを時間差で見せる例を軸に解説します。 コーディングは一切不要で、ボタン操作だけで洗練された時間差演出が作れます。 結論：Wix Studioの「遅延（ディレイ）」とは？アニメーション開始の待ち時間のこと 遅延（ディレイ）とは、アニメーションが「始まるまでの待ち時間」を秒数で指定する設定のこと

PCで見たときはきれいに整っているのに、スマホで開いた瞬間に文字がはみ出したり、ボタンが画面からずれたりしていた。 そんな経験はありませんか。 これはWix Studioのレスポンシブ設定がまだうまく効いていないサインです。 この記事では、Wix Studioのレスポンシブ設定方法を、要素をスタックでまとめる下準備から、デバイス表示の切り替え、崩れの直し方、文字サイズと横幅の個別調整まで、初心者の方でも順番どおりに進められるよう解説します。 専門用語はそのつど噛み砕いて説明するので、はじめてWix Studioを触る方も安心して読み進めてください。 Wix Studioのレスポンシブ設定とは？PC・タブレット・スマホで自動で変わる仕組み Wix Studioのレスポンシブ設定とは、PC・タブレット・スマホという画面サイズの違うデバイスごとに、レイアウトや文字の大きさを画面幅に合わせて自動で調整する仕組みのことです。 同じページでも、大きなモニターでは横に広く、スマホでは縦にすっきりと並ぶよう、表示が切り替わります。 この切り替わりの境目になるのが

「実績ページやスタッフ紹介を追加するたびに、いちいち編集画面を開いてレイアウトを組み直すのが大変」。 ホームページを運用していると、こうした更新作業の負担に悩む場面は少なくありません。 ページが増えるほど、1件の追加や修正にかかる手間はふくらんでいきます。 この悩みを根本から解決するのが、Wixの「CMS」という仕組みです。 名前だけ聞くと難しそうに感じるかもしれませんが、考え方はとてもシンプルで、一度理解すれば「なぜもっと早く使わなかったのか」と感じる方が多い機能です。 この記事では、WixのCMSとは何かを、専門用語をかみくだきながら初心者の方にもわかるように解説します。 WixのCMSとは、編集画面に入らずページの内容を一括更新できる仕組み 先に結論からお伝えします。 WixのCMSとは、「コレクション」というデータの入れ物を使い、編集画面に入らずページの内容を一括で更新できる仕組みのことです。 もう少しかみくだくと、CMSは「データ」と「デザイン」を切り離して管理する考え方です。 ページのデザイン（見た目）はあらかじめ1つだけ作っておき、

Wix Studioでサイトを編集していると、レスポンシブ動作の設定欄に出てくる「ハグ」という言葉。 なんとなく設定したまま放置している方も多いのではないでしょうか。 実はこの「ハグ」、使いどころを押さえると非常に便利な一方、知らずに使うと「文字が枠から突き抜ける」といったトラブルの原因にもなります。 この記事では、Wix Studioの「ハグ」とは何かをやさしく解説したうえで、便利に効くシーン、似た設定「比例してスケーリング」との違い、そして文字が突き抜けるときの直し方までを、操作手順ベースでまとめます。 Wix Studioに不慣れな方でも、読み終わるころには「ハグ」を自信を持って使い分けられるようになります。 結論：Wix Studioの「ハグ」とは、枠が中身に合わせて自動で伸縮するレスポンシブ動作のこと Wix Studioの「ハグ」とは、要素の枠（ボックス）が中に入っているコンテンツのサイズに合わせて自動的に伸縮するレスポンシブ動作の設定です。 テキストや画像など中身の大きさが変わると、枠もそれに寄り添うように調節されます。 Wix..

Wix Studioで制作していると、「この動きは仕様なのか、それとも不具合なのか」と判断に迷う場面が必ず出てきます。 これまではカスタマーケアに電話で問い合わせ、回答を待つあいだ作業が止まる、というのが当たり前でした。 ですが今は、Wix Studioに搭載されたAIアシスタント（AIチャットボット）に質問すれば、電話せずにその場で答えが返ってくる時代になっています。 本記事では、Wix Studio AIアシスタントとは何かという基本から、仕様か不具合かを切り分ける手順、自己解決の流れ、提案文の添削への活用、そして有人サポートへつなぐ判断基準までを、お客様視点で具体的にご紹介します。 結論：Wix StudioのAIアシスタントを使えば、仕様の疑問や不具合を電話せずその場で解決できる Wix StudioのAIアシスタントとは、エディタ内で疑問や不具合を質問すると、カスタマーケア相当の回答をその場で返してくれるAIチャットボットのことです。 従来、Wix Studioで不明点やバグに遭遇したときは、カスタマーサクセス（カスタマーケア）に電話で

Wix Studioでサイトを公開したあと、お知らせや見出しの文言を少し長くしただけで、文字がボックスからはみ出し、画面の外まで突き抜けてしまった。 そんな経験はありませんか。 「これはバグなのでは」と不安になる方が多いのですが、実はこれはWix Studioの仕様で、原因さえ分かれば数クリックで直せます。 この記事では、突き抜けの正体である「ハグ」というレスポンシブ動作の仕組みと、最も確実な「比例してスケーリング」への変更手順、横幅の数値指定までを、お客様自身が操作できるように順を追って解説します。 Wix Studioで文字が突き抜けるのはバグではなく「ハグ」が原因 結論：Wix Studioで文字が画面外に突き抜けるのはバグではなく、「ハグ」というレスポンシブ動作の仕様が原因です。 直し方は、テキストを囲むボックスの動作を「ハグ」から「比例してスケーリング」へ変えることが基本になります。 突き抜けが起きやすいのは、サイト公開後、運用の中で文言を変更したときです。 制作時はちょうどよく収まっていた見出しやキャッチコピーを、運用の中で長い文章に

この記事の監修 株式会社ラジャ｜Wixレジェンドレベルパートナー／【SEO担当監修】中田ディレクター 「Wix Studioという名前は聞くけれど、従来のWixと何が違うのか分からない」「自社のサイト制作にWix Studioが向いているのか判断できない」とお悩みではないでしょうか? 名前が似ているため混同されがちですが、Wix StudioはレスポンシブやデザインのコントロールでWix Editorと大きく異なります。違いを理解しないまま選ぶと、運用しにくいサイトになったり、せっかくの表現力を活かせなかったりするリスクがあります。 本記事では、Wix Studioの定義・従来Wixとの違い・できること/できないこと・実際の制作事例・費用感までを、現場の知見をもとに一気通貫で解説します。 Wix Studioとは 結論：Wix Studioとは、制作会社・フリーランス・企業向けに設計された、フルレスポンシブ対応のWix制作プラットフォームのことです。 従来のノーコードの領域を超えた、マーケティングまで行えるWebサイト制作プラットフォームで

Wixの最新アップデートで、ついに待望の機能がリリースされました。 Wix Editorで作成したサイトを、Wix Studioへ移行できる機能です。 これまで多くのユーザーや制作会社から要望があったこの機能。 まさに「ついに来たか」と言えるアップデートです。 今回は、この新機能の概要と、現場でのインパクトについて解説します。 これまでの課題：移行は“ほぼ作り直し” 従来、Wix EditorからWix Studioへの移行は簡単ではありませんでした。 ・デザインを見ながら手作業で再構築 ・アプリや機能も1つずつ移行 ・コンテンツも個別対応 つまり、「実質ゼロから作り直し」というのが当たり前でした。 その結果、 ・制作工数が大幅に増える ・エンジニアの負担が大きい ・コストが上がる といった課題が常に存在していました。 新機能のポイント：ワンクリックで移行が可能に 今回のアップデートにより、Editor → Studioへの移行が大幅に簡略化されました。 基本的な流れ 1.Editorサイトを選択 2.「Studio版のサイトを作成」をクリック

「プレビューでは完璧だったのに、公開したらレイアウトが崩れている…」 この問題、Wix Studioを使っている方の多くが一度は経験する“あるある”です。 実際に現場でも、 ・納品直前にレイアウトが崩れる ・どこに原因があるかわからない ・誰に聞けばいいかわからない といった相談が非常に多く、問い合わせの約8割がこのテーマに関するものです。 今回は、トップディレクター視点で 「なぜ崩れるのか？」 「どうすれば防げるのか？」 をわかりやすく解説します。 なぜプレビューと公開後で崩れるのか？ 結論から言うと、原因はシンプルです。 →「要素の配置ルールが正しく設定されていない」から 特に多いのが以下の状態です。 ・パーツを“とりあえず置いただけ” ・スタックを使っていない ・中央揃え・ドッキング設定をしていない この状態だと、画面幅が変わった瞬間にレイアウトが崩れます。 崩れる典型パターン よくあるのはこのようなケースです。 ・画面を広げると→要素が左右にズレる ・画面を縮めると→要素同士がくっつく ・スマホで見ると→全体バランスが崩壊...

今回は、Webディレクションの現場でよく使われる「FAQ（よくある質問）ページ」の作り方について解説します。 実はこのFAQページ、ユーザーの疑問を解決するだけでなく、内部SEOにも大きく影響する重要なコンテンツです。 現場で実際に使われているノウハウをもとに、「どう作るべきか？」「どの方法が最適か？」をわかりやすくまとめました。 FAQページはなぜ重要なのか？ FAQは単なる補足情報ではありません。 ・ユーザーの不安を解消し、離脱を防ぐ ・問い合わせ数を減らし、業務効率を改善 ・内部SEOの強化につながる 特に最近は、検索意図に応えるコンテンツとしてFAQの重要性がさらに高まっています。 FAQの作り方は大きく2パターン FAQの実装方法は、主に以下の2つです。 ①アプリ（FAQ機能）を使う方法 最もおすすめなのがこの方法です。 特徴 ・ダッシュボード上で管理できる（CMS的に運用可能） ・カテゴリー分けが簡単 ・検索機能付き ・デザインが最初から整っている メリット ・圧倒的に運用しやすい ・更新・追加が簡単 ・チームでも管理しやすい デメリ

【実務で使える】CMSで“絞り込み検索”を実装する方法 案件の高度化やWordPressからの移行が進む中、「一覧ページをどう見やすくするか」は重要な課題です。 本記事では、WixのCMS機能を活用し、ノーコードで実現できる“絞り込み検索”の具体的な実装方法と活用ポイントを解説します。 ノーコードでもここまでできる、効率的なサイト設計とは ここ最近、現場では ・WordPressからの移行案件 ・機能性を重視したサイト制作 といった、やや難易度の高い案件が増えてきています。 その中でも特に多い相談が、 「一覧ページをもっと見やすくしたい」 「ユーザーが目的の情報にすぐ辿り着ける設計にしたい」 というものです。 そこで今回は、CMSを活用した“絞り込み検索機能”の実装方法について解説します。 絞り込み検索は「標準機能」で実装できる Wixには、実は絞り込み検索を実現するための機能が標準で備わっています。 例えば以下のようなUIです。 ・カテゴリーで絞り込み（例：コーポレート / 採用 / サービス） ・タグで絞り込み（例：デザイン / SEO /

大学卒業後、中学校教師、テーマパークスタッフ、空手指導者など異色のキャリアを歩んできたヤマモトユウキさん。 現在はWebフリーランス、ITインフルエンサー、格闘家という“三刀流”で活動しています。 空手道場のホームページ制作をきっかけにWeb業界へ転身し、制作会社でディレクターとして150サイト以上を担当。現在はフリーランスとして活躍しています。 今回は、ノコド道場に参加した理由やこれまでのキャリア、そして今後のビジョンについて伺いました。 【受講生インタビュー】異色のキャリアからWebディレクターへ 今回は、「ノコド道場」第3期生として参加しているヤマモトユウキさんにインタビューを行いました。 ノコド道場3期生・ヤマモトユウキさん ヤマモトさんは現在、 ・Webフリーランス ・IT情報を発信するインフルエンサー ・現役の格闘家 という、まさに“三刀流”で活動されています。 大学卒業後は中学校の教師、テーマパークスタッフ、空手指導者など、異色のキャリアを経てWeb業界へ。 そこから制作会社のディレクターを経験し、現在は独立してフリーランスとして活

Wix 営業の現場やお客様との打ち合わせで、 「Wix Studioの編集って難しいんですか？」 「WordPressから移行したいけど、運用が不安で……」 といった声をよく耳にします。 結論から言うと、Wix Studioの編集は“使い分け”さえ理解すれば決して難しくありません。 ポイントになるのが、「カスタムモード」と「コンテンツ編集モード」この2つの編集モードです。 今回は、それぞれの特徴と、どんな人がどのモードを使うべきかを分かりやすく解説します。 2つの編集モードの違いとは？ Wix Studioには、大きく分けて以下の2つの編集モードがあります。 ■ カスタムモード こちらは制作時に使うモードです。 ・パーツの追加・移動 ・スタック構造の設計 ・余白（パディング）の調整 ・色やレイアウトの細かな制御 など、自由度が非常に高く、デザインや構造を一から作り込むことができます。 その反面、ある程度の知識と慣れが必要なモードでもあります。 ■ コンテンツ編集モード 一方こちらは、運用専用のモードです。 カスタムモードで完成したテンプレートを

スマホでサイトを見たときに、 文字が重なっている ボタンがはみ出している 画像と文章の間がバラバラ こんな経験はありませんか？ まず前提として知っておきたいのは、 Wix自体の技術的な品質は非常に高い ということです。 Web Almanac の分析によると、 Wix は主要CMSの中で Google Lighthouse（SEO）スコアの中央値100点を達成しています。 このスコアは、ページの構造がSEOに非常に優れている品質を評価するもので、かつての「WixはSEOに弱い」という印象を過去にするものです。 ユーザーには届けられるのに、見栄えが悪くてユーザーが離れてしまう……。 こんな勿体無いことはありませんよね？ では、なぜ「wix studio モバイル版 崩れる」という現象が起きるのでしょうか？ この記事では、レイアウトが崩れる原因を、Wix studioのプロのクリエイターができるだけわかりやすく解説します。 Wix studioでモバイル版のレイアウトが崩れる原因 今回は特定の機能ではなく、 「なぜモバイル版でレイアウトが崩れるの