モバイル・ゲートウェイ/モバイル用ホームページ整形

From mediawiki.org
This page is a translated version of the page Mobile Gateway/Mobile homepage formatting and the translation is 84% complete.

Main pages of MediaWiki instances which go beyond traditional text (for example using two column layouts) usually require special treatment to display on mobile via Extension:TemplateStyles in responsive skins such as Skin:Timeless and Skin:Minerva .

もし皆さんのウィキメディア・プロジェクトでメインページ(ホームページ)の整形をモバイル端末(スマートフォンやタブレットなど)の閲覧に対応していない場合、さらにそのプロジェクト管理者があなたである場合は、以下の手順に従って対処をお願いします。

留意点:多くの場合、メインページの編集には管理者権限が必須です。

モバイル版でコンテンツを非表示にする

最初に、モバイル用のホームページに適したコンテンツを決めてください。

下記の要点によって、デスクトップ版のページのコンテンツ(「今日の一枚」など)を評価します。

  • どれくらい人気か。
  • 定期的に更新されているか。
  • ざっと読みに適しているか。
  • モバイルの画面にうまく適しているか。

どのコンテンツが理に適っているか決めたら、手順2に進みます。

以下を行うためには、ログインして管理権限を持たなければなりません。ホームページをデスクトップ表示に切り替え、「編集」 をクリックして携帯端末向けの表示に加えるコンテンツを選びます。

各コンテンツの中で、ページから非表示にしたいものに nomobile クラスを追加するか、このクラスを持つ要素の子要素となるようにします。

<div class="nomobile"> ... </div>

div タグの開始タグと終了タグの間に入れるものとは? おそらく「今日の一枚」など、ページに表示するコンテンツ用のテンプレートがあるはずです。

レスポンシブスタイルの使用

一部のスタイルは、モバイル版に適していません(フレンドリーではない)。例えばCSSの指定においてwidth(幅)、height(高さ)、padding(余白)などをピクセル値固定で指定した場合です。もしスタイル指定を変更する必要があれば、Extension:TemplateStyles を用いたり、MediaWiki:Common.cssMediaWiki:Mobile.css にて指定します。 TemplateStyles is recommended but 3rd parties may wish to use the MobileFrontend feature flag $wgMFSiteStylesRenderBlocking.

For common problems with table based layouts, you can use the styles in the Minerva compatiblity template.

MediaWikiをモバイルに適したものにする には、共通する問題に対するいくつかのヒントが紹介されています。

「ページを保存」をクリックします。

変更は必ず全て確認をしてください!