Yahooメールを広々と使う方法 【2014/6中旬以降版?!】

  • 投稿 : 2014-06-19
  • 更新 : 2014-06-20

本記事の方法を使えば、上記のように表示されるようになるかと思います。

2014/06中旬から、Yahooメールが変わって、スマホとかタブレットとかに最適化された感じになったと思います。しかし、僕はパソコンで使っているのでうーんという感じです。

ヤフーメールが変わりましたが、右側に表示されるCMを表示させない方法はないですか?
半分近くもCMが占めてますね。
邪魔でしょうがありません。

メール情報の表示幅が狭いため、受信時刻が表示されません。
消す方法はないでしょうか?
ヤフーメールが変わりましたが、右側に表示されるCMを表示させない方法はないで... - Yahoo!知恵袋

端的にいうと、上記の不満なんですね・・・。

パソコンのブラウザー版Yahoo!メールは、「正式版」と「ベータ版」を統合し、1つのバージョンになります。
2014年5月28日(水)より順次、自動的に現「ベータ版」の仕様に変更し、2014年6月中旬をめどに現在の「正式版」の提供を終了します。
Yahoo!メール(ベータ版)ヘルプ - ベータ版と正式版の見分け方

現状のバージョンを何と呼べばよいのか悩んだというかいまだにわかりません。
最初は正式版?なのかなと思うと、旧「正式版」と区別しにくいし・・・わざとなんだろうか?

やりかた

使用するプラグイン

■Chrome
Chrome ウェブストア - Stylish

■FireFox
Stylish :: Add-ons for Firefox

ChromeやFireFoxの場合は、
ブラウザに「Stylish」というプラグインを導入して、Yahooメールだけに独自にスタイルシート(CSS)を適用するようにします。

動作確認は、Chromeで行いました。

■IEの場合
カスタム スタイル シートを使って Web ページの書式を設定する | マイクロソフト アクセシビリティ
ユーザースタイルシート「特定のサイトだけに適用する方法は?」 - マイクロソフト コミュニティ
ITmedia エンタープライズ:Windows Tips「自分のスタイルシートを使ってみよう」

本記事では扱っていないが、Yahooメールだけに適応させることができないが、ユーザー定義のスタイルシートを全サイトに適応することはできる(はずです)。たぶん、全サイトに適応しても問題ない感じだと思うので、どうしてもIEでやってみたい場合は、その方法が使えるかもしれません。

追記2014/06/20:IE11で試してみたのですが、うまくいきません。私が、なにか勘違いしてるのかも?


設定の仕方


#theAd,
.ad_NW,
.col-b,
[id*="ads_"],
[class*="ads_"] { display: none !important; }
 
#shellcontent { right: 0!important; }
コード部分は上記の用に指定します。
また、適用先 を「ドメイン上のURL」を選択して「mail.yahoo.co.jp」を指定します。

動作しているかの確認


Yahooメールのサイトを開いたら、アイコンのところに赤で「1」とか表示されるので、その表示が出れば、「Stylish」は動作しているかと思います。

参考にしたサイト

Yahooメール(ベータ版)を広々と使うためのユーザスタイルシート - メモ用紙
Restyle the web with Stylish! - userstyles.org

今後の為に・・・

前半の部分が、広告を非表示
後半の「#shellcontent { right: 0!important; }」の部分が、横幅を広げてるところです。

!importantをつけると、強制的にこの属性で上書きされます。
shellcontent という名前は、HTMLソースをみて探すしかないんですが、Chrome だとF12キーを押すと開発ツール?が表示されるので、それで探すと便利です。

スポンサーリンク