【SWELL】スマホからデモサイトに着せ替える方法

コメントを見る

SWELLではCSSなどのコードをいじらなくても おしゃれなデザインにすることができます

デザインを変える方法は「SWELL利用者限定の会員サイト」にある 着せ替え機能を使う というものです。

ちなみにこのサイトは「ぽんひろ」さんにカスタマイズしてもらったのですが、少しの間だけ「デモサイト①」に変更しています。

JUN

簡単にできるので お洒落な雰囲気に変えたい人 はやってみてください!

着せ替えをする手順と注意点

先に注意点を挙げておくと着せ替えは10分もあれば終わりますが デモサイトと全く同じにするには、ほかにもやらなければいけない作業 があります。

完全に再現できない部分もありますので、その辺りは適宜調節していただければと思います。

引用:SWELLデモサイトのデザイン着せ替えファイル

理由は「完全に再現できない部分がある」からです。細かい部分の調整方法は、また改めてほかの記事で説明します。

手順1. 着せ替えに必要なプラグインをインストール

デザインを変更するには「Customizer Export/Import」というプラグインを使います。

Customizer Export/Import

先にこのプラグインをインストール ➡ 有効化しておきましょう。

このプラグインを導入することにより、外観 ➡ カスタマイズ の中に 「エクスポート / インポート」という項目が一番下に追加 されます。

エクスポート / インポート
「追加 CSS」の下に表示されます。

手順.2 着せ替えのファイルをダウンロード

次に着せ替えに必要なデータファイルをSWELL利用者限定の会員サイト「SWELLERS’」からダウンロードします。

DEMOサイト zipファイル
変えたいデモサイトのファイルをダウンロードします
JUN

自分がどんな感じのサイトにしたいのかは下のリンクを参考にしてください。

SWELL DEMO 1
SWELL DEMO 2
SWELL DEMO 3
SWELL DEMO 4
SWELL DEMO 5
SWELL DEMO 6

手順3. zipファイルを解凍しよう!

zipファイルをそのままアップロードしても着せ替えることはできない ので、ダウンロードしたファイルを解凍する必要があります。

iPhoneでは iOS13 から 解凍アプリを使わなくてもzipファイルを解凍することができる ようになりました。

まずはスマホアプリの ファイル を開きます。

ファイルの中から先ほどダウンロードした swell_demo01_dat.zip を見つけ出してタップすると、自動的に解凍してくれます。

swell_demo01_dat.zip をタップすると、

自動的にファイルを解凍して swell_demo01.dat というファイルが現れます。

JUN

これで準備完了です!

手順4. 解凍したファイルをアップロード

ファイルを解凍したら自分のサイトの管理画面に戻り 外観カスタマイズエクスポート / インポートを選択します。

次に ファイルを選択プラウズ をタップして先ほど解凍した swell_demo01/dat を選びます。

JUN

ここで間違ってダウンロードした状態の 「zipファイル」をアップロードすると着せ替えできない ので気を付けてね。

あとは 画像ファイルをダウンロードしてインポートしますか? にチェックを入れてインポートをタップ。

自動的に カスタマイズ のトップ画面に戻ればOK!

これで着せ替え作業は完了です♪

この記事を書いた人

コメント

コメントする