ベストセラー人気 WordPress テーマTop 30 詳細

テキストハイライター(蛍光ペン)のプラグイン

Last Updated:2020年1月25日| 16のコメント
  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

Simple Text Highlighter Shortcode Plugin for WordPress

テキストを好みの色に蛍光処理をする簡単な WordPress プラグインを作ってみました。 Simple Text Highlighter Shortcode Plugin for WordPressは非常に軽いプラグインでテキストをハイライトするショートコードを提供しています。 (ダウンロードは以下Updatedセクションで可能です。)

インストール方法

  • 下のコードをコピーして、テーマの関数ファイルに貼り付けます。 必ずチャイルドテーマをインストールして作業してください。

使用方法

ショートコード[high]と[/ high]を使用してテキストをハイライト処理することができます。

例:

  • [high]テキスト[/ high] - > 基本的に黄色でハイライトします。
  • [high color = "red" bg = "blue"]テキスト[/ high] - > 青でハイライトして、テキストの色を赤に設定します。
  • [high bg = "grey" color = "white" size = "20px" left = "5px"]テスト[/ high] - > Background color:grey、Text-color:white、Text-size:20px、Padding-left:5px

サポートされる属性者:

  • bg = background-color
  • color = text-color
  • padding = padding
  • size = text-size
  • left = padding-left
  • right = padding-right
  • top = padding-top
  • bottom = padding-bottom
  • border = border
  • bbotom = border-bottom
  • radius = border-radius
  • weight = font-weight
  • height = line-height

非常に単純なショートコードプラグインであるため、すべての環境で問題なく動作します。 問題がある場合コメントにご連絡ください。

更新しました:

属性が追加され、スタイルが指定されたプリセット(Preset)が追加されました。

  • 【pcode] wp_redirect()[/ pcode] => wp_redirect()
  • [kbd] Ctrl + C [/ kbd] => Ctrlキー+ C
  • 【navytext]文章や語句[/ navytext] => 文章や語句

ダウンロードに問題がある場合は、次のコードをコピーして使用している WordPress テーマの関数ファイルに追加してください。

/*
Plugin Name: Simple Text Highliter Shortcode
Plugin URI: https://www.thewordcracker.com/
Description:
Author: WordCracker
Version: 1.2
Author URI: https://www.thewordcracker.com/
*/

add_shortcode('high', 'highlighter_span_shortcode');
function highlighter_span_shortcode($atts, $content = null) {
extract(shortcode_atts(array('color' => '', 'bg' => 'yellow', 'size' => '', 'padding' => '', 'left' => '', 'right' => '', 'top' => '', 'bottom' => '', 'border' => '', 'bbottom' => '', 'radius' => '', 'weight' => '', 'height' => ''), $atts));
$return = '<span style="';
if (!empty($color)) $return .= 'color:'.$color.';';
if (!empty($bg)) $return .= 'background-color:' .$bg.';';
if (!empty($size)) $return .= 'font-size:'.$size.';';
if (!empty($padding)) $return .= 'padding:'.$padding.';';
if (!empty($left)) $return .= 'padding-left:'.$left.';';
if (!empty($right)) $return .= 'padding-right:'.$right.';';
if (!empty($top)) $return .= 'padding-top:'.$top.';';
if (!empty($bottom)) $return .= 'padding-bottom:'.$bottom.';';
if (!empty($border)) $return .= 'border:'.$border.';';
if (!empty($bbottom)) $return .= 'border-bottom:'.$bbottom.';';
if (!empty($radius)) $return .= 'border-radius:'.$radius.';';
if (!empty($weight)) $return .= 'font-weight:'.$weight.';';
if (!empty($height)) $return .= 'line-height:'.$height.';';
$return .= '">';
return $return . $content . '</span>';
}

function code_formatting($atts, $content = null) {
$return ='<span class="codeformatting" style ="padding: 2px 4px; font-size: .95em; color: #c7254e; background-color: #f9f2f4; border-radius: 4px;">';
return $return . $content . '</span>';
}
add_shortcode('pcode', 'code_formatting');

function keyboard_shortcuts_formatting($atts, $content = null) {
$return ='<span class="keyboardshortcode" style ="display: inline-block; padding: 3px 5px; font-size: .85em; line-height: 14px; color: #333; background-color: #fcfcfc; border: 1px solid #ccc; border-bottom-width: 2px; border-radius: 3px; box-shadow: inset 1px -1px 1px #fff, inset -1px 1px 1px #fff;">';
return $return . $content . '</span>';
}
add_shortcode('kbd', 'keyboard_shortcuts_formatting');

function navytext_formatting($atts, $content = null) {
$return ='<span class="navytext" style ="color: #ffffff; background-color: #006699; font-weight: bold;">';
return $return . $content . '</span>';
}
add_shortcode('navytext', 'navytext_formatting');

 

メモ:



16のコメント

コメント

  1. もしかしたらダウンロードはどのようにしていますか..? Update側zipファイルがアップロードされているのがアンボイネヨ。〓〓

    応答
    • こんにちは?

      ご不便をお掛けします。

      ダウンロード関連のプラグインを削除し、この記事に添付ファイルがあることをまだ確認していませんでした。

      代わりに上記のコードをコピーして使用している WordPress テーマの関数ファイルに貼り付けます。

      コードを入れて見て、もし問題が発生した場合、コードだけが削除できます。

      応答
      • functions.phpに挿入して使用すればよいという言っているの? ^^
        ありがとう!

      • 本当に申し訳ありませんが。 適用はどのようにすればよいでしょうか? Wordの他の投稿も見ましたが、わかりません。.ㅠㅠ申し訳ありません…

      • 本文に[high]… [/high]と入力するとスタイルが適用されるのでやむを得ず{high}… {/high}と入力しました。

        時間になるとショートコードとして認識しないように… ]を入力する方法を探す予定です。

        楽しい夜の時間を持って^^

  2. ありがとうございます〜

    Veteran様コメントはスパムとして分類されて今確認しました。

    CSSで直接調整する必要が内容を細かく調整するために個人的なレベルで作成されたプラグインです。

    頻繁に使用するのであればTinyMCEに追加しても良さそうです。

    応答
  3. うれしいです。 と〜プラグインを直接作成して使用ものだ。

    TinyMCEボタンを追加することはいかがでしょうか (WCさんが希望であるかを知らないのに)より快適なんじゃないかと思うようになります。 基本的に省略されたテキストの背景色、上付き、下付き文字等のボタンを使用するには、..


    add_filter( 'mce_buttons_3', 'my_mce_buttons_3' );
    function my_mce_buttons_3( $buttons ) {
    $buttons[] = 'fontsizeselect';
    $buttons[] = 'fontselect';
    $buttons[] = 'backcolor'; // 문자 배경색
    $buttons[] = 'superscript';
    $buttons[] = 'subscript';
    $buttons[] = 'styleselect'; // Drop down 메뉴로
    return $buttons;
    }

    もしかしたらご存知のつもりなら無視してください。^^

    応答
  4. こんにちは。 更新されたバージョンをダウンロード受けようとしたところ、パスワード(simple)が間違っているね。
    教えていただけますがあり連でしょうか?

    応答
    • こんにちは?

      事実あまり反応がなく、個人的にその時その時の更新して使用していました。
      最新バージョンにアップデートしたので参照してください。
      内容も更新されました。
      事実上のプラグインさえあればほとんどのテキスト効果を実現することができます。 HTMLコードを知って使用が容易になります。

      だから、楽しい一日を過ごす。

      応答
      • エゴエゴ。 今度はリンクが切れたね。 確認お願いいたします。

      • 私はテストしてみるとダウンロードできます。 うまくいかない場合は、上記のコードをコピーして関数ファイルに追加して試してください。 お疲れ様でした。

      • 今やり直してみると、ダウンロードがね。 何かしばらくエラーがあったようです。 プラグインも良いですよ。 シンプルなので、さらに良いです。 よく使用します。
        私のブログはxiphiasilver.co-story.netです。 模擬ハッキングに興味のありましたら一度訪れてみてください。 ^^

      • うわすごいものだ。

        ハッキングと言えば否定的に聞こえますが、「模擬ハッキング」は、企業システムのセキュリティ問題を把握して改善できるようにする重要な役割を果たすことがわかっていますが、私が正しく理解しているかどうかわかりませんね。

        サイトをしばらく聞こえた予想通り容易ではない内容を扱うようですね。
        時間になると、よく聞かみましょう。

        ちなみにコメントシステムをDisqusに変更SEOなど多くの面で有益であるとね。 だから私は最近、大規模な(?)の心を食べDisqusに変えたところ、思ったより良いようです。 コメントをDisqusに変えることを一度検討してみてください。

        楽しい週末と休日になってください^^

      • 考えてみると「中級」カテゴリの場合、コピー防止になっていますね。 コメントに書いたメールアドレスは正しいですか? メールでファイルを直接送信しますか?