web-dev-qa-db-ja.com

FirefoxでHelvetica、TimesなどのMS TrueTypeフォントを使用するにはどうすればよいですか?

私はUbuntuワークステーションで(Windows)TrueTypeフォントを使用しています( details )。デスクトップアプリとWeb(Firefoxを使用)の両方でフォントがどのように表示されるかについてはほとんど満足しています。

ただし、一部のWebページでは、 このような 、フォントは完全に吸い込まれます。

screenshot

そのサイトのCSSで理由がHelveticaであることがわかりました。

font-family: Helvetica,Arial,Tahoma,sans-serif;

Firebugを使用して、そのリストからHelveticaを削除すると、Arialが使用され、すべてが再び見栄えがします。

alt text

私の質問は、Helvetica(またはTimes、または他のそのようなフォント)を使用するWebページを自動的に見栄えよくする方法です。言い換えると、TimesおよびHelveticaフォントファミリーをセリフおよびサンセリフのデフォルト(私の場合はそれぞれTimes New RomanおよびArial)にマップする方法は?

このシナリオでFirefoxにMSTrueTypeフォントを使用させるソリューションに興味があります。これは、FirefoxのUbuntuフォント構成またはカスタムCSSルール(または現在私が知らない何か)の調整に基づいているかどうかは関係ありません。

更新:問題は完全に解決されました-この回答私がする必要があることを説明します。

8
Jonik

編集:同僚から画期的なアドバイスを受けた後、この回答を完全に更新しました。

これが私が/etc/fonts/local.conf<fontconfig>要素内)に挿入したものです:

<!-- Replace Helvetica with Arial -->
<match target="pattern">
    <test qual="any" name="family">
        <string>Helvetica</string>
    </test>
    <edit name="family" mode="assign" binding="strong">
        <string>Arial</string>
    </edit>
</match>    

Times-> Times NewRomanについても同様です。 (私の完全なlocal.confここ を参照してください。)重要なのは、<edit>要素にbinding = "strong"を使用することでした。 (また、「assign」の代わりに「assign_replace」モードを使用すると、攻撃的すぎることを除いて、同様のことが発生します。VerdanaもArialに置き換えられます)。

フォント構成の変更はすぐに有効になります。 Firefoxでのテストに加えて、次のように機能することを確認できます。

$ fc-match helvetica
Arial.ttf: "Arial" "Normal"

問題が発生した場合の最善のヘルプは、man fonts-confの近くにあります。 (ドキュメントがあっても、フォントシステムの動作はやや複雑で扱いにくいように見えました。)次のようなコマンドを使用して、実際に何が起こっているのかを「デバッグ」することもできます。

FC_DEBUG=4 fc-match helvetica

さらに、FC_DEBUG=1024 fc-match helveticaは、フォントの一致に影響を与える構成ファイルのリストを表示します。

8
Jonik

Operaでも同様の問題が発生しました。その解決策は、構成で「CoreXFonts」を無効にすることでした。 Firefoxに同様のオプションがあるかどうかを確認することをお勧めします。

別のオプション:

  • 「Helvetica」というフォントがインストールされていないことを確認してください。同じようなことが何度か起こりました。 IIRCの問題のあるフォントは、システムフォントフォルダ(100dpiだと思います)の75dpiおよび/usr/local/share/fontsというフォルダにありました。それらのフォルダを完全にそこから移動しました。
  • [システム]> [環境設定]> [外観]> [フォント]でデフォルトを確認します。
  • 設定>コンテンツでFirefoxのデフォルトを確認してください。

コアフォルダに変更を加える場合は、次の方法でフォントキャッシュを再構築する必要があります。

Sudo fc-cache -f -v
1
DisgruntledGoat

とにかくそのスクリプトに「Grant」を追加する必要があります...

Greasemonkey 1.0は、特別なメタデータブロック命令@grantを追加します。

_If a script does not specify any @grant values, Greasemonkey 1.0-1.9 will attempt to auto-detect the right settings. From GreaseMonkey 2.0, @grant none is assumed by default, if no other values are specified.[1]
If a script specifies any values (or they were auto detected), then it will be provided with only those API methods that it declares.
    The valid values are unsafeWindow, and the names of those GM_ prefixed values that you wish your script to be granted access to.
Otherwise the script will be granted no special API privileges, and thus run without the security constraints Greasemonkey scripts have traditionally had. If you want your script to operate in this mode, you should explicitly declare @grant none.
_

スクリプト(最後にカウントしたときに半分以上)が特別なAPIをまったく使用しないのは一般的です。このようなスクリプトの場合、特別な特権を付与しないように明示的に要求することは、スクリプトがコンテンツページで直接実行されることを意味します。これは、セキュリティサンドボックスがなく、その制限もないことを意味します。したがって、ページ内の変数へのアクセス、関数の呼び出し、およびその結果の読み取りも機能します。これを行うには、単純に:

_// ==UserScript==
// @name        Grant None Example (can be omitted since GM 2.0)
// @include     http*
// @grant       none
// ==/UserScript==
console.log('This script grants no special privileges, so it runs without security limitations.');
_

GreasemonkeyのAPIのいずれかを使用する場合は、スクリプトに付与するように明示的に要求する必要があります。

_// ==UserScript==
// @name        Grant Some Example
// @include     http*
// @grant       GM_getValue
// @grant       GM_setValue
// ==/UserScript==

var counter = GM_getValue('counter', 0);
console.log('This script has been run ' + counter + ' times.');
GM_setValue('counter', ++counter);
_

この場合、スクリプトは、_GM_getValue_と_GM_setValue_の両方へのアクセスを各_@grant_行に1つずつ許可するように要求しています。アクセスを許可するGreasemonkeyAPIの名前を指定します。 (すべてのスクリプトは、特に要求せずに常に_GM_info_を取得します。)一時的に、これも機能します。

_// ==UserScript==
// @name        Grant Legacy Example
// @include     http*
// ==/UserScript==

var counter = GM_getValue('counter', 0);
console.log('This script has been run ' + counter + ' times.');
GM_setValue('counter', ++counter);
_

この例は、Greasemonkeyバージョン1.0で機能します。 @grant行がない場合、Greasemonkeyは使用されているAPIを検出しようとし、それらの@grant行が指定されているかのように動作します。この検出は、特定の場合、特にeval()が使用されている場合に失敗する可能性があります。

このため、@ grantの前に記述されたすべてのスクリプトは引き続き機能するはずですが、スクリプトを変更して、将来的に壊れないように、できるだけ早く@grantを指定する必要があります。互換性レイヤー

Greasemonkey APIの多くは、DOMStorageなどのWeb標準によって複製されています。スクリプトが単一のドメインでのみ動作することを期待している場合は、@ grant noneを使用して、互換性を向上させることで、すぐに欠点をなくすことができます。 @requireライブラリを使用するだけで、現在標準のブラウザ機能を備えたGreasemonkeyAPIをエミュレートできます。

_// ==UserScript==
// @name        Grant None Example, With Shim
// @include     http://www.example.com/*
// @grant       none
// @require     https://Gist.githubusercontent.com/arantius/3123124/raw/grant-none-shim.js
// ==/UserScript==

var counter = GM_getValue('counter', 0);
console.log('This script has been run ' + counter + ' times.');
GM_setValue('counter', ++counter);
_

このスクリプトは、grant none shimが標準のブラウザー機能を備えたAPIエミュレーションを提供していることを除いて、上記の例と同じように機能します。シム互換性レイヤーがスクリプトに対して十分に機能する場合、これは両方の長所です。範囲

付与なしの場合でも、ユーザースクリプトには、コンテンツページのグローバルスコープとは異なり、独自のグローバルスコープがあります。これは、トップレベルの_var x = 1;_がコンテンツスコープに表示されないため、ページが壊れないことを意味します(つまり、異なる値を持つ変数xに依存している場合)。コンテンツスコープに値を書き込むには、_window.x = 1;_を実行します。

JQueryのバージョンを_@require_すると、暗黙的に_window.$_と_window.jQuery_に割り当てられます。実行しているページがjQueryの異なるバージョンに依存している場合、これによりページが破損する可能性があります。この問題を回避するには、スクリプトのトップレベルのどこでも次のようにします。

_this.$ = this.jQuery = jQuery.noConflict(true);
_

このコードは、jQuery参照(これに、grant noneモードで実行している場合のスクリプトのグローバルスコープ)を保存し、ウィンドウ(コンテンツグローバルスコープ)から削除して、元々そこに保存されていたものを復元します。

0
BANED4NOREASON

疑問に思っているのですが、ローカルフォントと@font face cssを使用できますか?

0
alpha1

Greasemonkey はあなたの質問の解決策の1つになります。このアドオンをインストールすると、Webページをカスタマイズしたり、フォントを変更したりできます。

フォントをHelvitaに変更する1つのサンプルスクリプト

// ==UserScript==
// @name           Google Reader Font in Helvetica and enlarged
// @version        1.0
// @creator        Joe
// @description    Changes the font family and size from Google Reader page
// @namespace      userscripts.org
// @include        https://www.google.com/reader/*
// @include        http://www.google.com/reader/*

// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

addGlobalStyle('.entry-body{font-family:Helvetica;font-size:110%;line-height:150%;}');
addGlobalStyle('A.entry-title-link {font-family:Helvetica;font-size: 20px;}');
0
ukanth