すべてのページの背景画像を変更する

サポート
1

Hello - Is there anyway to use my own custom background image for all pages?

Thanks

2

Add this theme component by @Johani to your site:

「いいね！」 7
3

Is there any theme component which shows normal background instead on Blur background?

4

No, but you can create a new theme component with something like this

#main {
    background-image: url(image-URL);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}
「いいね！」 6
5

これを試したところ、カテゴリの背景画像と奇妙な相互作用が発生しました。#main から body に変更したところ、問題なく動作しました。

ただし、どちらの場合も、UI 要素が背景画像に隠れやすくなっていることに気づきました。そのため、インターフェースで使われるさまざまな CSS クラスに対して、単色の白背景を設定するように変更しましたが、これは手間がかかります。すべてのコンテナを処理する明確な単一のクラスが存在しないためです。

私が間違っているのでしょうか？テキストやインターフェースを隠さないように、一般的な背景画像を設定するより良い方法はあるでしょうか？

私が背景を設定している方法は以下の通りです：

body {
    background-image: url(my-url);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}

そして、UI の「修正」方法は以下の通りです：

.container, .search-container, .reviewable, .discourse-post-event-upcoming-events, .tag-sort-options, .page-not-found, .page-not-found-topics {
    background-color: #FFFFFF;
    border: 4px;
    border-style: solid;
    border-color: #FFFFFF;
}

カテゴリの背景は、カテゴリ UI を使って単純に設定されています。

「いいね！」 1