How to load a different theme.liquid file based on url?

Highlighted
Shopify Partner
5 0 1

Hi there,


I've read that it is possible to load a different theme.liquid file (such as theme.alternate.liquid). I'd like to do so for a subdomain. I was thinking of using something like this in the index.liquid file:
{% if request.host == 'maindomain.com' %}
{% layout 'theme.liquid' %}
{% elsif request.host == 'subdomain.maindomain.com' %}
{% layout 'theme.alternate.liquid' %}
{% endif %}

{{ content_for_index }}


, but I think I may be missing something... The subdomain home page loaded differently than the main domain homepage, but when I go to add sections [or any kind of html elements] in the theme.alternate.liquid file, it doesn't show up on the subdomain homepage.

I've also been able to do this with page templates, but I'd like to do this with subdomains, without redirecting to a page...

 

Any help is appreciated. 

Thanks
Elizabeth

0 Likes
Highlighted
Shopify Partner
5 0 1

This is the code that I got to work...

{% if request.host == 'maindomain.com' %}
{{ content_for_index }}
{% elsif request.host == 'subdomain.maindomain.com' %}
{% layout 'theme.alternate' %}
{% endif %}

 

Now I am trying to figure out a way to customize the subdomain home page with the customizer... almost got it.

Anyone out there with ideas, I would really appreciate it.

Elizabeth

1 Like
Highlighted
Shopify Partner
5 0 1

My ultimate goal is to load a seemingly "different store" when the user goes to a sub.maindomain. What I understand so far:

- When the user goes to sub.maindomain.com, they see the same content as maindomain.com

- The carts are separate between sub.maindomain.com and maindomain.com

- There is no way?? to control what content is pushed through the global variables {{content_for_index}} and {{content_for_layout}}, as in wrapping in an if statement.

- Even when loading different theme.liquid files, for maindomain.com and sub.maindomain.com, the content_for_index still loads the maindomain's sections and content, making it the same site, but looking different [my initial thought was to set the body to an empty element then add sections back in, but that would make the whole convenience of shopify irrelevant]

- I read on a forum discussion somewhere around here that it would be possible to control the sections that load through content_for_index by not having any sections dynamically on the home page, only adding in through {% section 'sectionname' %} on each page. This would be okay, but it would lose the great functionality of the home page sections re-arranging that shopify has.

The stores maindomain.com and sub.maindomain.com will have a combined inventory and will be managed by the same company; sub.subdomain.com is a sub store of the maindomain.com. 

I've read some solutions are to buy another shopify account, but that doesn't make sense to me as the only solution, and doesn't even count as a solution in my particular case. 

Further questions I have: 

- Where is it determined what page content to load for password.liquid and gift_card.liquid? Those are both layout pages with their own content_for_index. I don't see an if statement on my end, is this something controlled by shopify only- like how all page templates must be written as page.templatename.liquid? Is there a way to add another layout file, and use it simultaneously with another layout file?

- Is there a way to wrap the content_for_index in an if statement, or load a different content_for_index, as done with password.liquid?

 

What I'm thinking of for now, is to create a page that will be the home page of sub.maindomain.com, then redirect the sub.maindomain.com to the page, as in sub.maindomain.com/pages/subhome. This will give the same content as maindomain.com/pages/subhome, but will look different, and will give the user a separate cart... Since maindomain.com/pages/subhome won't be available to the users by a direct menu link, it will be unlikely for them to ever type in the url maindomain.com/pages/subhome and won't be directed to the substore... but that is hoping, and I don't think this is a great solution.

 

I will keep trying and respond to myself when I figure things out. Maybe Jason or tim will chime in sometime- they're kind of my shopify forum heroes. :)

0 Likes
Highlighted
Shopify Partner
5 0 1

Update on my progress:

 

I've done away with the subdomains for now, connected domains domain1.com and domain2.com, both domains connected to shopify, with shopify's option for redirect disabled.

 

In the theme.liquid file, at the very beginning of the <head> tag I included:

{% if request.host == 'domain2.com' and request.path == '/' %}
<script>
window.location.replace( 'https://domain2.com/pages/pagename' );
</script>
{% else %}
{% endif %}

-Thanks to Steven_Amrhein's answer here.

 

So I've created a page template, called page.pagename.liquid, which sets {% layout none %} and have copy/pasted relevant info from theme.liquid (such as html structure) a new section called newpage-index.liquid which is called from page.pagename.liquid and includes schema to create adjustable sections on the page pagename.

When the user types in domain2.com, they are redirected to the page "pagename".

When the user types in domain1.com, they are directed the home page of domain1.com. 

Unfortunately, if the user  types in domain1.com/pages/pagename, they will be directed to the same content as domain2.com/pages/pagename. I'm thinking of setting another redirect so if the user does type it in, they will be directed back the home page at domain1.com....

 

How likely is it that a user will type in the exact address: domain1.com/pages/pagename, when there is no direct link to suggest that is a page? I've done this a few times for sites, when trying to find out the root page- only going further up, but never guessing pages names...

 

0 Likes
Highlighted
New Member
2 0 0

Hi Elizabeth,

I'm looking to do an equivalent thing. But I encountering difficulties to make this part happen:

"So I've created a page template, called page.pagename.liquid, which sets {% layout none %}"

till here is ok, then:

" and have copy/pasted relevant info from theme.liquid (such as html structure) a new section called newpage-index.liquid which is called from page.pagename.liquid and includes schema to create adjustable sections on the page pagename."

I'm lost,

which relevant info  from theme.liquid did you copy exactly? and the new section newpage-index.liquid what about it? 

 

My personal goal is to create several univers under one shop. for example  jacksurf.com and jackskate.com When the customer is inside that univers domain name will change and checkout will be done on jackshop.com.

each shop univers has is own particular homepage (with specific sales banner and/or new arrivals) and specific menu.

 

Thank you for your help,

 

0 Likes