みんカラガイドのブログ一覧

標準で１枚追加できる写真以外を、きれいに貼りつける方法を説明します。

左の写真は通常のサムネイル写真です。
クリックすると大きくなって見やすいですね。






しかし、その他の大きい画像をいつものようにブログに貼りつけると…

▼画像のはみ出た分が見えなくなってしまします。


まず、はみでた部分を直したいと思います。
とはいっても原寸で表示させることは不可能なので、少し縮小して
表示させてみます。


通常の画像貼り付け

通常の画像貼り付けを行うと、ブログ投稿画面に以下のようなHTMLタグが出力されます。
このタグ自体に「横幅」を指定して小さくしてしまおう！ ということです。

修正前：

<img src='https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/supportBlog/
stylesheet/samplePhoto/Lphoto_sample.jpg' border='0'>


修正後：

<img src='https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/supportblog/
stylesheet/samplePhoto/Lphoto_sample.jpg' border='0' width="580" >


横幅を表す「width」タグに「580ピクセル」と入力してみました。
実際の写真は以下になります。

▼通常の写真　クリックできません


これだけではせっかく取った写真を大きく見せることができません。
ここでもうひと工夫して、「クリックしたら元画像が開く」ようにしてみましょう。

先ほど「width」を追記した「img」タグをドラックして、リンクボタンを押す。



▼クリックして拡大


拡大画像が開きました。

是非お試しください！

■ヘッダーの色を変更するには



「ヘッダーの背景色」の「カラーコード」をテキストボックス内に記入するか、
テキストボックス横にあるカラーピッカー（七色の丸）をクリックし、
お好きな色を選んでください。

変更を反映するにはページの下にある「保存」ボタンを押してください。
一度確認する場合はページ上に表示される「スタイルプレビュー」を押してください。



ヘッダーの色が変更されました。

■ヘッダー画像を変更するには



ヘッダー画像はアップロードをすると自動的に差し替えられます。
Windowsでは「参照」、Macでは「ファイルの選択」ボタンをクリックして画像を選択してください。
選択した画像を反映するにはページの下にある「保存」ボタンを押してください。

ヘッダー部分は大きさに制限があります。
あらかじめ高さ50～290ピクセルに合わせた画像をご用意ください。

制限内容
容量：200kb
横：930ピクセル
縦：50～290ピクセル

※横幅が930ピクセル以下の画像は繰り返して表示されます。

一度確認する場合はページ上に表示される「スタイルプレビュー」を押してください。



ヘッダー画像が変更されました。

■背景色を変更するには

「ヘッダーの背景色」の「カラーコード」をテキストボックス内に記入するか、
テキストボックス横にあるカラーピッカー（七色の丸）をクリックし、
お好きな色を選んでください。



変更を反映するにはページの下にある「保存」ボタンを押してください。
一度確認する場合はページ上に表示される「スタイルプレビュー」を押してください。



背景色が変更されました。

■背景画像を変更するには




最大容量：300KB以内
画像サイズ：1280×1280ピクセル以内



画像が変更されました。

背景画像の位置やリピートを選択することで色々な表現が可能になります。
ヘッダー背景色 変更テキストボックス横の「透過する」にチェックを入れ、
ヘッダー画像を設定しないでおくと背景画像に指定したものが透過されて表示されます。

例えば
背景画像に愛車の写真アップし、
「背景画像の位置」の「水平方向」の「中央」にチェック。
さらに「垂直方向」の「上」にチェックをいれ
「背景画像のリピート」を「しない」にチェックを入れ保存すると
ナビゲーションの下からぴったりくっついた様に表示されます。

こうすると実際の横幅よりも大きいヘッダー画像を表示している
ように表現することができます。

本文文字色とリンク色を変更します。



色を変更するには
「カラーコード」をテキストボックス内に記入するか、
テキストボックス横にあるカラーピッカー（七色の丸）をクリックし、
お好きな色を選んでください。



リンクカラーが変更されました。

ちなみにカラーコードとは#の後ろに6桁の16進数が続く制御コードのことです。

例：
#000000 は黒
#FFFFFF　は白

以前もスタイルシートをカスタムしていた方には馴染み深いと思います。

■見出しアイコンを変更するには

見出しアイコンとはブログのタイトルやプロフィールの項目で
タイトルの左に表示されるアイコンのです。



アイコン画像はアップロードをすると自動的に差し替えられます。
Windowsでは「参照」、Macでは「ファイルの選択」ボタンをクリックして画像を選択してください。

選択した画像を反映するにはページの下にある「保存」ボタンを押してください。
一度確認する場合はページ上に表示される「スタイルプレビュー」を押してください。



アイコンが変更されました。

スタイルシート用画像などにアップした画像を使用する場合は
「詳細編集」で対応することができます。

↓アイコン表示箇所対応表↓

コンテンツタイトル	ブログタイトル
	パーツタイトル
	整備手帳タイトル
	フォトギャラリータイトル
	スポット名称
	この記事へのコメント
	タグ
	関連リンク
	掲示板タイトル
	お友達からの紹介文ページタイトル
	お友達一覧ページタイトル
	グループ一覧ページタイトル
プロフィールタイトル	最新ブログ
	最新パーツレビュー
	最新整備手帳
	お友達
	ファン
	グループ