Twitter埋め込みガジェットの中にあるリンクの色を変更する。

Twitterの埋め込みコードは現在のところ、
ある程度Twitterのウィジェットの設定の画面で設定できます。

しかし、サイトのイメージと合わせるために、link系の色だけ変えたい時などに、
「ユーザー名（@name）」や「Embed」、「View on Twitter」などは
簡単には色を変更できなかったので方法を調べました。

やったこと。
ポイントは２つ。

ポイント１）style.cssを作成しないでそのままもたせたこと。
　*参照１からJSの書き方がわかったので使わせていただきました。

　railsと一緒に動かしてたのだけど、urlのリクエストをJSから送っていたようだったので、
　別ファイルのcssを読み込まず、直接JSにstyleを記載。

ポイント２）!importが重要
　**参照２からimport!するようにと書いてあったので、その通りにやったら反映されました！

　Twitterのaタグのlinkのデフォルトカラーをセットし、hoverした時の色も指定した
　ソース：

function changeTwitterWidgetDesign(){
    var $twitter_widget = $('iframe.twitter-timeline');
    var $twitter_widget_contents = $twitter_widget.contents();

    if ($twitter_widget.length > 0 && $twitter_widget[0].contentWindow.document.body.innerHTML !== ""){
      $twitter_widget_contents.find('head').append(
        '<style type="text/css"> a { color: #41b7d8 !important; } a:hover { color: #9eeefc !important; } </style>'
      );
    }
    else {
      setTimeout(function(){
        changeTwitterWidgetDesign();
      }, 350);
    }
  }

changeTwitterWidgetDesign();

参照：
　２つのブログを参考にさせていただきました。
　*参照１：CSSとJS/jQueryでTwitter埋め込みタイムラインのデザインをカスタマイズする
　　　　　→ http://ithat.me/2016/02/09/js-jquery-twitter-widget-timeline-customize
　**参照２：dakkie blog / Twitter ウィジェットをカスタマイズする。
　　　　　→ http://dakkie.com/blog/css/twitter-widget-customize/