SIRIUSシリウスで更新履歴の背景画像を変更方法

トップページ＞ SIRIUSのカスタマイズ＞ SIRIUSシリウスカスタマイズや小技＞ SIRIUSシリウスで更新履歴の背景画像を変更方法

SIRIUSシリウスで更新履歴の背景画像を変更方法

SIRIUSシリウスのデフォルトテンプレートでトップページでの更新履歴は元々は下図のようです。

変更後、こんなになります

今回自分のサイトにイメージを合わせた更新履歴の変更方法を説明したいと思います。

ステップ1：更新したい背景画像を作成

更新履歴と背景はすべて画像なのですが、更新したい画像を入れ替えるだけでOKです。

まず、ペイントなどの画像編集ソフトで、更新したい画像を作成します。大きさは幅：800；立て：70ぐらいで大丈夫。画像ファイル名は「whats_top.jpg」にしてください。

ステップ2：更新履歴の背景画像入れ替える

サイトのテンプレートフォルダを開いてｉｍｇフォルダを開くと画像ファイル一覧が確認できます、更新したい画像を上書き保存してください。そうすると、更新履歴の背景画像を入れ替えられます。

次はSIRIUSシリウス編集画面の「画像管理」をクリック、→　「新規追加」をクリックして、「whats_top.jpg」という画像を追加し、上書き保存すれば、完了です。

最後にサイト生成して、プレビューで変更できたかを確認いただけます。

ステップ3、ずれたときの対処方法

画像がずれた場合があります、そのとき、スタイルシートを編集します。

SIRIUSシリウス編集画面の上部リボンバーの編集　→　スタイルシート編集　をクリックします。「whats_top.jpg」で検索して、

530の「#whatsnew 」の部分を編集します。

border:1px solid ：上下左右に太さ1pxで実線の枠.
background-image：背景画像
padding-top: 内側上部の余白の値を指定
padding-bottom: 内側下部の余白の値を指定
padding-right:内側右部の余白の値を指定
padding-left: 内側左部の余白の値を指定

それぞれ自分のサイトに合わして編集して、「保存」を押します。

という印の画像ファイル名は「whats_li.jpg」です、

これも変更したい画像を「whats_li.jpg」という名づけて、同じ方法で上書き保存して、変更できます。

では、自分のサイトにイメージを合わせた更新履歴を変更できました。

関連ページ

シリウス（SIRIUS）で2カラムサイドメニュー幅変更方法: デフォルトテンプレートの2カラムサイドメニュー幅変更方法について説明します。
シリウスでサイドメニューのフリースペースを増やす方法: シリウスでサイドメニューのフリースペースを増やす方法について説明します。
SIRIUSシリウスで更新履歴の位置を変更する方法: SIRIUSシリウスで更新履歴の位置を変更する方法について解説していきます。
SIRIUSシリウスの更新履歴枠の角を丸くする&影をつける方法: SIRIUSシリウスの更新履歴枠の角を丸くすると影をつける方法について解説していきます。
SIRIUSでカーソルを置くとリンク画像を動かす設定方法: SIRIUSでカーソルを置くとリンク画像を動かす設定方法について、詳しく解説していきます。
SIRIUS サイドバーに画像付きのプロフィールを設置方法: SIRIUS サイドバーに画像付きのプロフィールを設置方法について、詳しく解説していきます。
SIRIUS　クラスの設定機能で蛍光ペンを設定方法: SIRIUS　クラスの設定機能で蛍光ペンを設定方法について、詳しく解説していきます。
SIRIUSに無料でメールフォームを設置する方法: SIRIUS（シリウス）に無料でメールフォームを設置する方法について、詳しく解説していきます。
SIRIUSで記事途中に飾り枠を挿入する方法: SIRIUS（シリウス）で記事途中に飾り枠を入れる方法について、詳しく解説していきます。
SIRIUS　同じページ内で指定の場所にリンクする方法: SIRIUS　同じページ内で指定の場所にリンクする方法について、詳しく解説していきます。
SIRIUSで動くボタンを作成方法: SIRIUSで動くボタンを作成方法について、詳しく解説していきます。
SIRIUSでスクロールの途中でサイドバーが消えないよう固定する方法: SIRIUSでスクロールの途中でサイドバーが消えないよう固定する方法について解明します。
SIRIUSで1つの記事を複数のカテゴリに登録する方法: SIRIUSで1つの記事を複数のカテゴリに登録する方法について説明します。
SIRIUSで蛍光ペンをカスタマイズする: SIRIUSで蛍光ペンをカスタマイズする方法
SIRIUSでトップへ戻るボタンを実装する方法: SIRIUSでトップへ戻るボタンを実装する方法について紹介します。
SIRIUSシリウスの見出しフォントに影をつける方法: SIRIUSシリウスの見出しフォントに影をつける方法を紹介します。
SIRIUSのサイトにYouTube動画を『埋め込み』方法: SIRIUSのサイトにYouTube動画を『埋め込み』方法について紹介していきます。
SIRIUSでGoogleマップをサイトに埋め込む方法: SIRIUSでGoogleマップをサイトに埋め込む方法についてご紹介していきます。
SIRIUSでトップへ戻るボタンに画像を使用する方法: SIRIUSでトップへ戻るボタンに画像を使用する方法について紹介していきます。
SIRIUSで画像を横に自動スライドさせて動かす方法: SIRIUSで画像を横に自動スライドさせて動かす方法を紹介していきます。
SIRIUS(シリウス）で画像を振り子のように左右に揺らす実装方法: SIRIUS(シリウス）で画像を振り子のように左右に揺らす実装方法を紹介します。
SIRIUS(シリウス）で<MAQUEE>タグを使って簡単に画像を動かす: SIRIUS(シリウス）でタグを使って簡単に画像を動かす方法をご紹介します。