🦔

RのShinyアプリでファビコンを設定する方法

2023/06/02に公開

ファビコン(Favicon)とは

ブラウザのタブに表示されるアイコン(赤丸)のことです。16px × 16pxなどの画像データで、拡張子は.icoです。ファビコンの作り方は他サイトを参照ください。

実装方法

ファビコンを表示するためだけのソースコードを下に載せておきます。実際に動かすときはファビコン(.ico)を別途用意してください。

ファビコンの置き場所

ファイルの置き場所には注意が必要です。以下のようにwww/の中にしまってください。これを知らず苦戦しました。
ちなみにルートディレクトリに置いてwww/からの相対パスで渡すことも試しましたがダメでした。大人しくルールに従いましょう。

./
├─ www/
│  └─ favicon.ico
├─ server.R
└─ ui.R  

仕組み

tags$head(tags$link(rel = "shortcut icon", href = "favicon.ico"))が核になります。
tagsを使ってhtmlタグを直接差し込んでいます。今回のコードだと以下のようなタグを差し込むことになります。htmlを書く人からしたらただ単にファビコンの設定をしていると分かるでしょう。

<head>
  ~~~
  <link rel="shortcut icon" href="favicon.ico">
  ~~~
<head>

まとめ

RのShinyでファビコンを設定する方法を解説しました。細かい内容ですが、こういったところを設定すると、丁寧に開発している印象を持ってもらえると思います。
おしゃれなアイコンを作ってモチベーション上げていきましょう(デザインセンスは別途用意してください)。

ソースコード

server.R
library(shiny)

shinyServer(
  function (input, output, session) {
  }
)
ui.R
library(shiny)

shinyUI(
  fluidPage(
    tags$head(tags$link(rel = "shortcut icon", href = "favicon.ico")),
    "Hello, world!"
  )
)

Discussion