Moddaning fikr-mulohaza shakli: Qanday qilib Internetda yaratish mumkin? HTML va PHP-ni telefon bilan qanday qilib chiroyli pop -p -p-ni shakllantirish va e-pochta buyurtmasini yuborish mumkinmi?

HTML va CSS-da aloqa shaklini yaratish bo'yicha ko'rsatmalar, shuningdek ulanish va konfiguratsiya uchun tayyor shakl shakllari va qo'llanmasi to'plami.

Bugungi kunda dasturlash ko'nikmalariga ega bo'lmagan har qanday shaxs o'z saytini, tarmoqdan tayyorlangan shablonni yuklab, uni dvigateldan o'rnatishda o'rnatib, o'z saytini yaratishi mumkin.

Biroq, har bir tayyor -ga tayyorlangan shablon foydalanuvchi talablarini qondira olmaydi. Ularning aksariyati "pishloq" shaklida tasvirlangan va masalan, fikr-mulohaza shaklida, masalan, aloqa formasi mavjud.

Ushbu sayt bloki onlayn do'konlar egalari va katta axborot portallarining egalari uchun juda muhimdir. Bizning maqolamizda siz mustaqil ravishda fikr-mulohaza shaklini tuzish haqida ma'lumot topasiz, bu erda tayyor shablonni va uni qanday qilib veb-saytingizga o'rnatishingiz mumkin.

Rasm 1. Qayta aloqa formasi nima va nima uchun bunday kerak?

Qayta aloqa formasi nima va nega bunday kerak?

• Har qanday munosib saytning eng muhim funktsiyalaridan biri bu aloqa formasi. Bu tashrif buyurgan va resurs ma'muriyati o'rtasidagi hamkorlikka xizmat qiladi. Shunday qilib, uning yordami bilan siz texnik yordamga murojaat qilish yoki ma'muriyatlarga kerakli ma'lumotlarni yuborishingiz mumkin. Masalan, onlayn do'konlarda to'lov tafsilotlari yoki buyurtma qilingan tovarlar nomi. Sizning portalingizda bunday shaklga ega bo'lish tavsiya etiladi, chunki uning tashrif buyuruvchilari va mijozlar bilan doimiy aloqada bo'lgan doimiy aloqasi muvaffaqiyatli rivojlanishning kalitidir.

Teskari aloqa shakli - bu matnning bir nechta kirish maydonlaridan va "yuborish" tugmasidan iborat alohida sahifa yoki blok (bo'lim). Qoida tariqasida, standart shakli quyidagi maydonlarga ega:

• To'liq ism
• Elektron pochta (elektron pochta manzili)
• Uyali telefon raqami
• Saytingiz manzillari
• Matnli xabarni kiritish uchun maydon

Biroq, maydonlar xohlaganingizcha bo'lishi mumkin va ular xohlaganingizcha imzolanishi mumkin. Bularning barchasi sizning ehtiyojlaringiz va tasavvuringizga bog'liq.

2. Rasm 2. Qayta aloqa formasi nima va nega bunday kerak?

• Bundan tashqari, ba'zi egalar Google yoki Yandex kartalarini "Vkontakte", "Facebook", "Google+" va boshqalarni qamrab olish shakllariga qo'shadilar. Ammo biz eng oddiy fikr-mulohaza shaklini yaratish haqida gaplashamiz, buning uchun sizga belgilar tilining asoslari haqida faqat bilish kerak Html va boshqa hech narsa yo'q.

HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish kerak?

Maqolani to'liq zerikarli darslikka aylantirmaslik uchun, biz allaqachon belgilash tilining asoslari bilan tanish ekanligingizni davom ettiramiz Html Va uning qanday ishlashi haqida umumiy tasavvuringiz bor. Agar sizda bunday ko'nikmalarga ega bo'lmasa, shaklni yaratishni boshlashdan oldin, bilimingizni biroz resursda siqish tavsiya etiladi htmlbook.ru. Aks holda, siz nafaqat ushbu korxonadan voz kechishingiz, balki saytingizning kodini buzishingiz mumkin.

Ishlash bo'yicha fikr-mulohaza shaklini qayta tiklash uchun sizga uchta muhim element kerak, ulardan biri shaklning belgilari va tuzilishi uchun javobgardir ( Html), uning tashqi dizayni uchun ikkinchisi ( CSS), va ma'lumotlarni qayta ishlash va uzatish uchun uchinchi ( Php). Bu tartibda boshlaylik:

Fikr-mulohaza uchun HTML kodini yozish

• 1-qadam. Shaklni ko'rsatish uchun Html Teg ishlatiladi \u003cForp\u003e \u003c/ forma\u003e. Ichkarida o'lchamdagi o'lchamlar, uslublar va boshqa muhim xususiyatlar o'rnatiladi. Yorliqning o'zi yozishda u forma uchun o'rnatishga yordam beradigan sinfni o'rnatishi kerak CSS Uslublar.

1-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 2-qadam. Qo'shimcha shakldagi birinchi maydonni yaratish uchun \u003cForp\u003e Blok yorlig'ini yozishingiz kerak \u003cP\u003eyangi chiziqni yaratish uchun javobgardir.

2-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 3-qadam. Ichki teg \u003cP\u003e Yangi qatordan biz quyidagi yorliqni kiritamiz: \u003cYorliq \u003d "ism"\u003eIsm \u003c/ Yorliq\u003e. U kelajakdagi shakl sohasining nomlari uchun javobgardir.

3-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 4-qadam. Yangi qatorda hamma narsa bir xil yorliqda \u003cP\u003e Biz quyidagi qiymatlar bilan dala yaratish tegini belgilaymiz: \u003cKirish turi \u003d "Matn" nomi \u003d "Ism" raqami: "Ismingizni kiriting »Kerakli \\\u003e. Parametr " turi \u003d "matn"" Matn maydonining turini va parametrini o'rnatadi " yukliqni saqlash joyi \u003d "Ismingizni kiriting «» Ushbu matn maydonidagi dastlabki matnni o'rnatadi. Parametr " talab qilingan»Bu maydonni to'ldirish uchun majburiy bo'lgan saytga tashrif buyuradi. Natijada, quyida skrinshotda ko'rsatilgandek bitta maydon bilan shakl olishingiz kerak.

4-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 5-qadam. Yuqoridagi misol bilan siz kerakli qolgan maydonlarni har safar tegdan boshlangan qo'shing \u003cP\u003e. Matnli xabar bilan maydonni o'rnatish uchun tegdan foydalaning \u003cTextarea Nom \u003d "Xabar" cols \u003d "50" qatorlar \u003d "6" kerak. Variantlar " pollar"Va" qatorlar»Matn maydonining kengligi va balandligi uchun javobgardir. Siz ko'proq yoqadigan parametrlarni o'rnatishingiz mumkin. Siz quyida skrinshotda ko'rsatilgan narsangizni olishingiz kerak.

5-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 6-qadam. Bugungi kunda Internetda juda ko'p bo'lgan botlardan himoya qilish uchun yorliq bilan boshqa qatorni yarating \u003cInpute nomi \u003d "Bazspama" turi \u003d "Matn" uslubi \u003d "Displey: Hech biri" qiymat \u003d ". Parametr tufayli " sTYLE \u003d "Displey: yo'q"»Ushbu soha oddiy odamlar tomonidan ko'rinmaydi, ammo botlar avtomatik ravishda to'ldiriladi. Shunday qilib, siz har doim tirik odamni dasturdan ajratishingiz mumkin.

6-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 7-qadam. Yuborish tugmachasini yaratish belgisining yakuniy bosqichi bo'ladi. Bu uchun teg ishlatiladi \u003cTugmasi\u003e. Yangi blok yarating \u003cP\u003e Va uning ichida quyidagi parametrlar bilan tugmachani kiriting: \u003cTugma sinf \u003d "yuborish" turini \u003d "yuborish"\u003exabar yubormoq \u003c/ Tugmasi\u003e. Shunga o'xshash natijani ekranda ko'rsatilgandek paydo bo'lishi kerak.

7-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

Kasbli uslublar bilan ishlash (CSS)

• Belgilash jarayonida ko'rganingizdek, biz juda egri, aql bovar qilmaydigan va jirkanch narsalarni chiqardik. Fikr-mulohazalarni berish uchun ko'proq yoki kamroq ko'rinishga ega bo'lishi uchun bitta til Html Bu etarli bo'lmaydi. Buning uchun siz uslublardan foydalanishga murojaat qilishingiz kerak bo'ladi CSS.
• Agar siz asosiy ko'nikmalaringizni resursda mahkamlash uchun maslahatlardan foydalangan bo'lsangiz htmlbook.ru, keyin shaklning barcha qismlari uchun ba'zi dizayn parametrlarini o'rnating CSS Bu siz uchun qiyin bo'lmaydi. Agar siz bularning barchasini buzish istagi yoki vaqtingiz bo'lmasa, unda biz sizga tayyor kod bilan ta'minlaymiz va uni qanday ulanishni aytamiz.

8-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

Ulanish uslublari CSS Ga Html Siz ikkita usulingiz mumkin:

• Kodni kaskadli stoldan faylning pastki qismiga nusxalash style.cssssayt hostingda mavjud
• O'zgarishlar faylini xosting va ulash uchun harakat qiling

Fayli style.csss Yorliq ichida ulanadi \u003cBoshim\u003e \u003c/ boshim\u003e Skript yordamida \u003cLink Rel \u003d "Styleyheet" Media \u003d "Ekran" HREF \u003d "Style.css"\u003e. Agar uslublardagi fayl asosiy HTML-fayl sifatida bir xil papkada bo'lmasa, unda siz unga yo'lni ko'rsatishingiz kerak. Bizning fayllarimizda uslublar bilan, har bir elementning belgisi bor. Agar xohlasangiz, o'zingiz uchun parametrlarni o'zgartirishingiz, faqat asosiy dasturlash ko'nikmalari asosida boshqariladi.

PHP fayl ulanishi va uni sozlash

Yuqorida aytib o'tilganidek, skript Php aloqa shaklini ijro etish uchun javobgardir. Biroq, tilda ishlash printsipini ko'proq yoki kamroq tushunish uchun PhpAgar siz katta hajmdagi adabiyotlarni o'qishingiz va amaliyot uchun munosib bir necha soat sarflashingiz kerak. Shuning uchun, ishda bo'lgani kabi CSSAgar biz sizga profess yozuvi bilan sizga tayyorlangan faylni taqdim etamiz, bu faqat hujjat bilan hujjat bilan ulanish qoladi.

Fayldan farqli o'laroq style.csss, Shaklning o'zi xususiyatiga php skript bilan fayl ilova qilinadi. Bu tartibda boshlaylik:

• 1-qadam. Ilgari yozma kodni oching va ochiq shakl yorlig'ini toping. Unga xossa qo'shing " harakat \u003d "Aloqa-form.php""Va" usul \u003d "Post"". Skrinshotda misol tomosha qiling.

9-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 2-qadam. Bizning PHP faylini yuklab oling va uni xuddi shu papkada joylashtiring, u erda HTML hujjati joylashgan. Shunday qilib, PHP va HTML fayllari bir-biri bilan o'zaro ta'sir qiladi.

10-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish kerak?

• 3-qadam. Keyin, o'zingiz uchun skriptni sozlashingiz kerak. Faylni oching va o'zgaruvchini o'rnating, ularga HTML skriptdagi kabi bir xil nomlarni tayinlang. Agar siz formaga qo'shimcha maydonlar qo'shsangiz, ularni skrinshotda ko'rsatilgandek PHP yozuviga qo'shing.

11-rasm. HTML va PHP-dagi sayt uchun eng oddiy aloqa formasini qanday yaratish kerak?

• 4-qadam. Keyinchalik, siz elektron pochtangizning manzili va sizning qutingizda ko'rsatilgan harf mavzusi bilan yana ikkita o'zgaruvchini qo'shishingiz kerak. O'zgaruvchan chiziqda " $ Manzil"Elektron pochtani va chiziqda ko'rsating" $ sub»Maktub mavzusi skrinshotda ko'rsatilgan.

12-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish kerak?

• 5-qadam. O'zgaruvchan chiziqda " $ ms»Pochta orqali olgan xat formatining formati sozlangan. Siz uni o'zgarmagan yoki ta'mingizni tahrirlashingiz mumkin.

13-rasm HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

• 6-qadam. Boshqa barcha yo'nalishlar xabarni yuborish va botalardan himoya sozlamalarini o'z ichiga olishi uchun javobgardir, shuning uchun ularni o'zgarishsiz qoldirishi kerak. Natijada, to'liq kod quyida skrinshotda ko'rsatilgandek ko'rinishi kerak.

14-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa shaklini qanday yaratish kerak?

Teskari aloqa uchun CSS va PHP fayllarini yuklab oling

Chiqish paytida barcha harakatlarni bajarganingizdan so'ng, siz oddiy tartibli fikr-mulohazalarni olasiz

15-rasm. HTML va PHP-da sayt uchun eng oddiy aloqa formasini qanday yaratish mumkin?

Turli maqsadlar uchun HTML va CSS-ning chiroyli dizayn shakllarini tanlash

• Yuqoridagi ko'rsatmalarga asoslanib, siz o'zingizning ta'mingizdagi fikr-mulohazalar shaklini osongina "chizishingiz mumkin". Biroq, agar sizda mustaqil ravishda noldan shaklni yaratishga vaqtingiz yoki xohlamasangiz, Internetdagi tayyorgar shakllarini topishingiz va asosiy ko'nikmalarga ega bo'lishingiz mumkin Html ularni o'zingiz uchun tahrirla.

1-rasm. Turli maqsadlar uchun HTML va CSS-dagi go'zal dizayn shakllarini tanlash

• Bir oz qidirib topdik, biz siz uchun tanlovni topdik 35 Go'zal pop -up dizaynini loyihalashning ajoyib aloqa shakllari Html Va CSS. Ushbu shakllar kabi dvigatellar uchun mos keladi WordPress Va JoomlaUlar boshqaruv panelidan oddiy va oson sozlamaga ega va dvigatelsiz saytlar uchun juda mos keladi.

Saytlar uchun fikr-mulohaza shakllarini tanlab oling

Video: Qayta o'qilgan fikr-mulohazalar Teskari aloqa fikrlari