追加したCSSが反映されない WordPressテーマ ~質問したら解決が早かったです~">

毎日が自由研究 

スポンサードリンク

追加したCSSが反映されない WordPressテーマ ~質問したら解決が早かったです~

WRITER
 
この記事を書いている人 - WRITER -

 

リンクをクリックする時に色が変わったり、かっこよくなるCSSを追加してみたいと思ったのでチャレンジしてみました!

 

コピペOK!CSSでリンクテキストにアニメーションを付ける11の技

 

でも、反映されませんでしたので、

 

「理由は何でしょうか?あまりいろいろなCSSを次から次へと追加しないほうが良いのでしょうか?」と、質問をしてきました。

 

 

(追記:実は赤い✖印の表示に恐怖を覚えて手が出せなかっただけで、反映させるところまで行っていませんでした。

 

勘違い!

 

言われたとおりにCSSを貼り付けたらちゃんと直ぐに出来ました!)

 

CSSを追加で貼り付けた時に出てきた表示はこれ↓

 

 

 

 

プラグインが邪魔?

 

(追記・・・反映させようとしたにもかかわらず出来なかったと思いこんでいた)

 

こいう不具合が起きた時にはよく「プラグインが邪魔をする」という言葉を聞くので、自分のサイトにインストールされているプラグインを全部書きだしてみました。

 

AddQuicktag (停止 | 設定アンチスパム)

Akismet Anti-Spam  設定 | 停止

All In One SEO Pack Proへアップグレード | ドキュメント | サポートフォーラム | SEO 設定 | 停止

 
Black Studio TinyMCE Widget 停止
 
Contact Form 7 設定 | 停止
 
Google AdSense plugin Settings | 停止
 
Hello Dolly 有効化 | 削除
 
Intuitive Custom Post Order 停止

 
Jetpack by WordPress.com
 
Jetpack | 設定 | サポート | 停止
 
MetaSlider 停止

 
Post Or Page Hide Title 停止

 
Quick Adsenseings | 停止
Shortcodes Ultimate 停止
 
Show Article Map 停止
 
 
Simple Custom CSS 有効化 | 削除
 
SiteGuard WP Plugin 停止
 
Slider WD Deactivate
 
Speech bubble (ふきだしプラグイン) 停止
 
Table of Contents Plus 設定 | 停止

 
TinyMCE Advanced 設定項目 | 停止
 
TypeSquare Webfonts for エックスサーバー 有効化 | 削除

 

VaultPress 停止

 

WP Multibyte Patch 有効化 | 削除

 

Yoast SEO 有効化 | 削除

 
 
 
(結果的にこの情報はいらない情報だったようです。)
 
 
 

追加CSSの欄に入っているもの2種類

 

文字フォントを変えるCSS

 

文字の装飾のCSS

 

この2つが入っています。

 

 

 
 
 
 

これまでにもCSSを弄っているのでリビジョン履歴が10ぐらいあると思います。

 

それと、今ブログヘッダー上部に変な文字列が出来てしまっています。

 

これは、CSSを弄り始めた当初まで遡ってリビジョンを復元すれば大丈夫ですか?

 

(リビジョンとは、記事やCSSを更新するたびに自動的にバックアップを取ってくれるありがたい機能とのことです。)

 

最近これまでにもCSSを大分弄ってしまっています。

 

多分10ぐらいリビジョン(履歴というかバックアップ)があると思います。(リビジョンが多いとブログが重くなる?!始めて聞きましたが、今回は無視)

 

記事になっているのですが、こっちはごちゃごちゃしてて読みづらいかもしれません。

 

追加SCCを弄ったら、ブログのヘッダーに変な文字が出るようになりました

 

WordPressのテーマはGiraffeです

 

WordPressのテーマはGiraffeです!

 

CSSの変更は、テーマによって追加するものが違うと小耳に挟んだことがあります。

 

なので、CSSの知識ゼロの私には選択の余地なんかあるはずもありません。

 

ここは観念して人に聞くしか無い!

 

赤いバッテンは削除しても問題とのご回答

 

 この1~22というのはコードでもなんでもないので、削除しても良いというご回答をいただきましたので思い切って削除してみました。

 
 
 
 赤い×は「コードの書き方が間違っています」という表示なので、削除するか書き直せば大丈夫なんだそうです。
 
 
赤いで表示されているので本能的にヤバイ感じがして手が出ませんでした^^;
 
 
無事にリンクの装飾が完了しました!
 
 
赤いバツは、そういうことだったんですね。
 
 
サイトが崩れるんじゃないかと心配でしたがこれで安心です。
 
 
 

学習記録としてブログに書いてます。

 

 
完全でなくてもインプットしたらアウトプットをすると良いと、一般的に最近よく言われていますので私もそう心がけています。
 
 
 
こういう質問は主にFacebookでしています。
 
 
全部じゃないですが学習記録としてブログに書いてます。
 
 
Facebookには投稿欄はあるにはありますが、画像をたくさん貼ったり出来ないし自由度は低い感じがします(知らないだけかも)。
 
 
ブログ記事に質問事項を分かりやすく書けば、質問のやり取りの回数も減って効率が良いんじゃないかとちょっと思いました。
 
 
そして、解決した後は、同じような疑問を持った人に参考になる。
 
 
私が質問内容を簡潔にわかり易くする能力がないだけかもしれませんが。
 
 
 
 
 
 
 
 
 

 

この赤く表示されている番号のところを削除しました。

 

 

変更前の記事の画像 ↓  リンクが水色です。

 

 

 

変更後、リンクがピンク色になり、動きも出た画像 ↓

これはコピーなので動いていませんが。

 

 

 

 

 

まとめ

 

結果は、知っていれば簡単なことでした。

 

追加CSSに表示されるエラー「赤いバッテン」は無視して良かったんですね。

 

自分でもしつこく調べてみてどうしても分からなかったら、質問もありです。

 

ゼロからの質問だと、教えてくれる方が大変になってしまうので自分でも調べてからのほうがやっぱり良いんだと思いました。

 

ブログ記事風にしたので画像もたくさん貼れて、質問がスムーズに出来ました。

 

 

スポンサードリンク
この記事を書いている人 - WRITER -

- Comments -

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

CAPTCHA


Copyright© ごはんつめんきちゃんCOM  , 2018 All Rights Reserved.