忍者ブログ

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

シンプルxシンプル




シンプルなテンプレートエディターをつくったよ。

テンプレートはこちら

※ごめん。詳細は時間が出来たら書くよー。


PR

Leaf

このブログは忍者ブログ用デザインテンプレート『Leaf』のチュートリアルです。

テンプレート概要

『Leaf』
シンプルな日記用のテンプレが欲しいとご要望をいただいたのでつくってみました。プラグイン無し、一段組みのシンプルな構成です。

デモ

デモサイトはこちら

画面構成

シンプルな一段構成で、プラグインはありません。

仕様について

HTML5/CSS3を利用

セマンティックな文書構造にしてあります。将来的にSEOへの効果を期待しています。

レスポンシブウェブデザインに対応

このブログはレスポンシブウェブデザインに対応しています。 スマートフォンの閲覧時に忍者ブログのデフォルトデザインを利用しない様にする設定が必要になります。 下記の手順で調整を行ってください。

  1. 忍者ブログ管理ページでブログ表示の設定をクリック
  2. サブナビのブログ表示の設定をクリック
  3. 「スマートフォン用テンプレート」の項目を使用しないに変更して保存

更新履歴

  • テンプレート申請中(2012/07/27)





shine

このブログは忍者ブログ用デザインテンプレート『shine』のチュートリアルです。

テンプレート概要

『shine』
最近、ボケ画像を使ったキラキラしてるテンプレートが流行ってるようなので、試しに作ってみました。背景画像は好きに変更してOKですよ。

デモ

デモサイトはこちら

画面構成

シンプルな一段構成で、プラグインはフッターに配置しました。

仕様について

HTML5/CSS3を利用

セマンティックな文書構造にしてあります。将来的にSEOへの効果を期待しています。

アルファベットウェブフォントを利用

ブログタイトルとプラグインタイトルの2か所にGoogleウェブフォントを利用しています。 (Lora:700:italic

できるだけ、上記2か所に関してはアルファベットを利用した方が、とてもかっこいい仕上がりになります。※もちろん日本語も利用できます。

プラグイン分散配置

このブログテンプレートでは、プラグインを通常のナビゲーションに利用するだけではなく、headタグ内、記事上、記事下、body閉じタグの直前に配置することで、デザインテンプレートを変更しても、アクセス解析のタグなどを再配置しなくても良い仕組みを導入しています。

プラグイン1
通常のプラグインとして利用します。「Notebook」テンプレートでは、ページ上部のトグルスライドの部分が該当します。
プラグイン2
プラグイン2は、<head>タグ内に配置しています。フリーエリアプラグインで、デザインテンプレートに依存しないCSSや、Googleウェブマスターツールの認証タグを設置して下さい。
プラグイン3 / プラグイン4
プラグイン3は記事の上部。プラグイン4は記事の下部になります。フリーエリアプラグインを利用して、Twitter、Facebookなどのソーシャルメディアのアイコン(忍者おまとめボタンがオススメ)や広告などを張ってください。
プラグイン5
プラグイン5は、</body>タグの直前に配置します。フリーエリアプラグインを利用して、アクセス解析のタグなどを設置して下さい。

レスポンシブウェブデザインに対応

このブログはレスポンシブウェブデザインに対応しています。 スマートフォンの閲覧時に忍者ブログのデフォルトデザインを利用しない様にする設定が必要になります。 下記の手順で調整を行ってください。

  1. 忍者ブログ管理ページでブログ表示の設定をクリック
  2. サブナビのブログ表示の設定をクリック
  3. 「スマートフォン用テンプレート」の項目を使用しないに変更して保存

更新履歴

  • テンプレート申請中(2012/07/27)





Notebook.(ノートブック)

このブログは忍者ブログ用デザインテンプレート『Note.』のチュートリアルです。

テンプレート概要

『Note』
このテンプレートはノートブック形式のデザインテンプレートです。日記やメモ帳、小説などに向いています。

デモ

デモサイトはこちら

画面構成

基本的には見開きで左右に記事が1件づつ配置されます。ブログ詳細設定にて、表示する一覧の記事件数を「2件」に設定変更して頂く必要があります。

仕様について

HTML5/CSS3を利用

セマンティックな文書構造にしてあります。将来的にSEOへの効果を期待しています。

アルファベットウェブフォントを利用

ブログタイトルとプラグインタイトルの2か所にGoogleウェブフォントを利用しています。 (Lora:700:italic

できるだけ、上記2か所に関してはアルファベットを利用した方が、とてもかっこいい仕上がりになります。※もちろん日本語も利用できます。

ソーシャルボタン

フッター部分にソーシャルボタンをつけておきました。 ただし利用して頂くには、テンプレートの編集を行って頂く必要があります。

  1. 忍者ブログ管理ページでテンプレートの設定をクリック
  2. 利用中のgridsテンプレートの[ 修正 ]をクリック
  3. HTML中の下記のリンク先を適宜変更。
    <aside>
        <ul id="social">
          <li><a href="#" target="_blank"><img src="http://blog.cnobi.jp/v1/blog/user/d3a05ff5bbe5cca991b42eb152f0b5fb/1340457578" /></a></li>
          <li><a href="<!--$g_url-->RSS/" target="_blank"><img src="http://blog.cnobi.jp/v1/blog/user/d3a05ff5bbe5cca991b42eb152f0b5fb/1340457577" /></a></li>
          <li><a href="#" target="_blank"><img src="http://blog.cnobi.jp/v1/blog/user/d3a05ff5bbe5cca991b42eb152f0b5fb/1340457576" /></a></li>
          <li><a href="#" target="_blank"><img src="http://blog.cnobi.jp/v1/blog/user/d3a05ff5bbe5cca991b42eb152f0b5fb/1340457575" /></a></li>
          <li><a href="#" target="_blank"><img src="http://blog.cnobi.jp/v1/blog/user/d3a05ff5bbe5cca991b42eb152f0b5fb/1340457574" /></a></li>
        </ul>  
    </aside>
※RSSボタンはリンクURLを設定済みです。変更の必要はありません。

プラグイン分散配置

このブログテンプレートでは、プラグインを通常のナビゲーションに利用するだけではなく、headタグ内、記事上、記事下、body閉じタグの直前に配置することで、デザインテンプレートを変更しても、アクセス解析のタグなどを再配置しなくても良い仕組みを導入しています。

プラグイン1
通常のプラグインとして利用します。「Notebook」テンプレートでは、ページ上部のトグルスライドの部分が該当します。
プラグイン2
プラグイン2は、<head>タグ内に配置しています。フリーエリアプラグインで、デザインテンプレートに依存しないCSSや、Googleウェブマスターツールの認証タグを設置して下さい。
プラグイン3 / プラグイン4
プラグイン3は記事の上部。プラグイン4は記事の下部になります。フリーエリアプラグインを利用して、Twitter、Facebookなどのソーシャルメディアのアイコン(忍者おまとめボタンがオススメ)や広告などを張ってください。
プラグイン5
プラグイン5は、</body>タグの直前に配置します。フリーエリアプラグインを利用して、アクセス解析のタグなどを設置して下さい。

更新履歴

  • テンプレート申請中(2012/07/20)
  • テンプレート承認済み/公開(2012/07/20)





grids(グリッズ)

新着テンプレができたよ。
■デモ:http://grids.blog.shinobi.jp/
■チュートリアル:http://grids.blog.shinobi.jp/Entry/13/