Како да креирате образац за контакт користећи Формспрее

Можете да користите многе методе на својој веб локацији да бисте корисницима омогућили да вам безбедно шаљу е-пошту. Један пример је коришћење атрибута маилто на обрасцу за контакт. Атрибут маилто отвара инсталирану апликацију за пошту за корисника да унесе поруку.

За боље искуство, размислите о интеграцији алата као што је Формспрее. Формспрее делује као посредник, снима податке обрасца и шаље их на вашу наведену адресу е-поште.

Шта је Формспрее и како функционише?

Формспрее је услуга е-поште коју можете интегрисати у прилагођени образац за контакт. Када се пријавите у Формспрее, можете да наведете своју циљну адресу е-поште за образац. Формспрее управља слањем образаца у ваше име. То вам дозвољава направите бесплатни образац за контакт, као што је Гоогле Формс, али ви хостујете стварну ознаку обрасца на својој веб локацији.

Формспрее ће генерисати крајњу тачку коју ћете морати да додате у свој прилагођени образац. Када корисник притисне дугме „Пошаљи“, образац ће користити крајњу тачку за позивање Формспрее АПИ услуге. Ово ће генерисати имејл са садржајем обрасца за контакт.

Формспрее ће послати ову е-пошту на циљну е-пошту коју сте навели у свом Формспрее налогу. Тада ћете примити е-пошту у пријемно сандуче. Ваш Формспрее налог такође има место где можете да видите своје поднете образац за контакт.

Да бисте регистровали своју е-пошту у Формспрее-у, пријавите се и унесите циљну адресу е-поште за свој образац.

1. Пријавите се Формспрее. Ако немате налог, мораћете да унесете своју адресу е-поште и лозинку. Региструјте се користећи адресу е-поште на коју желите да образац за контакт шаље пријаве. Можда ћете такође морати да верификујете ову адресу е-поште током процеса регистрације.
2. Када се процес регистрације заврши, отвориће се страница „Обрасци“. Кликните на Нова форма.
3. Унесите било које име за образац за контакт и оставите подразумевана подешавања пројекта. Унесите циљну адресу е-поште у поље „Пошаљи е-пошту на“. Овде ће Формспрее послати ваше поднеске обрасца за контакт. Када завршите, кликните на Креирајте образац.
4. Формспрее ће вам пружити крајњу тачку и примере како да је користите. Мораћете да додате ову крајњу тачку у свој прилагођени образац за контакт на вашој веб локацији (више о томе касније).
5. Формспрее подразумевано чува ваш образац у оквиру пројекта који се зове „Мој први пројекат“. Ако желите да промените име овога, вратите се на страницу „Обрасци“. Кликните на Подешавања поред назива пројекта.
6. Овде можете променити назив свог пројекта у нешто друго. На пример, можете га преименовати тако да има исто име као и ваша веб локација. Такође можете додати УРЛ за своју веб локацију.

Мораћете да додате крајњу тачку коју обезбеђује Формспрее у контакт образац у коду ваше веб локације.

1. Додајте крајњу тачку у атрибут „ацтион“ за образац. Ово ће довести до тога да прегледач корисника пошаље образац на ту УРЛ адресу када га пошаљу.

   <форм ацтион="https://formspree.io/f/xjvlaqpe" метход="ПОШТА">
   <!-- Ваш образац овде -->
   <тип дугмета="прихвати" цласс="дугме"> прихвати </button>
   </form>

2. Додајте уносе у образац. Можете користити овај пример обрасца који користи Боотстрап ЦСС оквир:

   <форм ацтион="https://formspree.io/f/mbjqjrdl" цласс="ектра-паддинг" метход="ПОШТА">
   <див цласс="форм-група">
   <ознака за="одговарати на"> Ваша емаил адреса </label>
   <тип уноса="емаил" цласс="форм-контрола" ид="одговарати на" наме="_одговарати на" нгМодел="Одговорити" ариа-десцрибедби="емаилХелп" плацехолдер="тест@екампле.цом">
   <мали ид="емаилХелп" цласс="образац-текст текст-пригушен"> Ваша е-пошта се неће делити ни са ким другим. </small>
   </div>
   <див цласс="форм-група">
   <ознака за="порука"> Ваша порука </label>
   <тектареа наме="порука" стиле="висина: 200пк" цласс="форм-контрола" ид="порука" плацехолдер="Хеј тамо! И'контактирам вас јер..."></textarea>
   </div>
   <тип дугмета="прихвати" цласс="дугме"> прихвати </button>
   </form>
   

Да бисте тестирали да ли Формспрее ради, пошаљите себи поруку користећи контакт форму, притисните прихвати, и проверите пријемно сандуче своје е-поште.

1. Покрените своју веб локацију и отворите страницу на којој се налази образац за контакт. Унесите поруку у контакт форму и притисните прихвати.
2. Добићете поруку обрасца за контакт у свом пријемном сандучету.
3. Ако се вратите на Формспрее, кликните на Поднесци таб. Овде ћете такође моћи да видите послате поруке из вашег контакт обрасца.

Формспрее је једна од многих услуга које можете користити да интегришете прилагођени образац за контакт на своју веб локацију. Омогућава вам да брзо почнете да прихватате повратне информације корисника без бриге о детаљима у позадини.

Ако сте нови у прављењу образаца са ХТМЛ-ом и ЈаваСцрипт-ом, такође можете сазнати више о валидацији образаца на страни клијента. Ово помаже да се осигура да ваши обрасци за контакт могу потврдити сав кориснички унос.

О аутору

Схарлене Вон Дрехнен (Објављено 9 чланака)

Шарлин је технички писац у МУО и такође ради пуно радно време у развоју софтвера. Она је дипломирани информатичар и има претходно искуство у области обезбеђења квалитета и универзитетског подучавања. Шарлин воли игре и свира клавир.

Више од Схарлене Вон Дрехнен