pixlee / magento2
社交电商平台,用于收集、编辑和展示用户生成的内容,以增强您的Magento商店
Requires
- php: ^7.1.3|~8.0.0|~8.1.0|~8.2.0
- magento/framework: >=102.0.1
- magento/module-backend: 101.0.*|102.0.*
- magento/module-catalog: 103.0.*|104.0.*
- magento/module-config: 101.1.*|101.2.*
- magento/module-configurable-product: 100.3.*|100.4.*
- magento/module-cron: 100.3.*|100.4.*
- magento/module-sales: 102.0.*|103.0.*
- magento/module-store: 101.0.*|101.1.*
- magento/module-url-rewrite: 101.1.*|102.0.*
README
要在线查看这些文档,请导航到: https://developers.pixlee.com/docs/magento-2
使用此Magento 2扩展连接到Emplifi的Pixlee TurnTo社交UGC服务。兼容Magento开源和Adobe Commerce,版本2.3.x - 2.4.6。
安装说明
使用Composer安装(推荐)
按照Adobe文档安装扩展 安装扩展
Composer包 pixlee/magento2
-
在您的根Magento安装目录中运行以下命令进行安装
composer require pixlee/magento2 bin/magento module:enable TurnTo_SocialCommerce --clear-static-content bin/magento setup:upgrade bin/magento setup:di:compile bin/magento cache:clean
-
配置模块以连接到您的Pixlee帐户。请参阅下面的设置部分。
通过复制文件进行安装
-
在您的Magento安装的
app目录中创建一个code/Pixlee/Pixlee目录。 -
从以下页面下载最新的“源代码”: https://github.com/pixlee/magento2/releases
-
解压文件,并将Pixlee_Pixlee目录的内容复制到
app/code/Pixlee/Pixlee目录。 -
从您的根Magento安装目录运行以下命令
bin/magento module:enable Pixlee_Pixlee --clear-static-content bin/magento setup:upgrade bin/magento setup:di:compile bin/magento cache:clean
-
配置模块以连接到您的Pixlee帐户。请参阅下面的设置部分。
设置
获取您的Pixlee API密钥
要连接到Pixlee,您需要从https://app.pixlee.com获取您的API密钥和密钥。
-
点击右上角的汉堡菜单中的设置链接。
设置页面应该看起来像这样
-
点击左侧导航栏上的Pixlee API。
从该页面,记录要在Magento商店配置中使用的值Account ID、Account API Key和Account Secret Key。
配置Pixlee Magento 2模块
在主菜单上选择商店 > 配置。
Pixlee配置在网站级别进行管理。在页面顶部,使用商店视图下拉菜单选择所需的网站。
🚧
注意
如果您将商店视图保留为默认配置,则Pixlee选项卡将不会显示。
在左侧导航面板中,点击Pixlee > 现有客户。
- 将启用设置为是
- 使用从https://app.pixlee.com获取的用户API密钥和帐户密钥填写API密钥和密钥。(见获取您的Pixlee API密钥以上)
- 在页面右上角点击保存配置以保存您的帐户设置。
从Magento 2导出产品到Pixlee
定期产品导出Cron作业
Magento 2扩展程序设置了一个定时任务,每天从网站1将产品导出到Pixlee。这将有助于确保在Pixlee中产品数据是最新的,从而确保在Magento 2中创建的新产品每天都被导出到Pixlee。
📘 注意
目前,只有网站1通过定时任务导出产品。其他网站需要通过管理员界面中的“导出到Pixlee产品”按钮手动导出。
更新产品导出到Pixlee的时间间隔
产品将在每天凌晨3点UTC进行导出。如果您希望更改产品导出的时间,请按照以下步骤操作
-
在您的Magento 2实例中的Pixlee扩展程序代码中,修改$MAGENTO_ROOT/app/code/Pixlee/Pixlee/etc/crontab.xml
-
要更改每天导出产品的具体小时,将计划标签中的3更改为您喜欢的任何小时
<job name="export_cronjob" instance="Pixlee\Pixlee\Cron\ExportCron" method="execute"> <schedule>1 3 * * *</schedule> </job>
导出到Pixlee产品按钮
您可以使用“导出到Pixlee产品”按钮在任何时间从Magento将网站产品导出到Pixlee。在Pixlee的“现有客户 > API设置”中,点击“导出到Pixlee产品”按钮,仅将当前选择的网站的所有产品导出到您的Pixlee账户。您可以针对每个网站重复此过程。
🚧
注意
如果您曾更改过Magento的max_execution_time变量,请确保将其设置为至少3600秒(1小时)。默认应为18000秒,可以保持不变。
在产品页面上嵌入PDP小部件
在Pixlee创建PDP小部件后,可以将其添加到产品详情页面。
-
前往https://app.pixlee.com,登录,并导航到“发布”标签。
(另请登录后,将浏览器指向https://app.pixlee.com/app#publish).
-
点击“安装产品展示”,应该会弹出一个类似下面的轻量级框。
-
根据您的需求自定义小部件。最后,按下“生成嵌入代码”按钮,您将看到一个嵌入代码。注意 - 我们建议在自定义时将“加载优先级”设置为“低优先级”。
复制生成的代码片段中的widgetId值。在Admin > 系统配置 > Pixlee账户配置 > 小部件ID字段中填写此值。这是我们在步骤10中跳过的同一字段。
-
现在,要实现Pixlee PDP小部件,只需在“PDP小部件设置”部分的“PDP小部件ID”字段中输入上一步骤中旁边的widgetId值。
然后,单击页面右上角的保存配置以保存您的账户设置。
这样,任何在其Pixlee相册中有标记照片的产品现在都应该在其产品描述页面上显示小部件画廊。
为了进一步自定义,您可以使用Pixlee的设计编辑器重新发布您的PDP小部件,并使用该结果生成的widgetId!
-
此外,如果您想自定义PDP小部件的放置位置,请修改catalog_product_view.xml。
例如,在Magento 2示例商店(Luma)中,它位于以下文件中
$MAGENTO_ROOT/app/code/Pixlee/Pixlee/view/frontend/layout/catalog_product_view.xml其中$MAGENTO_ROOT可能类似于/var/www或/usr/share/nginx/html,具体取决于您的安装。
在分类页面上嵌入CDP小部件
前三个步骤与嵌入PDP小部件完全相同,因为它们仅涉及从控制面板获取widgetId。
-
前往https://app.pixlee.com,登录,并导航到“发布”标签。
(另请登录后,将浏览器指向https://app.pixlee.com/app#publish).
-
点击“安装产品展示”,应该会弹出一个类似下面的轻量级框。
-
根据您的需求自定义小部件。最后,按下“生成嵌入代码”按钮,您将看到一个嵌入代码。注意 - 我们建议在自定义时将“加载优先级”设置为“低优先级”。
复制生成的代码片段中的widgetId值。
-
现在,要实现Pixlee CDP小部件,只需在Admin > 系统配置 > Pixlee账户配置 > CDP小部件ID下的小部件ID字段中填写此值。
然后,单击页面右上角的保存配置以保存您的账户设置。
这样,任何在其Pixlee相册中有标记照片的产品现在都应该在其产品描述页面上显示小部件画廊。
为了进一步自定义,您可以使用Pixlee的设计编辑器重新发布您的PDP小部件,并使用该结果生成的widgetId!
-
此外,如果您想自定义 CDP 小部件的放置位置,请修改 catalog_category_view.xml 文件。
例如,在Magento 2示例商店(Luma)中,它位于以下文件中
$MAGENTO_ROOT/app/code/Pixlee/Pixlee/view/frontend/layout/catalog_category_view.xml其中$MAGENTO_ROOT可能类似于/var/www或/usr/share/nginx/html,具体取决于您的安装。
测试和故障排除
为了测试一切是否已正确实施,我们需要检查两点:
- 所有产品都已导出吗?
- API 调用是否成功调用 Pixlee API?
所有产品都已导出吗?
在测试之前,请确保 Pixlee 产品导出作业至少运行过一次。如果您已运行导出一次,请跳到第 3 步。
-
要手动运行,请打开管理面板 > 存储 > 配置 > Pixlee > 现有客户。按下 将产品导出到 Pixlee 按钮,以启动导出。
-
您应该在这个页面上看到产品列表。
-
尝试搜索这个页面上的几个您知道存在于您的目录中的产品。
-
如果列表为空或您无法搜索特定产品,请进行下一步。否则,请直接进入下一节,即 API 调用是否成功调用 Pixlee API?
-
产品导出失败可能有几个原因,所以首先,我们需要找出失败的确切原因。Pixlee 产品导出作业将进度和所有异常记录到服务器日志中。因此,我们下一步要获取的是两个日志:Magento 服务器日志 和 PHP (Apache 或等效) 日志。
-
Magento 服务器日志通常位于 /var/log,所以请导航到该位置,查找名为 pixlee.log 的文件。
-
PHP 日志的位置取决于您的设置。例如,如果您使用 Apache,日志应该位于 /logs。我们在这个目录中寻找名为 php_error.log 的文件。
-
我们遇到的最常见问题之一是 Magento 或 PHP/Apache 服务器分配的内存不足。使用您喜欢的文本编辑器打开 php_error.log 文件,并搜索类似于以下行记录:
PHP 中允许的内存大小为 33554432 字节已耗尽(尝试分配 43148176 字节)
-
如果您找到了类似错误,请增加分配的内存,并再次运行产品导出作业。
-
我们遇到的另一个常见问题是 max_execution_time 设置得太低。寻找类似于以下记录的日志条目:
Fatal error: Maximum execution time of XYZ seconds exceeded in ...
-
如果您找到了类似的日志条目,请将您的 php.ini 文件中的 max_execution_time 设置至少为 3600。然后再次尝试导出产品。
-
如果到目前为止您仍然无法看到任何产品导出到 Pixlee,请联系我们 support@pixleeturnto.com,并在电子邮件中附上两个日志文件 pixlee.log 和 php_error.log。
API 调用是否成功调用 Pixlee API?
当客户将商品添加到购物车或在他们您的商店购买商品时,会调用 Pixlee API。我们需要确保这些调用在正确的时间进行。
-
打开您喜欢的浏览器,打开您的商店的产品页面。然后点击 加入购物车。
-
使用您喜欢的文本编辑器打开位于 /var/log 的 pixlee.log 文件,并将其滚动到最底部。
-
应该有一个以 AddToCart 开头的条目
-
如果您找到了 AddToCart 调用,则您的分析已正确集成。如果没有,请联系我们 support@pixleeturnto.com,并在电子邮件中附上 pixlee.log 文件。
-
切换回浏览器,继续结账并购买之前添加到购物车的产品。结账时请使用测试支付方式。
-
当您到达订单确认页面时,再次打开 pixlee.log 文件,并确保您正在查看文件的最新副本。
-
这次查找以 CheckoutSuccess 开头的日志条目。
-
如果您没有看到与截图中的 CheckoutSuccess 调用一样的内容,请联系我们,邮箱地址为 support@pixleeturnto.com,并在邮件中附上 pixlee.log 文件。
🚧
免责声明:移动分析
根据 Magento2 的设计,用户代理不会在添加到购物车和转换事件中传递。这意味着目前无法在移动和桌面转换数据之间进行分割。
包含小工具的页面上的 RequireJS 错误
为了验证您是否遇到了此问题,请执行以下操作
-
在您的浏览器中打开您的网站,并导航到应该出现 Pixlee 小工具的页面。
-
打开您的浏览器开发者工具,导航到控制台选项卡,并验证您是否看到此错误。
🚧
注意
此错误的原因是 pixlee.com 仅生成纯 HTML 的嵌入代码。而 Pixlee Magento 扩展符合 RequireJS 标准,并期望 Pixlee 脚本仅通过 RequireJS 嵌入。可以通过创建小工具来解决这个问题,具体步骤请参考这里,而不是直接从 pixlee.com 添加小工具嵌入代码。但是,如果您希望保留生成的嵌入代码,请按照以下步骤操作。
-
找到小工具生成的嵌入代码。它应该看起来像这样
以下是上述代码的格式化版本
<div id="pixlee_container"></div> <script type="text/javascript"> window.PixleeAsyncInit = function() { Pixlee.init({apiKey:'YOUR_API_KEY'}); Pixlee.addSimpleWidget({widgetId:YOUR_WIDGET_ID}); }; </script> <script src="//assets.pxlecdn.com/assets/pixlee_widget_1_0_0.js"></script>
-
使用 require 函数按照以下步骤更改嵌入代码
-
使用 require 函数,并添加 asset.pixlee.com URL 作为参数。
-
将 window.PixleeAsyncInit 函数中的 JavaScript 代码移动到 require 函数的回调中。
-
在回调的末尾调用 Pixlee.resizeWidget() 函数。
-
新的代码应该看起来像这样
<div id="pixlee_container"></div> <script type="text/javascript"> require(['https://assets.pxlecdn.com/assets/pixlee_widget_1_0_0.js'], function() { Pixlee.init({apiKey:'YOUR_API_KEY'}); Pixlee.addSimpleWidget({widgetId:YOUR_WIDGET_ID}); Pixlee.resizeWidget(); } ); </script>