UPDATE, 簡易CMSで無料ブログを公開、カスタム レイアウトを複数追加 #Vue #Vue-CLI #javascript

■ 概要:

CMSのアップデート内容で、
レイアウトを追加しました。

・デモサイトは、GithubPagesに設置して例になります。
・投稿データ等の、編集機能は前回と同じで。MD書式対応です


■ 環境

Vue CLI
vue: 2.6.11
vue-router

■ 前の関連のページ

概要については、前のページを参考下さい

■ 画面 Top

下記、レイアウトの紹介になります

・type2, グリッドレイアウト風

の投稿データ表示となります。

画像1

■ 参考の、デモのページ

https://kuc-arc-f.github.io/cms-sample-type2

■ 参考のコード


・type3 , 少し明るめ


画像2

■ 参考の、デモのページ 、type3

https://kuc-arc-f.github.io/cms-sample-type3

■ 参考のコード , type3

・type4


初版と、似ていますが、サイドに。twitterタイムラインを埋込可能な形です。
・タイムラインは、twitterの画面から取得して。埋め込む形です
https://publish.twitter.com/

画像3

■ 参考の、デモのページ 、type4

https://kuc-arc-f.github.io/cms-sample-type4

■ 参考のコード 、type4


■ type5: TOP画像無、gray

https://kuc-arc-f.github.io/cms-sample-type5

画像4

■ コードURL、type5
https://github.com/kuc-arc-f/vue_spa3cms3_type5

■ type6: TOP画像無、blue

https://kuc-arc-f.github.io/cms-sample-type6

画像5

■ コードURL、type6
https://github.com/kuc-arc-f/vue_spa3cms3_type6

■ type7: TOP画像無、green

https://kuc-arc-f.github.io/cms-sample-type7

画像6

■ コードURL、type7
https://github.com/kuc-arc-f/vue_spa3cms3_type7

■ type8: TOP画像無、purpul

https://kuc-arc-f.github.io/cms-sample-type8

画像7

■ コードURL、type8
https://github.com/kuc-arc-f/vue_spa3cms3_type8

■ type9: TOP画像無、SNSタイムライン付

https://kuc-arc-f.github.io/cms-sample-type9

画像8

■ コードURL、type9
https://github.com/kuc-arc-f/vue_spa3cms3_type9


■ 補足

・初版レイアウトの、デモはこちら
https://kuc-arc-f.github.io/cms-sample


ここから先は

0字

IndexedDB, Vue CLI 開発の事例、ノウハウに関する記事を集めました。 ■ 免責事項 / 注記 , 内容について動作確認…

この記事が気に入ったらサポートをしてみませんか?