Basic Configuration for Editors + Weather Card as example (#14010)

plugins/configuration_basic.rb

@@ -0,0 +1,74 @@
+module Jekyll
+  class ConfigurationBasicBlock < Liquid::Block
+    def initialize(tag_name, text, tokens)
+      super
+      @component, @platform = text.strip.split('.', 2)
+    end
+
+    def slug(key)
+      key.downcase.strip.gsub(' ', '-').gsub(/[^\w\-]/, '')
+    end
+
+    def render_config_vars(vars:, component:, platform:, converter:, classes: nil, parent_type: nil)
+      result = Array.new
+      result << "<div class='#{classes}'>"
+
+      result << vars.map do |key, attr|
+        markup = Array.new
+        markup << "<div class='config-vars-item'><div class='config-vars-label'><a name='#{slug(key)}' class='title-link' href='\##{slug(key)}'></a> <span class='config-vars-label-name'>#{key}</span></div><div class='config-vars-description-and-children'>"
+
+        if attr.key? 'description'
+          markup << "<span class='config-vars-description'>#{converter.convert(attr['description'].to_s)}</span>"
+        else
+          # Description is missing
+          raise ArgumentError, "Configuration key '#{key}' is missing a description."
+        end
+
+        markup << "</div>"
+
+        # Check for nested configuration variables
+        if attr.key? 'keys'
+          markup << render_config_vars(
+            vars: attr['keys'], component: component,
+            platform: platform, converter: converter,
+            classes: 'nested', parent_type: attr['type'])
+        end
+
+        markup << "</div>"
+      end
+
+      result << "</div>"
+      result.join
+    end
+
+    def render(context)
+      if @component.nil? and @platform.nil?
+        page = context.environments.first['page']
+        @component, @platform = page['slug'].split('.', 2)
+      end
+
+      contents = super(context)
+
+      component = Liquid::Template.parse(@component).render context
+      platform  = Liquid::Template.parse(@platform).render context
+
+      site = context.registers[:site]
+      converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
+
+      vars = SafeYAML.load(contents)
+
+      <<~MARKUP
+        <div class="config-vars basic">
+          #{render_config_vars(
+            vars: vars,
+            component: component,
+            platform: platform,
+            converter: converter
+          )}
+        </div>
+      MARKUP
+    end
+  end
+end
+
+Liquid::Template.register_tag('configuration_basic', Jekyll::ConfigurationBasicBlock)

source/_lovelace/weather-forecast.markdown

@@ -7,10 +7,40 @@ description: "The Weather Forecast card displays the weather. Very useful to inc
 The Weather Forecast card displays the weather. Very useful to include on interfaces that people display on the wall.
 
 <p class='img'>
-<img src='/images/lovelace/lovelace_weather.png' alt='Screenshot of the weather card'>
+  <img src='/images/lovelace/lovelace_weather.png' alt='Screenshot of the weather card'>
-Screenshot of the weather card.
+  Screenshot of the weather card.
 </p>
 
+
+### Card Settings
+
+
+{% configuration_basic %}
+Entity:
+  description: "The entity of the `weather` platform to use."
+Name:
+  description: The name of the location where the weather platform is located. If not set, the name will be the name set on the weather entity
+Show Forecast:
+  description: Check this if you would like to show the upcoming forecast under the current weather.
+Secondary Info Attribute:
+  description: Here you can specify a secondary attribute to show under the current temperature. Ex. Extrema, Precipitation, Humidity. If not set, it will default to Extrema (High/Low) if available, if not available then Precipitation and if precipitation isn't available then Humidity.
+Theme:
+  description: Theme your card using any installed theme in your HA environment.
+{% endconfiguration_basic %}
+
+<div class="note">
+
+  This card works only with platforms that define a `weather` entity.
+  
+  E.g., it works with [OpenWeatherMap](https://www.home-assistant.io/integrations/openweathermap/#weather) but not [OpenWeatherMap Sensor](https://www.home-assistant.io/integrations/openweathermap/#sensor)
+
+</div>
+
+
+### YAML
+
+This is for if you use YAML mode or just prefer to use YAML in the Code Editor in the UI
+
 {% configuration %}
 type:
   required: true
@@ -48,13 +78,6 @@ type: weather-forecast
 entity: weather.openweathermap
 ```
 
-<div class="note">
-
-  This card works only with platforms that define a `weather` entity.
-  
-  E.g., it works with [OpenWeatherMap](https://www.home-assistant.io/integrations/openweathermap/#weather) but not [OpenWeatherMap Sensor](https://www.home-assistant.io/integrations/openweathermap/#sensor)
-
-</div>
 
 ### Advanced