Firefoxの“Downthemall!”の代わりになる拡張機能(アドオン)の紹介

Firefox拡張機能Download Starは、Downthemall!の代わりになります。

インストールと使い方

FirefoxDownload Starのページを開き、「Firefoxへ追加」のボタンをクリックしてインストールすると、FirefoxツールバーにDownload Starのアイコンが表示されます。

f:id:ichbin:20190413141538p:plain

コンテンツをダウンロードしたいウェブページをFirefoxで開き(ここでは例としてUnsplashのトップページを開いています)、Download Starのアイコンをクリックすると、ポップアップが表示されます。

f:id:ichbin:20190413140642p:plain

このポップアップ内で、保存先フォルダの指定や、保存対象にするファイルの指定などをします。
保存対象にするファイルは、ファイルの種類や名前で絞り込むことができます。
右上のボタン(赤矢印のところ)をクリックすると、ダウンロードが実行されます。

f:id:ichbin:20190413141313p:plain

備考

ポップアップを表示させた状態で、キーボードでControl+Aのショートカット(「すべて選択」のショートカット)を押すと、ポップアップの中に表示されているダウンロード対象のファイルのURLをテキストとして選択できます。これをControl+Cでコピーすれば、URLのみを取得することもできます。ただしURLが長い場合は、右端が「…」という記号で省略されてしまうので、コピーしても正確なURLにはなりません。

f:id:ichbin:20190413142346p:plain
(ポップアップを表示させてControl+Aを押した状態)

Android端末のナビゲーションバーがタップできなくなったときの代替方法

Android端末のナビゲーションバーというのは、画面の下端の、このような部分のことです。

f:id:ichbin:20190329171325p:plain

このナビゲーションバーがタップできなくなったときに、その代わりになる方法を紹介します。


〈目次〉


全体のしくみ

本来のナビゲーションバーに表示されるボタンは、Androidのバージョンによって異なるようですが、下記のようなボタンはSwiftly Switchというアプリで実現できます。

  • 戻る
  • ホームを表示
  • 起動しているウィンドウを並べて表示
  • 音量を変える
  • スクリーンショットを撮る

Swiftly Switchを起動すると、こちらの画像にあるように、「戻る」などのボタンをAndroid端末の画面の端に、半円状もしくはグリッド状に表示させることができます。この機能を、ナビゲーションバーの代わりとして使うことができます。

設定の手順

Swiftly SwitchAndroid端末にインストールして起動します。

起動すると、画面上部に、GEERAL, EDGE1, EDGE2, EDGE3というタブがあります。
EDGE1, EDGE2, EDGE3のうちの少なくともどれか1つにおいて、「有効」のところをオンにします。

f:id:ichbin:20190329112149p:plain

その下の「モード」のところをタップして、ボタン(アイコン)の表示のさせ方(並べ方)を選択します。
並べ方には次の3通りがあります。

  • Recent app および Circle Favorites:半円の円周上に並べる
  • Quick action:Recent app や Circle Favoritesの半円よりも一回り大きい半円の円周上に並べる
  • Grid Favorites:グリッド状(碁盤の目状)に並べる

次に、画面上部のGENERALのタブをタップします。

f:id:ichbin:20190329113219p:plain

ここに表示されている、Recent app, Quick actions, Grid Favorites, Circle Favoritsという上述の4つのモードのそれぞれをタップすると、それぞれのモードで表示するボタンを指定する手順に入ります。

その手順を、それぞれのモードごとに説明します。

Recent app および Circle Favorites

画面上部にアイコンがこのように数個並んでいるので、そのうちの1つをタップします。

f:id:ichbin:20190329113521p:plain

白いポップアップが出てくるので、「ショートカット」をタップ。

f:id:ichbin:20190329113618p:plain

この画面に変わるので、上部の「アクション」のタブをタップ。

f:id:ichbin:20190329114010p:plain

すると、この画面になります。

f:id:ichbin:20190329114304p:plain

f:id:ichbin:20190329114323p:plain

上述のナビゲーションバーにあるべきボタンと同じ機能のものが、この中に含まれていますので、画面上に表示させたいものを1つタップしたうえで、右下の“OK"をタップします。

Quick Actions

上述のRecent appと同様に、画面上部にあるアイコンのうちのどれか1つをタップします。

f:id:ichbin:20190329104835p:plain

ポップアップの中から「アクション」をタップ。

f:id:ichbin:20190329105017p:plain

すると、割り当てることができる機能(アクション)を選択する画面になります。この中に、上述のナビゲーションバーにあるべきボタンも含まれています。

f:id:ichbin:20190329105108p:plain

画面に表示させたいものをタップします。

Grid Favorits

このようにグリッド状に表示されているアイコンのうちのどれか1つをタップします。

f:id:ichbin:20190329115032p:plain

白いポップアップが出てくるので、「ショートカット」をタップ。

f:id:ichbin:20190329171431p:plain

この画面に変わるので、上部の「アクション」のタブをタップ。

f:id:ichbin:20190329114010p:plain

すると、この画面になります。

f:id:ichbin:20190329114304p:plain

f:id:ichbin:20190329114323p:plain

上述のナビゲーションバーにあるべきボタンと同じ機能のものが、この中に含まれていますので、画面上に表示させたいものを1つタップしたうえで、右下の“OK"をタップします。

備考

  • Swiftly Switchは、インストール後にはAndroid端末の起動時に自動で起動するはずですが、もし自動で起動しないようであれば、Androidの設定画面にて「自動起動するアプリケーション」にSwiftly Switchが含まれるようにしてください。
  • Swiftly Switchには、この記事で紹介した点以外にも設定項目が多数あります。このアプリを快適に使うためには、それらの設定をデフォルトの状態から何ほどか変える必要があるかもしれません。それらのすべてをこの記事で説明することは控えますので、他のサイトで探してみてください。

Chrome / Firefoxの拡張機能 Stylus の基本的な使い方

ウェブブラウザ(Chrome / Firefox)の拡張機能である“Stylus"の使い方の基本的なところを解説します。


〈目次〉


インストール

Chrome

ChromeウェブストアのStylusのページを開き、「Chromeに追加」のボタンを押してインストール。

f:id:ichbin:20190308112938p:plain

Firefox

Stylusのページを開き、「Firefoxへ追加」のボタンを押してインストール。

f:id:ichbin:20190308113054p:plain

「インストール済みのスタイル」を管理する画面を開く

ツールバーに表示されているStylusのアイコンをマウスでクリックし、「管理」のボタンをクリック。*1

f:id:ichbin:20190310135810p:plain

「インストール済みのスタイル」という画面が開きます。

f:id:ichbin:20190308114227p:plain

新しくスタイルシートを作成する

上述の「インストール済みのスタイル」という画面にて、左側にある「新スタイルを作成」のボタンをクリック。

f:id:ichbin:20190308134109p:plain

「スタイルを追加」という画面が開きます。

f:id:ichbin:20190308143405p:plain

左上の「名前を入力してください」と書かれている欄に、このスタイルシートの名前を自由に入力します。
右上の「コード1」という入力欄に、スタイルシートCSS)を入力します。

このスタイルシートを、例外なくすべてのウェブページに適用させたい場合は、左上の「保存」ボタンを押します。設定はそれで完了です。
特定のウェブサイトやウェブページにのみ適用させたい場合は、下記の手順を実行します。

適用先を指定する

「コード1」に入力したスタイルシートを適用する対象(ウェブサイトや特定のURL)を指定する手順です。
「コード1」の入力欄の下にある「+」のアイコンをクリックすると、

f:id:ichbin:20190308135301p:plain

下記の画像のように選択肢が表示されるので、どれか1つを選び、

f:id:ichbin:20190308134928p:plain

「コード1」に入力したスタイルシートを適用させたいウェブサイトやウェブページが適用対象に含まれるように、右側の入力欄にURLやドメインを入力します。
例えば、Twitterを適用対象にしたい場合は、このように書くことができます。*2

f:id:ichbin:20190308135719p:plain

この入力欄の右側にある「+」のアイコンをクリックすれば、適用先を指定するための新しい入力欄がここに追加されます。

ここまで終えたら、左上の「保存」ボタンを押します。

f:id:ichbin:20190308140401p:plain

「保存」ボタンを押した後は、この画面は閉じてもかまいません。

作成済みのスタイルシートを編集または削除する

「インストール済みのスタイル」の画面で右側に表示されている各スタイルの名前をクリックすると、「スタイルを編集」という画面に入ります。
名前の右側に表示されている×のアイコンをクリックすると、そのスタイルを削除できます。

f:id:ichbin:20190308120818p:plain

適用のオン/オフを切り替える

ツールバーから切り替える

上述の手順で作成したスタイルシートの適用先(この例ではhttp://twitter.com/で始まるURL)に当てはまっているウェブページをブラウザで開いた状態で、ブラウザのツールバーに表示されているStylusのアイコンをマウスでクリックします。

f:id:ichbin:20190308144442p:plain

このウェブページに適用されているスタイルシートの名前が表示されており、それぞれの行頭に、適用のオン/オフを切り替えるチェックボックスがあります。

「インストール済みのスタイル」の画面から切り替える

上述の「インストール済みのスタイル」の画面にて、各スタイルシートの名前の左側にあるチェックボックスにチェックを入れるとオン、外すとオフとなります。

f:id:ichbin:20190308143206p:plain

*1:ブラウザのメニューから開く方法もありますが、説明は割愛します。

*2:この例では、選択肢として「次で始まるURL」を選んでいますが、その他の選択肢を選ぶこともでき、各選択肢に応じて右側の入力欄に入力すべき文字列が異なります。