![WordPress|Elementor 画像ボタンにシャドウとアニメーションをつける](https://tecn.apice-tec.co.jp/wp/wp-content/uploads/2023/08/エレメンター02.jpg)
お客様のご要望を聞きすぎたカンプを作ってしまい四苦八苦しているアピコです。(汗)
エレメンターの構成を勉強せずに走り出してしまい、お客様のご要望にストップかけることもできず・・・かなりやらかしたカンプ。
エレメンターマスターに「悲しい」と言わせたほどです。。。
エレメンターの良さはノーコードで手軽にカンタンに作れるところですが、「どうするのよ」と言った感じです。
さて、気を取り直して作業報告です。
下記は、同じ行程が必要なものが複数ある場合は、ひとつを設定した後、複製し、画像のみ変更すると、都度シャドウとアニメーションの調整が不要になります。
画像ボタンにシャドウをつけたい!
これはカンタン。四角、角丸四角、丸まで調整でき、シャドウのカラー、ぼかし、位置まで調整できます。
ちなみに、角丸をpxで設定するとモニターの大きさなどにより変形する場合があるので%などで設定するのもいいですね!
![](https://tecn.apice-tec.co.jp/wp/wp-content/uploads/2023/08/スクリーンショット-2023-08-09-10.45.34-1024x713.png)
画像ボタンのホバー時にアニメーションをつけたい!
これもカンタン!!
表示された直後のアニメーション、ホバー時のアニメーションが設定できます。
以下の画像はホバー時のアニメーション設定です。アニメーションも様々なバリエーションがあり、トランジッション時間も設定できます。
![](https://tecn.apice-tec.co.jp/wp/wp-content/uploads/2023/08/スクリーンショット-2023-08-09-10.53.12-1024x689.png)
もちろんリンクも貼ることができます。
システム開発はアピステクノロジーへ
アピステクノロジーでは、システム開発をはじめ、システムパッケージの販売にも力を入れています。
「IT TOOL」をご存じですか?
既に標準の機能が実装されているシステムパッケージを、貴社用にデザインカスタマイズし提供します。
さらに、IT導入補助金の利用で価格を大きく抑えることも可能です。
実績多数、低価格で本格的なサイトができると好評いただいております。
詳しくは弊社HPをご覧ください。
アピステクノロジーの実績紹介はこちら↓
ITツール紹介ページはこちら↓