Packages and LVGL

I’m pretty new into packages and templates, i get some errors.
Need some help with this.

the code below is a snipe from my yaml file.
every page is split down in 2 or more sectione.
The page_template is the first section, the second is the page itself

i loaded these 2 sections in different yaml files, but when trying to compile i get error’s and can’t figure out how to solve.

the error is
INFO ESPHome 2025.4.2
INFO Reading configuration /config/esphome/display-woonkamer.yaml…
ERROR Error while reading config: Invalid YAML syntax:

mapping values are not allowed here
in “/config/esphome/display-woonkamer.yaml”, line 77, column 24

pages:
    - id: boot_page
      # on_swipe_right:
      #   - lvgl.page.previous:
      # on_swipe_left:
      #   - lvgl.page.next:
      # bg_color: black
      <<: !include file: layouts/page_tenplate.yaml
      <<: !include file: layouts/boot_page.yaml
      # widgets:    
      #   - button:
      #       id: allesuit
      #       x: 0
      #       y: -68
      #       align: CENTER
      #       width: 210
      #       height: 50
      #       widgets:
      #         - label:
      #             width: SIZE_CONTENT
      #             height: SIZE_CONTENT
      #             x: -4
      #             y: -1
      #             align: center
      #             text_font: montserrat_40
      #             text: "Alles uit"

      #       on_short_click:
      #         - homeassistant.action:
      #             action: homeassistant.turn_on
      #             data: { entity_id: scene.alles_uit }

      #   - label:
      #       id: wifi_connected
      #       x: 126
      #       y: 21
      #       text_font: icon_48
      #       text_color: red
      #       text: "\U000F16BC"

      #   - label:
      #       id: ha_connected
      #       x: 201
      #       y: 21
      #       text_font: icon_48
      #       text_color: red
      #       text: "\U000F07D0"

See GitHub - agillis/esphome-modular-lvgl-buttons: A modular LVGL button platform for ESPHome for examples on how to use includes.

If you do need further help, you will need to show the contents of the included files. It’s also not much point posting a message flagging line 77 if it’s not clear which line that is.

Theres also a whole documentation page for learning how to use and how to add use “includes” or packages from places like Github.

I read it but stil can’t figure out why my part isn’t runing.

It tells you right there that the error is at line 77 column 24. Thats what we call a Clue and its where you should focus your attention looking for syntax issues, spacing issues, etc.

What you posted doesnt include the line numbers, nor did you clarify where line 77 is so that people can go straight to the error instead of having to search through all of it line by line completely unnecessarily, just to play “where’s Waldo” looking for the error because you didnt specify that detail even though the first comments to your post, they pointed out this exact same thing and you’ve remained unwilling to rectify that.

Maybe it requires a third person to point that out and the 3rd time will be a charm that motivates you to help us be able to help you better.