Shortcodes Ultimate カスタマイズ

Question

wordpressプラグイン Shortcodes Ultimateを利用して作ったボタンの高さや幅を変更したいのですが具体的にどのように編集したらよいでしょうか？
line-height:60pxなどにしたいのですが・・・・

Answer 1

ショートコードの引数で変わるようです。
・iconの値がtrueであればsizeの値の1.5倍(四捨五入）
・iconの値がfalseであればsizeの値の2倍(四捨五入）
の数値がpxで指定されるようです。

ただ、このsizeの値はfont-sizeやpaddingにも影響してきそうですので、
引数にclassを付与してあげて、別途cssで強制的に書き換える方法もアリかもしれません。

その際は、上記styleがタグに直接記述されてしまっているので、!important指定をしないと効かないかもしれません。

---

すみません。回答が具体的ではなかったですね。また、一部間違いがありましたので、訂正致します。
まず訂正ですが、

・iconの値がtrueであればsizeの値の1.5倍(四捨五入）
・iconの値がfalseであればsizeの値の2倍(四捨五入）

上の行でiconの値がtrueであれば、、と書いていますが、正しくは以下です。

・iconという引数がセットされ、値が空でなければsizeの値の1.5倍(四捨五入）
・iconという引数がなければsizeの値の2倍(四捨五入）

です。ちなみにsizeが指定されてない場合は3で設定されます。
iconという引数についてですが、ビジュアルエディタであれば
ショートコードを挿入→ボタン→アイコン
のところで、なにかしらアイコンを選んだ場合のことです。

---

以下は、先に書いた自分の説明の、具体的な詳細です。

ショートコードの引数で変わるようです。

といっているのは、以下の様な感じです。

[su_button size="30"] Click me [/su_button]
[su_button icon="icon: check" size="40"] Click me [/su_button]

1行目はiconという引数がないので、sizeの値の2倍がline-height になります。

2行目はアイコンを指定しています。

icon="icon: check"

この引数があると、line-heightはsizeの1.5倍の数字が適用されます。

どちらの記述でもline-heightは60pxになるはずです。ただし、font-sizeもそれぞれ30px,40pxになってしまいます。

スタイルで別途指定、という方法もお伝えしましたが、先ほど実践したところ、できませんでした。
あとは、プラグイン内の記述を直接書き換えてしまうか、でしょうか。

Comments

[退会済みユーザー]

回答ありがとうございます。
何となくわかりました。けど・・・
自分には難しそうです。

[akira888]

すみません。回答が具体的ではなかったです。
また、iconの説明について、誤りがありました。失礼いたしました。
修正しましたので、よろしければご確認下さいませ。

[退会済みユーザー]

度々、ありがとうございます。
>どちらの記述でもline-heightは60pxになるはずです。ただし、font-sizeもそれぞれ30px,40pxになってしまいます。

おっしゃる通りでした。

文字をsize=7 くらいで、高さを調節するために、Shortcodes Ultimateのcssの編集画面に.su-button { line-height:60px }
と記入しましたが変化がありませんでした。そもそもコードが間違っているか、 cssの編集画面はそのような使い方ではないのかもしれませんが・・・
検索すると、「Shortcodes Ultimateは便利！」のような記事は見かけますが具体的なカスタマイズについて日本語で書かれたものがなくて途方に暮れています。