Hot answers tagged

36

This is my first answer on this site. I've been struggling trying to make this work for the past two days and I was finally able to make it work, so I though it would be nice to share it. First of all you need to create a module: registration.php etc/module.xml view/frontend/layout/default.xml view/frontend/templates/minicart_open.phtml view/frontend/web/...


17

It is very simple to create modal popup in Magento 2. Like if you want to display any static block in popup, you can do it simply by calling the content and displaying it. We should start by creating new module in Magento 2. app/code/Example/ModalOverlay/registration.php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\...


9

You have to extend widget function _close in your custom module. Follow below steps for achieve your task: First create requirejs-config.js with code: var config = { map: { '*': { custommodal: 'Vendor_Modulename/js/custom', } } }; Create your js file in your web folder: define([ 'jquery', 'jquery/ui', '...


9

You don't have to extend the modal. You simply have to listen for the 'modalclosed' event on the DOM element on which the modal had been invoked. In fact the modal() function returns this element which makes the code trivial. $('#popup-modal').modal('openModal').on('modalclosed', function() { /*insert code here*/ });


8

We fixed this issue in a custom theme using a RequireJS mixin by adding the following files: app/design/frontend/VENDOR/THEME/Magento_Ui/web/js/model/modal-mixin.js define([ 'jquery', 'mage/utils/wrapper' ], function ($, wrapper) { 'use strict'; return function (modal) { modal.prototype.openModal = wrapper.wrap(modal.prototype....


7

You could use "modalClass" to set a particular class for each modal. See all of the possible modal paremeters in the following file: vendor/magento/module-ui/view/base/web/js/modal/modal.js


7

Different parameters can be used for Modal Popup creation by the reference of the file : vendor/magento/module-ui/view/base/web/js/modal/modal.js <script> require(['jquery','Magento_Ui/js/modal/modal'], function($,modal) { var options = { type: 'popup', responsive: true, innerScroll: true, ...


7

Why not just remove buttons from footer? _getModalOptions: function() { /** * Modal options */ var options = { type: 'popup', responsive: true, title: 'Customer Details', buttons: [] }; return options; },


6

It can be done by simply modifying minicart.js file. Navigate to vendor/magento/Magento_Checkout/view/web/js/view/minicart.js Under initialize: function, you will see $('[data-block="minicart"]').on('contentLoading', function (event) { Replace the function with this code. $('[data-block="minicart"]').on('contentLoading', function (event) { ...


6

what happens in wish list product , when a guest is adding a product to a wish list in the preDispatch method on controller they are checking whether the customer is logged in or not. If customer is guest then they set the current product's url customer session like this Mage::getSingleton('customer/session')->setBeforeWishlistUrl($this->...


5

Hi just place the below code in the footer file or any file which is common on all pages and it will do your job. I was also going to the same issue and came out with this and it works perfect. <script type="text/javascript"> require(['jquery'], function($) { $(document).ready(function(){ $("body").click ( function(e) { var ...


5

Got the solution to add opened function getModalOptions. Something like this, _getModalOptions: function() { /** * Modal options */ var options = { type: 'popup', responsive: true, title: 'Customer Details', buttons: [{ ...


4

Create your own module. Let's call it StackExchange_FreeShipping you will need the following files: app/etc/modules/StackExchange_FreeShipping.xml - the declaration file <?xml version="1.0"?> <config> <modules> <StackExchange_FreeShipping> <active>true</active> <codePool>local<...


4

alternative solution: check vendor/magento/module-catalog/view/frontend/web/js/catalog-add-to-cart.js line: 100 $(document).trigger('ajax:addToCart', form.data().productSku); We could add a custom js file: <script type="text/x-magento-init"> { "*": { "Magento_Catalog/js/view/minicart-open": {} } } In the js: $(document).on('ajax:...


4

Try the below code. No need to add reference for remove block <layout version="0.1.0"> <sendfriend_product_send translate="label"> ...... <remove name="header"/> <remove name="footer"/> ...... </sendfriend_product_send> </layout>


4

try this $('.modal-popup._inner-scroll .modal-inner-wrap').css('background-color','black'); require( [ 'jquery', 'Magento_Ui/js/modal/modal' ], function( $, modal ) { var options = { type: 'popup', responsive: true, innerScroll: true, slideshowSpeed:...


4

Follow this step Submit form Using ajax on ajax success open popup


4

Please do like this you need to put this code as your redirect page or any common phtml file. <?php $objectManager = \Magento\Framework\App\ObjectManager::getInstance(); $customerSession = $objectManager->get('Magento\Customer\Model\Session'); if($customerSession->isLoggedIn()) { ?> <div class="bt-action-file" style="display: none;">...


3

I modified the popup code, this worked for my needs. function addNewPop(id,title,w,h){ win = new Window({ title: title, className:"magento", destroyOnClose: true, recenterAuto:false, width:w, height:h, id: title, minimizable: false, maximizable: false, showEffectOptions: { duration: 0.4 }, ...


3

The notifications, like "Magento 1.9.1 is now available" come from this RSS feed: http://notifications.magentocommerce.com/community/notifications.rss It is processed by Mage_AdminNotification_Model_Feed. Many extensions add their own notification feed by extending this class and overriding getFeedUrl() and calling checkUpdate() periodically using a cronjob ...


3

First step: Change the layout file In your lotusbreath/onestepcheckout.xml files, replace* <lotusbreath_onestepcheckout_index_index> handle to <checkout_cart_index>. So, now the checkout block will be render in cart. Change <block type="lotusbreath_onestepcheckout/onepage" name="checkout.onepage" as="checkout.onepage"> to <block type="...


3

You'll need a custom module but it does not take much work if you know some basics of module development: create a controller action that does nothing more than $this->loadLayout(); $this->renderLayout(); Create a layout handle for this controller and include the predefined page_empty layout handle (this removes header, footer and sidebars, using ...


3

You simple add your embedded code in custom_popup div. <div id="custom_popup" style="display:none;"> <div class="youtube-video"> <iframe width="854" height="480" src="https://www.youtube.com/embed/UKlkIzD-Yj8" frameborder="0" allowfullscreen></iframe> </div> <?php echo $block->getLayout()->...


3

This javascript 'onbeforeunload' event is used to detect browser close or changing website. You can use the event to display popup. window.onbeforeunload = function () { return "Do you really want to close?"; };


3

Adding popup to minicart when click on add to cart button Edit your extended default.xml /app/design/frontend/vendor-name/theme-name/Magento_Theme/layout/default.xml and paste this line of code <?xml version="1.0"?> <!-- /** * Copyright © 2016 Magento. All rights reserved. * See COPYING.txt for license details. */ --> <page xmlns:xsi="...


3

There is support for pop ups / modals in magento 2 without the need for bootstrap. See information from dev docs below: http://devdocs.magento.com/guides/v2.0/javascript-dev-guide/widgets/widget_modal.html 1. Magento 2 Pop Up Basically adding below code to your html and popup should show on page load: <div id="custom-popup-modal"> <p>...


3

Hi Hardik you have solved this problem using below ways 1) By putting your model code inside $( document ).ready() 2) Check the length of your div whether you declared div is available or not. Try the below code. require( [ 'jquery', 'Magento_Ui/js/modal/modal', 'owlslider' ], function( $, modal ) { ...


2

Adding comment as an answer to not leave this unanswered: Yes, you need a 'local.xml' file in your theme folder. In there you will need a layout tag. Read up on getting started with local.xml in themes to get you started. – Henry's Cat Jun 8 '15 at 10:12


2

There's a FREE Magento Extension for this: Print Product & Shopping Cart Page


2

There is a rule to add skin/frontend/package/theme/css/print.css. If the file exists in your theme it will automatically be added in your frontend. You could add this file and edit accordingly for print specific styles. Add a button on your productpage with window.print() as action and you are ready to go.


Only top voted, non community-wiki answers of a minimum length are eligible