カスタムフィールドグループのデータをCSVインポートする
弊社アップルップルの学生インターンの課題として、a-blog cms のカスタムフィールドグループ の値を CSV でインポートする機能 があり、 a-blog cms LIVE Vol.01 でインターンの @ryoseiyamano に発表して頂きました。
a-blog cms LIVEでもご紹介させていただきましたが、実装方法をこの記事でご案内いたします。
ダウンロード方法
作られたものは github の https://github.com/appleple/cfg-csv に公開されています。以下のボタンから一式をダウンロードすることができます。
src フォルダ内のファイルの説明
| csvImport.js | CSVインポート用の JavaScript |
|---|---|
| csvDownload.js | CSVダウンロード用の JavaScript |
| csvImport.css | 追加ボタンの横にボタンのみ表示させるためのCSS |
設置方法
設置場所は自由ですが、field.html と同じディレクトリであれば以下のように書くだけで「CSVアップロード」ボタンが表示されるようになります。
インポートだけではなくCSVをダウンロードする機能も必要であれば、合わせて csvDownload.js も読み込んでください。
<script src="csvImport.js"></script> <link rel="stylesheet" href="csvImport.css">
CSVアップロードボタンが表示された様子
利用方法
- アップロードするCSV ファイルを用意してください。データは、 1行目にカスタムフィールドの name をカンマ区切りで設定し、2行目以降は1行目に対応するデータを記入してください。
- CSVアップロードボタンから、作成したCSVファイルを選択してアップロードしてください。
