賢威7カスタマイズ一覧StingerXeoryお問い合わせHomeStingerStinger7:トップに戻るボタンをカスタマイズする方法StingerStinger7:トップに戻るボタンをカスタマイズする方法こんにちは、ぶどうサワーです。サイトの閲覧ありがとうございます。先日、無料WordPressテーマ:Stinger7の正式版が公開されましたね。スコアもかなり上がったようです。Stingerユーザーが増えそうですね。今回の記事では、そんな無料WordPressテーマ:Stinger7の「トップに戻る」ボタンをカスタマイズする方法を紹介したいと思います。カスタマイズと言っても色々あると思いますが、ここではトップに戻るボタンの色を変更ボタンの大きさを変更ボタンを丸くする矢印を大きくするボタンの位置を変更という5つのカスタマイズをご紹介します。ボタンの色を変えるStinger7では子テーマも配布されているので、ここでは子テーマを使ってカスタマイズしていきたいと思います。トップに戻るボタンの色を変更していきます。#333;}ボタンの色が黒(#333)になります。部分を変更して下さい。マウスオーバー時の色を変えるには上のコードはマウスオーバーしていない、通常の状態の色を変えましたが、マウスオーバーしたときの色を変更する場合は、以下のように指定します。部分の色コードを編集して下さい。ボタンの大きさを変える次はボタンの大きさを変えるカスタマイズです。30px;}ボタンが上下左右5pxずつ大きくなりました。○○部分を変更すれば大丈夫です。数字が違うと位置がズレてしまうので、同じ数字で揃えて下さい。ボタンを丸くする今度はトップに戻るボタンを丸くします。四角から丸になるとだいぶ印象が変わりますね。大きさを変更することが出来ます。プロパティを追加すればお好みの大きさにできますが、ここでは30pxにしてみましょう。30px;}上のコードを追加すると、下の画像のようになります。最後のカスタマイズはボタンの位置の変更です。追加すると、トップに戻るボタンが「右端から30px、下端から30px」の位置に固定されるようになります。固定する場合のコードは下のようになります。ここまでのコードをまとめるとここまでのコードをまとめてみました。#555;}今回のカスタマイズは以上です。最後まで閲覧ありがとうございました。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。