アメーバオウンドカスタマイズ ボタン 18テーマ対応 ホームページを作ろうVol22

こんにちは。
アメーバオウンドマイスター
加藤敦志です。



アメーバオウンドボタンカスタマイズ

前回のブログで
ボタンカスタマイズ方法をまとめました。

「CDG:アメブロ連携対応」のみ適用可能なCSSについて
ご紹介しました。



18テーマ対応

全19テーマあるアメーバオウンドテーマ
内1テーマはカスタマイズ不可【LS】なので18テーマ

この18テーマに対応するようにCSSを作りました。





2パターンあります。

先ずはこちらの10テーマ用ボタンカスタマイズCSSです。


  1. MAGGIE 
  2. VANILLA 
  3. JUSTIN 
  4. TYPTM 
  5. PJ
  6.  BILL
  7.  NATALIE 
  8. MALIA 
  9. BELLE 
  10. SUGAR 
  11. JEPHOTO 


オレンジ

 .u-btn-bdr-clr { border-color: #ff9900; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#ffa035 0%,#ff9900); background-image:-webkit-gradient(linear,left top,left bottom,from(#ffa035),to(#ff9900)); } 



 ピンク

 .u-btn-bdr-clr { border-color: #ffb2b2; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#ffcccc 0%,#ffb2b2); background-image:-webkit-gradient(linear,left top,left bottom,from(#ffcccc),to(#ffb2b2)); } 



 イエロー

 .u-btn-bdr-clr { border-color: #f6cc33; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#f4da7c 0%,#f6cc33); background-image:-webkit-gradient(linear,left top,left bottom,from(#f4da7c),to(#f6cc33)); } 



 グリーン

 .u-btn-bdr-clr { border-color: #b5d78d; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#b5d78d 0%,#98d64d); background-image:-webkit-gradient(linear,left top,left bottom,from(#b5d78d),to(#98d64d)); } 



次のパターン

  1. CDG 
  2. SPUNE 
  3. CELL 
  4. WINKEL 
  5. NOBLESSE 
  6. NEMI 
  7. HINATA


オレンジ

 .u-btn-bg-clr { border-color: #ff9900; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#ffa035 0%,#ff9900); background-image:-webkit-gradient(linear,left top,left bottom,from(#ffa035),to(#ff9900)); } 


 ピンク

 .u-btn-bg-clr { border-color: #ffb2b2; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#ffcccc 0%,#ffb2b2); background-image:-webkit-gradient(linear,left top,left bottom,from(#ffcccc),to(#ffb2b2)); } 


 イエロー

 .u-btn-bg-clr { border-color: #f6cc33; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#f4da7c 0%,#f6cc33); background-image:-webkit-gradient(linear,left top,left bottom,from(#f4da7c),to(#f6cc33)); } 


 グリーン

 .u-btn-bg-clr { border-color: #b5d78d; color: #fff; border-radius:5px; background-image:-moz-linear-gradient(top,#b5d78d 0%,#98d64d); background-image:-webkit-gradient(linear,left top,left bottom,from(#b5d78d),to(#98d64d)); }



テーマに合わせて

お使いのテーマにあったCSSをお使いください

今後カラーを増やす予定です。

欲しいカラーがありましたらリクエストくださいね

お待ちしております!



Skypeでホームページ、SNS、悩み相談、操作方法、活用法などサポートやっています。

詳しくはこちらから!!



ではまた
加藤でした!!

0コメント

  • 1000 / 1000

AmebaOwnd 札幌 ホームページ作成 加藤敦志

AmebaOwndでホームページ制作を行っています。
Smilefactoryten 代表 加藤敦志です。

ホームページ制作、ブログカスタマイズなどに関するご質問なども、お気軽にお問い合わせくださいませ。

どうぞ宜しくお願いいたします。

【経歴】
大学卒業後、設計コンサルタント・農業土木設計技師に19年従事
退職後、機械設備管理、トラック運転手に従事
現在は、Webクリエイターとして作成とトータルWebサポートを行っております。

【お仕事内容】
ホームページ作成(アメーバオウンド、WordPre

AmebaOwnd(アメーバオウンド) 札幌 ホームページ作成 加藤敦志

AmebaOwnd(アメーバオウンド)でホームページ作成行っています。 札幌 smilefacotryten アメーバオウンドマイスター 加藤敦志です。 ホームページ、ブログ制作、悩み、苦手を問題解決へサポートする。 IT、WEBを使ってお仕事をされる方のお手伝い トータルWebサポートをしています。