フォーラムをリニューアルしました!
今後は、新フォーラムをご利用ください。
ブログカードの説明文について < ご要望
いつもお世話になっております。
SWELLのブログカード内の説明文欄(.p-blogCard__excerptのところ)をSWELLの設定から
- PCまたはスマホの場合表示・非表示の設定
- 説明文をディスクリプションから拾う、ディスクリプションが設定されてなかったら文章から拾う
のような設定項目を追加できないでしょうか?
もしくは、関連記事ブロックで入力できるように出来ないでしょうか?
ん〜、今のところ、そういった設定をつける予定はないです!
ディスクリプションなどをどうしても書き換えたいのであれば、HTMLブロックを使って直書きしていただくといいかなと...!
あ、でも内部リンクであればたしかに抜粋文を優先するような仕様にする方がいいかもしれないですね...!
内部リンクのメタディスクリプションの読み取りは、色々とややこしいことがあるので、しないです!
了さん回答ありがとうございます。
質問ですが
ディスクリプションなどをどうしても書き換えたいのであれば、HTMLブロックを使って直書きしていただくといいかなと...!
について、了さんがおっしゃられてる事がイマイチピンと来ないのですがどのようなイメージでしょうか?
いちおう私が書き換えたい部分を写真で添付しています。「」の部分を書き換えたいのですがHTMLブロックで直接書き換える事ができるのでしょうか?
デベロッパーツールで構造コピペしたやつをベースに、HTMLを直接組む感じです
なるほど!理解しました。
Chromeのデベロッパーツールで調べてからHTMLをコピペして書き直すって感じですね!
添付した画像なら
<div class="swell-block-postLink "><a href="https://wvtravelclub.jp/after-changing-from-cocoon-to-swell/" class="p-blogCard -internal" data-type="type1"><div class="p-blogCard__inner"><span class="p-blogCard__caption">関連記事</span><div class="p-blogCard__thumb c-postThumb"><figure class="c-postThumb__figure"><img data-lazyloaded="1" src="https://wvtravelclub.jp/wp-content/uploads/2020/05/a804ff1ed831e6442355ba6d6895297d-600x400.png.webp" data-src="https://wvtravelclub.jp/wp-content/uploads/2020/05/a804ff1ed831e6442355ba6d6895297d-600x400.png.webp" alt="【レビュー記事】ブログをCocoonからSWELLに変えてみたら…" class="c-postThumb__img -no-lb litespeed-loaded" data-was-processed="true"><noscript><img src="https://wvtravelclub.jp/wp-content/uploads/2020/05/a804ff1ed831e6442355ba6d6895297d-600x400.png.webp" alt="【レビュー記事】ブログをCocoonからSWELLに変えてみたら…" class="c-postThumb__img -no-lb"></noscript></figure></div><div class="p-blogCard__body"><span class="p-blogCard__title">【レビュー記事】ブログをCocoonからSWELLに変えてみたら…</span><span class="p-blogCard__excerpt">まいどおおきに!おおもと(@so88qa)です♪この度ブログのテーマを有料の「SWELL」に変えました!SWELLの前は無料で使えるCocoonというテーマを2年も使っていたのですが…S…</span></div></div></a></div>
になるので、
<span class="p-blogCard__excerpt">まいどおおきに!おおもと(@so88qa)です♪この度ブログのテーマを有料の「SWELL」に変えました!SWELLの前は無料で使えるCocoonというテーマを2年も使っていたのですが…S…</span>
の部分を書き換えて貼り付けし直すってことですね
そんな感じです...!
ただ、lazyloadの部分は動作前の状態に書き直していただく必要がありますので、その辺はご注意ください...!
僕はHTMLで直接書く時はいつも、以下の様な形で使っています。
<figure class="wp-block-embed">
<a href="{記事のURL}" class="p-blogCard -external" data-type="type3" target="_blank" rel="noopener noreferrer">
<div class="p-blogCard__inner"><span class="p-blogCard__caption">{サイト名}</span>
<div class="p-blogCard__thumb c-postThumb">
<figure class="c-postThumb__figure">
<img src="{サムネイル画像パス}" alt="{記事のタイトル}" class="c-postThumb__img -no-lb">
</figure>
</div>
<div class="p-blogCard__body">
<span class="p-blogCard__title">
{記事のタイトル}
</span>
<span class="p-blogCard__excerpt">
{記事の抜粋文}
</span>
</div>
</div>
</a>
</figure>
data-type="type3" のtypeは、ご自身のブログの設定に合わせて書き換えてください〜^^