No.3554, No.3553, No.3552, No.3551, No.3550, No.3549, No.3548[7件]
久々のCGI設置で不安だったんですが、丁寧な説明のおかげで簡単に設置できました!
今は自分用のTwitterとして活用させていただいてます🤗
ネタの提供をありがとうございます!(╹◡╹)ノ
本文中段「写真」と「日記」を書き違えてました🙃失礼しました…
そしてCSSが効かなかったのは試したものの記法がことごとく間違っていたようでした。。そんなことがあるのか。。
>>3548
教えていただいたもので無事非表示にできました!
この書き方だと他の#-[隠れハッシュタグ]も一括で隠せるので自分用タグが複数作れる点も便利ですね…!ありがとうございます!
>>3549 >>3550
詳しい解説をありがとうございます🍏「見えないフラグ」それです!
そもそもセレクタ指定がうまくいってなかったようでお恥ずかしい。。落ち着いて再度試したところ、これらでも無事消えました。ありがとうございます!
隠れハッシュタグ便利ですね、これから使っていこうと思います!
質問してみてよかったです。本当に助かります!大感謝です。
隠れハッシュタグを全部非表示にしたい場合は、No.3548さんのCSSでいけますね。属性セレクタの ^= を使ってそのように書けば「title属性値が - で始まる要素」すべてを対象に装飾できます。
🍵Re:3547◆なるほど。理解できたような気がします。本文の表示をどうにかしたいわけではなく、投稿に対して「見えないフラグ」を付与するようなイメージで、ラベルが透明なカテゴリかハッシュタグが作れれば良いわけですね。ハッシュタグなら簡単そうに思います。まず、隠れハッシュタグ機能を使えば、一覧にはリストアップされない点はご承知の通りです。後は、次のCSSを書けば、本文内にも表示されなくなります。
➡ .taglink[title="-forme"] { display: none; }
もしこれで消えない場合は、以下のように書くと良いでしょう。
➡ .taglink[title="-forme"] { display: none !important; }
ここで !important を加えているのは、ハッシュタグの表示箇所に対して既に別のスタイルが当たっているとき、それを確実に上書きするためです。(例えば、標準スキンだと .comment .taglink に対して display: inline-block; が指定されていますので、これを上書きできるだけの詳細度を持つセレクタを指定しないと上書きできません。ただ、標準スキンのCSSなら最初の方のCSSで詳細度を充分高くできるので !important は不要ですけども。例えば、.taglink[title="-forme"] ではなく a[title="-forme"] のようにセレクタを書いた場合、標準スキンでは(詳細度が足りないので)既存のスタイルを上書きできず、ハッシュタグは消えません。)
もし !important を加えるのがスマートではないと思われるなら、既存のCSSを上書きできるようなセレクタを必要なだけ追加すれば良いと思います。例えば次のような感じで。
.comment a.taglink[title="-forme"] { display: none; }
<備考>
第三者の方々に向けて参考までに補足情報を記しておきます。
▼まず、本文中に含まれるハッシュタグは、以下のようなHTMLで出力されています(設定に依って異なりますが、デフォルトでは以下のようになります)。
<a href="?tag=パーセントエンコードされたハッシュタグ名" class="taglink" title="ハッシュタグ名">#ハッシュタグ名</a>
▼ハッシュタグの先頭を「-」記号で始めると、ハッシュタグ一覧にはリストアップされない「隠れハッシュタグ」になります。仮に #-forme というハッシュタグを使うと、以下のようなHTMLが出力されます。
<a href="?tag=%2d%66%6f%72%6d%65" class="taglink" title="-forme">#-forme</a>
▼このハッシュタグだけを対象にしてCSSを適用したいときには、『class属性値が「taglink」である要素のうち、title属性値が「-forme」なもの』だけを対象にできる属性セレクタという書き方を使って、以下のようなCSSが書けます。
.taglink[title="-forme"] { ~装飾~ }
……というわけです。
畳む
隠れハッシュタグを本文中にも表示しない方法ですがtegalog.cssに
.taglink[title^="-"] { display:none; }
を追記でいけませんか?
私はこの方法で非表示にできてますのでご参考になれば幸いです(見当違いでしたらスルーしてください)