ブログ・サイトへの埋め込み

食品の栄養カード、食品の比較、栄養素ランキング、チェーン店メニューのランキングを、記事に貼り付けられます。無料です。

食品の栄養カード

エネルギー・たんぱく質・脂質・炭水化物・食塩相当量を、100gあたりと1人前で表示します。各食品ページの「このデータをブログに埋め込む」から、その食品のコードを取得できます。

埋め込みコード(数値は自動で最新に)

<iframe src="https://calories.jp/embed/food/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%80%E3%81%AD-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F" style="width:100%;border:0;height:790px"
        loading="lazy" title="にわとり 若どり むね 皮なし 生"></iframe>
<p style="margin:4px 0 0;font-size:12px">出典: <a href="https://calories.jp/food/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%80%E3%81%AD-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F">calories.jp「にわとり 若どり むね 皮なし 生」</a></p>
<script>
addEventListener("message", function (e) {
  if (e.origin !== "https://calories.jp" || !e.data || e.data.caloriesJp !== "height") return;
  var fs = document.querySelectorAll('iframe[src^="https://calories.jp/embed/"]');
  for (var i = 0; i < fs.length; i++)
    if (fs[i].contentWindow === e.source) fs[i].style.height = e.data.height + "px";
});
</script>

HTMLコード(iframeが使えないブログ向け)

<table>
<caption>にわとり 若どり むね 皮なし 生</caption>
<tr><th></th><th>100gあたり</th><th>1枚の1/2(120g)</th></tr>
<tr><th>エネルギー</th><td>105 kcal</td><td>126 kcal</td></tr>
<tr><th>たんぱく質</th><td>23.3 g</td><td>28.0 g</td></tr>
<tr><th>脂質</th><td>1.9 g</td><td>2.3 g</td></tr>
<tr><th>炭水化物</th><td>0.1 g</td><td>0.1 g</td></tr>
<tr><th>食塩相当量</th><td>0.1 g</td><td>0.1 g</td></tr>
</table>
<p style="margin:4px 0 0;font-size:12px">出典: <a href="https://calories.jp/food/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%80%E3%81%AD-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F">calories.jp「にわとり 若どり むね 皮なし 生」</a>(文部科学省 日本食品標準成分表)</p>
<p style="margin:2px 0 0;font-size:11px">※数値は可食部100gあたりの目安で、実際の値は品種や調理法などによって変わります。医学的・栄養学的な助言ではありません。</p>

表示例

HTMLコード(iframeが使えないブログ向け)

にわとり 若どり むね 皮なし 生
100gあたり1枚の1/2(120g)
エネルギー105 kcal126 kcal
たんぱく質23.3 g28.0 g
脂質1.9 g2.3 g
炭水化物0.1 g0.1 g
食塩相当量0.1 g0.1 g

出典: calories.jp「にわとり 若どり むね 皮なし 生」(文部科学省 日本食品標準成分表)

※数値は可食部100gあたりの目安で、実際の値は品種や調理法などによって変わります。医学的・栄養学的な助言ではありません。

HTMLコードは貼り付けるブログのデザインで表示されるため、見た目はこの例と少し変わります。

食品の比較

2つの食品を100gあたりで並べて比べます。出典リンクは両方の食品ページを指します。

埋め込みコード(数値は自動で最新に)

<iframe src="https://calories.jp/embed/compare/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%80%E3%81%AD-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%82%E3%82%82-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F" style="width:100%;border:0;height:540px"
        loading="lazy" title="にわとり 若どり むね 皮なし 生とにわとり 若どり もも 皮なし 生の比較(100gあたり)"></iframe>
<p style="margin:4px 0 0;font-size:12px">出典: <a href="https://calories.jp/food/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%80%E3%81%AD-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F">calories.jp「にわとり 若どり むね 皮なし 生」</a>、<a href="https://calories.jp/food/%E3%81%AB%E3%82%8F%E3%81%A8%E3%82%8A-%E8%8B%A5%E3%81%A9%E3%82%8A-%E3%82%82%E3%82%82-%E7%9A%AE%E3%81%AA%E3%81%97-%E7%94%9F">calories.jp「にわとり 若どり もも 皮なし 生」</a></p>
<script>
addEventListener("message", function (e) {
  if (e.origin !== "https://calories.jp" || !e.data || e.data.caloriesJp !== "height") return;
  var fs = document.querySelectorAll('iframe[src^="https://calories.jp/embed/"]');
  for (var i = 0; i < fs.length; i++)
    if (fs[i].contentWindow === e.source) fs[i].style.height = e.data.height + "px";
});
</script>

表示例

栄養素ランキング

ある栄養素が多い食品の上位10件です。実測値だけで順位を付けています。各ランキングページからコードを取得できます。

埋め込みコード(数値は自動で最新に)

<iframe src="https://calories.jp/embed/nutrient/protein" style="width:100%;border:0;height:800px"
        loading="lazy" title="たんぱく質が多い食品ランキング"></iframe>
<p style="margin:4px 0 0;font-size:12px">出典: <a href="https://calories.jp/nutrient/protein">calories.jp「たんぱく質が多い食品ランキング」</a></p>
<script>
addEventListener("message", function (e) {
  if (e.origin !== "https://calories.jp" || !e.data || e.data.caloriesJp !== "height") return;
  var fs = document.querySelectorAll('iframe[src^="https://calories.jp/embed/"]');
  for (var i = 0; i < fs.length; i++)
    if (fs[i].contentWindow === e.source) fs[i].style.height = e.data.height + "px";
});
</script>

表示例

調理前・調理後の重さを換算

生の重さから、ゆで・焼きなど調理後の重さとカロリーを換算します(文部科学省の重量変化率)。

埋め込みコード(数値は自動で最新に)

<iframe src="https://calories.jp/embed/cooking-yield" style="width:100%;border:0;height:470px"
        loading="lazy" title="調理前・調理後の重さを換算"></iframe>
<p style="margin:4px 0 0;font-size:12px">出典: <a href="https://calories.jp/cooking-yield">calories.jp「調理前・調理後の重さを換算」</a></p>
<script>
addEventListener("message", function (e) {
  if (e.origin !== "https://calories.jp" || !e.data || e.data.caloriesJp !== "height") return;
  var fs = document.querySelectorAll('iframe[src^="https://calories.jp/embed/"]');
  for (var i = 0; i < fs.length; i++)
    if (fs[i].contentWindow === e.source) fs[i].style.height = e.data.height + "px";
});
</script>

表示例

利用について