こんにちは。おもち(omochi.biz)です。
こちらのページでは、WordPressブログのサイトデザインをSWELLのデモサイトと同じデザインに着せ替える方法についてわかりやすく解説していきます。
ワードプレスにSWELLテーマをインストールしてから始めよう!
ワードプレスにSWELLテーマをインストールする方法はこちら
STEP1.デモデータをダウンロードしよう
まずはSWELLのデモサイト一覧から、あなたのお好きなデモサイトを1つえらんでください。
デモで使われている色味はあとから自由にかえられるよ!
お気に入りのデモサイトが決まったら、SWELLデモデータのダウンロードページをひらきます。
ダウンロードしたいデモサイト番号の右側にある『ダウンロード』ボタンをクリック。
これでデモデータがダウンロードできたよ!
ダウンロードしたzipファイルは、そのままでは使えないので、ファイルを展開していきましょう。
パソコンのダウンロードをひらいて、ダウンロードしたファイルの上で右クリック。
『すべて展開…』をクリック。
展開先を確認して『展開』ボタンをクリック。
展開されたファイル内にある『swell_demo〇〇.dat』をつかって、デモサイトの着せ替えをやっていきましょう。
STEP2.WordPressに『Customizer Export/Import』プラグインを追加しよう
ワードプレスをひらいて、画面左側にあるメニューの『プラグイン』にカーソルをもっていき、表示された『新規プラグインを追加』をクリック。
プラグインの検索に『Customizer Export/Import』と入力。
検索結果に表示されたCustomizer Export/Importにある『今すぐインストール』ボタンをクリック。
そのまま『有効化』ボタンをクリック。
STEP3.SWELLのデモデータをWordPressにインポートしよう
画面左上にある『カスタマイズ』をクリック。
画面左側のメニューにある『エクスポート/インポート』をクリック。
インポートの『ファイルを選択』ボタンをクリック。
さきほど展開したファイル内にある『swell_demo〇〇.dat』を選択。
画像ファイルをダウンロードしてインポートしますか?のチェックボックスにチェック。
『インポート』ボタンをクリック。
これでデモサイトの着せ替えはOK!あなた好みにカスタマイズしていこう!
参考までに:サイトのメインビジュアルを変更する方法
画面左側のメニューにある『トップページ』をクリック。
『メインビジュアル』をクリック。
サイトのメインビジュアルは、こちらで変更できます。
メインビジュアルに動画を配置したい場合は『動画の設定』よりファイルをアップロードしてください。
メインビジュアルに画像を配置したい場合は、メインビジュアルの表示内容で『画像』を選択。
『各スライドの設定』より画像をアップロードしてください。
『フィルター処理』をつかえば、さらにあなた好みのメインビジュアルにカスタマイズできます。
メインビジュアルの上にテキストを配置したい場合は『メインテキスト』にお好きな文字列を入力してください。
改行したいときは『<br>』を入力すると改行できるよ!
設定が終わったら『公開』ボタンをクリック。
『公開』ボタンをクリックしないと、変更した設定が保存されないから気をつけてね!
画面左上にある『×』マークをクリックすると、ワードプレスのダッシュボード画面にもどれます。
STEP4.WordPressからプラグインを削除しよう
不必要になったプラグインは削除しておきましょう。
ワードプレスをひらいて画面左側のメニューにある『プラグイン』をクリック、Customizer Export/Importの下にある『無効化』をクリック。
無効化できたら『削除』をクリック。
プラグインはいつでも追加できるので、安心して削除してOKだよ!
サイトデザインは、ある程度、ブログ記事がないと進まないので、必要なプラグインをインストールしてからブログ記事作成をしていきましょう。