چگونه برای بلاگ استاتیک Next.js یک نقشه سایت ایجاد کنیم

اگر مقالات قبلی ما را درباره ساخت یک وبلاگ استاتیک با استفاده از Next.js دنبال کرده‌اید، ممکن است به بهبود SEO وبلاگتان علاقه‌مند باشید. یکی از مراحل مهم در این زمینه، ساخت نقشه‌سایت یا sitemap.xml و فایل استاندارد محدودیت ربات‌ها برای وبسایت شماست.

نقشه‌سایت فایلی است که تمام صفحات وبسایت شما را لیست می‌کند و به موتورهای جستجو کمک می‌کند تا ساختار وبسایت شما را درک کنند.

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

در مقابل، فایل استاندارد محدودیت ربات‌ها یا robots.txt به موتورهای جستجو می‌گوید که کدام صفحات یا بخش‌های وبسایت شما باید کراول نشوند و یا در فهرست نتایج جستجو گنجانده نشوند.

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

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

ما در اینجا برای ساخت فایل‌های sitemap.xml و robots.txt برای وبلاگ استاتیک Next.js، از پلاگین next-sitemap استفاده خواهیم کرد. پس مراحل زیر را دنبال کنید.

ابتدا پکیج next-sitemap را از طریق دستور زیر نصب کنید.

pnpm add next-sitemap

سپس فایل next-sitemap.config.js را در دایرکتوری ریشه پروژه Next.js ایجاد کنید. در فایلی که ایجاد کردید، کد زیر را اضافه کنید.

/** @type {import('next-sitemap').IConfig} */
module.exports = {
  siteUrl: 'https://your-website-url.com',
  generateRobotsTxt: true,
}

لطفاً اطمینان حاصل کنید که your-website-url.com را با آدرس وبسایت خود جایگزین کرده‌اید. گزینهgenerateRobotsTxt برای تولید فایل robots.txt همراه با sitemap.xml فعال شده است.

در ادامه، کد زیر را به فایل next.config.js خود اضافه کنید. این کد برای افزودن کاراکتر انتهایی (/) به آدرس‌های نقشه سایت و جلوگیری از ایجاد ادرس های دوگانه استفاده می شود.

module.exports = {
  trailingSlash: true,
}

در مرحله بعد، فایل package.json خود را با اسکریپت های زیر به روز کنید.

{
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "postbuild": "npm run export",
    "lint": "next lint",
    "preexport": "next-sitemap",
    "export": "next export"
  }
}

این اسکریپت فایل‌ها را هنگام اجرای دستورbuild تولید می کند و سپس صفحات استاتیک را به پوشهout اکسپورت می کند.

دستور زیر را برای بیلد پروژه Next.js خود و تولید فایل های استاتیک پروژه اجرا کنید.

pnpm run build

این عمل باعث ایجاد فایل های sitemap.xml و robots.txt در دایرکتوریpublic پروژه شما می شود.

برای نادیده گرفتن فایل های تولید شده توسط Git در پروژه خود، با افزودن خطوط زیر به فایل .gitignore خود، آن ها را صرف نظر کنید.

**/robots.txt
**/sitemap*.xml

این تمامی مراحل ساده برای ایجاد فایل های robots.txt و sitemap.xml برای وبلاگ استاتیک Next.js شما بود که به موتورهای جستجو کمک می کند تا وب سایت شما را با کارایی بیشتری کراول و فهرست کنند.

با دنبال کردن این مراحل ساده، شما یک نقشه سایت و یک فایل robots.txt برای وبلاگ استاتیک Next.js خود ایجاد کرده‌اید که به موتورهای جستجو در کرال و فهرست کردن وب سایت شما به صورت موثرتر کمک خواهد کرد.