nextjs لا يحتوي على index.html لاستراد scripts و تعديل meta

عبد النور محمد · 23 يونيو 2021

في create react app لدينا ملف index.html في مجلد ال public خيث يمكن التعديل على لتعم التعديلات في جميع الموقع ولكن nextjs لا يحتوي ملف index.html مركزي هل هناك طريقة لانشاء ملف مركزي مشابه للذي يوجد في create raect app؟

عبدالباسط ابراهيم · 23 يونيو 2021

يمكنك استخدام الإضافة next-seoحيث توفر لك مميزات كثيرة فيمكنك إضافة meta لصفحة معينة أو إضافة meta إفتراضية لجميع الصفحات أو الموقع كالتالي

إنشاء custom App يسمى app.js_
ثم يمكنك استدعاء DefaultSeo من next-seo ثم إضافة الإعدادات التي تريدها

import App, { Container } from 'next/app';
import { DefaultSeo } from 'next-seo';

// import your default seo configuration
import SEO from '../next-seo.config';

export default class MyApp extends App {
  render() {
    const { Component, pageProps } = this.props;
    return (
      <Container>
        <DefaultSeo // Component يجب أن تكون في البداية قبل ال 
          openGraph={{
            type: 'website',
            locale: 'en_IE',
            url: 'https://www.url.ie/',
            site_name: 'SiteName',
          }}
          twitter={{
            handle: '@handle',
            site: '@site',
            cardType: 'summary_large_image',
          }}
        />
        <Component {...pageProps} />
      </Container>
    );
  }
}

عبدالله عبدالرحمن11 · 23 يونيو 2021

يمكنك إستخدام المكون المُدمج Head لإضافة عناصر الى العنصر head في الصفحة كالآتي

import Head from 'next/head'

function IndexPage() {
  return (
    <div>
      <Head>
        <title>عنوان الصفحة</title>
        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
      </Head>
      <p>فقرة</p>
    </div>
  )
}

export default IndexPage

nextjs لا يحتوي على index.html لاستراد scripts و تعديل meta

السؤال

عبد النور محمد

2 أجوبة على هذا السؤال

Recommended Posts

عبدالباسط ابراهيم

عبدالله عبدالرحمن11

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية