次回から「なおやすブログ」と検索してください^ ^
プライマリボタンの変え方

【THE・THOR】(ザ・トール )プライマリボタンをカスタマイズする方法

あなたはプライマリボタンを使っていますか?

これですこれ↓

実はこれ、自分好みにカスタマイズすることが出来るんですよ🎵

この記事では、その方法をお伝えしていきます。

3分くらいで設定し終わると思うので、気軽にやってみてください。

【THE・THOR】(ザ・トール )でプライマリボタンをカスタマイズする方法【画像で解説】

「外観」から「カスタマイズ」をクリックする。

カスタマイズボタン

「パーツスタイル設定[THE]」をクリックする。

パーツスタイル設定

「共通ボタン設定(全ページ用)」をクリックする。

共通ボタン設定

文字の色と背景の色はここから簡単に変えることができます。

共通ボタン

文字色と背景色を変えたいだけの場合は、ここだけの設定のみで十分です。

もし、こんな風にアレンジを加えたいのであれば、CSSをいじる必要があります。

※方法をお伝えしますが、ここからは自己責任でお願いします。

【THE・THOR】(ザ・トール )プライマリボタンをカスタマイズする方法【アレンジ編】

「外観」から「カスタマイズ」をクリックする。

カスタマイズ

下にスクロールして「追加CSS」をクリックします。

追加CSS

ここにCSSを記述していきます。

ホバーしたら。。。
.btn__link-primary {  background: #FF773E;  color: #fff;  border: px solid ;  padding: 14px 30px;}.btn__link-primary:hover {  background: #fff;  opacity: 0.7;  border: 1px solid orangered;  border-style:dashed;  border-radius: 30px;  color: orangered;}

このCSSは、ホバー(ボタンの上にカーソル・指を置くこと)したらボタンが破線になるアレンジです。

こんな感じで、プライマリボタンを自分の好みにカスタマイズすることが出来ます。

HTMLやCSSの知識があれば、もっと色々なボタンを作ることが出来ますよ🎵

興味が湧いた方はぜひこちらの記事も見てみてください。

naoyasublogでは質問・相談を募集しています。

なおやすの

ツイッター:@naoyasu_log

匿名希望の方は匿名質問箱でもOKなので、なんでも質問してくださいね~!

 

プログラミングに興味があるけど何から始めていいのか分からないなら

まずは無料体験から初めてみませんか?^^

>>TechAcademy [テックアカデミー]

ここならオンライン完結でプログラミングの無料体験が出来ますし

不安なことも相談できるのでめっちゃ良かったです!

合わないなと思ったら辞めればいいだけなので損はしないですよ^^

 

改めまして当ブログへようこそ!

もしあなたが…

  • 自分に自信がなくて将来が不安。
  • そこそこ稼げて食いっぱぐれないスキルが欲しい。
  • 普通以下のスペックだけど将来は自由に豊かに生きていきたい。

こんな風に思っているなら、このブログに出会えたあなたはラッキーです!

なぜなら過去の僕と同じ悩みを持っているから。

そしてこのブログには、これらの悩みを解決する記事が詰まっています。

当ブログのことを少し紹介させてください^^

目次はこんな感じです。

  1. 過去の僕の悩みのほとんどを解決したものとは?
  2. 〇〇スキルを身につけた方法。
  3. なおやすブログってどんなブログ?

>>続きを読む

 

【大学中退・引きこもり・うつ】からエンジニア就職を成功させた僕が選んだプログラミングスクール

  • TECHCAMP
    5

  • DMM WEBCAMP
    5

  • ポテパンキャンプ
    4