Наслови страница, мета ознаке и мета описи су важни за СЕО. Оне су прве ствари које корисник види на СЕРПС-у и одређују да ли ће кликнути на вашу веб локацију. Због тога је важно да оптимизујете наслове, мета ознаке и опис ваше веб странице.
У Нект.јс их додајете преко прилагођене компоненте главе. Можете их додати на све странице у апликацији или их прилагодити за сваку страницу.
Додавање глобалне ознаке главе на све странице Нект.јс
Нект.јс обезбеђује _апп.јс за иницијализацију страница. Можете га користити за креирање мета ознака које се деле на свим страницама.
увоз '../стилес/глобалс.цсс'
увоз Глава из 'следећи/глава'функцијаМиАпп({ Компонента, пагеПропс }) {
повратак <>
<Глава>
<мета наме="аутор" цонтент="Н.Н. лице"/>
</Head>
<Компонента {...пагеПропс} />
</>
}
извозУобичајено МиАпп
Ако желите да страница има прилагођени наслов и опис, додајте јој главну компоненту и Нект.јс ће је користити уместо подразумеване у компоненти апликације.
Додавање мета ознака и описа на одређену Нект.јс страницу
Статичке мета ознаке и описи су погодни за странице чији садржај остаје исти, на пример, почетна страница.
Отворите датотеку /пагес/индек.јс и измените ознаку хеад одговарајућим насловом и описом.
увоз Глава из "следећи/глава";конст Почетна= () => {
повратак (
<>
<Глава>
<наслов>Блог</title>
<мета наме="виевпорт" цонтент="почетна-скала=1.0, ширина=ширина уређаја" />
<мета наме='Опис' цонтент='Чланци о програмирању'/>
</Head>
<главни>
<х1>Добродошли на мој блог!</h1>
</main>
</>
);
};
извозУобичајено Кућа;
Компоненти Хеад приступате тако што ћете је увести из нект/хеад. Функционише додавањем елемената у хеад таг оф ХТМЛ страницу. У зависности од тога где поставите ову компоненту, мета ознаке и опис ће бити доступни у целој апликацији или на појединачним страницама.
Додавање наслова, ширине оквира за приказ и описа у датотеци _апп.јс осигурава да све странице имају исте метаподатке.
Ова страница има статички садржај, али понекад ћете можда желети да направите странице које користе динамички садржај.
Додавање динамичког мета наслова и описа на Нект.јс страницу
У зависности од случаја употребе, можете да користите гетСтатицПропс(), гетСтатицПатхс() или гетСерверСидеПропс() за преузимање података у Нект.јс. Ови подаци одређују садржај странице. Користите га за креирање метаподатака за страницу.
На пример, креирање метаподатака за Нект.јс апликацију која приказује постове на блогу било би заморно.
Препоручени начин је да направите динамичку страницу која прима идентификатор за који можете да користите преузети садржај блога. Затим можете користити овај садржај у компоненти главе.
увоз { гетАллПостс, гетСинглеПост } из "../../утилс/мдк";
увоз Глава из "следећи/глава";конст Пост = ({ наслов, опис, садржај }) => {
повратак (
<>
<Глава>
<наслов>{титле}</title>
<мета наме="Опис" цонтент={опис} />
</Head>
<главни>{/* садржај странице */}</main>
</>
);
};извозконст гетСтатицПропс = асинц ({ парамс }) => {
// добијамо једну објаву
конст пост = чекати гетСинглеПост (парамс.ид, "постс");повратак {
реквизити: { ...пост },
};
};извозконст гетСтатицПатхс = асинц () => {
// Преузми све постове
цонст патхс = гетАллПостс("постова").мап(({ ид }) => ({ парамс: { ид } }));повратак {
стазе,
повући се: лажно,
};
};
извозУобичајено Пошта;
Функција гетСтатицПропс прослеђује податке поста у Пост компоненту као пропс. Компонента Пост деструктурира наслов, опис и садржај из реквизита. Глава компонента затим користи наслов и опис у мета таговима.
Нект.јс је оптимизовани оквир
Управо сте научили како да користите компоненту хеад за додавање мета наслова и описа у Нект.јс пројекат. Користите ово знање да креирате заглавља прилагођена СЕО-у, попните се на СЕРП-ове и привучете више посетилаца на своју веб локацију.
Осим главне компоненте, Нект.јс пружа и друге компоненте попут везе и слике. Ове компоненте су унапред оптимизоване што олакшава креирање брзих веб локација прилагођених СЕО-у.
