Magento 2. Add simple checkbox on product page

[denisnagorny]

Good morning. 

I need to add custom checkbox on Product page, like a custom field. This checkbox will be displayed on product page. 

I've googled some time, but didn't find needed functionality or similar code. 

Thanks for any help. 

[Sohel]

Hi @denisnagorny 

Overwrite vendor/magento/module-catalog/view/frontend/templates/product/view/form.phtml then add checkbox here.

<input type="checkbox" value="1" name="custom_checkbox"> <?= __('My Checkbox')?>

Now template looks like

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

// @codingStandardsIgnoreFile

/**
 * Product view template
 *
 * @var $block \Magento\Catalog\Block\Product\View
 */
?>
<?php $_helper = $this->helper('Magento\Catalog\Helper\Output'); ?>
<?php $_product = $block->getProduct(); ?>

<div class="product-add-form">
    <form data-product-sku="<?= $block->escapeHtml($_product->getSku()) ?>"
          action="<?= /* @NoEscape */ $block->getSubmitUrl($_product) ?>" method="post"
          id="product_addtocart_form"<?php if ($_product->getOptions()): ?> enctype="multipart/form-data"<?php endif; ?>>
        <input type="hidden" name="product" value="<?= /* @escapeNotVerified */ $_product->getId() ?>" />
        <input type="hidden" name="selected_configurable_option" value="" />
        <input type="hidden" name="related_product" id="related-products-field" value="" />
        <?= $block->getBlockHtml('formkey') ?>
        <?= $block->getChildHtml('form_top') ?>
        <?php if (!$block->hasOptions()):?>
            <?= $block->getChildHtml('product_info_form_content') ?>
        <?php else:?>
            <?php if ($_product->isSaleable() && $block->getOptionsContainer() == 'container1'):?>
                <?= $block->getChildChildHtml('options_container') ?>
            <?php endif;?>
        <?php endif; ?>

        <?php if ($_product->isSaleable() && $block->hasOptions() && $block->getOptionsContainer() == 'container2'):?>
            <?= $block->getChildChildHtml('options_container') ?>
        <?php endif;?>
        <?= $block->getChildHtml('form_bottom') ?>
        <input type="checkbox" value="1" name="custom_checkbox"> <?= __('My Checkbox')?>
    </form>
</div>
<script>
    require([
        'jquery',
        'priceBox'
    ], function($){
        var dataPriceBoxSelector = '[data-role=priceBox]',
            dataProductIdSelector = '[data-product-id=<?= $block->escapeHtml($_product->getId()) ?>]',
            priceBoxes = $(dataPriceBoxSelector + dataProductIdSelector);

        priceBoxes = priceBoxes.filter(function(index, elem){
            return !$(elem).find('.price-from').length;
        });

        priceBoxes.priceBox({'priceConfig': <?= /* @escapeNotVerified */ $block->getJsonConfig() ?>});
    });
</script>