登録不要・完全無料。ブロックを並べるだけでお店のホームページが作れます。このページを読めば今日中にサイトが完成します。
エディターを開く(無料)登録不要・インストール不要
HPYourselfはブラウザ上で動くので、インストール不要です。エディターを開くをクリックするだけで今すぐ始められます。
EDITOR LAYOUT
左パネル:ブロック一覧・設定
← 左:ブロックの設定パネル
右:リアルタイムプレビュー →
トップページ・メニューページ・アクセスページなど
左パネルの上部にページ一覧があります。「+ページを追加」ボタンで新しいページを追加できます。
「トップ」「メニュー」「アクセス」など、編集したいページをクリックします。
ページ名はナビゲーションに表示される名前です。スラッグはURLになります(例:about → about.html)。
ページ全体の背景色とコンテンツの最大幅を設定できます。通常は1200pxがおすすめです。
パーツを組み合わせてページを作る
HPYourselfはブロックを積み重ねてページを作ります。左パネルのブロック一覧から追加したいブロックをクリックするだけです。
クリックして設定パネルを開く
プレビュー上のブロックをクリックすると、左パネルに設定パネルが表示されます。テキスト・画像・色などを自由に変更できます。
右側のプレビュー画面でブロックをクリックすると、左パネルにそのブロックの設定が表示されます。
左パネルの入力欄に内容を入力すると、右のプレビューにリアルタイムで反映されます。
左パネルのブロック名の横にある ↑↓ ボタンで順番を変更できます。プレビュー上でのホバーボタンでも操作できます。
左パネルのブロック名の横にある ✕ ボタン、またはプレビュー上のホバーボタンの ✕ で削除できます。
サイト全体のデザインを統一する
左パネルの「共通項目設定」タブからナビゲーション(上部メニュー)とフッター(下部)のデザインを設定できます。
ナビゲーションに表示するロゴ画像またはテキストを設定します。
ブランドカラーに合わせた色に変更できます。プリセット(A〜F)から選ぶこともできます。
サイト名・説明文・OGP画像を設定するとGoogle検索やSNSシェア時の表示が改善されます。
HTMLまたはWordPressテーマとしてダウンロード
作業内容は自動保存されますが、ファイルとして書き出すことでサーバーに公開できます。
そのままサーバーにアップロードして使えるHTMLファイル一式がZIPでダウンロードされます。
WordPressに適用できるテーマファイルがZIPでダウンロードされます。