Define multiple component in data-templates-url html file

Support
#1

We need to customized the components and we are setting the data-templates-url html file content like a bottom html content. tried with lots of permutation and combination. But not succeeded to override it.

Please provide us the way to define multiple component overridable in Snipcart integration.

We are planning to customize the following components.
Sign in form
Register form
Forget password form
Cart summary
Billing form
Shipping form
My account form (Dashboard)

Templates 
    <address-fields>
        <div class="root">
		<!-- Here rest nodes will defined -->
		</div>
    </address-fields>
    <signin-form>
        <authentication-view>
			<div class="root">
			<!-- Here rest nodes will defined -->
			</div>
        </authentication-view>
    </signin-form>
	<register-form>
		<authentication-view>
		<overridable name="register">
			<div class="root">
			<!-- Here rest nodes will defined -->
			</div>
		</overridable>
		</<authentication-view>
	</register-form>
</div>
#2

Hey @servers,

Can you please share the complete code if your HTML file that contains your template? I already spotted a few issues in the sample you sent, but I want to make sure we don’t miss anything.

One important thing to remember is that ny components that you render in your templates that are provided by us can’t be self-closing tags:

<snipcart-error-message class="snipcart-error-message--global-form" />

This is causing some issues when parsing the HTML. You should replace it by:

<snipcart-error-message class="snipcart-error-message--global-form"></snipcart-error-message>
#3

Please find the template file details

Just click on the link and it will redirect to browser, from there you can download this template html file.

1 Like