さくらのブログのサイドバーにバナーを設置する方法
目次
要望
こんな感じでバナーを設置したいです。
バナーの作成
まず、バナーを作成します。
ブログのテーマ「超シンプル(右サイドバー)」の場合は、幅240pxです。
バナー画像のアップロード
さくらのブログの管理ページを開きます。
http://blog.sakura.ne.jp/cms/home/
「ファイルマネージャ」をクリックします。
「ファイルを選択」して「アップロード」します。
その後、画像ファイルが追加されていることを確認してください。
設置
左のサイドバーから「デザイン」をクリックして、「コンテンツ」をクリックします。
左側の「コンテンツ」の中の「ブログ画像...」をドラッグ&ドロップでサイドバーの最上部に設置します。
設置した「ブログ画像」をクリックして編集します。
モーダルウィンドウ(小さなウィンドウ)が表示されます。
その中の「コンテンツHTML編集」をクリックします。
既存のソースコードをすべて削除します。
モーダルウィンドウの内部をスクロールして、先程アップロードした画像をクリックします。
モーダルウィンドウの上部へ戻って、新たにHTMLタグが挿入されていることを確認してください。
バナーのリンク先となる「href属性」を変更します。
今回は例としてヤフーのトップページに移動するよう変更します。
href属性を変更したら、モーダルウィンドウの一番下へスクロールして、「保存」をクリックします。
「編集を完了しました」というメッセージが表示されたら、「×」をクリックしてモーダルウィンドウを閉じます。
ブログ全体の設定を保存するために「保存」をクリックします。
「設定を変更しました」というメッセージが表示されたら、「ブログを見る」をクリックして表示を確認します。
これで完了です。