Whenever customers receive an order confirmation email or a password reset email, they need a sign to know that it has been sent from your store. That time, they might pay attention to the email logo. Uploading a logo to every transactional email, hence, is a must task. Unfortunately, in Magento 2.1, many merchants run into a problem, say, the image uploaded is missing.
In this article, we show you how to fix “Fail to Upload Magento Transactional Email Logo in 2.1” right!
When Does This Issue Happen?
It might occur when you try to upload a Magento transactional email logo by following Admin ⇒ Content ⇒ Design ⇒ Configuration ⇒ Select Your Current Theme
Under Transactional Emails in the Logo Image field, please Upload your Magento transactional email logo. You will see the logo to be displayed as follow:
CHECK NOW >>> Magento 2 Admin Email Notification extension
After you save the Magento 2 email logo, however, it shows a missing image.
Please right-click and select Inspect elements, you can check the URL of the logo. This URL varies based on your uploading. Mine is http://mywebsite.com/pub/media/email/logo/stores/1/mylogo.png
If you go to this URL, it turns out a 404 Page. And, when following the folder pub/media/email/logo/stores/1/ this directory does not exist.
It refers that Magento does not save your logo in the directory as above. In fact, the logo is saved in the pub/media/logo/stores/1/
How to Fix It Right?
To fix this issue, you can choose either of the following solutions.
Solution 1: Override the default Magento 2 email logo using a theme
Step 1:
Go to the app/design/frontend/YourVendorName/YourThemeName/Magento_Email/web/ directory in your custom theme.
Step 2:
Rename the logo you want to upload to “logo_email.png” (it is the default Magento logo name), then copy this image to the folder that has just been created.
Solution 2: Create a module and change upload_dir
Step 1: Create the registration.php file
In the app/code/Bss/TransactionEmail/registration.php please add the following code:
<?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::MODULE, 'Bss_TransactionEmail', __DIR__ );
Step 2: Create the module.xml file
In the app/code/Bss/TransactionEmail/etc/module.xml add the code:
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Bss_TransactionEmail" setup_version="1.0.0"> </sequence> <module name="Magento_Theme"/> </sequence> </module> </config>
Step 3: Create the di.xml file
In the app/code/Bss/TransactionEmail/etc/di.xml add the code:
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> <preference for="Magento\Theme\Model\Design\Backend\Logo" type="Bss\TransactionEmail\Model\Design\Backend\Logo"/> </config>
Step 4: Create the Logo.php file
In the app/code/Bss/TransactionEmail/Model/Design/Backend/Logo.php add the code:
<?php namespace Bss\TransactionEmail\Model\Design\Backend; class Logo extends \Magento\Theme\Model\Design\Backend\Image { const UPLOAD_DIR = 'email/logo'; protected function _getUploadDir() { return $this->_mediaDirectory->getRelativePath($this->_appendScopeInfo(self::UPLOAD_DIR)); } }
Run following command in your terminal:
php bin/magento setup:upgrade php bin/magento setup:static-content:deploy php bin/magento cache:flush
Now, go to your website and order a product and check whether the order confirmation email has the new logo image.
That’s all for Magento transactional email logo troubleshooting and I hope it is helpful for you.
P/S: Stay tuned with our Magento knowledge base series to get more and more useful information.
BSS Commerce is one of the leading Magento extension providers and web development services in the world. With experienced and certified Magento developers, we commit to bring high-quality products and services to optimize our business effectively.
CONTACT NOW to let us know your problems. We are willing to support you every time.
