زیرو سئو

اخبار و آموزش روز دنیای سئو

نحوه استفاده از آنها برای بهبود سئو

توسط ·


وردپرس محبوب ترین سیستم مدیریت محتوا (CMS) در جهان است که سهم بازار آن بیش از 60 درصد است.

یک انجمن بزرگ پشتیبانی و تعدادی افزونه رایگان موجود، ساخت یک وب‌سایت با وردپرس (WP) را مقرون به صرفه می‌سازد، و نقش کلیدی در این که چرا سهم آن در بازار بسیار زیاد است، دارد.

با این حال، همانطور که می دانید، نصب افزونه ها هزینه دارد.

آنها اغلب ممکن است نمرات Core Web Vitals شما را کاهش دهند. برای مثال، ممکن است فایل‌های CSS یا JS غیرضروری را در هر صفحه‌ای که به آن‌ها نیازی ندارند، بارگذاری کنند.

برای رفع آن، باید یک برنامه نویس استخدام کنید تا این کار را برای شما انجام دهد، یک افزونه ممتاز بخرید، یا شاید یک مسیر یادگیری کوچک را طی کنید و خودتان این کار را انجام دهید.

شما همچنین می توانید ترکیبی شوید و برخی از بخش های مشکلات خود را با کدنویسی سفارشی و بخش های دیگر را با استفاده از افزونه ها حل کنید.

هدف این مقاله کمک به شما در مسیر یادگیری است و ما به شما در مورد نیازترین قلاب های وردپرس برای کمک به بهبود سئوی فنی وب سایت خود کمک می کنیم.

هوک وردپرس چیست؟

قلاب‌های وردپرس ویژگی‌های کلیدی در WP هستند که به توسعه‌دهندگان اجازه می‌دهند تا عملکرد CMS را بدون نیاز به تغییر فایل‌های اصلی WP گسترش دهند – به‌روزرسانی تم‌ها یا افزونه‌ها را بدون شکستن تغییرات سفارشی آسان‌تر می‌کند.

آنها یک راه قدرتمند برای توسعه دهندگان ارائه می کنند تا عملکرد وردپرس را گسترش دهند و تغییرات سفارشی در سایت های خود ایجاد کنند.

قلاب فیلتر چیست؟

تابع فیلتر قلاب برای اصلاح خروجی تابع قبل از بازگشت استفاده می شود. به عنوان مثال، می توانید با استفاده از قلاب فیلتر wp_title، عنوان صفحه را با نام وبلاگ خود پسوند کنید.

اکشن هوک چیست؟

Action Hook به برنامه نویسان اجازه می دهد تا اقدامات خاصی را در یک نقطه خاص از اجرای WP Core، افزونه ها یا تم ها انجام دهند، مانند زمانی که یک پست منتشر می شود یا فایل های JS و CSS بارگذاری می شوند.

با یادگیری چند قلاب یا فیلتر اصلی، می توانید طیف گسترده ای از وظایف را بدون نیاز به استخدام توسعه دهندگان انجام دهید.

قلاب های زیر را مرور خواهیم کرد:

  • wp_enqueue_scripts
  • wp_head
  • script_loader_tag
  • template_redirect
  • wp_headers

wp_enqueue_scripts

این دقیقا همان قلابی است که برای حذف فایل‌های اضافی CSS یا JS از بارگذاری در صفحاتی که نیازی به آنها نیست، استفاده می‌کنید.

به عنوان مثال، افزونه محبوب رایگان تماس با فرم 7، که بیش از 5 میلیون نصب دارد، فایل‌های CSS و JS را در همه صفحات بارگیری می‌کند – در حالی که فرد فقط برای بارگیری در جایی که فرم تماس وجود دارد به آن نیاز دارد.

برای حذف فایل‌های CF7 CSS و JS در صفحاتی غیر از صفحه تماس، می‌توانید از قطعه کد زیر استفاده کنید.

function my_dequeue_script(){
//check if page slug isn't our contact page, alternatively, you can use is_page(25) with page ID, or if it is a post page is_single('my-post') 
  if ( !is_page('contact') ) {
     wp_dequeue_script('google-recaptcha');
     wp_dequeue_script('wpcf7-recaptcha');
     wp_dequeue_script('contact-form-7');
     wp_dequeue_style('contact-form-7');
  }

}
add_action('wp_enqueue_scripts', 'my_dequeue_script', 99 );

چند نکته کلیدی وجود دارد؛ اولویت اکشن هوک روی 99 تنظیم شده است تا اطمینان حاصل شود که اصلاحات ما آخرین بار در صف اجرا می شوند.

اگر آن را مثلاً روی 10 تنظیم کنید، کار نمی‌کند زیرا تابع صف‌بندی CF7 از اولویت 20 استفاده می‌کند. بنابراین برای اطمینان از آخرین اجرا و تأثیرگذاری، اولویت را به اندازه کافی بزرگ تنظیم کنید.

همچنین، در کد، از شناسه آرگومان تابع “contact-form-7” استفاده کردیم. ممکن است تعجب کنید که چگونه آن را پیدا کردم.

این بسیار ساده و شهودی است. فقط از ابزار بازرسی عنصر مرورگر خود استفاده کنید و ویژگی id تگ های پیوند یا اسکریپت را بررسی کنید.

ویژگی id تگ اسکریپتتصویر از نویسنده، فوریه 2023

می‌توانید کد منبع وب‌سایت خود را با استفاده از عنصر بازرسی بررسی کنید و هر فایل JS یا CSS را در جایی که نیازی ندارید، شروع کنید.

wp_head

این اکشن هوک برای افزودن هرگونه منبع JS، فایل CSS یا متا تگ در بخش صفحه وب استفاده می شود.

با استفاده از این قلاب، می توانید منابع پیش بارگذاری شده را در قسمت head بارگذاری کنید، که می تواند امتیاز LCP شما را بهبود بخشد.

به عنوان مثال، پیش بارگذاری فونت، که یکی از توصیه های Google است، یا آرم و تصاویر برجسته در صفحات مقاله، همیشه در بالای صفحه بارگذاری می شود – و برای بهبود LCP باید آنها را از قبل بارگذاری کنید.

برای آن، از قطعه کد زیر استفاده کنید.

function my_preload() {
?>
   <!-- Google Fonts -->
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,200..900;1,200..900&family=Lora:ital,wght@0,400..700;1,400..700&display=swap"/>
   <link rel="preload" as="image" href="https://www.yoursite.com/path-to-logo/image.jpg"/>
   <?php if( has_post_thumbnail() ): // check if article has featured image?>
   <!-- Featured Image -->
   <?php // $featured_image = str_ireplace(array( '.png', '.jpg', '.jpeg'), '.webp', $featured_image ); // enable this if you have webp images. ?>
   <?php $featured_image = get_the_post_thumbnail_url( get_the_ID(), 'full' ); ?>
   <link rel="preload" as="image" href="<?php echo $featured_image;?>"/>
   <?php endif;
}
add_action('wp_head', 'my_preload', 3 );

دو خط اول برای بارگذاری فونت های گوگل از قبل است، سپس لوگو را از قبل بارگذاری می کنیم و بررسی می کنیم که آیا مقاله دارای تصویر برجسته است یا خیر، سپس تصویر برجسته را از قبل بارگذاری می کنیم.

به عنوان یک یادداشت اضافی، موضوع یا سایت شما ممکن است تصاویر webp را فعال کرده باشد. در این صورت، باید نسخه webp آنها را از قبل بارگذاری کنید.

script_loader_tag

شما در مورد منابع مسدودکننده رندر زیاد شنیده اید که می توانند با به تعویق انداختن یا ناهمگام بارگذاری برچسب های جاوا اسکریپت رفع شوند. برای بهبود FCP و LCP حیاتی است.

این عمل فیلتر برای فیلتر کردن خروجی HTML تگ‌های اسکریپت استفاده می‌شود و شما دقیقاً به این فیلتر برای همگام‌سازی یا به تعویق انداختن بارگذاری تم یا فایل‌های JS/CSS افزونه خود نیاز دارید.

function my_defer_async_load( $tag, $handle ) {
   // async loading scripts handles go here as an array
   $async_handles = array('wpcf7-recaptcha', 'another-plugin-script');
   // defer loading scripts handles go here as an array
   $defer_handles = array('contact-form-7', 'any-theme-script');
   if( in_array( $handle, $async_handles) ){
     return str_replace( ' src', ' async src', $tag );
   }
   if( in_array( $handle, $defer_handles ) ){
     return str_replace( ' src', ' defer="defer" src', $tag );
   }
return $tag;
}
add_filter('script_loader_tag', 'my_defer_async_load', 10, 2);

این فیلتر دو آرگومان را می پذیرد: تگ HTML و دسته اسکریپت که در بالا هنگام بررسی از طریق عنصر بازرسی به آنها اشاره کردم.

می‌توانید از دسته برای تصمیم‌گیری برای بارگیری ناهمگام یا به تعویق انداختن اسکریپت استفاده کنید.

پس از به تعویق انداختن یا عدم همگام سازی بارگذاری، همیشه از طریق کنسول مرورگر بررسی کنید که آیا خطاهای JS دارید. اگر خطاهای JS را مشاهده کردید، ممکن است به یک توسعه دهنده نیاز داشته باشید که به شما کمک کند، زیرا رفع آنها ممکن است ساده نباشد.

template_redirect

این اکشن هوک قبل از تعیین الگوی بارگیری فراخوانی می شود. می توانید از آن برای تغییر کد وضعیت HTTP پاسخ استفاده کنید.

برای مثال، ممکن است به صفحات درخواست جستجوی داخلی خود، بک لینک های اسپم حاوی کاراکترهای عجیب و/یا الگوهای رایج داشته باشید.

در ژورنال موتور جستجو، ما به داشتن بک لینک های اسپم که به صفحات جستجوی داخلی ما که به زبان کره ای هستند، عادت کرده ایم – و از لاگ های سرور خود دریافتیم که ربات گوگل به شدت در حال خزیدن آنها بوده است.

بک لینک های اسپمتصویر از نویسنده، فوریه 2023

کد پاسخ پیش‌فرض وردپرس 404 یافت نشد، اما بهتر است 410 را وارد کنید تا به گوگل بگویید برای همیشه از بین رفته‌اند، بنابراین خزیدن آنها را متوقف می‌کند.

function my_410_function(){
  if( is_search() ) {
    $kw = $_GET['s'];
    // check if the string contains Korean characters
    if (preg_match('/[\x{AC00}-\x{D7AF}]+/u', $kw)) {
     status_header(410, 'Not Found');
    }
  }// end of is_search
}
add_action( 'template_redirect', 'my_410_function', 10 );

در مورد ما، ما می دانیم که محتوای کره ای نداریم، به همین دلیل شرایط خود را اینگونه تنظیم کردیم.

اما ممکن است محتوای بین المللی به زبان کره ای داشته باشید و شرایط ممکن است متفاوت باشد.

به طور کلی، برای غیر برنامه نویسان، ChatGPT یک ابزار عالی برای ایجاد شرایط با استفاده از یک عبارت منظم است، که می توانید از آن برای ایجاد یک شرط if/else بر اساس الگوی هرزنامه خود از GSC استفاده کنید.

wp_headers

این اکشن هوک برای اصلاح هدرهای HTTP وردپرس استفاده می شود.

شما می توانید از این قلاب برای اضافه کردن هدرهای امنیتی به هدرهای HTTP پاسخ وب سایت خود استفاده کنید.

function my_headers(){
      $headers['content-security-policy'] = 'upgrade-insecure-requests';
      $headers['strict-transport-security'] = 'max-age=31536000; preload';
      $headers['X-Content-Type-Options'] = 'nosniff';
      $headers['X-XSS-Protection'] = '1; mode=block';
      $headers['x-frame-options'] = 'SAMEORIGIN';
      $headers['Referrer-Policy'] = 'strict-origin-when-cross-origin';
      $headers['Link'] = '<https://www.yoursite.com/wp-content/uploads/themes/yourtheme/images/logo.jpg>; rel=preload; as=image';
     $headers['Link'] = '<https://fonts.gstatic.com>; rel=preconnect; crossorigin'; 
$headers['Link'] = '</wp-content/uploads/themes/yourtheme/images/logo.webp>; rel=preload; as=image';
      return $headers;
 }
add_filter( 'wp_headers', 'my_headers', 100 );

در کنار هدرهای امنیتی، می‌توانید تگ‌های «پیوند» (به تعداد دلخواه) را برای اتصال یا بارگذاری اولیه هر منبعی اضافه کنید.

اساسا، این یک روش جایگزین برای پیش بارگذاری است که در بالا توضیح داده شد.

همچنین می‌توانید «X-Robots-Tag» (هر تعداد که بخواهید) به هدرهای HTTP خود بر اساس نیاز خود اضافه کنید.

نتیجه

پلاگین ها اغلب با هدف حل طیف گسترده ای از وظایف هستند و ممکن است اغلب به طور خاص برای برآوردن نیازهای خاص شما طراحی نشده باشند.

سهولت در تغییر هسته وردپرس یکی از زیباترین جنبه های آن است – و می توانید آن را با چند خط کد تغییر دهید.

ما در مورد اکشن هوک‌هایی صحبت کردیم که می‌توانید از آنها برای بهبود سئوی فنی استفاده کنید، اما وردپرس دارای تعداد زیادی قلاب اکشن است که می‌توانید با استفاده از آن‌ها اساساً هر کاری را که می‌خواهید با حداقل استفاده از افزونه‌ها انجام دهید.

منابع بیشتر:

تصویر ویژه: Grafico moze/Shutterstock





منبع

برچسب‌ها:

مطالب مرتبط