Movable Type.net

MovableType.net 活用ブログ

MovableType.net の新機能の使い方や、ウェブサイトの構築・運用に役立つTIPSを紹介しています。

GitHub連携機能でウェブサイトと配下のブログのテーマをまとめて管理する

以前GitHub連携でデザインを管理するという記事をご紹介しましたが、GitHub連携ではウェブサイトとその配下のブログのテーマを同時に管理することができます。

今回は、ウェブサイトの下にブログ1つの構成を例にご説明します。

multiogimage.jpg

まず、ウェブサイトを作成した後にブログを1つ作成します。
ここでは、ブログのフォルダ名を「blog」として作成しておきます。

GitHubのレポジトリ側では、直下にウェブサイト用の「_theme」フォルダを用意し、同じ階層に「blog」フォルダを用意、その下にブログ用の「_theme」を用意します。
これにより、先ほど作成したウェブサイトとブログの構成と同じになります。

実際のサンプルファイルも用意しましたので、以下よりダウンロードしてお試しください。

サンプルファイルの構成

.
├── _theme
│   ├── blog_static
│   │   ├── images
│   │   │   ├── bg-top-main.jpg
│   │   │   ├── favicon.ico
│   │   │   ├── logo.png
│   │   │   ├── main-img.png
│   │   │   └── ogimage.png
│   │   └── js
│   │       ├── common.js
│   │       ├── jquery.smooth-scroll.min.js
│   │       └── jquery.tile.min.js
│   ├── templates
│   │   ├── common_bottom_js.mtml
│   │   ├── common_head_js.mtml
│   │   ├── common_stylesheet.mtml
│   │   ├── config.mtml
│   │   ├── footer.mtml
│   │   ├── header.mtml
│   │   ├── index_page.mtml
│   │   └── styles.mtml
│   └── theme.yaml
└── blog
    └── _theme
        ├── blog_static
        │   ├── images
        │   │   ├── bg-top-main.jpg
        │   │   ├── favicon.ico
        │   │   ├── logo.png
        │   │   ├── main-img.png
        │   │   └── ogimage.png
        │   └── js
        │       ├── common.js
        │       └── jquery.tile.min.js
        ├── templates
        │   ├── blog-sidemenu.mtml
        │   ├── category_entry_listing.mtml
        │   ├── common_bottom_js.mtml
        │   ├── common_head_js.mtml
        │   ├── common_stylesheet.mtml
        │   ├── config.mtml
        │   ├── entry-list.mtml
        │   ├── entry.mtml
        │   ├── feed_recent.mtml
        │   ├── footer.mtml
        │   ├── header.mtml
        │   ├── index_page.mtml
        │   ├── javascript.mtml
        │   ├── main_index.mtml
        │   ├── page.mtml
        │   ├── styles.mtml
        │   └── yearly_entry_listing.mtml
        └── theme.yaml

GitHubの画面上では以下のようになります。

multithme.jpg

サンプルテーマの簡単な説明

ウェブサイト

hayasetest.jpg

  • 1ページ完結のデザイン
  • ウェブページを追加すると各ブロックと上部メニューが追加される

ブログ

blog.jpg

  • 各アーカイブを含んだブログテーマ
  • 上部ナビゲーションは親のウェブサイトの指定の位置にスムーズに遷移するようになっている

このように、作成したブログと同じ構造でフォルダを作り、その下にそれぞれテーマファイルである「_theme」を用意する、という方法でウェブサイトとブログをまとめてGitHubで管理することができます。

是非GitHub連携でデザインを管理するの記事を参考にしつつお試しいただければと思います!

アカウント作成は無料! 同じアカウントでウェブサイトをいくつでも作成でき、作成したウェブサイト毎に14日間無料で利用可能です。

アカウント作成

Movable Type.net は無料トライアルが可能です。
Web制作者の方で、デモや評価利用をご希望の場合は、制作者向け評価ライセンスをご利用ください。

無料トライアル 資料ダウンロード 制作者向け評価ライセンス