Ինչպես տեղադրել Google Քարտեզները կայքում ՝ 4 քայլ

2024 Հեղինակ: John Day | [email protected]. Վերջին փոփոխված: 2024-01-30 09:46

Քվեարկեք ինձ համար Maps Challenge- ում:

Վերջերս ես ստեղծել եմ մի վեբ կայք, որն օգտագործում է Google Քարտեզները: Google Քարտեզների իմ կայքում տեղադրելը բավականին հեշտ էր և ոչ այնքան դժվար: Այս ցուցումներում ես ձեզ ցույց կտամ, թե որքան հեշտ է Google Քարտեզները տեղադրել ձեր վեբ կայքում:

Եթե անկեղծ լինեմ ձեզ հետ, ես պարզապես Google Քարտեզները տեղադրեցի իմ վեբ կայք `պարզապես հաճույքի համար: Կարանտինում այդքան անելիք չկա, ուստի ինչու չպատրաստել Google Maps- ից օգտվող կայք, ապա մարդկանց ցույց տալ այն քայլերը, որոնք ես կատարել եմ այս կայքը ստեղծելու ժամանակ:

Այժմ պետք է ասեմ, որ դուք պետք է մեկ -երկու բան իմանաք HTML- ի և CSS- ի մասին `Google Քարտեզները ձեր վեբ կայքում տեղադրելու համար: Եթե դուք ոչինչ չգիտեք HTML- ի կամ CSS- ի մասին, փորձեք գնալ

Նշում. Ես W3Schools- ի հետ կապված չեմ որևէ ձևի կամ ձևի: Դա պարզապես կայք է, որը ես գտա, որ օգտակար է HTML և CSS սովորելիս:

Պարագաներ

• Տեքստի խմբագիր (կօգտագործվի ձեր կայքը հարմարեցնելու և ձեր վեբ կայքի բովանդակությունը տրամադրելու համար):
• Google Քարտեզներ (այն, ինչ տեղադրված կլինի ձեր վեբ կայքում):
• HTML- ի և CSS- ի հիմնական ըմբռնում (սրանք հետևյալ ծրագրավորման լեզուներն են, որոնք կօգտագործվեն ձեր կայքը հարմարեցնելիս և ձեր վեբ կայքում բովանդակություն տրամադրելիս):

Քայլ 1: Ներկայացրեք բովանդակություն ձեր կայքում

Գնացեք ձեր համակարգչի տեքստային խմբագրիչի ծրագրակազմ: Օրինակ, քանի որ ես Windows ունեմ, պետք է գնամ Գրառման գրքույկ: Գրառման գրքույկ գնալուց հետո մուտքագրեք հետևյալը.

Գուգըլ քարտեզներ

Գուգըլ քարտեզներ

Գրառման գրքույկում հետևյալը մուտքագրելուց հետո գնացեք Google Քարտեզներ, որտեղից հետագայում կստանաք այն կոդը, որը կօգտագործվի Google Քարտեզները ձեր վեբ կայքում տեղադրելու համար:

Ահա Google Քարտեզներ գնալու հղումը ՝

Քայլ 2. Տեղադրեք Google Քարտեզները ձեր վեբ կայքում

Google Քարտեզներում հայտնվելուց հետո կտտացրեք «Մենյու» կոճակին, ապա փնտրեք «Կիսվել կամ տեղադրել քարտեզը»: Երբ տեսնեք «Կիսվել կամ տեղադրել քարտեզը», կտտացրեք դրա վրա: Երբ կտտացրեք դրա վրա, դուք պետք է տեսնեք «Ուղարկել հղում» և «Տեղադրել քարտեզ»: Այժմ կտտացրեք «Տեղադրեք քարտեզ», երբ կտտացրեք «Տեղադրեք քարտեզը», այժմ պետք է տեքստային տուփի ձախ կողմում գտնվող ներքև սլաքը, որը կօգտագործվի ՝ ընտրելու համար, թե որքան մեծ կամ փոքր եք ցանկանում քարտեզը: Պատճենեք տեքստը վանդակում: Եվ տեղադրեք տեքստը ձեր վեբ կայքի HTML- ում:

Քայլ 3: Անհատականացրեք ձեր կայքը

Վերադարձեք ձեր համակարգչի տեքստային խմբագրիչի ծրագրակազմ և մուտքագրեք հետևյալը.

Google Քարտեզների տեքստ {ֆոնային-գույն: rgb (129, 207, 224, 1);}

Գուգըլ քարտեզներ

Ոճի պիտակը օգտագործվում է ձեր կայքը հարմարեցնելու համար: Այժմ ես ձեզ խորհուրդ կտամ, որ այս քայլը օգտագործում է CSS: Կարող եք մուտքագրել հետևյալը, որպեսզի ձերն ամբողջությամբ նման լինի իմ կայքին:

Ավարտելուց հետո ձեր ֆայլը պահեք որպես «Google Maps.html»: Մի մոռացեք html հատվածը, քանի որ եթե դուք չեք ներառում այս մասը, չեք կարող կայք պատրաստել:

Քայլ 4: Նայեք ձեր վերջնական արտադրանքին

Այս հրահանգների բոլոր քայլերին հետևելուց հետո, մի լավ նայեք ձեր վերջնական արտադրանքին: Եթե գոհ եք ձեր վերջնական արտադրանքից, դա հիանալի է: Բայց, եթե գոհ չեք ձեր վերջնական արտադրանքից, վերադարձեք ձեր Գրառման գրքույկ և փորձեք շտկել ձեր վերջնական արտադրանքը, որպեսզի հաջորդ անգամ, երբ մեկ անգամ լավ նայեք ձեր վերջնական արտադրանքին, գոհ լինեք ձեր ստեղծածով: ձեր ձեռքերը:

Եթե ցանկանում եք դիտել իմ աղբյուրի կոդը, այն կարելի է գտնել սույն Հրահանգների ներքևում: Շնորհակալ եմ, որ դիտում եք իմ Հրահանգները և ուրախ կոդավորումը:

Որպես հիշեցում, խնդրում եմ քվեարկեք ինձ համար Maps Challenge- ում: