¿Alguien sabe si es posible mover el paso de registro del cliente al pago como en el pago original de Magento 1? Buscando una extensión que lo haga por mí o consejos sobre cómo podría lograrlo.
¿Alguien sabe si es posible mover el paso de registro del cliente al pago como en el pago original de Magento 1? Buscando una extensión que lo haga por mí o consejos sobre cómo podría lograrlo.
Respuestas:
Lo haría creando un paso en el proceso de pago que detecta el clima en el que ha iniciado sesión y luego muestra el formulario en consecuencia.
Cargue el formulario de registro en este paso sobre ajax y modifique el evento posterior al registro para detectar si el registro se realizó en el proceso de pago, redirigiendo de nuevo al proceso de pago en lugar del tablero.
Llegué a agregar un paso de trabajo que se muestra cuando no se ha iniciado sesión para el registro y redirigir el éxito del registro de nuevo a la comprobación deshabilitando el paso anterior para una experiencia de usuario fluida.
Ofrecer una opción de inicio de sesión si el usuario tiene una cuenta pero no ha iniciado sesión en esta etapa mejoraría aún más aquí.
Este es el código completo si desea verificar todo, era mucho para incluir en la respuesta:
Cree un formulario de registro dentro del controlador:
Como los pasos de pago necesitan php
ejecutarse para obtener la url y la clave del formulario, etc., se necesitará un controlador para que podamos cargar este formulario de registro sobre ajax en el paso.
<?php
namespace Harrigo\RegisterCheckout\Controller\Index;
use Magento\Framework\Controller\ResultFactory;
class Register extends \Magento\Framework\App\Action\Action
{
protected $resultPageFactory;
/**
* Constructor
*
* @param \Magento\Framework\App\Action\Context $context
* @param \Magento\Framework\View\Result\PageFactory $resultPageFactory
*/
public function __construct(
\Magento\Framework\App\Action\Context $context,
\Magento\Framework\View\Result\PageFactory $resultPageFactory
)
{
$this->resultPageFactory = $resultPageFactory;
$this->_resultFactory = $context->getResultFactory();
parent::__construct($context);
}
/**
* Execute view action
*
* @return \Magento\Framework\Controller\ResultInterface
*/
public function execute()
{
//if (isset($_POST["cart"])) {
$resultLayout = $this->resultFactory->create(ResultFactory::TYPE_LAYOUT);
return $resultLayout;
//}
//$this->_redirect('checkout/');
}
}
Controlador / Index / Register.php
A continuación, se muestran los bloques de registro dentro del controlador para que podamos llamar a Ajax al pago.
<?xml version="1.0"?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/layout_generic.xsd">
<container name="root" label="Root">
<block class="Magento\Framework\View\Element\Js\Components" name="customer_account_create_head_components" template="Magento_Customer::js/components.phtml"/>
<block class="Magento\Customer\Block\Form\Register" name="customer_form_register" template="Harrigo_RegisterCheckout::register.phtml">
<container name="form.additional.info" as="form_additional_info"/>
<container name="customer.form.register.fields.before" as="form_fields_before" label="Form Fields Before" htmlTag="div" htmlClass="customer-form-before"/>
</block>
<block class="Magento\Cookie\Block\RequireCookie" name="require-cookie" template="Magento_Cookie::require_cookie.phtml">
<arguments>
<argument name="triggers" xsi:type="array">
<item name="registerSubmitButton" xsi:type="string">.action.submit</item>
</argument>
</arguments>
</block>
<block class="Magento\Framework\View\Element\Template" name="form_additional_info_customer" template="Magento_Customer::additionalinfocustomer.phtml"/>
</container>
</layout>
/view/frontend/layout/harrigoregister_index_register.xml
Asegúrese de agregar routes.xml dentro de la carpeta etc / frontend del módulo.
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../lib/internal/Magento/Framework/App/etc/routes.xsd">
<router id="standard">
<route id="harrigoregister" frontName="harrigoregister">
<module name="Harrigo_RegisterCheckout" />
</route>
</router>
</config>
Crea un paso de pago:
http://devdocs.magento.com/guides/v2.0/howdoi/checkout/checkout_new_step.html
Como este es el primer paso, asegúrese de agregar los mixins tal como lo hice en el módulo, ya que los devdocs son incorrectos aquí, lo que lleva a cada paso que muestra:
<!--The 'step_code' value from the .js file should be used-->
<li id="registerstep" data-bind="fadeVisible: isVisible">
<div class="step-title" data-bind="i18n: 'Register'" data-role="title"></div>
<div id="checkout-step-title"
class="step-content"
data-role="content">
<form data-bind="submit: navigateToNextStep" novalidate="novalidate">
<div class="actions-toolbar" id="shipping-method-buttons-container">
<div class="primary">
<button data-role="opc-continue" type="submit" class="button action continue primary">
<span><!-- ko i18n: 'Continue as guest'--><!-- /ko --></span>
</button>
</div>
</div>
</form>
</div>
<div id="registerblock"></div>
</li>
Esto fallaba si el bloque no se había cargado antes de la llamada ajax, pero terminó usando algo como esto para obtener nuestro formulario de registro del controlador y escupirlo en el paso:
//waits for elements to load in checkout
function waitForElement(elementPath, callBack){
window.setTimeout(function(){
if($(elementPath).length){
callBack(elementPath, $(elementPath));
}else{
waitForElement(elementPath, callBack);
}
},500)
}
//get crosssell products / newsletter
$.ajax({
url: "/harrigoregister/index/register",
type: "post",
data: {
cart: "yes"
},
success: function(response) {
waitForElement("#registerblock",function(){
$("#registerblock").html(response);
});
},
error: function(xhr) {
}
});
Hay muchos más pasos aquí, solo siga los devdocs asegurándose de hacer el paso de mezcla, pero use a continuación para mezclar, ya que el ejemplo de devdocs no funciona:
define(
[
'ko',
'Magento_Customer/js/model/customer'
], function (ko, customer) {
'use strict';
var mixin = {
initialize: function () {
if(!customer.isLoggedIn()) {
this.isVisible = ko.observable(false);
this.visible = ko.observable(false); // set visible to be initially false to have your step show first
}
this._super();
return this;
}
};
return function (target) {
return target.extend(mixin);
};
}
);
Las principales diferencias fueron los pasos de pago y envío que usan isVisible y Visible y devdocs solo usa visible en el ejemplo, por lo que es necesario agregar Visible para corregirlo. También tuve que hacer ajustes si el paso estaba deshabilitado.
Modificar el redireccionamiento de registro:
Magento 2: redirige al usuario a una página específica después de registrarse
<?php
namespace Harrigo\RegisterCheckout\Plugin;
use Magento\Framework\Controller\ResultFactory;
use Magento\Framework\Registry;
use Magento\Framework\UrlInterface;
class Redirect
{
protected $coreRegistry;
protected $url;
protected $resultFactory;
public function __construct(Registry $registry, UrlInterface $url, ResultFactory $resultFactory)
{
$this->coreRegistry = $registry;
$this->url = $url;
$this->resultFactory = $resultFactory;
}
public function aroundGetRedirect ($subject, \Closure $proceed)
{
//need to check out if registration was from checkouit
/** @var \Magento\Framework\Controller\Result\Redirect $result */
if ($_POST['checkout'] = 'true') {
$result = $this->resultFactory->create(ResultFactory::TYPE_REDIRECT);
$result->setUrl($this->url->getUrl('checkout'));
return $result;
}
return $proceed();
}
}
Ejemplo tosco, pero también tuvo que anular el archivo register.phtml para agregar la variable de pago final para determinar la diferencia entre los 2 formularios. Allí donde no mostraba muchos pasos, pero compruebe el módulo que creé para obtener un ejemplo completo.