WordPressテーマSANGOの質問

記事一覧のアイキャッチ画像の表示、タブのコンテンツ欄のセンタリング、タブ文字色変更

アバター
Stella

「トップページのタブ切り替え機能」を、トップページ用固定ページで再現したくて、SANGOタブブロックを設置、タブのコンテンツ欄内に、SANGOコンテンツブロック(SANGO記事一覧とSANGOボタンが入っている)を入れてみました。

タブを選択すると、「タブのコンテンツ」欄の上部に特定カテゴリの記事一覧、下部にそのカテゴリの記事一覧ページに飛ぶボタンが表示される様に作りましたが、この方法では記事のアイキャッチが表示されません。
(あるカテゴリでは、下段真ん中のスライダー方式のみアイキャッチ画像が出ましたが、もう一つのカテゴリではスライダーでも出ない状態です)

「タブのコンテンツ」欄に入れることの出来る要素は、現状一つのみの様ですが、コンテンツブロックで複数要素をまとめて入れるのは適さない、等の使用条件があったら教えていただけますでしょうか。

また、「タブのコンテンツ」内の要素をセンタリングすることは可能でしょうか。記事一覧の横長カード二枚一列のタイプを使いたいのですが、右に余白ができてしまいます。

それから、選択されていないタブのテキストを他の色に変えることは可能でしょうか。今の薄グレーだと見づらいと言われてしまいました。

いろいろ申し訳ありません。どうぞよろしくお願いいたします。

【SANGO タブブロック】の使い方
コメントへの回答
サルワカくん
サルワカくん
2022/03/20

お世話になっております。

タブのコンテンツ欄に入れることの出来る要素は、現状一つのみの様ですが、コンテンツブロックで複数要素をまとめて入れるのは適さない、等の使用条件があったら教えていただけますでしょうか。

タブコンテンツの中には複数コンテンツを入れられるようになっています。特に条件はありませんが複数入れられませんでしょうか?

選択されていないタブのテキストを他の色に変えることは可能でしょうか。今の薄グレーだと見づらいと言われてしまいました。

以下のCSSをタブブロックのカスタムCSSに記述していただければ色を変えられると思います。


.post-tab > [class*=tab]:not(.tab-active) {
background-color: ここにお好みの色コード;
}

以上となります。
よろしくお願いします。

アバター
Stella
2022/03/23

返信ありがとうございます。返信をいただいた後も試行錯誤をしてうまくいかなかったのですが、先ほど下記の方法でうまくいきました。

先に入れた要素(私の場合は記事一覧ブロック)を左クリック→「sangoタブブロックの旧アイコン「sangoタブアイテムを選択」が出るので左クリック→「ブロックの追加」の+マークがタブのコンテンツのフィールドに出てくるので、あとは通常通りブロックを追加

失敗のパターンは、タブのコンテンツのフィールドに、通常は各ブロック要素の上下に出る「ブロックの追加」+マークが出ないため、記事ブロックの下あたりを左クリックで選択してブロック挿入を試みても、ブロックが欄外に出てしまう、というものでした。

どうやら、上記説明文の時点から少し変わって、現在はsangoタブブロック関連のアイコンは2つになっているのですね。青い新アイコンがタブ本体、説明文中の黒い旧アイコンがタブのコンテンツに入れるアイテムの追加、でしょうか。
動画の方で、ブロックを二つ挿入するシーンを入れていただけると分かりやすいかも、と思いました。

タブのテキストの色替えの方は、ご指示いただいたCSSだと背景色変更だったので、下記で解決しました。
.post-tab > [class*=tab]:not(.tab-active) {
color: ここにお好みの色コード;
}

この後も別の団体に2つサイトを作る予定のため、気になっていたことが今解決してすごくうれしいです。サポートをどうもありがとうございました。

サルワカくん
サルワカくん
2022/03/23

解決されてよかったです。
確かに操作方法の動画があると親切ですね。
随時動画も更新していきたいと思います。

この後も別の団体に2つサイトを作る予定のため、気になっていたことが今解決してすごくうれしいです。

今後2サイトもSANGOを利用していただけるとは嬉しいです。
今後ともよろしくお願いします。