RecipeKit Svelte widget manual install snippet (auto-synced)

recipekit-svelte.liquid

{% comment %}RecipeKit Svelte Widget v1.6.6{% endcomment %}
{%- assign rk_settings = shop.metafields.recipekit.settings -%}
  {%- assign rk_lang = shop.metafields.recipekit.rk_lang -%}
  {%- assign rk_recipe_id = blank -%}
  {%- assign rk_mf = blank -%}
  {%- if article -%}
    {%- assign rk_resource_id = article.id | downcase -%}
    {%- assign rk_type = article.metafields.recipekit[rk_resource_id].type -%}
    {%- if rk_type == 'json' -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id].value -%}
    {%- else -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id] -%}
    {%- endif -%}
    {%- if rk_mf != blank -%}
      {%- assign rk_recipe_id = rk_mf.recipe_id -%}
    {%- endif -%}
  {%- endif -%}
  {%- if rk_recipe_id != blank -%}
    {%- if rk_mf != blank -%}
      <script type="application/json" id="recipe-data-{{ rk_recipe_id }}">{{ rk_mf | json }}</script>
      {%- assign rk_rc = rk_mf.rating_count | default: '1' | at_least: '1' -%}
      {%- assign rk_rv = rk_mf.recipe_rating | ceil | default: 5 | at_most: 5 -%}
      {%- if rk_rv == 0 -%}{%- assign rk_rv = 5 -%}{%- endif -%}
      {%- capture rk_ld_i -%}{%- for i in rk_mf.recipe_ingredients -%}{%- unless i.type == 'heading'
  -%},"{{- i.ingredient | strip_html | escape -}}"{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {%- capture rk_ld_d -%}{%- for d in rk_mf.recipe_directions -%}{%- unless d.type == 'heading'
  -%},{"@type":"HowToStep","text":"{{- d.direction | strip_html | escape -}}","name":"{{- d.step_name |
  default: d.direction | strip_html | escape -}}","url":"{{ shop.url }}{{ article.url }}#step-{{-
  forloop.index -}}"{%- if d.image != blank -%}{%- assign rk_step_img = d.image | replace:
  'https://f000.backblazeb2.com/file/recipekit-bucket/', 'https://images.getrecipekit.com/' -%}{%- if rk_step_img contains '?' -%}{%- assign rk_step_img = rk_step_img | append: '&width=700' -%}{%- else -%}{%- assign rk_step_img = rk_step_img | append: '?width=700' -%}{%- endif -%},"image":"{{- rk_step_img -}}"{%- endif -%}}{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {% assign rk_ld_attr = 'type="application/ld+json"' %}<script {{ rk_ld_attr
  }}>{"@context":"https://schema.org/","@type":"Recipe","name":"{{- rk_mf.recipe_title | escape
  -}}","image":["{{- rk_mf.recipe_image -}}"],"description":"{{- rk_mf.recipe_description | strip_html |
  escape -}}","keywords":[{%- for keyword in rk_mf.recipe_tags -%}"{{- keyword.name | strip_html | escape -}}"{%-
  unless forloop.last -%},{%- endunless -%}{%- endfor -%}],"author":{"@type":"Person","name":"{{-
  rk_mf.recipe_author | strip_html | escape | default: article.author -}}"},"datePublished":"{{-
  rk_mf.recipe_date | default: article.published_at | date: '%Y-%m-%d' -}}","prepTime":"{{-
  rk_mf.iso_prep_time -}}","cookTime":"{{- rk_mf.iso_cook_time -}}","totalTime":"{{- rk_mf.iso_total_time
   -}}","recipeYield":"{{- rk_mf.serving_size | strip_html | escape -}}","recipeCategory":"{{- rk_mf.recipe_category | strip_html |
   escape -}}","recipeCuisine":"{{- rk_mf.recipe_cuisine | strip_html | escape
  -}}","recipeIngredient":[{{- rk_ld_i | remove_first: ',' -}}],"recipeInstructions":[{{- rk_ld_d |
  remove_first: ',' -}}],"nutrition":{"@type":"NutritionInformation"{%- if rk_mf.nutrition_serving_size != blank -%},"servingSize":"{{-
  rk_mf.nutrition_serving_size | escape -}}"{%- endif -%}{%- if rk_mf.recipe_calories != blank -%},"calories":"{{-
  rk_mf.recipe_calories -}}"{%- endif -%}{%- for nutrition_field in rk_mf.nutrition_data -%}{%- unless nutrition_field.value == 'calories' or nutrition_field.dynamic == true -%},"{{- nutrition_field.value -}}":"{{ nutrition_field.content }}"{%- endunless -%}{%- endfor -%}}{%- if rk_rc > 0 and rk_mf.enable_rating == true or
  rk_mf.enable_rating == 'true' -%},"aggregateRating":{"@type":"AggregateRating","ratingValue":{{- rk_rv
   | default: 5 -}},"bestRating":5,"worstRating":1,"ratingCount":{{- rk_rc | default: 1
  -}}}{%- endif -%}{%- if rk_mf.recipe_video != blank and rk_mf.recipe_video contains 'youtube' or
  rk_mf.recipe_video contains 'shorts' or rk_mf.recipe_video contains 'youtu.be' or rk_mf.recipe_video
  contains 'vimeo' -%},"video":{"@type":"VideoObject","name":"{{- rk_mf.recipe_title | escape
  -}}","description":"{{- rk_mf.recipe_description | strip_html | escape -}}","thumbnailUrl":"{{-
  rk_mf.recipe_image -}}","contentUrl":"{{- rk_mf.recipe_video -}}","uploadDate":"{{- rk_mf.recipe_date
  -}}"}{%- endif -%}}</script>
    {%- endif -%}
    {%- if rk_settings.settings.enable_servings_adjuster == false -%}
      {%- assign rk_enable_servings_adjuster = false -%}
    {%- else -%}
      {%- assign rk_enable_servings_adjuster = true -%}
    {%- endif -%}
    <style>recipe-kit:not(:defined){display:block;min-height:400px;width:100%;contain:layout style}</style>
    <recipe-kit
      recipeid="{{ rk_recipe_id }}"
      shop="{{ shop.permanent_domain }}"
      design="{{ rk_settings.recipe_design | default: 'rk_uptown' }}"
      color="{{ rk_settings.design_colour | default: '#000000' }}"
      enableatc="{{ rk_settings.enable_atc | default: false }}"
      enableallatc="{{ rk_settings.enable_all_atc | default: false }}"
      enableclicktocheck="{{ rk_settings.click_to_check | default: false }}"
      enablecookmode="{{ rk_settings.settings.cook_mode_enabled | default: false }}"
      clicktoconfirmrating="{{ rk_settings.settings.click_to_confirm_rating | default: false }}"
      enableservingsadjuster="{{ rk_enable_servings_adjuster }}"
      servingsaboveingredients="{{ rk_settings.settings.servings_above_ingredients | default: false }}"
      showqtystepper="{{ rk_settings.settings.show_qty_stepper | default: false }}"
      enableunittoggle="{{ rk_settings.settings.enable_unit_toggle | default: false }}"
      apiurl="{{ rk_lang.app_url | default: 'https://app.getrecipekit.com' }}"
    ></recipe-kit>
    <script>
      if (!window.recipeKitSvelteLoaded) {
        var s = document.createElement('script');
        s.src = 'https://widget.recipekit.com/widget/v2/templates/recipekit-widget.js';
        s.async = true;
        document.head.appendChild(s);
        window.recipeKitSvelteLoaded = true;
      }
    </script>
  {%- endif -%}

rk-svelte-widget.liquid

{% comment %}RecipeKit Svelte Widget v1.1.1{% endcomment %}
{%- assign rk_settings = shop.metafields.recipekit.settings -%}
  {%- assign rk_lang = shop.metafields.recipekit.rk_lang -%}
  {%- assign rk_recipe_id = blank -%}
  {%- assign rk_mf = blank -%}
  {%- if article -%}
    {%- assign rk_resource_id = article.id | downcase -%}
    {%- assign rk_type = article.metafields.recipekit[rk_resource_id].type -%}
    {%- if rk_type == 'json' -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id].value -%}
    {%- else -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id] -%}
    {%- endif -%}
    {%- if rk_mf != blank -%}
      {%- assign rk_recipe_id = rk_mf.recipe_id -%}
    {%- endif -%}
  {%- endif -%}
  {%- if rk_recipe_id != blank -%}
    {%- if rk_mf != blank -%}
      <script type="application/json" id="recipe-data-{{ rk_recipe_id }}">{{ rk_mf | json }}</script>
      {%- assign rk_rc = rk_mf.rating_count | default: '1' | at_least: '1' -%}
      {%- assign rk_rv = rk_mf.recipe_rating | ceil | default: 5 | at_most: 5 -%}
      {%- if rk_rv == 0 -%}{%- assign rk_rv = 5 -%}{%- endif -%}
      {%- capture rk_ld_i -%}{%- for i in rk_mf.recipe_ingredients -%}{%- unless i.type == 'heading'
  -%},"{{- i.ingredient | strip_html | escape -}}"{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {%- capture rk_ld_d -%}{%- for d in rk_mf.recipe_directions -%}{%- unless d.type == 'heading'
  -%},{"@type":"HowToStep","text":"{{- d.direction | strip_html | escape -}}","name":"{{- d.step_name |
  default: d.direction | strip_html | escape -}}","url":"{{ shop.url }}{{ article.url }}#step-{{-
  forloop.index -}}"{%- if d.image != blank -%},"image":"{{- d.image | replace:
  'https://f000.backblazeb2.com/file/recipekit-bucket/', 'https://images.getrecipekit.com/' | append:
  '?width=700' -}}"{%- endif -%}}{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {% assign rk_ld_attr = 'type="application/ld+json"' %}<script {{ rk_ld_attr
  }}>{"@context":"https://schema.org/","@type":"Recipe","name":"{{- rk_mf.recipe_title | escape
  -}}","image":["{{- rk_mf.recipe_image -}}"],"description":"{{- rk_mf.recipe_description | strip_html |
  escape -}}","keywords":[{%- for keyword in rk_mf.recipe_tags -%}"{{- keyword.name | escape -}}"{%-
  unless forloop.last -%},{%- endunless -%}{%- endfor -%}],"author":{"@type":"Person","name":"{{-
  rk_mf.recipe_author | strip_html | escape | default: article.author -}}"},"datePublished":"{{-
  rk_mf.recipe_date | default: article.published_at | date: '%Y-%m-%d' -}}","prepTime":"{{-
  rk_mf.iso_prep_time -}}","cookTime":"{{- rk_mf.iso_cook_time -}}","totalTime":"{{- rk_mf.iso_total_time
   -}}","recipeYield":"{{- rk_mf.serving_size | escape -}}","recipeCategory":"{{- rk_mf.recipe_category |
   escape -}}","recipeCuisine":"{{- rk_mf.recipe_cuisine | strip_html | escape
  -}}","recipeIngredient":[{{- rk_ld_i | remove_first: ',' -}}],"recipeInstructions":[{{- rk_ld_d |
  remove_first: ',' -}}],"nutrition":{"@type":"NutritionInformation","servingSize":"{{-
  rk_mf.serving_size | escape -}}"{%- if rk_mf.recipe_calories != blank -%},"calories":"{{-
  rk_mf.recipe_calories -}}"{%- endif -%}}{%- if rk_rc > 0 and rk_mf.enable_rating == true or
  rk_mf.enable_rating == 'true' -%},"aggregateRating":{"@type":"AggregateRating","ratingValue":"{{- rk_rv
   | default: '5' -}}","bestRating":"5","worstRating":"1","ratingCount":"{{- rk_rc | default: '1'
  -}}"}{%- endif -%}{%- if rk_mf.recipe_video != blank and rk_mf.recipe_video contains 'youtube' or
  rk_mf.recipe_video contains 'shorts' or rk_mf.recipe_video contains 'youtu.be' or rk_mf.recipe_video
  contains 'vimeo' -%},"video":{"@type":"VideoObject","name":"{{- rk_mf.recipe_title | escape
  -}}","description":"{{- rk_mf.recipe_description | strip_html | escape -}}","thumbnailUrl":"{{-
  rk_mf.recipe_image -}}","contentUrl":"{{- rk_mf.recipe_video -}}","uploadDate":"{{- rk_mf.recipe_date
  -}}"}{%- endif -%}}</script>
    {%- endif -%}
    {%- comment -%}
      Widget-feature toggles default to the shop-level setting (configured on the
      admin Settings page). Merchants using the app block can override these
      per placement in their theme editor.
    {%- endcomment -%}
    {%- if rk_settings.settings.enable_servings_adjuster == false -%}
      {%- assign rk_enable_servings_adjuster = false -%}
    {%- else -%}
      {%- assign rk_enable_servings_adjuster = true -%}
    {%- endif -%}
    <recipe-kit
      recipeid="{{ rk_recipe_id }}"
      shop="{{ shop.permanent_domain }}"
      design="{{ rk_settings.recipe_design | default: 'rk_uptown' }}"
      color="{{ rk_settings.design_colour | default: '#000000' }}"
      enableatc="{{ rk_settings.enable_atc | default: false }}"
      enableclicktocheck="{{ rk_settings.click_to_check | default: false }}"
      enablecookmode="{{ rk_settings.settings.cook_mode_enabled | default: false }}"
      clicktoconfirmrating="{{ rk_settings.settings.click_to_confirm_rating | default: false }}"
      enableservingsadjuster="{{ rk_enable_servings_adjuster }}"
      servingsaboveingredients="{{ rk_settings.settings.servings_above_ingredients | default: false }}"
      showqtystepper="{{ rk_settings.settings.show_qty_stepper | default: false }}"
      apiurl="{{ rk_lang.app_url | default: 'https://app.getrecipekit.com' }}"
    ></recipe-kit>
    <script>
      if (!window.recipeKitSvelteLoaded) {
        var s = document.createElement('script');
        s.src = 'https://widget.recipekit.com/widget/v2/templates/recipekit-widget.js';
        s.async = true;
        document.head.appendChild(s);
        window.recipeKitSvelteLoaded = true;
      }
    </script>
  {%- endif -%}

svelte-recipekit.liquid

{%- assign rk_settings = shop.metafields.recipekit.settings -%}
  {%- assign rk_lang = shop.metafields.recipekit.rk_lang -%}
  {%- assign rk_recipe_id = blank -%}
  {%- assign rk_mf = blank -%}
  {%- if article -%}
    {%- assign rk_resource_id = article.id | downcase -%}
    {%- assign rk_type = article.metafields.recipekit[rk_resource_id].type -%}
    {%- if rk_type == 'json' -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id].value -%}
    {%- else -%}
      {%- assign rk_mf = article.metafields.recipekit[rk_resource_id] -%}
    {%- endif -%}
    {%- if rk_mf != blank -%}
      {%- assign rk_recipe_id = rk_mf.recipe_id -%}
    {%- endif -%}
  {%- endif -%}
  {%- if rk_recipe_id != blank -%}
    {%- if rk_mf != blank -%}
      <script type="application/json" id="recipe-data-{{ rk_recipe_id }}">{{ rk_mf | json }}</script>
      {%- assign rk_rc = rk_mf.rating_count | default: '1' | at_least: '1' -%}
      {%- assign rk_rv = rk_mf.recipe_rating | ceil | default: 5 | at_most: 5 -%}
      {%- if rk_rv == 0 -%}{%- assign rk_rv = 5 -%}{%- endif -%}
      {%- capture rk_ld_i -%}{%- for i in rk_mf.recipe_ingredients -%}{%- unless i.type == 'heading'
  -%},"{{- i.ingredient | strip_html | escape -}}"{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {%- capture rk_ld_d -%}{%- for d in rk_mf.recipe_directions -%}{%- unless d.type == 'heading'
  -%},{"@type":"HowToStep","text":"{{- d.direction | strip_html | escape -}}","name":"{{- d.step_name |
  default: d.direction | strip_html | escape -}}","url":"{{ shop.url }}{{ article.url }}#step-{{-
  forloop.index -}}"{%- if d.image != blank -%},"image":"{{- d.image | replace:
  'https://f000.backblazeb2.com/file/recipekit-bucket/', 'https://images.getrecipekit.com/' | append:
  '?width=700' -}}"{%- endif -%}}{%- endunless -%}{%- endfor -%}{%- endcapture -%}
      {% assign rk_ld_attr = 'type="application/ld+json"' %}<script {{ rk_ld_attr
  }}>{"@context":"https://schema.org/","@type":"Recipe","name":"{{- rk_mf.recipe_title | escape
  -}}","image":["{{- rk_mf.recipe_image -}}"],"description":"{{- rk_mf.recipe_description | strip_html |
  escape -}}","keywords":[{%- for keyword in rk_mf.recipe_tags -%}"{{- keyword.name | escape -}}"{%-
  unless forloop.last -%},{%- endunless -%}{%- endfor -%}],"author":{"@type":"Person","name":"{{-
  rk_mf.recipe_author | strip_html | escape | default: article.author -}}"},"datePublished":"{{-
  rk_mf.recipe_date | default: article.published_at | date: '%Y-%m-%d' -}}","prepTime":"{{-
  rk_mf.iso_prep_time -}}","cookTime":"{{- rk_mf.iso_cook_time -}}","totalTime":"{{- rk_mf.iso_total_time
   -}}","recipeYield":"{{- rk_mf.serving_size | escape -}}","recipeCategory":"{{- rk_mf.recipe_category |
   escape -}}","recipeCuisine":"{{- rk_mf.recipe_cuisine | strip_html | escape
  -}}","recipeIngredient":[{{- rk_ld_i | remove_first: ',' -}}],"recipeInstructions":[{{- rk_ld_d |
  remove_first: ',' -}}],"nutrition":{"@type":"NutritionInformation","servingSize":"{{-
  rk_mf.serving_size | escape -}}"{%- if rk_mf.recipe_calories != blank -%},"calories":"{{-
  rk_mf.recipe_calories -}}"{%- endif -%}}{%- if rk_rc > 0 and rk_mf.enable_rating == true or
  rk_mf.enable_rating == 'true' -%},"aggregateRating":{"@type":"AggregateRating","ratingValue":"{{- rk_rv
   | default: '5' -}}","bestRating":"5","worstRating":"1","ratingCount":"{{- rk_rc | default: '1'
  -}}"}{%- endif -%}{%- if rk_mf.recipe_video != blank and rk_mf.recipe_video contains 'youtube' or
  rk_mf.recipe_video contains 'shorts' or rk_mf.recipe_video contains 'youtu.be' or rk_mf.recipe_video
  contains 'vimeo' -%},"video":{"@type":"VideoObject","name":"{{- rk_mf.recipe_title | escape
  -}}","description":"{{- rk_mf.recipe_description | strip_html | escape -}}","thumbnailUrl":"{{-
  rk_mf.recipe_image -}}","contentUrl":"{{- rk_mf.recipe_video -}}","uploadDate":"{{- rk_mf.recipe_date
  -}}"}{%- endif -%}}</script>
    {%- endif -%}
    <recipe-kit
      recipeid="{{ rk_recipe_id }}"
      shop="{{ shop.permanent_domain }}"
      design="{{ rk_settings.recipe_design | default: 'rk_uptown' }}"
      color="{{ rk_settings.design_colour | default: '#000000' }}"
      enableatc="{{ rk_settings.enable_atc | default: false }}"
      enableclicktocheck="{{ rk_settings.click_to_check | default: false }}"
      enablecookmode="{{ rk_settings.settings.cook_mode_enabled | default: false }}"
      clicktoconfirmrating="{{ rk_settings.settings.click_to_confirm_rating | default: false }}"
      apiurl="{{ rk_lang.app_url | default: 'https://app.getrecipekit.com' }}"
    ></recipe-kit>
    <script>
      if (!window.recipeKitSvelteLoaded) {
        var s = document.createElement('script');
        s.src = 'https://widget.recipekit.com/widget/v2/templates/recipekit-widget.js';
        s.async = true;
        document.head.appendChild(s);
        window.recipeKitSvelteLoaded = true;
      }
    </script>
  {%- endif -%}