【ウェブサイトSEOランキング最適化】typecho イケメンテーマ上位ウェイト最適化プラン

プログラミング 2023-06-11 19:44:53 訪問数: null

序文

前回の最適化記事では、次のように、主に typecho のさまざまな側面の美化と簡単な最適化を完了しました:
独自のブログの美化を構築する: typecho joe テーマの最適化ログ
、ブロガーは Handsome テーマを使用します。joe テーマとの比較、編集、カスタマイズ機能がより強力で便利になりましたが、致命的な問題があり、SEO効果がジョーテーマほど良くなく、テーマを切り替えるため、検索エンジンに含まれる記事も一部落ちてしまいます。したがって、ハンサムテーマに対してターゲットを絞ったSEO最適化を実行する必要があります。以下の対象を絞った最適化が主に実現されます。

  1. スパイダーインデックスを解決する際の「このページに複数の h1 タグが存在します」問題
  2. 記事内の外部リンクは最適化されていないため、重量が減少します。rel="nofollow" 属性を追加する必要があります。
  3. グローバル左側のサイドバーの最新のコメント項目にはスパムリンクが蓄積されているため、この項目を削除し、残りの項目の位置を美化します。
  4. 記事の最後にタグを付けた関連記事のおすすめをおすすめ条件として追加、合計5記事
  5. Webサイトのタイトルコネクタの両側のスペースを削除し、Webページのタイトルの有効な情報量を増やします。
  6. カスタム説明とキーワード ラベル メニューを追加する
  7. ホームページと記事ページのページネーションとラベルページの重みの分散を軽減します。

スパイダーインデックスを解決する際の「このページに複数の h1 タグが存在します」問題

質問: ソース コードを確認すると、各記事に 2 つの h1 タグがあることがわかりました。テーマファイルを検索したところ、読み込みモード後のh1であることが分かりましたが、読み込みモードのh1を変更するとタイトルディレクトリの順番に問題が発生する可能性があります。ただし、読み取りモードではディレクトリは表示されないため、デフォルトでは見た目に問題はありません。改造してもいいし、気にする人は改造しないでください。

場所: /handsome/libs/content.php

手前のh1は記事ページのタイトル、奥のh1は閲覧モードのh1なのでh2に変えるだけです。675行目あたり。

記事タイトル h1:

<header id="small_widgets" class="bg-light lter wrapper-md">
<h1 class="entry-title m-n font-thin text-black l-h">' . $archive->title;

読み取りモード h1: h2 に変更

<div id="morphing-content" class="hidden read_mode_article">
    <div class="page">
        <h2 class="title">$obj->title</h2>
        <!--修改下一行 h1 为 h2 ，此处已修改-->
        <div class="metadata singleline">
    		<a href="#" rel="author" class="byline">{
    
    $author}</a>&nbsp;•&nbsp;
			<span class="delimiter"></span><time class="date">{
    
    $time}</time>
    	</div>     
        {
    
    $core_content}
    </div>
</div>

記事内の外部リンクは最適化されていないため、重量が減少します。rel="nofollow" 属性を追加する必要があります。

nofollow には 3 つの主な機能があります。

  1. 信頼できないコンテンツを防ぐために、ブログ上の最も一般的なスパム メッセージとコメントは、ページが一部のスパム ページやスパム サイトを指すことを防ぐために、外部リンクを取得するためのスパム リンクです。
  2. 有料リンク: 有料リンクが Google の検索結果ランキングに影響を与えないように、Google では nofollow 属性の使用を推奨しています。
  3. 効果的なページをクロールするようにクローラーをガイドする: クローラーの効率に影響を与える無意味なページをクローラーがクロールするのを防ぎます。

著作権を残さずに他人のプログラムを使用することは不道徳であるため、下部に著作権情報を残す必要がありますが、著作権、ファイリング、サイト外のリンクには nofollow タグを付ける必要があります。リンク先はサイト下部の広告協力や連絡先などのページにnofollowタグを付ける必要があります。

イケメンテーマの外部リンク処理は以下の3種類に分かれます。

  • 記事の外部リンク
  • サイト全体のフレンドリーなリンク
  • 内部ページのフレンドリーなリンク

独自の最適化スキームを選択します。

記事の外部リンク

開発者ツールを通じて、記事の外部リンクのクラスが class="no-external-link" であることがわかります。このクラスに従って、テーマ ファイルをクエリします。次のコードが /handsome/libs/content に存在します。 /ScodeContent.php:

//文章中的链接，以新窗口方式打开
$content = preg_replace_callback("/<a href=\"([^\"]*)\">(.*?)<\/a>/", function ($matches) {
    
    
    if (strpos($matches[1], substr(@BLOG_URL, 0, -1)) !== false || strpos(substr($matches[1], 0, 6), "http") === false) {
    
    
        return '<a href="' . $matches[1] . '">' . $matches[2] . '</a>';
    } else {
    
    
        if (Utils::getExpertValue("no_link_ico", false)) {
    
    //true 则不加图标
            return '<a href="' . $matches[1] . '" target="_blank">' . $matches[2] . '</a>';
        } else {
    
    
            <!--在下一行添加 rel="nofollow" 此处已修改-->
            return '<span class="external-link"><a class="no-external-link" rel="nofollow"  href="' . $matches[1] . '" target="_blank"><i data-feather="external-link"></i>' .
                $matches[2] .
                "</a></span>";
        }

    }
}, $content);

コードのコメントに従って、対応するコードを追加します。

サイト全体のフレンドリーなリンク

コードの場所: /handsome/component/aside.php

明確：

<ul class="nav nav-sub dk">
      <li class="nav-sub-header">
      <!--使用links插件，输出全站友链 下一行 rel='noopener nofollow' 即可 -->
     <?php $mypattern1 = "<li data-original-title=\"{title}\" data-toggle=\"tooltip\" 
    data-placement=\"top\"><a rel='noopener nofollow' href=\"{url}\" target=\"_blank\"><span>{name}</span></a></li>";
     $options = mget();
     if ($options->pluginReady){
    
    
         Handsome_Plugin::output($mypattern1, 0, "ten");
     } ?>
</ul>

内部ページのフレンドリーなリンク

コードの場所: /handsome/libs/Content.php

明確：

$mypattern = <<<eof
<div class="col-sm-6">
<!--下一行 rel='nofollow' 即可 -->
<a href="{url}" target="_blank" class="list-group-item no-borders box-shadow-wrap-lg" rel="nofollow"> <span 
class="pull-left thumb-sm avatar m-r" > <img 
  src={
    
    image} alt="Error" class="img-square" /> <i class="{color} right"></i> </span> <span class="clear"><span class="text-ellipsis">
  {
    
    name}</span> <small 
  class="text-muted clear text-ellipsis">{
    
    title}</small> </span> </a>
</div>

グローバル左側のサイドバーの最新コメント項目にスパムリンクが蓄積される

記事へのコメントの際にリンクを残すことは可能ですが、リンクの優良性を保証するものではなく、最新のコメント欄が直接トップページに表示されるため、サイトの軽量化につながる可能性がありますので、お試しください。最新のコメント列を削除すると、次のような効果が得られます。

画像-20230608013958335

コードの場所: /handsome/component/sidebar.php

コメントを使用する:<!--注释符-->次のコードをコメント化します。

<!--在 14 行-->
<!--<?php if (COMMENT_SYSTEM == 0): ?>
<li role="presentation"> <a href="#widget-tabs-4-comments" role="tab" aria-controls="widget-tabs-4-comments" aria-expanded="false" data-toggle="tab"> <i class="glyphicon glyphicon-comment text-md text-muted wrapper-sm" aria-hidden="true"></i> <span class="sr-only"><?php _me("最新评论") ?></span> </a></li>
<?php endif; ?>-->

最新のコメントを削除した後、下部のナビゲーション バーの位置が揃っていないため、残りの 2 つの列の位置を変更する必要があります。

「最新のコメント」セクションの後のサイドバーを削除

ハンサム.min.css を変更する必要があります。その場所は /handsome/assets/css です。

通信速度を追求するため、CSSは圧縮されており、肉眼では見つけにくいですが、 .nav-tabs-alt .nav-tabs>li[data-index="0"].active~.navs- を使用できます。 slider-bar をキーワードとして Word 検索関連のコードを使用し、それに対応する:transform:translateX(xx%);xx を対応する値に変更します。

2 つのボタンは data-index="0" によって区別されることに注意してください。

  • data-index="0"対応するtransform: translateX(55%);ものを変更しますtransform: translateX(100%);
  • data-index="2"対応するtransform: translateX(460%);ものを変更しますtransform: translateX(405%);

これは CSS ファイルなので、単にクリックして更新しても意味がありません。キャッシュが読み取られます。次のように、変更された結果を確認するには、F5 キーを押してキャッシュなしでページを更新する必要があります。

カード服スタンプ.jpg

記事の最後にタグを付けた関連記事のレコメンドをレコメンド条件として追加します。

ここでは記事ページに関連記事を表示したいだけですが、個人ブログの1ページにリンクを張りすぎるのはおすすめできません。以下に書いてあるのは最大5つです。

特定のコードの場所は自分で決めることができ、記事の最後に置くだけです。ブロガーが採用した位置は、次のとおり、次の記事と前の記事の位置よりも下になります。

画像-20230608012118471

コードの場所は /handsome/post.php です。

特定の場所：

<!--120 行：上一篇&下一篇-->
<nav class="m-t-lg m-b-lg">
    <ul class="pager">
    	<?php thePrev($this); ?>   <?php theNext($this); ?>
    </ul>
</nav>

関連する紹介コード:

<!--相关推荐-->
<div class="tab-content clear">
    <h3 class="widget-title m-t-none text-md"><?php _me("相关文章") ?>
        <small><i class="fontello-bell" data-toggle="tooltip" title="我们将根据本文的tag进行相关文章的推荐"></i>
        </small>
    </h3>
    <div id="relatedPosts" >
        <ul class="list-group-item nav nav-list">
            <?php $this->related(5)->to($relatedPosts); ?>
            <?php if ($relatedPosts->have()): ?>
                <?php while ($relatedPosts->next()): ?>
                <li class="tocify-item text-second">
                    <a href="<?php $relatedPosts->permalink(); ?>" title="<?php $relatedPosts->title(); ?>"><?php $relatedPosts->title(); ?></a>
                </li>
                <?php endwhile; ?>
            <?php else : ?>
            <li>暂无相关推荐</li>
            <?php endif; ?>
        </ul>
    </div>
</div>

Webサイトのタイトルコネクタの両側のスペースを削除し、Webページのタイトルの有効な情報量を増やします。

タイトルに多くの文字が含まれるブログで、両側のスペースを削除して 1 ～ 2 文字の表示が得られる場合は、空格-空格に置き換えられます。-

$options = mget();
if ($currentPage > 1) {
    
    
	<!--删除‘-’前后空格 -->
    _me("第%s页-", $currentPage);
}

if ($commentPage > 1) {
    
    
    //todo 这种描述容易有歧义
    <!--删除‘-’前后空格 -->
    _me("第%s页-", $commentPage);
}
$obj->archiveTitle(array(
    'category' => _mt('分类 %s 下的文章'),
    'search' => _mt('包含关键字 %s 的文章'),
    'tag' => _mt('标签 %s 下的文章'),
    'author' => _mt('%s 发布的文章')
), '', ' - ');
echo $title;

ホームページの説明とキーワード表示のバグを修復する

ページのヘッダーセクションに説明がありません。

ページのソース コードに説明を追加するセクション:<meta name='description' content='在此处输入有关页面内容的描述性、富含关键字的文本。'>。

検索エンジンは、検索エンジン結果ページ (SERP) のタグで提供される説明を使用する場合があります。よく書かれた説明はページのコンテンツに適合し、検索者の意図に関連しており、検索時のページのクリックスルー率の向上につながるため、Web サイトへのトラフィックの増加に役立ちます。

抽象的なものは長すぎるか短すぎます

ページのソース コードのマークアップの説明の長さを25 ～ 160 文字に変更します。

検索エンジン クローラーは、検索結果ページの説明の最初の 150 ～ 160 文字のみを表示するため、説明が長すぎる場合、検索者はすべてのテキストを表示できない可能性があります。説明が短すぎる場合、検索エンジンは他のテキストを追加する可能性があります。その場所で見つかったコンテンツ。検索エンジンは、ユーザーが検索している内容により関連性があると判断した場合、作成した説明の代わりに他の説明を表示する場合があることに注意してください。

オリジナルの Typecho の説明とキーワードのタグはカスタマイズできないため、SEO に十分配慮していません。実際、これは非常に簡単です。元のメニューの先頭に 2 つのメニュー項目の説明とキーワードを追加します。一般原則として、それらが空の場合は、デフォルトの説明タグとキーワード タグが使用され、空でない場合は、記事執筆時に設定したタグが使用され、トップページ、タグ、分類判定が行われます。公式ドキュメントは次のとおりです: The magic is syntax - Typecho Docs

typechoフレームワークの具体的な使い方

  • それを開きvar/Widget/Archive.php、追加したコードを上記と同じ位置に次のように変更します。
if(($this->is('index') == False)AND($this->is('tag') == False)AND($this->is('category') == False)){
    
    
    if((!is_null($this->fields->description))AND(strcmp($this->fields->description,'') != 0)){
    
    
        $allows['description'] = $this->fields->description;
    }
    if((!is_null($this->fields->keywords))AND(strcmp($this->fields->keywords,'') != 0)){
    
    
        $allows['keywords'] = $this->fields->keywords;
    }
}
説明
  • 現在のページがホームページ/ラベル/カテゴリであるかどうかを判定する判定文を追加し、ホームページ、ラベル、カテゴリでない場合にのみ実行します。
  • 説明文やキーワードが空文字列かどうかを判定する判定文を追加し、空文字列の場合は元の方法を使用します。

Handsome ソースコードを変更する方法

  • 簡単なテストでは問題ありませんが、実際にご使用になる際にはご自身でテストしてください。
  • 冒頭で述べたホームページのバグは修正されました。
  • ラベルや分類判定がない場合は、上記のコードを参照して追加するだけで接続できますAND。
  • header.php公式ドキュメントを参照してください: Custom Header Information Output - Typecho Docs

具体的な方法

  • それを開きusr/themes/handsome/component/header.php、行 54 (<?php $this->header(Content::exportGeneratorRules($this)); ?>この行) を見つけて、この行を次の行に置き換えます。
<?php
        if($this->is('index')){
    
    
            $this->header(Content::exportGeneratorRules($this));
        }else{
    
    
            $custom_headerb = '';
            if(!is_null($this->fields->description)){
    
    
                $custom_headerb .= 'description=';
                $custom_headerb .= $this->fields->description;
            }
            if(!is_null($this->fields->keywords)){
    
    
                if(strcmp($custom_headerb,'') == 0){
    
    
                    $custom_headerb .= 'keywords=';
                    $custom_headerb .= $this->fields->keywords;
                }else{
    
    
                    $custom_headerb .= '&keywords=';
                    $custom_headerb .= $this->fields->keywords;
                }
            }
            if(strcmp($custom_headerb,'') == 0){
    
    
                $this->header(Content::exportGeneratorRules($this));
            }else{
    
    
                $this->header($custom_headerb);
            }
        }
    ?>

説明

  • まずホームページかどうかを判断し、ホームページであれば独自の方法を使用します。
  • 1ページ目でない場合は、個別に判断してdescription記入keywordsし、まとめてご記入ください。
  • description合計が入力されていない場合でもkeywords、元の方法が使用されます。
  • 最後にheader()関数に送信されます。

ホームページと記事ページのページネーションとラベルページの重みの分散を軽減します。

一定期間使用した結果、検索エンジンには記事ページは含まれないものの、次のページが含まれることが多いことがわかりました。

  • さまざまな記事タグが含まれるページ
  • 各種キーワード検索ページ
  • さまざまな記事カテゴリのページ

検索エンジンが他のページではなくより多くの記事をインデックスできるようにするために、スパイダー シールド ファイル robots.txt に次の情報が追加されます。

Disallow: /category
Disallow: /tag
Disallow: /search

プラグインの補足推奨事項

Pretty_for_handsome : Typecho テーマ Handsome 用の特別な美化プラグイン。テーマのコードを変更するという複雑な操作を置き換えるプラグインです。次の機能があります。

  • iframe ビデオ記事の埋め込みの最適化
  • iframe ビデオのショートコード挿入
  • 応答時間と訪問者数の合計 (サイト全体の文字数が制限され、サーバーの負荷が軽減されます)
  • 右側のサイドバーのタイムラプスモジュール
  • 上部のナビゲーションには天気が表示されます
  • 左側のディレクトリの色のアイコン
  • 色付きのタグと右側の色付きのタグクラウド
  • マウスが回転してアバターが拡大されます
  • マウスクリック効果
  • 記事タイトルを中央揃え
  • ロゴスイープライト
  • レプリケーション成功のプロンプト
  • H1/H2タイトル背景色の設定
  • 報酬ボタンのバウンス効果
  • モバイルでタグクラウドとブログ情報を非表示にする
  • ホーム 記事 マウスオーバー フローティング
  • ウェブサイトの稼働時間
  • 記事終了ロゴ
  • 記事QRコード
  • 記事の最後にある Baidu ボタンを送信してください
  • フルステーション白黒
  • 著作権表示は記事の下部にあります
  • コメントの境界線と影
  • アバターの呼吸効果に関するコメント
  • 記事ヘッダー画像のフローティング
  • ホームページのカルーセルのスタイルを最適化する
  • ダイナミックな背景
  • トップページの画像レイアウト、記事タイトルのスタイルを最適化する
  • モバイル端末の動的背景スイッチを非表示にする
  • ナイトモードは動的背景スイッチを非表示にします
  • 静的な壁紙の設定
  • 記事前の広告スペースを増やす
  • コメント欄前の広告スペースを増やす

おすすめ

転載: blog.csdn.net/yumuing/article/details/131100133
おすすめ
ランキング
Oracleのクエリ重複フィールド
An error occurred when ssm used count to query data
【Leyes de la Naturaleza】La sabiduría de las multitudes
JavaWebの研究では、（13）を締結 - セッションの使用は、重複送信フォームを防ぎます
Firebase増加サインアップクォータ
[MyBatisフレームワーク]mybatis入門
ハートレスの世界
Djangoのインストールと使用について
[转] UiPath展開アーキテクチャ
mybatis-plusは楽観的なロック変更を使用します
アーカイブ
もっと
2024-05-14(9)
2024-05-13(8)
2024-05-12(27)
2024-05-11(31)
2024-05-10(33)
2024-05-09(30)
2024-05-08(18)
2024-05-07(34)
2024-05-06(6)
2024-05-05(0)

コードワールド

© 2018 codetd.com