ワードプレスのコクーン(Cocoon)でボタンを光らせる方法です。
今回はスマホ(iPhone)から作ってみました。
こんな感じに光るボタンを簡単に作ることができます。
![](https://nftgamelabo.com/wp-content/uploads/2023/05/IMG_1152.jpg)
ボタンが光っていると目立ってかっこいいわね。
【光るボタンの作り方の手順】
まずはじめに「旧エディタ」で光らせたいボタンになるタグを作ります。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9517-243x300.jpeg)
例えば、「LINE NFT」の光るボタンを作りたい場合は、公式からURLを拾ってきてタグを作ります。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9538-300x271.jpeg)
タグを作ることが出来れば、今度はテキストモードで開き直し、タグにした部分を選択し「コピー」します。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9541-158x300.jpeg)
タグをコピーした後はブログを「非公開」にして保存します。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9531-206x300.jpeg)
保存した後に旧エディタからではなく、今度は「ブロックエディタ」から開きます。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9517-1-267x300.jpeg)
「ブロックエディタ」で開いた後に黄色の丸印の「十字ボタン」をタップします。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9539-300x285.jpeg)
十字ボタンをタップした後に下にスクロールしていき、「囲みボタン」をタップします。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9518-300x296.jpeg)
囲みボタンをタップした後に今度は黄色の丸印の部分をタップします。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9542-282x300.jpeg)
すると新しく画面が開き「リンクタグ・ショートコード」の所に先程コピーしたタグを貼りつけます。貼りつけた後にボタンに表示させたい文字を入力します。(今回はLINE NFTと入力)
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9535-182x300.jpeg)
タグを貼りつけた後は、「光らせる」のボタンをタップしたり、「文字のサイズ」を選択したり、ボタンの色や文字の色等の設定を選択します。
![](https://nftgamelabo.com/wp-content/uploads/2023/06/IMG_9536-188x300.jpeg)
これで完成です❗️お疲れ様でした☺️