wordpressでパネルに小・中サイズは設定できるのですが、
大サイズ(横長・正方形)が設定できません。
manifest.jsonには
json
1{ 2 "manifest_version": 2, 3 "version": "1.0.0", 4 "icons": [ 5 { 6 "src": "\/images\/favicon-144x144.png?v2", 7 "sizes": "144x144", 8 "type": "image\/png" 9 }, 10 { 11 "src": "\/images\/favicon-152x152.png?v2", 12 "sizes": "152x152", 13 "type": "image\/png" 14 }, 15 { 16 "src": "\/images\/favicon-256x256.png?v2", 17 "sizes": "256x256", 18 "type": "image\/png" 19 } 20 ], 21 "theme_color": "#e1fffe", 22 "display": "standalone" 23} 24
browserconfig.xml
xml
1<?xml version="1.0" encoding="utf-8"?> 2<browserconfig> 3 <msapplication> 4 <tile> 5 <square70x70logo src="images/small.png?v2"/> 6 <square150x150logo src="images/medium.png?v2"/> 7 <wide310x150logo src="images/wide.png?v2"/> 8 <square310x310logo src="images/large.png?v2"/> 9 <TileColor>#e1fffe</TileColor> 10 </tile> 11 </msapplication> 12</browserconfig>
headerには下記を記述しています。
html
1<link rel="icon" href="<?php echo get_template_directory_uri(); ?>/images/favicon.ico?v2"> 2<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="<?php echo get_template_directory_uri(); ?>/images/favicon.ico?v2"> 3<link rel="manifest" href="<?php echo get_template_directory_uri(); ?>/manifest.json"> 4<meta name="application-name" content="<?php echo bloginfo(name); ?>"> 5<meta name="msapplication-square70x70logo" content="<?php echo get_template_directory_uri(); ?>/images/small.png"> 6<meta name="msapplication-square150x150logo" content="<?php echo get_template_directory_uri(); ?>/images/medium.png"> 7<meta name="msapplication-wide310x150logo" content="<?php echo get_template_directory_uri(); ?>/images/wide.png"> 8<meta name="msapplication-square310x310logo" content="<?php echo get_template_directory_uri(); ?>/images/large.png"> 9<meta name="msapplication-config" content="<?php echo get_template_directory_uri(); ?>/browserconfig.xml"> 10<meta name="msapplication-TileColor" content="#e1fffe"> 11<meta name="msapplication-TileImage" content="<?php echo get_template_directory_uri(); ?>/images/favicon-144x144.png?v2"> 12<link rel="mask-icon" href="<?php echo get_template_directory_uri(); ?>/images/safari-pinned-tab.svg?v2" color="#00271a">
アンドロイドやiphonには表示できているようなのですが、
開発者ツールで確認したところ、パスに間違いはありませんでした。
どうすれば大きいサイズのタイルも設定できるようになりますか?
また、browserconfig.xmlやmanifest.jsonへのパスは必要でしょうか?
少しメモ
xml
1<?xml version="1.0" encoding="utf-8"?> 2<browserconfig> 3 <msapplication> 4 <tile> 5 <square70x70logo src="http://sample.com/small.png"/> 6 <square150x150logo src="http://sample.com/medium.png"/> 7 <wide310x150logo src="http://sample.com/wide.png"/> 8 <square310x310logo src="http://sample.com/large.png"/> 9 <TileColor>#eeeeee</TileColor> 10 </tile> 11 </msapplication> 12</browserconfig> 13
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。