• 車種別
  • パーツ
  • 整備手帳
  • ブログ
  • みんカラ＋
■ナビゲーション
  1. 車・自動車SNSみんカラ
    2. >
  2. ブログ
    3. >
  3. 日記
    4. >
  4. ブログ一覧
    5. >
  5. ブログに大きな画像を貼るための設定(スタイルシートの設定編) [wa-pa-pa]
イイね！
   
2015年07月18日

ブログに大きな画像を貼るための設定(スタイルシートの設定編)

タイトル通りブログに大きな画像を貼るための設定を物忘れがひどいのでブログに記録しておきます。自己責任で作業を行ってください。
スマホ版アプリで見ても画像サイズが同じで何のこっちゃなのでPCで見るとサイズの違いがわかります。


ブログに大きな画像を貼るための設定(画像準備編)で作成したブログで大きい画像の右側が欠けている部分を欠けないで表示する設定方法です。


①みんカラマイページの管理よりスタイルシートを選択します。


②スタイルの選択画面が表示されるのでここでスタイルを選択しても設定できるみたいですが自分はできなかったので簡易編集でスタイルシートを設定しました。
また現在スタイルシートを複雑にカスタマイズ設定している方は設定がリセットされてしまいますので、そのまま⑥から設定するか、してみてください。


③簡易編集画面の赤丸の基本とするスタイルより自分はみんカラホワイトを選択しました。
選択後読み込みボタンを押します。
読み込みボタンを押したら今まで使用していたスタイルシートは上書きされますので気を付けてください。


④基本とするスタイルを選択・読込後、簡易編集画面の一番下に保存ボタンがあるので保存ボタンを押します。


⑤保存ボタンを押すと「スタイルシートを読み込みますか?保存されている画像以外の編集内容は破棄されます」とメッセージが表示されるのでOKを選択


⑥スタイルシートの読み込みが完了したら赤丸の詳細編集を選択し共通コンテンツを選択します。


⑦コンテンツ領域の赤丸部分「overflow:hidden;」を変更します。


⑧コンテンツ領域の赤丸部分「overflow:hidden;」を「overflow:visible;」に変更します。
この変更で画像の右側の欠けがなくなり全体が表示されるようになります


⑨変更完了後共通コンテンツ画面の一番下に保存があるので保存します。


⑩共通コンテンツの保存が完了したら赤丸のスタイル選択をクリックしてカスタムスタイルの適用を押します。これで右側の欠けがなくなり全体が表示されるようになっているはずなので画像準備編で作成したブログを表示してみます。


⑪右側の欠けがなくなり全体が表示されるようになっていますが、赤矢印の線と赤丸部分のサイドメニューの背景で画像が見えていないので、赤矢印の線の除去と、赤丸のサイドメニュー背景の透明化をします。


⑫まずは赤矢印の線の除去ですが、スタイルシートの詳細編集のコンテンツ共通 の コンテンツ表示上部・コンテンツ表示・コンテンツ表示下部3か所赤丸部分に「background:url(https://cdn.snsimg.carview.co.jp/～) no-repeat bottom left;」とありますがカッコ内のURLを削除して「background:url() no-repeat bottom left;」とします。3か所ともにカッコ内のないURLを削除します。


⑬変更後は赤丸の様になります。確認後共通コンテンツの保存をし、スタイル選択の中のカスタムスタイルの適用を押します。これで赤矢印の線の除去とが完了したので、またまた画像準備編で作成したブログを表示してみます。


⑭赤矢印にあった線が消えています。
次に赤丸のサイドメニューの背景の透明化です。
スタイルシートの詳細編集のサイドメニューを選択します。


⑮赤丸のサイドメニュー領域の
width:300px; を　width:200px; に変更。
background:#fff;　を　background:; に変更。
最終行にmargin:100px;　を追加入力。


⑯⑮の通り変更・追加するとこうなります。
並びが違うかもしれませんが、それぞれの項目が変更・追加されたことを確認後、サイドメニューの保存をし、スタイル選択の中のカスタムスタイルの適用を押します。これで赤丸のサイドメニューの透明化が完了したので、またまた画像準備編で作成したブログを表示してみます。


⑰サイドメニューの背景は透明化されているので以上で完了です。


以上で設定は完了です。
またサイドメニューが邪魔で気になる方はサイドメニューを消してしまうこともできるようなのでご紹介します。
画像はございません。
スタイルシートの詳細編集のサイドメニューで
サイド領域リンク内とサイドメニュー領域内に
opacity:0;
を追加入力をします。
その後サイドメニューの保存。
スタイル選択の中のカスタムスタイルの適用を押します。
画像準備編で作成したブログを表示してみます。
サイドメニューが消えていれば完了です。

長々とお付き合い頂きありがとうございます。
ブログ一覧 | 日記
Posted at 2015/07/19 00:19:00

   

イイね！0件



carview!のマイカー登録でお得なクーポンを獲得しよう

今、あなたにおすすめ

ブログ人気記事

異常気象に翻弄された今年の桜、上田 ...
ライトバン59さん

【シェアスタイル】モニター募集🎁 ...
株式会社シェアスタイルさん

朝の一杯　4/18
とも ucf31さん

乃木坂〜六本木ぶらり旅😋
こいんさん

両親の結婚記念日でした！
FLAT4さん

第3日曜日ですね～✨奥多摩❓️❓️
ヒロ桜井さん

この記事へのコメント

リック・ジョンソン
2015年7月19日 10:25
おはようございます

今回もとても丁寧な説明のブログわざわざありがとうございました

大変参考になりました　(^^)
コメントへの返答
2015年7月19日 11:10
おはようございます(^o^)
自分の記録用にアップしようと思っていたので気にせずに(^o^)/
いりあん
2015年11月16日 6:56
参考にさせていただきました。
有り難うございます。
コメントへの返答
2015年11月16日 13:20
こんにちは

雑なブログで申し訳ございません。

参考にできるところはぜひ参考にして下さい。
ぼさぼさ頭
2017年12月10日 22:30
はじめまして。いろいろ検索してたら、こちらに辿り着きました。おかげさまで大きな画像を出来るようになりました。ありがとうございました。もしみん友さんに聞かれたら、こちらのブログを紹介させてもらって大丈夫でしょうか？

   

プロフィール

wa-pa-paです。 見た目はノーマルで少しずつ中身を弄っていきます。 皆さんのページを参考にさせて頂いています。 よろしくお願いします。
みんカラ新規会員登録

ユーザー内検索

<< 2024/4 >>

日 月 火 水 木 金 土
 123456
78910111213
14151617181920
21222324252627
282930    

リンク・クリップ

趣味なら本気で!　一眼レフカメラ撮影テクニック～ステップアップへの道♪ 
カテゴリ：その他（カテゴリ未設定）
2016/01/24 09:48:17 		 
スピーカーKICKER QS65.2 ツイーターインストール 
カテゴリ：その他（カテゴリ未設定）
2015/10/27 22:02:21
フロントドアのデッドニング 
カテゴリ：その他（カテゴリ未設定）
2015/05/22 21:29:49
[ 他のクリップをチェック ]

愛車一覧

ホンダ フィット ホンダ フィット
ホンダ フィットに乗っています。 ホワイトパールです。
ダイハツ ムーヴコンテ ダイハツ ムーヴコンテ
ムーブコンテです。
[ 愛車一覧 ]

過去のブログ

2016年
01月02月03月04月05月06月
07月08月09月10月11月12月
2015年
01月02月03月04月05月06月
07月08月09月10月11月12月
2014年
01月02月03月04月05月06月
07月08月09月10月11月12月
ヘルプ｜ 利用規約｜ サイトマップ

あなたの愛車、今いくら？

複数社の査定額を比較して愛車の最高額を調べよう！

あなたの愛車、今いくら？
メーカー
モデル
年式
走行距離（km）
© LY Corporation