レイアウトによるが、ページの左や右側に表示される領域です。同じ内容で全ページに表示されるという特徴があります。

サイドバーにナビメニューがあるレイアウトもありますが、通常は画像や写真などのコンテンツを追加できます。

ここでは、サイドバーに以下の編集およびコンテンツを挿入・表示します。

• 028-1 サイドバーを編集する
• 028-2 アイキャッチャーを挿入する
• 028-3 新着情報を表示する
• 028-4 サイト内検索を挿入する
• 028-5 カレンダーを表示する
• 028-6 シェアボタンを表示する
• 028-7「いいね！」ボタンの設置

• 公表できるのであれば、サイドバーにある、会社名／住所／電話番号の内容を書き換えます。
• 小見出しは、他の見出しに書き換えます。
• これ以外の文章やシェアボタンコンテンツは削除しておきます。

サイドバーに何を記述するかは、ホームページ次第です。以下は例です。

• イベント情報
• 新着情報
• ブログテーマへの入り口リンク

以降に示す項目は、サイドバーへの記述操作の例です。

サムネイル画像を挿入します。すでに作成済みの画像があればそれを利用しますが、無い場合は作成することから始めます。

１）ピクセラ・エディターを起動し、「新しい画像を作成」を選択する

２）「新しい画像を作成」のサイズを指定します。

画像サイズは、このあと追加する画像のサイズ（480 x 330px）に合わせます。

⇩

「背景」レイヤーができ、ロック（鍵がかかっている）状態となる。

３）「背景」レイヤーを黒塗りにする。

これは、後のステップで行う透過作業を分かり易くするために行います。

４）「レイヤー」から「画像をレイヤーとして開く」で、画像を選択します。

ここでは、画像 a0003_001808.jpg を選びます。

⇩

レイヤー１として、編集する画像が追加されました。

５）左上の背景部分を透過します。

①「選択ツール」→ ② 左上背景部分をクリック → ③ Ctrl+Z（取り消す） → ④「公差」値を変更する → ⑤「選択ツール」→ ⑥ 背景部分をクリック → ②から⑥を何度か繰り返し最適な「公差」値をみつけます → ⑦ Delete（削除）キーを押す

⇩

６）同様に右下部分の背景も透過する

７）透過されていない部分を消しゴムで消す

画像の境目の消し方が多少雑であっても、アウターグローできれいになります。

８）レイヤースタイルでアウターグローを指定する

画像のあるレイヤー①を選択し、「レイヤートグル」②をクリックしてオンにする。「レイヤースタイル」③をクリックし、表示されるパネルで「アウターグロー」④を選ぶ。色は白色⑤を設定し、「OK」⑥を押すと、アウターグローが設定されます。

⇩

９）アウターグローが設定されたので、

① レイヤートッグルをオフにし、

② 背景レイヤーをダブルクリックし、チェックを外す。これにより背景の黒色は無くなる。

⇩

１０）画像の縁をぼかす

① 画像のレイヤーを選ぶ → ②「一列選択ツール」をクリックする → ③「フェザー」値を設定する。数値が高いほど、周りがぼけます。→ ④ぼかしたい周辺をドラッグする

⑤ メニュー「編集」から「選択部分の諧調を反転する」をクリックする。

⇩

⑥「Delete」キーを押すと画像の縁がぼけて表示されます。

１１）ファイルを保存する

①「ファイル」から「保存」をクリックする。

②「フォーマット」を「png」に変更する。「OK」を押す。

③ 保存場所と名前を指定して「保存」する。

④「フォーマット」を「pxd」に変更して保存する。

作成し保存した画像を、サイドバーの［＋コンテンツを追加］で挿入します。

詳細は、Jimdo 虎の巻：Googleのサービスを利用したサイト内検索ボックスの設置方法を参照します。

あるいは、カスタム検索を参照します。

カレンダーの表示は、060 ツール の 063 カレンダー を参照します。

ホームページをシェアしてもらうためのボタンをまとめて追加できます。ボタンの配色、サイズ、形などを指定できます。

ホームページを閲覧してくれた方が、Facebook や Twitter、Google+ を通じて「ホームページの推薦」を気軽に行えるようになります。もしかすると、それを見た人があなたのホームページを訪問してくれるかもしれません。

「シェアボタン」を追加する位置で「＋コンテンツを追加」をクリックします。

① 表示したいシェアボタンをチェックボックスをオンにする。

② 配置位置、③ サイズ、④ 形状、⑤ 色（カラー／白／黒）を指定する

⑥「保存」をクリックする

⇩

シェアボタンが表示される

シェアボタンと似たような機能ですが、こちらは「いいね！」をしてくれた方の人数などが表示されるのが特長です。

「いいね！ボタン」を選び、表示方法を指定します。「保存」をクリックします。

⇩

「いいね！」ボタンが設置されます。