初心者のための

スクロールすると蛍光マーカーが引かれる!

2018/12/08
 

スクロールで蛍光マーカーが引かれるようにしたいなぁってちょっと前から探していて、見つからないなぁって思っていたのだけど。

 

見つけちゃいました!

 

プラグインじゃなくって、ちょっとファイルをいじらないといけないけど・・・

 

header.php

 

「heder.php」って私の使っている「giraffe」の子テーマにはないので、親テーマからダウンロードして、子テーマのフォルダーにアップしました!

 

関連記事
 
 
そうそう、作業前にバックアップはとっておいてくださいね!
 
 
 
 
「外観」の「テーマの編集」から 子テーマの「heder.php」に下記のコードを追加します。

 

 

追加CSSにコードを追加

 

 

 

「外観」の「CSS編集」をクリックします。

 

表示された追加CSSに下記のコードを追加しましょう。

 

 

 

 

 

 

コードを貼り付けたら「公開」のクリックを忘れずに!

 

AddQuiktagに登録

 

あとは、記事で下記のコードを呼び出すとスクロールされた時に蛍光マーカーを引いてくれます。

 

 

マーカーを引く 

 

毎回テキストに貼り付けてってやっぱり大変なので、AddQuiktagに登録しちゃいましょう!

 

登録方法は下記の記事をどうぞ!

 

関連記事
 
 
開始タグは「<span class=”marker-animation”>マーカーを引く」、終了タグは「</span>」です。
 
 
そうそう、文の途中で一部分だけマーカーを入れたい時は、文の途中でコードを入れてくださいね!
 
 
 

まとめ

 

ずっと探していたので、めちゃめちゃ嬉しいです。

目を楽しませてくれそうですね!

 

ではまた!まみでした。 

 

 

- Comments -

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Copyright© ワードプレスお困りごと講座 , 2018 All Rights Reserved.