• ダイアログボックスをショートコードで作る

    Raindrops 0.930以降であれば、ショートコードという記法を利用できます。

    強調表示などで使えるダイアログボックスを作ることができます。

    重要なお知らせ

    ここに内容を記述します。

    ダイアログボックスは、投稿画面で以下のように記述します

    [dialog title=”重要なお知らせ”]

    ここに内容を記述します。

    [/dialog]


  • タブインターフェースをショートコードで作成

    Raindrops テーマ 0.930以降をお使いの場合、タブインターフェースをショートコードを使って簡単に記述できます。

    • Tab Area

    ショートコード タブ


    タブインターフェースの作り方を紹介します。

    書き方


    タブを書くには、ショートコードという記法を使います

    [tab]

    [tab_item title=”タブのタイトルを書きます”]

    ここにコンテンツを書きます

    [/tab_item]

    [/tab]

    tab_itemを増やしていくとそれぞれのタブができます。

    制限、html要素、h3はタイトルに使うので、tab_item内では使えません


    画像


    画像は、サイズが多少大きくてもタブ内に縮小されてはみ出ません

    **tab その他の属性
    タブのコンテンツ部分にクラスを指定できます。
    クラスを追加したサンプルを以下に示します。

    [tab class=”gradient2 corner”]
    • Tab Area

    ショートコード タブ


    タブインターフェースの作り方を紹介します。

    書き方


    タブを書くには、ショートコードという記法を使います

    [tab]

    [tab_item title=”タブのタイトルを書きます”]

    ここにコンテンツを書きます

    [/tab_item]

    [/tab]

    tab_itemを増やしていくとそれぞれのタブができます。

    制限、html要素、h3はタイトルに使うので、tab_item内では使えません


    画像


    画像は、サイズが多少大きくてもタブ内に縮小されてはみ出ません

    ❗ 一ページの画面の中に複数のタブインターフェースが表示される場合は、それぞれは、一つのタブインターフェースとして、表示されます。(つまり、タブインターフェースがいくつあっても、表示されるのはクリックした一つのコンテンツになります)


  • クリックすると内容を表示:toggle short code

    Raindrops0.930以降をご利用の方は、ショートコードという記法を使うことができます。

    このページでは、クリックするとその内容を表示するトグルショートコードについて解説します
    行間20:

    • ここをクリックすると内容を表示する書き方
    • [toggle title=”test”]

      ここに本文

      [/toggle]

    • さらに二つのショートコード属性を記述することができます。
    • [toggle title=”test” class_title=”gradient2″ class_content=”gradient4″ ]

      ここに本文

      [/toggle]

    • class_title class_contentを使った表示の例

    行間20:


  • Raindrops 0.930 ライブになりました

    0.924の時に案内させていただいた。Raindrops独自機能ボタンは、テーマファイルで利用できず、ショートコードで対応して、紹介した機能を実現しました。

    ただ、テーマファイルに付加するべきではない。このコメント付で承認されているので、これらの機能については、今後検討を深めて行きたいと思います。

    今回新しく追加された機能の一つ、ショートコードを使ったタブ機能を簡単に紹介します。

    出来上がるのは、こんなタブです。

    • Tab Area

    ショートコード タブ


    タブインターフェースの作り方を紹介します。

    書き方


    タブを書くには、ショートコードという記法を使います

    [tab]

    [tab_item title=”タブのタイトルを書きます”]

    ここにコンテンツを書きます

    [/tab_item]

    [/tab]

    tab_itemを増やしていくとそれぞれのタブができます。

    制限、html要素、h3はタイトルに使うので、tab_item内では使えません


    画像


    画像は、サイズが多少大きくてもタブ内に縮小されてはみ出ません

    これ以外にも、トグル機能や、投稿の分割などいくつかの機能が追加されています 今後順次紹介していきます。


  • Raindrops0.928ライブになりました。

    エディタの追加機能を中止させていただきましたので

    今回は、
    ヘッダータイトルの文字が見難いことがあるバグ
    エントリータイトルがなくても、代替画像を表示して閲覧に支障がないようにするという2点になりました

    タブ表示やダイアログボックス、投稿エリアの分割機能などについては、
    プラグインによる方法、ショートコードによる方法を、試作して検討しております。

    近いうちに、何らかの公式テーマとして許容される方法で追加していきたいと考えておりますのでご了承ください


  • 新バージョン0.924機能の訂正

    0.924をレビューに出しましたが、レビュアーより、

    テーマファイルからの、エディターパネルの、カスタマイズやボタンの追加は、テーマファイルで行うべきことではなく、プラグインで行うべきだというメッセージがありました。

    機能としては便利なものだと思っていますが、ワードプレスのテーマのレギュレーションは遵守すべきものと考え、修正版を再レビューに出しました

    0.924のエディタに関する新機能は、中止いたします。


  • Raindrops 0.924 レビューの申請しました

    ❗ エディタの拡張機能について、

    ワードプレスレビュアーより、テーマファイルからのエディタのカスタマイズやボタンの追加は、行うべきでなく、プラグインで行うべきだという指摘があり、

    大変便利な機能だと思っていましたが、テーマへの組み込みは中止とさせていただきます。

    こんにちは

    Raindropsテーマの新しいバージョンをレビュー申請しました

    今回、投稿エディタのビジュアルエディタボタンのカスタマイズを行いました。

    **ビジュアル表示でのメニューは、以下のようになります。

    左から
    -undo
    -redo
    -編集中のエントリを白紙にする
    -more リンクの挿入
    -エントリの中をページ風に分割
    -太字
    -斜体
    -リスト
    -リンク作成
    -見出し、段落を範囲に割り当て
    -フルスクリーンモード
    -もちょっといろんなメニューの表示
    -レインドロップスのスペシャルオプション

    以上のメニューに変更しました。
    私自身はビジュアルメニューを使わないのですが、htmlタグを普段使わない人でも、レインドロップスのいろんな機能を身近なものにしていただくため、オプションメニューを目玉に編成してみました。

    おかしかったら、コメントください よろしくお願いします。

    **タイトルが空欄でも、代替画像を表示するようにしました。
    非画像対応のブラウザでも、問題ないように、非表示テキストも追加してあります。

    自動的に補完されるhtmlコードは以下のような構成になります

    [php]
    <a href="http://www.odekake.biz/wp/?p=2549" rel="bookmark">
    <img src="http://www.odekake.biz/wp/wp-content/themes/raindrops/images/link.png"
    alt="no title entry link">
    <span class="hide">This entry has no title posted on October 1, 2011</span></a>
    [/php]

    **ヘッダーのタイトルが、状態によって読みにくい色になるバグを修正しました。

    行間20:
    **レインドロップスのビジュアルエディタ オプションボタンについて

    -33:66
    –エントリーを33%幅のボックスと66%幅のボックスに分けます

    -50:50
    –エントリーを33%幅のボックスと66%幅のボックスに分けます
    -33:33:33
    –エントリーを3個の同じ幅のボックスに分けます

    -dialogbox
    –ダイアログボックスを作ります

    -tabbox
    –タブ付のボックスを自動生成します。

    -toggle
    –タイトルをクリックするとコンテンツが表示されるトグルボックスを自動生成します。

    待ちきれない人は、http://github.com/tenman/(b:githubからダウンロードできます)