ツールチップ実装プラグイン「WordPress Tooltip」

n__1092

WordPress Tooltip」は、WordPressにツールチップを実装できるプラグインです。jQueryプラグイン「TipTip」を組み込んでいます。プラグインページの対応バージョンは古めですが、WordPressにロードしているjQueryライブラリのバージョンがTipTipに対応していれば動くようです。

実装方法

インストール・有効化すれば、あとはショートコードを使用して投稿に挿入できます。
ショートコードの書き方

[tooltip content="ツールチップの内容" url="リンクを付与する場合はURL"]
テキスト
[/tooltip]

オプション

/wp-content/plugins/wp-tooltip/js/wp-tooltip.js内でオプションを設定できます。
オプションはTipTipのページを参照して下さい。
デフォルトでは、keepAlive: trueとなっていますが、デモページではfalseにしました。これでカーソルがテキストから外れるとツールチップはフェイドアウトするようになります。

jQuery(function() {
    jQuery('.wp-tooltip').tipTip({
        keepAlive: false
    });
});
他プラグイン
Easy Tooltip
Simple Tooltips:title属性をツールチップ化、メニューのセレクタを指定し、ツールチップを表示してくれる。

WordPress Plugins » Tag: Tooltips - Recent Posts

  • このエントリーをはてなブックマークに追加

関連記事

n__0752

Twenty Eleven カスタマイズ

目次 author-info 消す 作成者(投稿者)を消す 投稿者情報を表示しない proudly powered by wordpressのリンクをコピーライトに変更

n__1019

折りたたみ要素やタブなどをショートコードで実装できるプラグイン「Arconix Shortcodes」

「Arconix Shortcodes」は、投稿内にショートコードでいろいろな要素を実装できるプラグインです。ダウンロードはこちらからできます。ダウンロード・解凍してpluginsディレクトリにアップ

wp-login.php

ログイン画面・機能をカスタマイズ

CSSを変更してスタイル変更 ログイン画面用のCSSを用意して子テーマとして使用します。変更したい部分だけを記述して下さい。 // オリジナル /wp-admin/css/login.min.

n__1107

「All in One SEO Pack」を代替するための準備

「All in One SEO Pack」は、SEO対策に必要な基本的な設定を行ってくれるプラグインです。とある事情で、無効化することになったので代替を行いました。特に問題があるわけではなく、特殊なこ

n__twenty-twelve

Twenty Twelve カスタマイズ

何点かTwentyTwelveのカスタマイズについてご質問をいただきましたのでここでまとめてみます。 目次 子テーマのつくりかた 他記事へのリンク アーカイブタイトル("カテゴリー別アーカ

n__twenty-twelve

Twenty Twelve 投稿日・投稿者を非表示に

TwentyTwelveのちょっとした部分をカスタマイズする方法を紹介していきます。 また、子テーマで出力部分を変更する際に、翻訳が必要な部分//_()の部分がでてきますので、以下の投稿も参考に

n__twentyfifteen

Twenty Fifteen テーマ用フォント "Noto" / "Inconsolata"の使用を止

TwentyFifteenでは、テーマ用のフォントとして「Noto」と「Inconsolata」というフォントをGoogleフォントから引っ張ってきて使用されるようです。 ちなみにどのようなフォント

wp-dark-lo-1024x768

多言語化プラグイン「qTranslate」

ブログを多言語化しようと思い、プラグイン「qTranslate」を導入してみました。 General Settingsで使用する言語を選択する ★使用する言語を選択 管理画面「設定」⇒「Lang

863

「カテゴリー」ウィジェット カスタマイズ

「カテゴリー」ウィジェットは、管理画面ではあまりカスタマイズできません。必要であれば、フックやプラグインを用いて表示設定などの変更を行うことができます。 目次 「カテゴリー」ウィジェットの追加

bouquet

ブルー・オレンジ・ピンクと選べるテーマ「Bouquet」をカスタマイズ

プレビューはこちら ダウンロード 目次 ヘッダー画像の高さを変更 アイキャッチをアップロード h1タグがやたら多いので最適化 画像をレスポンシブ対応 フォント「Sorts Mill

Comment

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

PAGE TOP ↑