توجيه الثقافة في Blazor: روابط ثقافية صديقة للسيو في Blazor

السعر
5 €حوالي 21.20 د.إ.‏
آخر تحديث 29‏‏/1‏‏/2026
حزمة البرمجيات Blazor Server · VS 2026 · .NET 10 · TablerForNet

في هذا الدرس الخاص بـ Blazor، ستطبق روابط ثقافية صديقة للسيو بحيث تستخدم كل صفحة روابط نظيفة وقابلة للفهرسة مثل ghostlyinc.com/en-us/page-name. ستتعلم كيفية تبديل الثقافات بأمان، والحفاظ على تنقل متسق، وتحسين اكتشاف المحتوى متعدد اللغات. لنبدأ خطوة بخطوة.

إذا كنت تريد الأساسيات كاملة أولاً، اقرأ ما هو Blazor؟ ثم عد لتطبيق توجيه الثقافة لتحسين السيو.

توجيه عناوين URL في Blazor بناءً على الثقافة لعرض هياكل صفحات متعددة اللغات صديقة لـ SEO
أنماط عناوين URL المدركة للثقافة في Blazor التي تعزز الفهرسة ووضوح التنقل والوصول العالمي

ما ستبنيه في هذا الدرس حول الروابط الثقافية الصديقة للسيو

يرشدك هذا الدليل خلال التنفيذ الكامل:

  • تغيير ثقافة التطبيق: تحديث الثقافة بشكل متسق في تطبيق Blazor الخاص بك.
  • استخدم نظام روابط منظم: قدم الصفحات تحت /en-us/your-page لكل ثقافة.
  • دعم تغييرات الثقافة عبر المتصفح: اسمح للمستخدمين بتبديل الثقافات حسب تفضيلاتهم.
  • تعامل مع روابط الثقافة غير الصالحة: أعد التوجيه أو استخدم بديلًا عند عدم دعم الثقافة.
  • حافظ على روابط صديقة للسيو ومخصصة للثقافة: اجعل كل صفحة مترجمة سهلة الزحف.
  • حسّن الفهرسة وتجربة المستخدم: عزز الظهور مع الحفاظ على تجربة متوقعة.

للمزيد عن البيانات الوصفية وأساسيات السيو المنظمة في Blazor، راجع مكون بيانات SEO لـ Blazor.


خطوة بخطوة: تنفيذ روابط ثقافية صديقة للسيو في Blazor

لننتقل الآن إلى الكود الذي يضيف توجيهًا معتمدًا على الثقافة لتطبيق Blazor الخاص بك. اتبع كل خطوة لتحصل على روابط ثقافية متسقة عبر الصفحات الحالية والمستقبلية.

C#



بعد ذلك، أضف متحكم الثقافة. يطبق الثقافة المختارة ويعيد توجيه المستخدم إلى الرابط الصحيح الخاص بالثقافة.

C#



في هذه المرحلة لديك ICultureService و CultureController. الآن قم بالتحديث Program.cs مع هذه التغييرات:

  • سجّل ICultureService.
  • حدد الثقافة الافتراضية كأول ثقافة مدعومة في القائمة.
  • قم بتكوين الثقافات المدعومة لترجمة المحتوى.
  • قم بتكوين الثقافات المدعومة لواجهة المستخدم.
  • طبق خيارات الترجمة المكونة على مسار الطلبات.
  • ربط طلبات HTTP الواردة بإجراءات المتحكم المناسبة.
C#




قم بالتحديث الآن _host.cshtml مع هذه التغييرات:

  • قم بحقن ICultureService.
  • تعيين خاصية lang في HTML.
  • تعيين ملف تعريف الارتباط للثقافة في وسم body.
Razor



قم بالتحديث الآن App.razor مع هذه التغييرات:

  • قم بحقن ICultureService.
  • حقن مدير التنقل.
  • أضف قسم الكود الموضح أدناه.
Razor

@inject NavigationManager Navigation
@inject ICultureService cultureService

@code {

    /// <summary>
    /// This section handles redirection to a new culture when the user changes the culture in the browser link.
    /// If you don't wish to support this, you can delete this code.
    /// By default, it redirects to the current culture if no culture is specified in the link.
    /// </summary>
    /// <param name="firstRender">Indicates whether this is the initial rendering of the page</param>
    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            // Check if the link contains a specified culture
            var culture = cultureService.GetCultureFromLink(Navigation.Uri, Navigation.BaseUri);

            // If the culture string is null or empty, it's the page's first load. In this case, set the culture from the browser settings.
            if (string.IsNullOrEmpty(culture)) culture = CultureInfo.CurrentCulture.Name.ToLowerInvariant();

            // Check if the culture is supported by the application
            if (!cultureService.IsCultureSupported(culture))
            {
                // Try to set the language contained in the culture
                culture = cultureService.HandleUnsupportedCulture(culture);
            }

            var cultureInfo = new CultureInfo(culture);

            // If the current culture differs from the specified culture, set the new culture
            if (!string.Equals(CultureInfo.CurrentCulture.Name, culture, StringComparison.OrdinalIgnoreCase))
            {
                cultureService.SetCulture(cultureInfo);
            }
        }
    }
}

أنشئ مكونًا جديدًا لاختبار الثقافات المختلفة: ChangeCulture.razor


Razor

@using System.Globalization
@inject ICultureService cultureService

<button @onclick="() => SetCulture(Englisch)"> Englisch</button>
<button @onclick="() => SetCulture(Arabische)"> Arabische</button>
<button @onclick="() => SetCulture(France)"> France</button>
<button @onclick="() => SetCulture(Austria)"> Austria</button>
<button @onclick="() => SetCulture(Germany)"> Germany</button>

@code {
    private string Englisch = "en-us";
    private string Arabische = "ar-ae";
    private string France = "fr-fr";
    private string Austria = "de-at";
    private string Germany = "de-de";

    private void SetCulture(string culture)
    {
        cultureService.SetCulture(new CultureInfo(culture));
    }
}


قم بالتحديث الآن MainLayout.razor مع هذه التغييرات:

  • قم بحقن ICultureService.
  • حقن مدير التنقل.
  • أضف المكون قبل الإنشاء.
  • أضف قسم الكود الموضح أدناه.
Razor

@inject NavigationManager navi
@inject ICultureService cultureService

<article class="content px-4">
    <ChangeCulture/>
    @Body
</article>

@code {
    // Here we redirect to culture link, for example, from example.com to example.com/de-de/
    protected override void OnAfterRender(bool firstRender)
    {
        // Only perform this logic on the first render
        if (firstRender)
        {
            // Extract the relative path from the current URI by removing the base URI
            var currentUri = navi.Uri.Replace(navi.BaseUri, ");

            // Find the index of the first slash in the relative path
            int firstSlashIndex = currentUri.IndexOf('/');

            // Prepare the culture-specific URI
            string uri;
            if (firstSlashIndex >= 0)
            {
                // Extract the part of the relative path after the first slash
                string result = currentUri.Substring(firstSlashIndex + 1);

                // Construct the culture-specific URI
                uri = "/" + cultureService.Culture + "/" + result;
            }
            else
            {
                // If no slash was found in the relative path, navigate to the root path for the current culture
                uri = "/" + cultureService.Culture + "/";
            }

            // Navigate to the determined URI
            navi.NavigateTo(uri, false, false);
        }

        // Call the base OnAfterRender method to ensure proper functioning of the component
        base.OnAfterRender(firstRender);
    }
}

تطبيق توجيه الثقافة على جميع الصفحات

الآن، مع تطبيق روابط ثقافية صديقة للسيو عبر جميع صفحات Blazor، أنشأت نهجًا متسقًا ينطبق على الصفحات الحالية والمستقبلية. عند إضافة مسارات جديدة، طبق نفس الخطوات للحفاظ على قابلية الزحف والتوقع لكل صفحة مترجمة.

  • قم بحقن ICultureService.
  • أنشئ معامل الثقافة.
  • حدد معامل الثقافة في طريقة OnInitialized.
  • أضف معامل الثقافة إلى وسم الصفحة.

الكود التالي يوضح التغييرات على الصفحة fetchdata.razor

Razor


اختيار تعلم Blazor

بناء تطبيقات Blazor بثقة باستخدام أنماط عملية

نصيحة مني تعلمت الكثير هنا من خلال إرشادات فيديو عملية حول أساسيات Blazor، خيارات البنية، وتصميم المكونات القابلة للصيانة.

  • مختبرات خطوة بخطوة لمكونات Razor، الحالة، وحقن التبعيات.
  • إرشادات عملية حول الاستضافة، الأداء، وسير العمل للنشر.
  • تقنيات واجهة مستخدم نظيفة تحافظ على قابلية صيانة كود Blazor الخاص بك.
استكشف دورة Blazor

لماذا روابط الثقافة الصديقة للسيو مهمة في Blazor

  • حسّن إمكانية الاكتشاف: تساعد الروابط المعتمدة على الثقافة محركات البحث على فهم المحتوى الخاص بكل لغة وفهرسته بشكل صحيح.
  • عزز ثقة المستخدم: يتعرف المستخدمون فورًا على /en-us/ أو /de-de/ مما يقلل الاحتكاك ويزيد التفاعل.
  • حافظ على تنقل متسق: نمط رابط موحد عبر الموقع يمنع التنقل بلغات مختلطة.
  • وسع المحتوى متعدد اللغات: يمكنك إضافة لغات جديدة دون إعادة تصميم المسارات أو تكرار الصفحات.
  • اجعل موقعك مستقبليًا: تتبع الصفحات الجديدة تلقائيًا نفس قواعد توجيه الثقافة الصديقة للسيو.
  • الوصول العالمي: تسهل الروابط الخاصة بالثقافة استهداف مناطق وتفضيلات لغوية مختلفة.

إذا كنت تخطط لنشر Blazor Server علنًا، فهذه ملاحظات الاستضافة قد تساعدك: استضافة Blazor Server على UpCloud.

الأسئلة المتكررة

إجابات على الأسئلة الشائعة حول روابط الثقافة وترجمة Blazor

لقد انتهينا. لأي صفحات مستقبلية، كرر خطوات المسار + معامل الثقافة. وعند إنشاء روابط في الكود، أدرج دائمًا جزء الثقافة لتجنب التنقل المعطل.