Thêm thẻ H1 vào Logo cho Website WordPress sử dụng Theme Flatsome

Theo checklist kỹ thuật chuẩn SEO, thẻ H1 của Trang chủ website thường được đặt vào Logo. Dưới đây là cách để bạn có thể dễ dàng thêm thẻ H1 vào Logo cho Website WordPress sử dụng Theme Flatsome.

Bước 1: Copy file element-logo.php từ thư mục themes > flatsome > template-parts > header > partials vào thư mục child-theme tương ứng (themes > child-theme > template-parts > header > partials)

Bước 2: Thêm thẻ H1 vào theo mẫu dưới đây

<!-- Header logo -->
<?php if(is_front_page()) : ?><h1 style="margin-bottom:0"><?php endif; ?>
<?php 
    $darklogo = get_field('dark_logo','option');
    $lightlogo = get_field('light_logo','option'); 
    $stickylogo = get_field('sticky_logo','option'); 
?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?><?php echo get_bloginfo( 'name' ) && get_bloginfo( 'description' ) ? ' - ' : ''; ?><?php bloginfo( 'description' ); ?>" rel="home">
    <?php if(flatsome_option('site_logo')){
      $logo_height = get_theme_mod('header_height',90);
      $logo_width = get_theme_mod('logo_width', 200);
      $site_title = esc_attr( get_bloginfo( 'name', 'display' ) );
      if(get_theme_mod('site_logo_sticky')) echo '<img width="'.$logo_width.'" height="'.$logo_height.'" src="'.$stickylogo.'" class="header-logo-sticky" alt="'.$site_title.'"/>';
      echo '<img width="'.$logo_width.'" height="'.$logo_height.'" src="'.$darklogo.'" class="header_logo header-logo" alt="'.$site_title.'"/>';
      //if(!get_theme_mod('site_logo_dark')) echo '<img  width="'.$logo_width.'" height="'.$logo_height.'" src="'.$lightlogo.'" class="header-logo-dark" alt="'.$site_title.'"/>';
      if(get_theme_mod('site_logo_dark')) echo '<img  width="'.$logo_width.'" height="'.$logo_height.'" src="'.$darklogo.'" class="header-logo-dark" alt="'.$site_title.'"/>';
    } else {
    bloginfo( 'name' );
  	}
  ?>
</a>
<?php if(is_front_page()) : ?></h1><?php endif; ?>

Bước 3: Lưu lại kết quả và kiểm tra

Về tôi

Minh Anh

Xin chia sẻ những phần việc nhỏ ở các dự án đã triển khai để tiện sử dụng lại ở những dự án khác, giúp rút ngắn thời gian hoàn thành sản phẩm, giảm chi phí cho đối tác và khách hàng.