Google Карталарын веб -сайтка кантип кыстаруу керек: 4 кадам

2024 Автор: John Day | [email protected]. Акыркы өзгөртүү: 2024-01-30 10:39

Карталар чакырыгында мага добуш бериңиз!

Жакында мен Google Карталарын колдонгон вебсайт түздүм. Google Карталарын веб -сайтыма жайгаштыруу абдан оңой жана анча кыйын болгон жок. Бул Нускамада мен сизге Google Карталарын веб -сайтыңызга орнотуу канчалык оңой экенин көрсөтөм.

Чынын айтсам, мен Google Карталарды веб -сайтыма жөн гана көңүл ачуу үчүн киргиздим. Карантинде турганда көп нерсе жок, андыктан Google Карталарын колдонгон вебсайт жасабаңыз, анан бул вебсайтты түзүүдө жасаган кадамдарымды элге көрсөтпөйсүзбү.

Эми айта кетишим керек, Google Карталарын веб -сайтыңызга киргизүү үчүн HTML жана CSS жөнүндө бир -эки нерсени билишиңиз керек. Эгерде сиз HTML же CSS жөнүндө эч нерсе билбесеңиз, https://www.w3schools.com/ сайтына өтүңүз.

Эскертүү: Мен W3Schools менен эч кандай форма же формада байланышы жокмун. Бул HTML жана CSSти үйрөнүүдө пайдалуу деп тапкан вебсайт.

Жабдуулар

• Текст редактору (веб -сайтыңызды ыңгайлаштыруу жана веб -сайтыңыздагы мазмунду камсыздоо үчүн колдонулат).
• Google Карталары (веб -сайтыңызга эмне камтылган).
• HTML жана CSS жөнүндө негизги түшүнүк (бул веб -сайтыңызды ыңгайлаштырууда жана веб -сайтыңызда мазмун менен камсыз кылууда колдонулуучу төмөнкү программалоо тилдери).

1 -кадам: Веб -сайтыңызга Мазмун берүү

Компьютериңиздеги текст редакторунун программасына өтүңүз. Мисалы, менде Windows бар болгондуктан, Notepadга өтүшүм керек. Блокнотко киргенден кийин, төмөнкүлөрдү териңиз:

Google Карталар

Google Карталар

Блокнотко төмөнкүлөрдү терип бүткөндөн кийин, Google Карталарга өтүңүз, кийинчерээк Google Карталарды веб -сайтыңызга киргизүү үчүн колдоно турган кодду аласыз.

Бул жерде сиз Google Карталарга баруу үчүн шилтеме:

2 -кадам: Google Карталарын веб -сайтыңызга кыстарыңыз

Google Карталарга киргенден кийин, "Меню" баскычын чыкылдатып, андан кийин "Карта менен бөлүшүү же кыстаруу" дегенди издеңиз. "Карта менен бөлүшүү же кыстаруу" дегенди көргөндөн кийин, аны басыңыз. Сиз аны баскандан кийин, "Шилтемени жөнөтүү" жана "Картаны кыстаруу" дегенди көрүшүңүз керек. Эми "Картаны кыстаруу" баскычын чыкылдатыңыз, "Картаны кыстаруу" баскычын баскандан кийин, азыр картанын канчалык чоң же кичине болушун тандоо үчүн колдонула турган текст кутусунун сол жагындагы ылдый жебени көрүшүңүз керек. Текстти кутуга көчүрүү. Жана текстти вебсайтыңыздын HTMLсине чаптаңыз.

3 -кадам: Вебсайтыңызды ыңгайлаштырыңыз

Компьютериңиздеги текст редактору программасына кайтып келип, төмөнкүлөрдү териңиз:

Google Карталардын негизги бөлүгү {background-color: rgb (129, 207, 224, 1);}

Google Карталар

Стиль теги веб -сайтыңызды ыңгайлаштыруу үчүн колдонулат. Эми мен сизге бул кадам CSSти колдоноорун кеңеш берем. Силердики менин веб -сайтыма окшош болушу үчүн, сиз төмөндө жазсаңыз болот.

Бүткөндөн кийин, файлыңызды "Google Maps.html" катары сактаңыз. Html бөлүгүн унутпаңыз, анткени эгер сиз бул бөлүктү кошпосоңуз, анда вебсайт жасай албайсыз.

4 -кадам: Акыркы продуктыңызды караңыз

Бул Нускамалардагы бардык кадамдарды аткарып бүткөндөн кийин, акыркы продуктуңузга жакшылап көз чаптырыңыз. Эгер сиз акыркы продуктуңузга ыраазы болсоңуз, анда бул сонун. Бирок, эгер сиз акыркы продуктуңузга канааттанбасаңыз, Блокнотуңузга кайтып келип, акыркы продуктуңузду оңдоого аракет кылыңыз, кийинки жолу акыркы продуктыңызды жакшылап карасаңыз, сиз өзүңүз жараткан нерсеге ыраазы болосуз. сенин колдоруң.

Эгерде сиз менин баштапкы кодумду көргүңүз келсе, аны ушул Нускамалардын түбүнөн тапса болот. Менин Instructables жана бактылуу коддорду көргөнүңүз үчүн рахмат!

Эскерте кетсек, Maps Challenge программасында мага добуш бериңиз!