{"id":1742,"date":"2021-04-30T10:15:47","date_gmt":"2021-04-30T10:15:47","guid":{"rendered":"https:\/\/meetanshi.com\/blog\/get-logo-url-alt-text-logo-height-and-width-in-magento-2\/"},"modified":"2025-07-16T17:56:10","modified_gmt":"2025-07-16T12:26:10","slug":"get-logo-url-alt-text-logo-height-and-width-in-magento-2","status":"publish","type":"post","link":"https:\/\/meetanshi.com\/blog\/get-logo-url-alt-text-logo-height-and-width-in-magento-2\/","title":{"rendered":"How to Get Logo URL, Alt Text, Logo Height and Width in Magento 2"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">A logo is the visual representation of your brand or store. It can communicate a message about who&nbsp;you are, what you do, and what your values are!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00a0After installing\u00a0Magento 2, one of the essential things you need to do is\u00a0<a href=\"https:\/\/meetanshi.com\/blog\/change-logo-in-magento-2\/\" target=\"_blank\" rel=\"noreferrer noopener\">change the logo<\/a>\u00a0on the website.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">When we upload or change a logo in our store, it sets logo-related information like logo size, logo URL, alt text and saved in various file formats such as PNG, GIF, JPG, or JPEG.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">While designing our Magento 2 store, we often&nbsp;need a perfect-sized logo&nbsp;that matches the size of our web page. For instance, the size of a logo must enlarge when our site transforms to the larger screen and reduce when the store opens on the mobile screen. To craft a logo of perfect dimension, we recommend using an&nbsp;<a href=\"https:\/\/meetanshi.com\/free-tools\">image resizer tool<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In that scenario, we have to dynamically<strong><em>&nbsp;get logo URL, alt text, logo height and width in Magento 2&nbsp;<\/em><\/strong>to compare the updated logo with the existing one and validate logo information.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Get the logo information dynamically and use it in further operations like comparing, validating logo details, designing purpose, etc. using the below solution:<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Method to Get Logo URL, Alt Text, Logo Height and Width in Magento 2<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Use the below code in your block file.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?php\n\nnamespace Vendor\\Module\\Block;\nclass LogoDetail extends \\Magento\\Framework\\View\\Element\\Template\n{\n    protected $logo;\n\n    public function __construct(\n        \\Magento\\Backend\\Block\\Template\\Context $context,\n        \\Magento\\Theme\\Block\\Html\\Header\\Logo $logo,\n        array $data = []\n    )\n    {\n        $this->logo = $logo;\n        parent::__construct($context, $data);\n    }\n\n\n    public function getLogoWidth()\n    {\n        return $this->logo->getLogoWidth(); \/\/ To get Logo image width\n    }\n\n    public function getLogoHeight()\n    {\n        return $this->logo->getLogoHeight(); \/\/ To get Logo image height\n    }\n\n    public function getLogoSrc()\n    {\n        return $this->logo->getLogoSrc(); \/\/ To get Url of Logo image\n    }\n\n    public function getLogoAlt()\n    {\n        return $this->_logo->getLogoAlt(); \/\/ To get Url of Logo image alternet text\n    }\n\n}\n\n?><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">You can get all block functions by printing like below in your .<strong>phtml<\/strong>&nbsp;file<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">echo $block->getLogoWidth();\/\/Print logo Width\necho $block->getLogoHeight();\/\/Print logo Height\necho $block->getLogoSrc();\/\/Print logo path \necho $block->getLogoAlt();\/\/Print logo alt text<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">That\u2019s easy, right?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Feel free to share the solution with Magento Community via social media.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Thank You.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A logo is the visual representation of your brand or store. It can communicate a message about who&nbsp;you are, what you do, and what your&#8230;<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[34],"tags":[],"class_list":["post-1742","post","type-post","status-publish","format-standard","hentry","category-magento"],"acf":[],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1742","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=1742"}],"version-history":[{"count":5,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1742\/revisions"}],"predecessor-version":[{"id":18092,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1742\/revisions\/18092"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=1742"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=1742"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=1742"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}