タグ「Template」が付けられているもの

動かなくなったhtml5slidesを修正する【覚書】

html5slidesが削除されたので、Movable Typeのテンプレートで作ったスライドが動かなくなった。チョコっと修正して動くようになったので覚書。

以下よりhtml5slidesをダウンロードする

html5slides

slides.js・prettify.js・styles.cssを使用する

展開したフォルダ

slides.jsを開き、13行めのパスを書き換える

var PERMANENT_URL_PREFIX = 'http://html5slides.googlecode.com/svn/trunk/';

例えば、スライド直下であれば以下の通り。

var PERMANENT_URL_PREFIX = '';

slides.js・prettify.js・styles.cssをインデックステンプレートに作成する。

インデックステンプレートの「メインページ」23行め、slides.jsへのパスを修正する。

<script src="http://html5slides.googlecode.com/svn/trunk/slides.js"></script>
<script src="slides.js"></script>

Movable Type テーマの販売を終了いたします

2005年12月8日開業以来10年にわたり皆様のご厚情をいただいて今日まで続けて参りましたが、諸般の事情により来る3月31日をもちまして営業を終了することになりました。

永らくご愛顧いただきましたお得意様をはじめ、ご指導ご鞭撻を賜わりました業界各位の皆様には衷心より厚く御礼申し上げる次第でございます。
重ねて御礼申し上げ、ますますのご隆盛をお祈りいたしましてご挨拶とさせていただきます。

尚、当ブログは個人のブログとして継続運営いたします。

アットスタイル 柳 泰久

アットスタイルのMovable Type テーマをSSL環境で利用する【覚書】

販売中のテーマデモサイトをSSL化した際の覚書。テーマには一切手を入れずに完了した。

管理画面のSSL化

mt-config.cgiに以下を追加記述する

AdminCGIPath https://example.com/Movable Typeをインストールしたディレクトリ/

URLを変更する

ウェブサイト(またはブログ)の「設定」にてウェブサイトのURLをhttpsからのURLに変更する

記事やページで利用したアイテムのURLを置換

Movable Typeの「検索/置換」を使用し、アイテムのURLをhttpsからのURLに書き換える。

再構築して完了

Movable Type 5以下のテーマ販売を終了予定です

2015年9月30日、Movable Type 5.2.x は"EOL"(製品ライフサイクルの終了)となりました。

【Movable Type 5】EOL(製品ライフサイクルの終了)のお知らせ

アットスタイルではMovable Type 5以下のテーマの販売を終了することにいたしました。無料テンプレートにつきましても同様に公開を終了する予定です。

何卒、ご理解の程よろしくお願いします。

ホームページの土台での紹介文に歓喜

昨年の1月、ある方から丁寧なメールをいただいた。

「ホームページの土台(WEBテンプレートのまとめサイト) を立ち上げまして、誠に勝手ながら、御社サイトの情報を掲載させて頂きました。

中略

「掲載を許可しない」等ございましたらご一報頂ければ幸いです。

特に問題ない内容で掲載されていたので、そのまま返信もせずにいた。

本日アナリティクスで「参照サイト」のリストにあったので見てみると、サイトはリニューアルされており以下のような内容が追加されていた。

国内のMTテーマを配布している数あるサイトの中で、常に最新バージョンに対応しつつ、このサイトのように洗練されたデザインを提供しているところを私は知りません。

ホームページの土台
ホームページの土台

本当にありがとうございます。

Movable Type 6 無料テーマ Bootstrap 01のBootstrapをv3.3.1にアップデートしました

1ヶ月ほど前になりますが、Bootstrap v3.3.1がリリースされています。

これに伴い、「Movable Type 6 無料テーマ Bootstrap 01」のBootstrapをv3.3.0からv3.3.1にアップデートしました。

Movable Type 6 無料テーマ Bootstrap 01
Movable Type 6 無料テーマ Bootstrap 01

有料テーマのアップデートは完成次第、ご案内します。

よろしくお願いします。

Movable Type 6.0.4へのバージョンアップ時の不具合(YAMLの構文エラー)について

アットスタイルのテーマ・テンプレートをインストールしたMovable Typeで6.0.4へのバージョンアップを行う際にYAMLの構文エラーが発生します。これは構文チェックの厳しいバージョンへYAML::Tinyが変更されたことによるもので、アットスタイルで販売・配布している全てのテーマ・テンプレートで発生します。

丸2日掛けて、以下の全ての(500ファイルほど)のYAMLを修正し、正常にMovable Type 6.0.4へのアップデートが可能なことを確認いたしました。

テーマをご利用の方は、Movable Type 6.0.4へのアップデートの前にアットスタイルまでお知らせ下さい。theme.yaml又はconfig.yamlをお送りいたしますので、差し替えた後にアップデート作業を行って下さい。

お手数ではございますが、よろしくお願いします。

Movable Type 5でMovable Type 6のテーマを利用する

Movable Type 5の製品ライフサイクル終了日は、2016年1月15日となっており、継続使用される所も多いようです。

アットスタイルで販売中の「Movable Type 6 テーマ(テンプレート) Bootstrap HTML5」をMovable Type 5で利用する方法をご紹介します。

なお「Movable Type 6 ビジネス向けベーステーマ(テンプレート) Bootstrap HTML5」でも同様の編集でご利用いただけます。

ウェブサイト

バナーフッターの<$mt:StatsSnippet$>を削除又はアクセス解析のコードに変更します。

ブログ

以下のテンプレートを編集します。

  • メインページ
  • ウェブページ
  • カテゴリ別ブログ記事リスト
  • 記事
  • コメントプレビュー
  • コメント完了
  • 検索結果

編集箇所は7つのテンプレートで共通です。

タイトル要素の

<$mt:WebsiteName encode_html="1"$>

<mt:BlogParentWebsite><$mt:WebsiteName encode_html="1"$></mt:BlogParentWebsite>

パンくずリスト内の

<li><a href="<$mt:WebsiteURL$>">Home</a></li>

<li><a href="<mt:BlogParentWebsite><$mt:WebsiteURL$></mt:BlogParentWebsite>">Home</a></li>

ブログのメインページでの編集箇所

変更後、再構築して完了です。

「【MT東京-04】MovableTypeテーマをつくる」が開催されます

第1回から第3回まではケーススタディーとして開催されましたが、今回は実践的なMovableTypeテーマについてのイベントになったようです。

【MT東京-04】MovableTypeテーマをつくる
【MT東京-04】MovableTypeテーマをつくる

気になる内容は

  1. テーマの導入によるウェブサイト制作の高効率化
    テーマ導入の事例
    テーマ導入によるワークフロー改善
  2. MTのインストール、セッティング
    テーマ導入までのMTの設定を解説
  3. テーマ制作

参加したいのですが...

GitHub Pagesにページを作成し独自ドメインを設定した

atstyle.orgのドメインは、期限切れのまま放置していたのですが、思い立ってGitHub Pagesでサイトを作ってみることにした。

GitHub for Macを使ったので、作り方は簡単。以下覚書

  1. username.github.ioでリポジトリを作る
  2. 「Set up in Desktop」ボタンをクリックしデスクトップにクローンを作る
  3. デスクトップにファイルを配置
  4. デスクトップにCNAMEファイルを作成する
  5. GitHub for MacからコミットしてSync
  6. ドメインのAレコードを192.30.252.153に向ける

atstyle.org

Movable Type 6 無料テーマ Bootstrap 01にBootswatchのCSSを適用する

Movable Type 6 無料テーマ Bootstrap 01にフラットでシンプルなデザインが美しいBootswatchのスタイルシートを適用する方法をご紹介します。

Bootswatch

Bootswatchのスタイルシートを利用するには、予めナビゲーションバーをFixed navbarなどに変更します。

Fixed navbar

ダッシュボードを開き、Bootswatchよりダウンロードしたbootstrap.min.cssをbootstrap_min_css(bootstrap_min_css.mtml)にペーストします。ファイルサイズが大きいために上手くペースト出来ない事があります。その場合はテーマのbootstrap_min_css.mtmlに上書きアップロードし、bootstrap_min_cssを初期化して下さい。

Cosmoを適用したブログ

テーマによってはページャーなどがうまく表示されないものもあるようです。多少カスタマイズの必要な場合があります。

Movable Type 6 無料テーマ Bootstrap 01にZenbackを設定する

Movable Type 6 無料テーマ Bootstrap 01」にはZenbackの設定をスムーズに行えるように「Zenback」モジュールを作成しています。このモジュールにコードを記述するだけでZenbackを実装することが出来ます。

「Zenback」モジュール(zenback.mtml)を開きます。上下の<!--と-->を削除し、「ここに Zenback の Script コードを貼り付けてください。」部分にZenbackから提供されたコードを記述します。

「Zenback」モジュール

コードを追加した「Zenback」モジュール

「記事アーカイブ」を再構築します。

記事下のZenback

設定直後は上手く表示できませんが、少し時間が経過すると正しく表示されます。

Movable Type 6 無料テーマ Bootstrap 01の記事にキーワードを出力する

昨日、「Movable Type 6 無料テーマ Bootstrap 01」のユーザー様よりmeta name="keywords"の出力についてご質問をいただきましたので、ブログでも紹介いたします。

  • 記事のキーワードフィールドの内容をmeta name="keywords"として出力
  • meta name="description"の直後に出力する

「HTMLヘッダー」モジュール(html_head.mtml)を開いてdescription部分に

<meta name="keywords" content="<$mt:EntryKeywords$>">

を追加します。

「HTMLヘッダー」モジュール

entry_templateで分岐しているその範囲内に追加します。

<mt:Ignore>================ description ================</mt:Ignore>
<mt:If name="entry_template">
<meta name="description" content="<$mt:EntryExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:EntryKeywords$>">
<mt:ElseIf name="category_archive">
<meta name="description" content="<$mt:ArchiveTitle$> <$mt:CategoryDescription$>">
<mt:ElseIf name="page_template">
<meta name="description" content="<$mt:PageTitle$> <$mt:PageExcerpt remove_html="1"$>">
<mt:ElseIf name="main_index"><mt:If tag="BlogDescription">
<meta name="description" content="<$mt:BlogDescription$>">
</mt:If><mt:Else>
<meta name="description" content="<$mt:var name="page_title"$>">
</mt:If>
<mt:Ignore>================ /description ================</mt:Ignore>

記事以外でキーワードの追加を行うとしたら、以下のようになります。

<mt:Ignore>================ description ================</mt:Ignore>
<mt:If name="entry_template">
<meta name="description" content="<$mt:EntryExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:EntryKeywords$>">
<mt:ElseIf name="category_archive">
<meta name="description" content="<$mt:ArchiveTitle$> <$mt:CategoryDescription$>">
<meta name="keywords" content="キーワード1,キーワード2,キーワード3">
<mt:ElseIf name="page_template">
<meta name="description" content="<$mt:PageTitle$> <$mt:PageExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:PageKeywords$>">
<mt:ElseIf name="main_index"><mt:If tag="BlogDescription">
<meta name="description" content="<$mt:BlogDescription$>">
<meta name="keywords" content="キーワード4,キーワード5,キーワード6">
</mt:If><mt:Else>
<meta name="description" content="<$mt:var name="page_title"$>">
<meta name="keywords" content="キーワード7,キーワード8,キーワード9">
</mt:If>
<mt:Ignore>================ /description ================</mt:Ignore>

キーワード1~キーワード9は適宜変更してください。

Movable Type 無料テーマ(テンプレート)のダウンロードをGitHubに移動しました。

無料配布中のMovable Type テーマ(テンプレート)をGitHubに移動しました。

GitHub

利用規約も変更し、より気軽にご利用いただけるようになりました。よろしくお願いします。

Movable Type 6 無料テーマ Bootstrap 01のナビゲーションバーをFixed navbarにカスタマイズする

Movable Type 6 無料テーマ Bootstrap 01」のナビゲーションバーを、Bootstrapのサンプルにも掲載されているFixed navbarにカスタマイズする方法をご紹介します。

Bootstrap サンプルのFixed navbar

バナーヘッダー(banner_header.mtml)を以下の内容に変更します

<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<header role="banner">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="<$mt:Link template="メインページ"$>"><$mt:BlogName$></a>
</div>
<nav class="navbar-collapse collapse" role="navigation">
<ul class="nav navbar-nav">
<li><a href="<$mt:Link template="メインページ"$>">Home</a></li>
<mt:Pages tag="@about">
<li><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
</mt:Pages>
<mt:Pages tag="@ADD_TO_SITE_NAV">
<li><a href="<$mt:PagePermalink encode_html="1"$>"><$mt:PageTitle$></a></li>
</mt:Pages>
<li><a href="<$mt:Link template="最新記事のフィード"$>">Feed</a></li>
</ul>
</nav>
</header>
</div>
</div>
<div class="container">
<header class="blog-header" role="banner">
<h1 class="blog-title"><$mt:BlogName encode_html="1"$></h1>
<p class="lead blog-description"><$mt:BlogDescription$></p>
</header>
<div class="row">

custom_for_mt_css(custom_for_mt_css.mtml)に以下を追加します。

body {
    padding-top: 40px;
}

再構築し完成です。

Fixed navbar