I want to move the Email section into Shipping address block of the one page checkout. How can I do this?
1 Answer
To move email field at bottom of shipping address create "shipping.html" file in below path
app/design/frontend/[Theme_Vendor]/[Theme]/Magento_Checkout/web/template/shipping.html
Add code
<!--
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
-->
<li id="shipping" class="checkout-shipping-address" data-bind="fadeVisible: visible()">
<div class="step-title" translate="'Shipping Address'" data-role="title" />
<div id="checkout-step-shipping"
class="step-content"
data-role="content">
<each args="getRegion('address-list')" render="" />
<each args="getRegion('address-list-additional-addresses')" render="" />
<!-- Address form pop up -->
<if args="!isFormInline">
<div class="new-address-popup">
<button type="button"
class="action action-show-popup"
click="showFormPopUp"
visible="!isNewAddressAdded()">
<span translate="'New Address'" />
</button>
</div>
<div id="opc-new-shipping-address"
visible="isFormPopUpVisible()"
render="shippingFormTemplate" />
</if>
<each args="getRegion('before-form')" render="" />
<!-- Inline address form -->
<render if="isFormInline" args="shippingFormTemplate" />
<each if="!quoteIsVirtual" args="getRegion('customer-email')" render="" />
</div>
</li>
<!--Shipping method template-->
<li id="opc-shipping_method"
class="checkout-shipping-method"
data-bind="fadeVisible: visible(), blockLoader: isLoading"
role="presentation">
<div class="checkout-shipping-method">
<div class="step-title"
translate="'Shipping Methods'"
data-role="title" />
<each args="getRegion('before-shipping-method-form')" render="" />
<div id="checkout-step-shipping_method"
class="step-content"
data-role="content"
role="tabpanel"
aria-hidden="false">
<form id="co-shipping-method-form"
class="form methods-shipping"
if="rates().length"
submit="setShippingInformation"
novalidate="novalidate">
<render args="shippingMethodListTemplate"/>
<div id="onepage-checkout-shipping-method-additional-load">
<each args="getRegion('shippingAdditional')" render="" />
</div>
<div role="alert"
if="errorValidationMessage().length"
class="message notice">
<span text="errorValidationMessage()" />
</div>
<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 translate="'Next'" />
</button>
</div>
</div>
</form>
<div class="no-quotes-block"
ifnot="rates().length > 0"
translate="'Sorry, no quotes are available for this order at this time'" />
</div>
</div>
</li>
Save the file and run below commands
php bin/magento setup:static-content:deploy -f
php bin/magento cache:clean
And the output shows in the below screenshot.
Hope this will work for you.