部署Matterport 3D漫游档案遇404，如何嵌入Shopify页面？

一、修复HostGator服务器上的404错误 #

从基础项开始逐一排查：

• 核对文件路径与访问地址：确认你上传的文件夹名称（比如matterport），访问地址应为你的域名/文件夹名/index.html，注意HostGator服务器区分大小写，别把index.html写成Index.html。同时用FileZilla检查public_html里的文件夹结构，确保index.html确实在目标文件夹内，没传错位置。
• 检查文件权限：在FileZilla中右键点击目标文件夹和index.html，选择「文件权限」。文件夹权限设为755，文件权限设为644，这是服务器允许公开访问的通用权限设置，权限错误会导致访问被拒。
• 清除缓存：按Ctrl+Shift+Delete清除浏览器缓存，或换个浏览器重试；也可以刷新DNS缓存——Windows运行ipconfig /flushdns，Mac终端执行sudo dscacheutil -flushcache，避免旧缓存导致的访问异常。
• 联系HostGator客服：如果以上步骤都无效，可能是服务器配置（比如.htaccess重写规则、路径映射）的问题，直接找HostGator客服排查，他们对这类基础服务器问题处理效率很高。

二、将Matterport内容添加到Shopify页面 #

解决服务器访问问题后，有两种简单实现方式：

• 直接跳转链接：在Shopify页面编辑器中添加「链接」模块，填入Matterport页面的完整URL（比如你的域名/matterport/index.html），用户点击即可跳转到3D漫游页面。
• 嵌入到页面内：打开Matterport的index.html文件，找到里面的<iframe>嵌入代码；在Shopify后台编辑页面时切换到「HTML」模式，粘贴这段代码，再调整宽高参数（比如width="100%" height="600px"）适配页面布局。

另外，如果你不想折腾自己的服务器，也可以直接用Matterport官方的托管服务，获取官方提供的分享链接或嵌入代码，直接加到Shopify页面里，更省心。

内容的提问来源于stack exchange，提问作者Christopher Montoya