How is the frontend logo block implemented?

dmitrii_fediuk · April 2, 2016, 12:01am

The frontend logo is implemented by the \Magento\Theme\Block\Html\Header\Logo class:

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/view/frontend/layout/default.xml#L50-L57


<container name="header-wrapper" label="Page Header" as="header-wrapper" htmlTag="div" htmlClass="header content">
    <block class="Magento\Theme\Block\Html\Header\Logo" name="logo">
        <arguments>
            <argument name="logo_img_width" xsi:type="number">189</argument>
            <argument name="logo_img_height" xsi:type="number">64</argument>
        </arguments>
    </block>
</container>

The standard Luma design theme adjusts the default width and height for the logo:

github.com

magento/magento2/blob/d447fa6e1/app/design/frontend/Magento/luma/Magento_Theme/layout/default.xml#L17-L22


<referenceBlock name="logo">
    <arguments>
        <argument name="logo_img_width" xsi:type="number">148</argument>
        <argument name="logo_img_height" xsi:type="number">43</argument>
    </arguments>
</referenceBlock>

The logo block uses the html/header/logo.phtml template:

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/Block/Html/Header/Logo.php#L14-L19


/**
 * Current template name
 *
 * @var string
 */
protected $_template = 'html/header/logo.phtml';

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/view/frontend/templates/html/header/logo.phtml#L9-L29


/**
* @var \Magento\Theme\Block\Html\Header\Logo $block
*/
?>
<?php $storeName = $block->getThemeName() ? $block->getThemeName() : $block->getLogoAlt();?>
<span data-action="toggle-nav" class="action nav-toggle"><span><?php /* @escapeNotVerified */ echo __('Toggle Nav') ?></span></span>
<?php if ($block->isHomePage()):?>
   <strong class="logo">
<?php else: ?>
   <a class="logo" href="<?php echo $block->getUrl(''); ?>" title="<?php /* @escapeNotVerified */ echo $storeName ?>">
<?php endif ?>
       <img src="<?php /* @escapeNotVerified */ echo $block->getLogoSrc() ?>"
            alt="<?php /* @escapeNotVerified */ echo $block->getLogoAlt() ?>"
            <?php echo $block->getLogoWidth() ? 'width="' . $block->getLogoWidth() . '"' : '' ?>
            <?php echo $block->getLogoHeight() ? 'height="' . $block->getLogoHeight() . '"' : '' ?>
       />
<?php if ($block->isHomePage()):?>
   </strong>
<?php else:?>
   </a>
<?php endif?>

The template uses the following \Magento\Theme\Block\Html\Header\Logo instance methods:

getLogoWidth() for the logo’s width:

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/Block/Html/Header/Logo.php#L81-L95


/**
 * Retrieve logo width
 *
 * @return int
 */
public function getLogoWidth()
{
    if (empty($this->_data['logo_width'])) {
        $this->_data['logo_width'] = $this->_scopeConfig->getValue(
            'design/header/logo_width',
            \Magento\Store\Model\ScopeInterface::SCOPE_STORE
        );
    }
    return (int)$this->_data['logo_width'] ? : (int)$this->getLogoImgWidth();
}

getLogoHeigjht() for the logo’s height:

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/Block/Html/Header/Logo.php#L97-L111


/**
 * Retrieve logo height
 *
 * @return int
 */
public function getLogoHeight()
{
    if (empty($this->_data['logo_height'])) {
        $this->_data['logo_height'] = $this->_scopeConfig->getValue(
            'design/header/logo_height',
            \Magento\Store\Model\ScopeInterface::SCOPE_STORE
        );
    }
    return (int)$this->_data['logo_height'] ? : (int)$this->getLogoImgHeight();
}

getLogoSrc() for the logo’s image (`src` attribute):

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/Block/Html/Header/Logo.php#L52-L63


/**
 * Get logo image URL
 *
 * @return string
 */
public function getLogoSrc()
{
    if (empty($this->_data['logo_src'])) {
        $this->_data['logo_src'] = $this->_getLogoUrl();
    }
    return $this->_data['logo_src'];
}

getLogoAlt() for the logo’s alternative text (`alt` attribute):

github.com

magento/magento2/blob/d447fa6e1/app/code/Magento/Theme/Block/Html/Header/Logo.php#L65-L79


/**
 * Retrieve logo text
 *
 * @return string
 */
public function getLogoAlt()
{
    if (empty($this->_data['logo_alt'])) {
        $this->_data['logo_alt'] = $this->_scopeConfig->getValue(
            'design/header/logo_alt',
            \Magento\Store\Model\ScopeInterface::SCOPE_STORE
        );
    }
    return $this->_data['logo_alt'];
}

dmitrii_fediuk · April 2, 2016, 12:02am

getLogoWidth() for the logo’s width:

getLogoHeigjht() for the logo’s height:

getLogoSrc() for the logo’s image (src attribute):

getLogoAlt() for the logo’s alternative text (alt attribute):

getLogoSrc() for the logo’s image (`src` attribute):

getLogoAlt() for the logo’s alternative text (`alt` attribute):