小技チョコレート

ちょっとした小技を紹介するだけのブログです。

ブラウザの拡張機能“Stylus”の使用例(3)

ブラウザの拡張機能である“Stylus”(Chrome 版 / Firefox 版)を使って、ウェブサイトの見た目を変えることができます。この記事では、そのサンプルを紹介します。

Stylus 自体の使い方の解説は、こちらをご参照ください。


〈目次〉


Wikipedia

左サイドバーの「メインメニュー」を非表示にする

div.vector-main-menu-container{display:none}

Gmail

添付された画像の最大横幅を制限する

メールの本文内に添付された画像がGmailの画面上に表示されるとき、その画像の横幅の最大値を制限します。

img[data-bit="iit"]{max-width:50% !important}  /* 50%にする場合 */

Yahoo! ニュース

コメント欄を非表示にする

div#articleCommentModule{display:none}

Cosense

相互リンクの末尾の矢印アイコンを非表示にする

Cosenseのページ同士が相互リンクになっているとき、相手のページへのリンクの末尾に、2本の矢印が自動で表示されるようです。これを非表示にします。

a.bidirectional-page-link{display:none}

Cosenseのページに掲載した画像をマウスでクリックして大きく表示したとき、画像の縦の長さを制限する

画像の縦の長さが、ウィンドウの高さよりも長いときに、はみ出ないようにするために使います。
max-heightの値として一応、100vhを採用していますが、それでも縦がはみ出る場合は、少し減らして90vhぐらいにするとよいです。

.full-content-modal .modal-body .full-content{max-height:100vh !important}  /*画面の高さに合わせる場合: 100vh*/

ページタイトルの直下に横線をひく

.line-title{border-bottom:solid 1px #ccc}  /* #cccにする場合 */

WorkFlowy

カーソルのある行に背景色をつける

div.name--focused div.content{background:#f7f8f9}  /*#f7f8f9にする場合*/

適用例

(1行目にカーソルがある)

関連記事

同様の記事として、こちらもあります。

ich.hatenadiary.com

Windowsに標準搭載のアプリ「フォト」でスクリーンショット画像などに矢印を描画する方法

矢印を描きたい位置でマウスドラッグをするだけで、矢印を自動で描画できます。

矢印を描きたい画像を、アプリ「Microsoft フォト*1で開きます。*2

画面の中央上部にアイコンの列があります。その左端にある「画像の編集」をクリック。

次の画面で、上部のアイコン列の中央にある「マークアップ」をクリックすると、画面の下部中央にツールのアイコンが表示されます。
このなかの、左端のアイコン(=ペン)、または左から2番目のアイコン(=ペン)をクリックすると、描画する線の太さ/色/種類を選択するためのグレーの四角形が出てきます。

グレーの四角形の右下のほうにある矢印アイコンをクリックしてから画像上をマウスでドラッグすると、その長さの矢印が自動で描画されます。

描画した矢印を消すには、ツールの右から2番目にある消しゴムのアイコン(マークアップの削除)をクリックしてから、消したい矢印をマウスで触るだけです。

描画が終わったら、右上の「保存オプション」のボタンから保存の操作をして終了です。

*1:このアプリは、Windowsの画面上での名前は「フォト」という表記です。

*2:対象の画像を開くための「既定のアプリ」として「フォト」を指定済みであれば、「エクスプローラ」などで対象の画像ファイルをダブルクリックすると単独のウィンドウが開きます。

記事にするほどでもない小技集(16)


〈目次〉


Dynalistのノードをランダムに開くブックマークレット

Dynalistをブラウザで開いている状態で実行すると、そのときの画面上に含まれている項目(ノード)のうちの1つを無作為に選び、その項目に"Zoom in"します。
「画面上における最上位の項目」も対象に含みます。
「上位階層の下に折り畳まれているので見えていない項目」は対象外です。
実行時にブラウザで開いているDocumentのみが対象です。

例えば、Dynalistに下記のような階層構造があり、ブラウザでAを開いているときに実行すると、A-Gの全てが対象になります。
Bを開いているときに実行すると、B-Dが対象になります。

  • A
    • B
      • C
      • D
    • E
      • F
      • G

コード gist.github.com

「カーソルがある行の上側に空行を作り、カーソルをそこへ移す」ショートカットキー(WindowsのAutoHotKeyを使用)

「文字を入力する行が最上部にあり、そこから下に向かって「新→旧」の順序で行が並ぶ」という書き方ができる。

AutoHotKeyをインストールしてあるWindowsにて、下記のコードを実行している間だけ適用される。

^Enter::  ;ホットキーは"Ctrl+Enter"
    Send, {Up}{End}{Enter}  ; ↑+End+Enter
return

再生中のSpotifyの音量変更をApple Watchからできないときの対処法

Spotifyで音楽などを再生しているとき、そのSpotifyと同じアカウントで使用しているApple WatchのSpotifyアプリを開いてデジタルクラウンを回すと、Spotifyの音量変更ができますが、時々、それができない場合があります。その対処法を紹介します。


(Apple WatchのSpotifyアプリ。右上にある緑色の縦棒が音量を示しており、デジタルクラウンの回転で音量が増減する)

デジタルクラウンを回しても音量変更ができないときは、Apple WatchのSpotifyアプリの再生画面の右下にあるアイコンをタップし、


(この右下のアイコン)

次の画面で、再生中の機器を示すアイコンをタップします。

そのうえでデジタルクラウンを回せば、音量の増減ができます。

PCのブラウザでWorkFlowyへの文字入力が中断するときのチェックポイント

Windows PCのウェブブラウザでWorkflowyを開き、そこへ日本語を入力しているとき、入力が勝手に中断したり、変換候補から確定した文字が入力されない場合があります。*1

筆者の経験上ですが、これが発生する条件はこちらの2通りです。

  • 同じブラウザで、タブとサイドバーの両方にWorkflowyを開く
    • サイドバーとは、例えばVivaldiの「パネル」や、floorpの「ブラウザーマネージャーサイドバー」。
    • サイドバーそのものを見えないように閉じているときにも起こる。
  • 別々のブラウザーのそれぞれにWorkflowyを開く

なお、同じブラウザの2つのウィンドウにWorkflowyを開いている場合なら、このような問題は起こらないようです(おそらく、ウィンドウが3つ以上でも同様でしょう)。
したがって、PCのブラウザで同時に複数のWorkflowyを開いて文字入力をしたい場合は、「同じブラウザで複数のウィンドウのそれぞれに開く」というのが、文字入力のトラブルを防ぐ選択肢だと思います。

Windows PCに接続しているBluetoothイヤホンの音が途切れるときのチェックポイント:WindowsとスマートフォンとのBluetooth接続を切ってみる

Windows PCに接続しているBluetoothイヤホンから出る音が途切れるとき、そのWindowsとスマートフォンとがBluetoothで接続されているなら、その接続を切ってみると、イヤホンからの音の途切れが直る場合があるようです。

筆者は下記の環境で経験しました。

  • Windows 11 Home 23H2
    • iPhone 12(iOS 17.5.1)をBluetoothで接続している状態
  • Sony WF-1000XM4(接続相手は上掲のWindows PCのみ)

IFTTTのウィジェットをApple Watchに表示するかどうかを個別に設定する方法

iPhoneのIFTTTアプリの右下にある「プロフィール」の画面にある「ウィジェット」をタップ。

次の画面に、作成済みのウィジェットの一覧があるので、設定したいウィジェットをタップ。

次の画面で、「Apple Watchに表示」のところをオン/オフして切り替えます。

Dynalistのバックアップをスマートフォンでダウンロードする方法

ZIP形式のバックアップをスマホでダウンロードするには、Dynalistにブラウザでログインした状態でhttps://dynalist.io/backupを開きます。

*1:IMEとしてGoogle日本語入力 / Microsoft IME / ATOK for Windowsを使用し、いずれでも経験しています。

Apple Watchのアップデートが「準備中」から先へ進まないときに対策として行ったこと

Apple Watch(watchOS)のアップデートが「準備中」という表示になったまま先へ進まなくなったときに、対策として行ったことをメモ的に書いておきます。
下記の対策をとることでアップデートが成功しました(watchOS 10.5の直前のバージョンから、10.5へ)。

ただし、いかなる場合でもこの対策が有効であるとか、余分な手順は一つも混ざっていないといったような確証は持っておりません。あくまでも筆者の経験のメモですので、参考情報として受け取って下さい。

環境

対策

こちらの1~5の順で操作します。

  1. Apple Watchを再起動する(サイドボタンとデジタルクラウンを同時に長押しする)。
  2. Apple Watchを充電器に接続して、充電されている状態にする。
  3. iPhoneWatchアプリにて「一般」→「ストレージ」と進む。その画面に表示されているアプリの一覧のなかに「watchOS」が存在していれば、それをタップ。次の画面で「削除」をタップする。*1
  4. iPhoneWatchアプリにて「一般」→「ソフトウェアアップデート」と進み、「自動アップデート」を「オフ」にする。
  5. そのまま数十分ほど放置しておくと、watchOSのダウンロードとインストールが完了する。

以上です。


*1:ここで削除されるものは、Apple Watchにすでにインストールされて現に稼働しているwatchOSではありません。