カテゴリの横にアイコンを表示するプラグインのようなものはありますか？

サポート
1

こんにちは、このようなもののように、カテゴリの隣にアイコンを配置できるプラグインのようなものはありますか？1つあったことは知っていますが、名前を思い出せません。

image
image493×287 18.2 KB

2

こんにちは @Glow さん :wave:

プラグインやテーマコンポーネントは不要です。画像アイコンを設定したい各カテゴリの右上にあるレンチのアイコンから「カテゴリ設定」に移動し、「画像」タブに移動すると、スクリーンショットのように表示される画像をアップロードできます。設定したいのは最初の「カテゴリ画像ロゴ」です。カテゴリページの先頭にも表示されることに注意してください。

「いいね！」 1
3

ありがとうございます。もっと小さくする方法はありますか？かなり大きすぎます。

image
image1138×429 32.5 KB

4

共通の - テーマまたはテーマコンポーネントのCSSで、次のように実行できます。

.category-logo.aspect-image {
    width: 100px;
}

幅の値を好きなように変更するだけです。ピクセルではなくパーセントを使用することもできます。お役に立てば幸いです :slight_smile:

「いいね！」 1
5

うーん、そのようなものを使った記憶があるので、まだプラグインがあると思いますが、これは縮小すると非常に奇妙に見え、写真とまったく同じようには見えませんが、名前を思い出せません。

image
image1184×412 14.9 KB

6

CSS を使用して、画像とその配置をさらにカスタマイズできます。

また、こちらもありますが、お探しのものかどうかわかりません。

「いいね！」 2
7

これは以前書いたコードです…


:root {
    --category-logo-width: 70px;
    --category-spacing: 0px;
}

.desktop-view table.category-list .category-logo.aspect-image {
    width: var(--category-logo-width);
    height: calc(var(--category-logo-width) - 45px);
    margin: 0 5px 0 0;
    padding: 0;
    transform: translatey(-35px);
}
table.category-list .category-logo.aspect-image img{
    width: var(--category-logo-width);
    height: var(--category-logo-width);
}
.desktop-view .has-logo .category-text-title {
    margin-left: calc(var(--category-logo-width) + 5px);
}
.mobile-view .category-title-link {
    display: flex;
}
.mobile-view .category-logo.aspect-image {
    margin: 0 5px 0 0;
    margin-top: 0 !important;
    padding: 0;
    order: -1
}
.mobile-view .category-text-title {
    margin: auto 0;
}


.desktop-view td.category {
    margin: var(--category-spacing);
}
.desktop-view table.category-list {
    border-collapse: separate;
    border-spacing: 0 var(--category-spacing);
}
.desktop-view table.category-list tr {
    margin: var(--category-spacing);
}
「いいね！」 2