Theme App Extension won't render on customers/account page

Retired Boards Appdev Store Design
1

I’m trying to get a Theme App Extension to display on the customers/account page but am having issues.

It won’t render. Other sections and blocks render correctly until I add my Theme App Extension. Then any other sections I added will disappear as well, not from the menu on the left but from the preview screen.

My Theme App Extension does render correctly and without any issues on other pages (templates).

I downloaded the Dawn theme and had to convert customers/account.liquid to customers/account.json with a customer-account.liquid file in the Sections directory. So I might be doing something wrong either in those files or in my Theme App Extension and I need someone to check what it could be.

Theme App Extension

Hello world

{% schema %}
{
    "name": "Custom App Extension",
    "target": "section",
    "class": "custom-tag-name"
}
{% endschema %}

customers/account.json (in Templates section)

{
  "sections": {
    "main": {
      "type": "customer-account",
      "settings": {
      }
    }
  },
  "order": [
  	"main"
  ]
}

customer-account.liquid (in Sections directory)


{% schema %}
  {
    "name": "Customer account",
  	"blocks": [
  		{
  			"type": "@app"
  		}
  	],
    "settings": []
  }
{% endschema %}
2

Hi there Paul!

Thanks for your question and great to hear you’re looking to integrate your app into the customer account pages! From your example here, it’s looking like you may need to add the {% render block %} tag within the markup of the customer-account.liquid section file.

When you look the product section in dawn, there is a loop to render app block in the section template:

{%- for block in section.blocks -%}
  {%- case block.type -%}
    {%- when '@app' -%}
      {% render block %}

the render tag will include the app block when it is instructed.

If you add the loop to render the app block in the area within the customer account section where you want it to appear, then it should work as expected. If you’re still having issues let us know here and we’ll troubleshoot further.

Cheers,

Liam

3

Thank you for the reply @Liam .

I was indeed missing the code that you mentioned but adding it didn’t work.

Because I’m unable to think of what I’m doing wrong I thought I try it on other 2.0 themes from the Theme Store. I found two (Warehouse and Beyond) that allow for sections on the customer account page, but both have the exact same behaviour as my customized Dawn version.

I’ve tried finding other apps with Theme App Extensions that I wanted to try and add to the customer account page to see if they cause the same behaviour, but I haven’t found an app yet that isn’t limited to templates other than the customer account page so I haven’t been able to try that yet.

I’ve also tried converting the login page to sections to see what it does there. But there it behaves the same as well.

To summarize what that behaviour (those issues) are:

  1. Custom app block doesn’t render on customers/account (or customers/login) page

  2. Default app blocks do render but disappear from view (not from the list on the left) when adding the custom app block

  3. Custom app block renders and behaves just fine on other templates like product- or home page

The fact that those other two themes show similar behaviour is making me think that either there is something wrong or missing in my Theme App Extension even though it’s very very basic with just a “Hello world”. Or something isn’t entirely correct with the whole Storefront 2.0 for custom theme app extensions for the account page.

I hope you (or the team) can dig further into this as I’m now kind of forced to refer to the old ways of adding things to the Storefront.

To help with that, I’ve made public repos of my Theme App Extension and my customized version of Dawn:

  1. https://github.com/PaulvdDool/theme-app-extension
  2. https://github.com/PaulvdDool/shopify-dawn-theme

I hope this is of use.

Thanks,
Paul

4

Hi Paul! It does seem there could be an issue on our side, app block rendering is working when you save the theme, but preview does not work well in the customer pages. We’ve opened an issue to fix this bug! Will report back with an update on this!

1 Like
5

Ah, it indeed does render if you save it and check the website.
It will at least allow me to continue development. Thank you!

6

Update on this issue: We have fixed the error for the customer page, so partners and merchants should be able to see the app blocks in the customer preview now.