技術

ChromeでTwitterの右カラムやDMポップアップ等を非表示にする

技術

どうも、先日Twitterのアカウント名を「東証全部退場」にしたところ気に入りすぎて延々戻せていないkayolabo801です。

さて、昨今のTwitter、息苦しくないですか。

どうでもいいトレンドは通報できるくせにセンシティブなトレンドは非表示にすらできず、トレンド欄ではブロックすら貫通する始末。

これではTwitterはどんどんヘイトを蓄積するプラットフォームになってしまいます。

諸悪の根源はいつの間にやら右カラムに常駐し出したトレンド欄です。

こいつが四六時中目に入るせいでストレスなんですよね。

ついでに右下のDM欄は使ったことないしクソ邪魔。

どうにかこいつらを非表示にできないものか…

と思って調べてみるといいものを発見しました。

特定のサイトの特定のCSSを弄れるChrome拡張”Stylus”

「このサイトのこの要素のCSSをこう表示する」といったことが可能なChrome拡張、「Stylus」というものがありました。

こいつで右カラム要素と右下のDMの要素を非表示にしてやればいいわけです。

実際の方法

まずはStylusをChromeに追加しましょう。

そうすると右上の拡張機能欄にStylusが追加されるので、そいつを選択→管理ボタンをクリックします。

するとStylusの管理画面に飛びます。

左にある「新スタイルを作成」をクリック。

そうして「コード1」欄に以下のコードを追加しましょう。

[data-testid="sidebarColumn"],
[data-testid="DMDrawer"]{
display: none
}

このコードを解説すると、Twitterの右カラムに付与されている「 data-testid=”sidebarColumn” 」と右下のDM欄に付与されている「 data-testid=”DMDrawer” 」という要素を指定してやり「display: none」で非表示にしているわけです。

どこにどのようなIDが付与されているかはサイトを開いた状態で目当ての要素を右クリック→検証をクリックすることで見ることができます。

つまり要素に付与されているIDさえ見抜ければ任意の要素を削除することが可能です。

最後に適用先を「次で始まるURL」「https://twitter.com」としてTwitter以外のサイトでStylusが動かないようにし、保存をクリックします。

Twitterのサイトに戻って画面を更新してやると…

このとおり右カラムと右下のDMポップアップ欄を消すことができました。

マトーメ

最近では見たくない情報まで流れてきてしまうTwitter、このような物理的自衛も可能です。

不必要な情報はシャットアウトしてお気楽なTwitterライフを送ってみませんか。

Let’snote CF-S10のストレージをSSD化してみた

技術

うおおおおおおおおおおおおおおおおお(電車で新宿へ向かう)

うおおおおおおおおおおおおおおおお(新宿駅到着)

うおおおおおおおおおおおおおおおおお(ツクモ新宿西口店)

何が大当たりやねん

うおおおおおおおおおおおおおおおおおおおおお

うおおおおおおおおおおおおおおおおおおお

SSDを買った

というわけで、現在使っているノートPCであるLet’snote CF-S10をSSD換装すべく新西ツクモでcrucialのMX500(500GB)を購入しました。

来春にVAIO SX14に乗り換える予定なのですが、それまでの繋ぎとして超型落ちPCを少しでもスペックアップしておきたかった所存。

SSDの見た目はこんな感じ。

なんの変哲もない2.5インチSSDですね。

HDDのデータをSSDに移行

まずは今入ってるHDDのデータを

このSSDに移す作業です。

実家から板チョコ型SATA-USB変換器を持って来ておいて助かりました。

HDDからSSDへデータを移す(「クローン」と言うらしいです)ために使ったバックアップソフトが「AOMEI Backupper Standard」というフリーソフトです。(同じくフリーソフトの「EaseUS Todo Backup」が有名ですが、私の環境ではうまくいかなかったので割愛。)

ソースディスクにHDDを指定して

ターゲットディスクにSSDを指定します。

クローン作成が始まりました。

というわけで終わるまでスヤァします( ˘ω˘)

翌朝起きたら、無事クローン作成が終わっていました。

SSD換装

では、ついに解体の儀です。

と言ってもLet’snote CF-S10の場合のストレージ交換は非常に簡単で

バッテリー外した横のこのフタを開けるだけです。

フタを外すのも簡単で、ここのネジと

ここのネジを外すだけです。

お邪魔しまーーす

フタが外れました。

元々のHDDを外すのも、ここのベロをつまんで

引っ張るだけです。

コネクタを忘れずに外しましょう。

HDDを外したので、これから入れるSSDと並べてみました。

今後のことも考えて、ベロはちゃんとSSDに貼り付け直しておきました。

というわけでSSDを挿していきます。

コネクターを忘れず装着して

押し込み。

あとはフタを装着して

SSD換装完了!!!

起動チェック

運命の起動チェック。

ドキドキ…

お!!

特に問題なく起動!!

そして起動が早い!!!!

おお~~~~~~~~

というわけで、無事骨董Let’snoteのSSD換装に成功しました。

ソフトの動作がかなり軽くなったり動画再生のカクつきが無くなったりと、明らかに性能が上がった体感がありました。(元が低スぺ過ぎたわけでありますが)

あと1年弱使い倒すには十分なスペックになってくれたかな、と思います。

以上。いえーい。

私をHTML中級者に育てた3冊

技術

どうも、人生で初めてボイチェンに触ってみたら自分の笑い声のあまりの可愛さに悶え死んだカヨコです。

高校2年の終わりにHTMLに触り始め、今ではWordPressのレスポンシブテーマを1から組むことができるようになりました。
自分で言うのはおこがましいですが、そろそろ「HTML中級者」を名乗ってもいいのかなと思っております。

さて、私が1年半である程度Webサイト制作ができるようになったのは、3冊の教本の力が大きかったと思っています。
あの3冊に出会わなければ私は未だ生半可なHTML知識でイキり散らしていたでしょう。

てなわけで早速紹介していきます。

わかばちゃんと学ぶ Webサイト制作の基本(湊川あい)

高3のはじめ辺り、私が絶賛HTML初心者イキリをかましていた時に出会った1冊です。

これを読んで全てが変わりました。

内容としては、

  • そもそも何故Webサイトを作るのか
  • HTMLの基礎
  • CSSのちょっと込み入ったとこまで
  • JavaScriptやPHPについてかるーーーーーーーーーく
  • Webサイト公開後の運営について

という感じです。

CSSに関して優先度とか疑似要素とか「大事だけど難しめの内容」まで網羅されているのが素晴らしいと感じますが、何よりこの本を第一に薦める理由は、
「初心者が見落とすWebサイトの制作意義Webサイトの運営
について超丁寧に説明されていることです。

ここが何より重要なのに、巷の初心者用HTML教本には書かれてません。HTML技術だけです。
ぶっちゃけタグとかの知識なんてggれば出てきます。
初心者用教本では技術よりこの2つを教えるべきです。

HTML始めたい人は絶対最初にこの1冊を買ってください。てか買え。

HTML5&CSS3デザインブック(エビスコム)

こいつは「きちんとWebサイトを組む」ことができるようになるための1冊です。

これを参考に1~2回サイトを組んでみれば、「レスポンシブデザインのサイトがどういう構造になっていて、どう組めばいいのか」が分かるようになります。

ただ、少々古めの本なので最新のコーディングトレンドには全然対応していません。
そのせいで私も少し古典的なHTMLを組む癖がついてしまいました。
なので、私としてはこの1冊を薦めますが、ナウいHTMLerになりたい方は別を当たってもいいかもしれないです。

WordPressデザインブック(エビスコム)

これはWordPressテーマを1から作るにあたって私が読むべきと思う1冊です。

2冊目にちょっと古い本を紹介したのは、この本にスムーズに移行できるようにするためです。
2冊目の内容が分かっていれば、難なくWordPressテーマを完成させることができます。

AMAZONでは酷評が目立ちますが、あれはHTMLの勉強の手順を踏まずいきなりWordPressに飛びついた連中のご意見なので気にしなくていいです。(過激派)

とりあえずこの3冊(前半2冊でもいいです)を読みきったら、それだけでHTML中級者を名乗っていいと思います。

ぶっちゃけHTMLは超簡単なので、どうか皆さんも「正しい順序で」勉強して欲しいと思っています。