あめつくのブログ

  • このエントリーをはてなブックマークに追加

アメブロカスタマイズ プロフィール画像の枠を非表示にする(CSS)

広告

ここでは、アメブロのcssを編集して「プロフィール画像の枠を非表示にする方法」を説明します。

【変更前】

【変更後】

なお、cssを編集するにはブログデザインを「CSS編集用デザイン」にする必要があります。ブログのデザインをCSS編集用デザインにする方法は、「アメブロのcssを編集するための設定」を参考にしてください。

広告

アメブロのプロフィール画像の枠を非表示にする方法

マイページ右上の「アメーバのサービス一覧」をクリックします。
サービス一覧(PC編)

[デザインの変更]をクリックします。
デザインの変更(PC編)

[cssの編集]をクリックします。

cssの編集画面が表示されます。ここから、プロフィール画像の枠を非表示にするためのcssの編集に入ります。

まず、下の赤枠の内容をコピーします。これがプロフィール画像の枠を非表示にするcssです。

.userProfileImage{
border:none;
}

コピーした内容はcssの一番下の部分に貼り付けます。
貼り付けが終わったら、[保存]ボタンをクリックして追加したcssを保存します。

保存できたらブログを表示し、ブラウザの更新ボタンをクリックします。
(古いデータが残っていると変更したcssが反映されませんので、ブラウザの更新ボタンをクリックして最新の状態に更新します。)

ここまでの内容を動画でも確認できます。よかったら、参考にしてください!

以上、「アメブロカスタマイズ プロフィール画像の枠を非表示にする(CSS)」でした!!

広告

関連記事

コメント

  • トラックバックは利用できません。

  • コメント (2)

    • しゅあー
    • 2014年 10月 28日

    はじめまして。
    大変有益な情報を惜しげもなく公開してくださってて、とても感謝です。
    ありがたく使わせていただいてます。

    ところで、この記事内容に関連することの質問よろしいでしょうか?

    ここに書かれてるのは、サイドバー内の画像枠についてですよね?
    プロフィールページ内の方も画像枠を非表示にすることは出来ないのでしょうか?
    よかったら教えてください。

      • あめつく
      • 2014年 11月 02日

      はじめまして、コメントありがとうございます。

      ご質問の件ですが、プロフィールページ内の画像枠も非表示にすることができます。

      手順は以下のとおりです。

      1.フリースペースの設定ページ(http://ucsprofile.ameba.jp/ucs/freespace2/show.do)を表示。

      2.フリースペースの内容に以下のコードを貼り付け保存。(貼り付ける位置は、最初でも最後でもかまいません。)

      <style>#leftArea #userImg{border:none;}</style>

      3.プロフィールページを表示して枠が非表示になっていることを確認。

      ざっくりな説明ですが、この手順で画像枠を消すことができます。不明な部分がありましたら、またいつでもご連絡ください。

      返信がおそくなってしまい失礼しました。

カテゴリー