SlideShare una empresa de Scribd logo
1 de 46
CMS 130
Web Forms
Building and managing web forms in
the CMS
WHAT ARE WEB FORMS?
• Like paper forms, web forms allow you to
gather information which can be stored and
used later.
• Unlike paper forms, web forms automatically
store the data. Your information is already
digital!
• Each web form submission is stored in a
database in the form of a table
• Each submission becomes a new row, while
columns are the names of the inputs
PARTS OF A WEB FORM
Example Web Form
This form captures personal information plus additional comments. Each
field is referred to as an input, or element.
Fieldsets
• Groups of inputs can be organized by fieldsets.
Let’s build a form!
• Building and managing web forms in the CMS
requires two steps.
1. Using the CMS Form Builder
2. Using KaratEmail to process and manage web
form submissions.
STEP 1: BUILD THE WEB FORM
Let’s build this comment form.
Create a new Form Asset
• Choose [ Content ] > [ Assets ].
• Click followed by “Form”.
Asset & Settings
Asset Info Asset Settings
• What you name the form matters.
• You could be managing a list of forms. Which
one is which?
Elements (or inputs)
Element Cards
• Elements can be dragged over
cards to add above.
• Cards can be dragged over each
other to change order.
• [ + ] button adds a card below.
“Last Name” input
• Begin fieldset here and give it a
label.
• Remember the name will be the
column in the submission.
• Advanced field will always look
like: key=value;
“First Name” input
“Email” input
• Override Single Line Text Field card
to be email with:
custom-type=email;
• Form won’t submit until the user
input resembles an email.
• Close the fieldset with:
fieldset-end=true;
“Additional Comments”
input
• Give users seven rows of height for
the Multi-Line Text Field using:
rows=7;
• Start, label, and stop the fieldset
around this single input.
Email Messages
• Ignore
• Already handled by KaratEmail.
Success Messages
• How will the form respond if the user
successfully fills in the inputs?
Write a success message.
The user will see the above.
Or put your own thank you page together instead.
The user will see the above.
Failure Messages
• How will the form respond if the user
successfully fills in the inputs but the form is
unable to store the submissions in KaratEmail?
– Example: Campus system outage.
Write a success message.
Enter default to get our standard message. Enter your own if you
wish.
The user will see the above.
Additional Options
• Make sure the “Save in Results Database” is
checked!
• Change the “Submission Button Text” if you
wish.
Create & Publish!
• Click [ Create ].
– If doesn’t work make sure all “Name”s are unique.
• Click [ Publish ].
– Sometimes takes up to 5 times to work. Otherwise
submit a request with the asset URL and we’ll take
a look.
– We recommend adding one fieldset at a time and
publishing (creating a save history).
Put the form asset on a page
View the web form [ Preview ]
Admin interface [ Edit ]
• Once the web form is ready for public
consumption click “Request Access” and
publish the page.
STEP 2: KARATEMAIL
Manage the web form submissions
Remember
• Web forms allow users to enter data that is
stored for processing.
• Each submission becomes a new row in the
tabular data set.
– Columns are the names of the inputs
• KaratEmail will begin storing submissions even
if you haven’t been granted access to them
yet.
• Log in to view the web forms you can manage.
The web form submissions
• Click [ View Form ].
• All buttons have tooltips.
• View a submission.
• Mark a submission as read/unread.
• Forward a submission to yourself.
• Delete a submission.
• Export read/all submissions to Excel.
• We have created a web form.
• Submissions for the web form are now tracked
through KaratEmail.
We’re done!
LAB
Let’s try some of what we have learned.
Instructions
1. Open a site you manage in the CMS and pull
up the Assets.
2. Create the form on the next page that
redirects to the following upon success.
• https://www.montana.edu/web/adam/outc16/t
hank-you.html
Create this form!
ADDITIONAL INFORMATION
Help!
• Online form builder Help Center
– More input types
– Building address fieldsets
• Online KaratEmail Help Center
• Submit a Support Ticket
• Attend an Open Support session for the CMS
– Available only at the MSU-Bozeman Campus

Más contenido relacionado

La actualidad más candente

Amazon dynamodb & amazon redshift
Amazon dynamodb & amazon redshiftAmazon dynamodb & amazon redshift
Amazon dynamodb & amazon redshiftSumeraHangi
 
10 easy steps to become an IEEEmember
10 easy steps to become an IEEEmember10 easy steps to become an IEEEmember
10 easy steps to become an IEEEmemberDr Dharmasa pawar
 
Session plan for web technologies lab subject
Session plan for web technologies lab subjectSession plan for web technologies lab subject
Session plan for web technologies lab subjectupen rao
 
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZer
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZerStd 12 Computer Chapter 1 Creating Html Forms Using KompoZer
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZerNuzhat Memon
 
Job searching computer class
Job searching computer classJob searching computer class
Job searching computer classLynne Reed
 

La actualidad más candente (8)

Amazon dynamodb & amazon redshift
Amazon dynamodb & amazon redshiftAmazon dynamodb & amazon redshift
Amazon dynamodb & amazon redshift
 
Quiz maker
Quiz makerQuiz maker
Quiz maker
 
10 easy steps to become an IEEEmember
10 easy steps to become an IEEEmember10 easy steps to become an IEEEmember
10 easy steps to become an IEEEmember
 
Itc lab 03
Itc lab  03Itc lab  03
Itc lab 03
 
Session plan for web technologies lab subject
Session plan for web technologies lab subjectSession plan for web technologies lab subject
Session plan for web technologies lab subject
 
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZer
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZerStd 12 Computer Chapter 1 Creating Html Forms Using KompoZer
Std 12 Computer Chapter 1 Creating Html Forms Using KompoZer
 
Learning express library slides
Learning express library slidesLearning express library slides
Learning express library slides
 
Job searching computer class
Job searching computer classJob searching computer class
Job searching computer class
 

Destacado

CMS 210: Introduction to Web Accessibility
CMS 210: Introduction to Web AccessibilityCMS 210: Introduction to Web Accessibility
CMS 210: Introduction to Web AccessibilityMontana State University
 
7 4 Preparing The Elements Forms And Databases
7 4 Preparing The Elements Forms And Databases7 4 Preparing The Elements Forms And Databases
7 4 Preparing The Elements Forms And DatabasesStark State College
 
Website maintenance: keeping your WordPress site updated and safe
Website maintenance: keeping your WordPress site updated and safeWebsite maintenance: keeping your WordPress site updated and safe
Website maintenance: keeping your WordPress site updated and safeClare Parkinson
 
Good and bad examples of e-commerce websites
Good and bad examples of e-commerce websitesGood and bad examples of e-commerce websites
Good and bad examples of e-commerce websitesseng
 
CMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a WebsiteCMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a WebsiteMontana State University
 
Google WebMaster Tool
Google WebMaster ToolGoogle WebMaster Tool
Google WebMaster ToolAli Ahmed
 
Webmaster tool by Neha Nayak
Webmaster tool by Neha NayakWebmaster tool by Neha Nayak
Webmaster tool by Neha NayakNeha Nayak
 
Top 10 e-commerce websites in India
Top  10  e-commerce websites in IndiaTop  10  e-commerce websites in India
Top 10 e-commerce websites in IndiaArham Partap Jain
 
Forms and Databases in PHP
Forms and Databases in PHPForms and Databases in PHP
Forms and Databases in PHPMike Crabb
 
Odoo - How to create awesome websites and e-commerce
Odoo - How to create awesome websites and e-commerceOdoo - How to create awesome websites and e-commerce
Odoo - How to create awesome websites and e-commerceOdoo
 
e-Commerce Website Development Proposal
e-Commerce Website Development Proposale-Commerce Website Development Proposal
e-Commerce Website Development ProposalIndicsoft Technologies
 
Creating and Processing Web Forms
Creating and Processing Web FormsCreating and Processing Web Forms
Creating and Processing Web FormsNicole Ryan
 
E Commerce Presentation
E  Commerce  PresentationE  Commerce  Presentation
E Commerce PresentationTylerjd
 
Accessible & Usable Web Forms. Your How To Guide!
Accessible & Usable Web Forms. Your How To Guide!Accessible & Usable Web Forms. Your How To Guide!
Accessible & Usable Web Forms. Your How To Guide!Rabab Gomaa
 
Ecommerce final ppt
Ecommerce final pptEcommerce final ppt
Ecommerce final pptreemalmarri
 
E commerce
E commerceE commerce
E commerceGBC
 

Destacado (20)

CMS 210: Introduction to Web Accessibility
CMS 210: Introduction to Web AccessibilityCMS 210: Introduction to Web Accessibility
CMS 210: Introduction to Web Accessibility
 
Website Hosting Guide
Website Hosting GuideWebsite Hosting Guide
Website Hosting Guide
 
7 4 Preparing The Elements Forms And Databases
7 4 Preparing The Elements Forms And Databases7 4 Preparing The Elements Forms And Databases
7 4 Preparing The Elements Forms And Databases
 
Blog12: Google Form (Database)
Blog12: Google Form (Database)Blog12: Google Form (Database)
Blog12: Google Form (Database)
 
Website maintenance: keeping your WordPress site updated and safe
Website maintenance: keeping your WordPress site updated and safeWebsite maintenance: keeping your WordPress site updated and safe
Website maintenance: keeping your WordPress site updated and safe
 
Good and bad examples of e-commerce websites
Good and bad examples of e-commerce websitesGood and bad examples of e-commerce websites
Good and bad examples of e-commerce websites
 
CMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a WebsiteCMS 120: Introduction to Building a Website
CMS 120: Introduction to Building a Website
 
Google WebMaster Tool
Google WebMaster ToolGoogle WebMaster Tool
Google WebMaster Tool
 
Webmaster tool by Neha Nayak
Webmaster tool by Neha NayakWebmaster tool by Neha Nayak
Webmaster tool by Neha Nayak
 
Top 10 e-commerce websites in India
Top  10  e-commerce websites in IndiaTop  10  e-commerce websites in India
Top 10 e-commerce websites in India
 
Forms and Databases in PHP
Forms and Databases in PHPForms and Databases in PHP
Forms and Databases in PHP
 
Odoo - How to create awesome websites and e-commerce
Odoo - How to create awesome websites and e-commerceOdoo - How to create awesome websites and e-commerce
Odoo - How to create awesome websites and e-commerce
 
e-Commerce Website Development Proposal
e-Commerce Website Development Proposale-Commerce Website Development Proposal
e-Commerce Website Development Proposal
 
Creating and Processing Web Forms
Creating and Processing Web FormsCreating and Processing Web Forms
Creating and Processing Web Forms
 
E Commerce Presentation
E  Commerce  PresentationE  Commerce  Presentation
E Commerce Presentation
 
Accessible & Usable Web Forms. Your How To Guide!
Accessible & Usable Web Forms. Your How To Guide!Accessible & Usable Web Forms. Your How To Guide!
Accessible & Usable Web Forms. Your How To Guide!
 
Ecommerce final ppt
Ecommerce final pptEcommerce final ppt
Ecommerce final ppt
 
E commerce ppt
E commerce pptE commerce ppt
E commerce ppt
 
E commerce
E commerceE commerce
E commerce
 
E commerce
E commerceE commerce
E commerce
 

Similar a CMS 130: Web Forms

5.1 Creating a Form Using AutoForm
5.1 Creating a Form Using AutoForm5.1 Creating a Form Using AutoForm
5.1 Creating a Form Using AutoFormPyi Soe
 
5 Designing Form
5 Designing Form5 Designing Form
5 Designing FormPyi Soe
 
How to create Outlook Form with example
How to create Outlook Form with exampleHow to create Outlook Form with example
How to create Outlook Form with exampleAkash Jadhav
 
Excel Power Query Secrets: How to Cut Data Prep Time by 75%
Excel Power Query Secrets: How to Cut Data Prep Time by 75%Excel Power Query Secrets: How to Cut Data Prep Time by 75%
Excel Power Query Secrets: How to Cut Data Prep Time by 75%Doug Burke
 
Forms as Structured Content
Forms as Structured Content Forms as Structured Content
Forms as Structured Content dotCMS
 
Kennect flo - a personalized email service
Kennect flo - a personalized email serviceKennect flo - a personalized email service
Kennect flo - a personalized email serviceOmkar Dusane
 
Lotus notes mail merge create and run agent
Lotus notes mail merge   create and run agentLotus notes mail merge   create and run agent
Lotus notes mail merge create and run agentEric Weinberg
 
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docx
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docxCIS 3100 - Database Design and ImplementationProducts on Sale Da.docx
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docxmccormicknadine86
 
How to create Excel dashboards easily
How to create Excel dashboards easilyHow to create Excel dashboards easily
How to create Excel dashboards easilyMockup Wireframe
 
- Database Design and ImplementationProducts on Sale Database fo.docx
- Database Design and ImplementationProducts on Sale Database fo.docx- Database Design and ImplementationProducts on Sale Database fo.docx
- Database Design and ImplementationProducts on Sale Database fo.docxgertrudebellgrove
 
SharePoint Terminology
SharePoint TerminologySharePoint Terminology
SharePoint TerminologyAyman Sheta
 
HTML5 &CSS: Chapter 08
HTML5 &CSS: Chapter 08HTML5 &CSS: Chapter 08
HTML5 &CSS: Chapter 08Steve Guinan
 
Access essential training framework
Access essential training   frameworkAccess essential training   framework
Access essential training frameworkVijay Perepa
 
Form using html and java script validation
Form using html and java script validationForm using html and java script validation
Form using html and java script validationMaitree Patel
 

Similar a CMS 130: Web Forms (20)

5.1 Creating a Form Using AutoForm
5.1 Creating a Form Using AutoForm5.1 Creating a Form Using AutoForm
5.1 Creating a Form Using AutoForm
 
5 Designing Form
5 Designing Form5 Designing Form
5 Designing Form
 
How to create Outlook Form with example
How to create Outlook Form with exampleHow to create Outlook Form with example
How to create Outlook Form with example
 
Excel Power Query Secrets: How to Cut Data Prep Time by 75%
Excel Power Query Secrets: How to Cut Data Prep Time by 75%Excel Power Query Secrets: How to Cut Data Prep Time by 75%
Excel Power Query Secrets: How to Cut Data Prep Time by 75%
 
Access 06
Access 06Access 06
Access 06
 
Forms as Structured Content
Forms as Structured Content Forms as Structured Content
Forms as Structured Content
 
Kennect flo - a personalized email service
Kennect flo - a personalized email serviceKennect flo - a personalized email service
Kennect flo - a personalized email service
 
Access4
Access4Access4
Access4
 
Lotus notes mail merge create and run agent
Lotus notes mail merge   create and run agentLotus notes mail merge   create and run agent
Lotus notes mail merge create and run agent
 
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docx
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docxCIS 3100 - Database Design and ImplementationProducts on Sale Da.docx
CIS 3100 - Database Design and ImplementationProducts on Sale Da.docx
 
How to create Excel dashboards easily
How to create Excel dashboards easilyHow to create Excel dashboards easily
How to create Excel dashboards easily
 
- Database Design and ImplementationProducts on Sale Database fo.docx
- Database Design and ImplementationProducts on Sale Database fo.docx- Database Design and ImplementationProducts on Sale Database fo.docx
- Database Design and ImplementationProducts on Sale Database fo.docx
 
SharePoint Terminology
SharePoint TerminologySharePoint Terminology
SharePoint Terminology
 
HTML5 &CSS: Chapter 08
HTML5 &CSS: Chapter 08HTML5 &CSS: Chapter 08
HTML5 &CSS: Chapter 08
 
Access essential training framework
Access essential training   frameworkAccess essential training   framework
Access essential training framework
 
SAP Adobe forms
SAP Adobe formsSAP Adobe forms
SAP Adobe forms
 
Info Path 2007 Training
Info Path 2007 TrainingInfo Path 2007 Training
Info Path 2007 Training
 
Dbms fast track 2/3
Dbms fast track 2/3Dbms fast track 2/3
Dbms fast track 2/3
 
Form using html and java script validation
Form using html and java script validationForm using html and java script validation
Form using html and java script validation
 
CSS_Forms.pdf
CSS_Forms.pdfCSS_Forms.pdf
CSS_Forms.pdf
 

Último

Dyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxDyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxcallscotland1987
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfNirmal Dwivedi
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024Elizabeth Walsh
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxVishalSingh1417
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfPoh-Sun Goh
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...pradhanghanshyam7136
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsMebane Rash
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...ZurliaSoop
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin ClassesCeline George
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxAreebaZafar22
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...christianmathematics
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxDr. Sarita Anand
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptxMaritesTamaniVerdade
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - Englishneillewis46
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 

Último (20)

Dyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxDyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptx
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Spatium Project Simulation student brief
Spatium Project Simulation student briefSpatium Project Simulation student brief
Spatium Project Simulation student brief
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 

CMS 130: Web Forms

  • 1. CMS 130 Web Forms Building and managing web forms in the CMS
  • 2. WHAT ARE WEB FORMS?
  • 3. • Like paper forms, web forms allow you to gather information which can be stored and used later. • Unlike paper forms, web forms automatically store the data. Your information is already digital!
  • 4. • Each web form submission is stored in a database in the form of a table • Each submission becomes a new row, while columns are the names of the inputs
  • 5. PARTS OF A WEB FORM
  • 6. Example Web Form This form captures personal information plus additional comments. Each field is referred to as an input, or element.
  • 7. Fieldsets • Groups of inputs can be organized by fieldsets.
  • 8. Let’s build a form! • Building and managing web forms in the CMS requires two steps. 1. Using the CMS Form Builder 2. Using KaratEmail to process and manage web form submissions.
  • 9. STEP 1: BUILD THE WEB FORM
  • 10. Let’s build this comment form.
  • 11. Create a new Form Asset • Choose [ Content ] > [ Assets ]. • Click followed by “Form”.
  • 12. Asset & Settings Asset Info Asset Settings
  • 13. • What you name the form matters. • You could be managing a list of forms. Which one is which?
  • 15. Element Cards • Elements can be dragged over cards to add above. • Cards can be dragged over each other to change order. • [ + ] button adds a card below.
  • 16. “Last Name” input • Begin fieldset here and give it a label. • Remember the name will be the column in the submission. • Advanced field will always look like: key=value;
  • 18. “Email” input • Override Single Line Text Field card to be email with: custom-type=email; • Form won’t submit until the user input resembles an email. • Close the fieldset with: fieldset-end=true;
  • 19. “Additional Comments” input • Give users seven rows of height for the Multi-Line Text Field using: rows=7; • Start, label, and stop the fieldset around this single input.
  • 20. Email Messages • Ignore • Already handled by KaratEmail.
  • 21. Success Messages • How will the form respond if the user successfully fills in the inputs?
  • 22. Write a success message.
  • 23. The user will see the above.
  • 24. Or put your own thank you page together instead.
  • 25. The user will see the above.
  • 26. Failure Messages • How will the form respond if the user successfully fills in the inputs but the form is unable to store the submissions in KaratEmail? – Example: Campus system outage.
  • 27. Write a success message. Enter default to get our standard message. Enter your own if you wish.
  • 28. The user will see the above.
  • 29. Additional Options • Make sure the “Save in Results Database” is checked! • Change the “Submission Button Text” if you wish.
  • 30. Create & Publish! • Click [ Create ]. – If doesn’t work make sure all “Name”s are unique. • Click [ Publish ]. – Sometimes takes up to 5 times to work. Otherwise submit a request with the asset URL and we’ll take a look. – We recommend adding one fieldset at a time and publishing (creating a save history).
  • 31. Put the form asset on a page
  • 32. View the web form [ Preview ]
  • 34. • Once the web form is ready for public consumption click “Request Access” and publish the page.
  • 35. STEP 2: KARATEMAIL Manage the web form submissions
  • 36. Remember • Web forms allow users to enter data that is stored for processing. • Each submission becomes a new row in the tabular data set. – Columns are the names of the inputs
  • 37. • KaratEmail will begin storing submissions even if you haven’t been granted access to them yet.
  • 38. • Log in to view the web forms you can manage.
  • 39. The web form submissions • Click [ View Form ]. • All buttons have tooltips.
  • 40. • View a submission. • Mark a submission as read/unread. • Forward a submission to yourself. • Delete a submission. • Export read/all submissions to Excel.
  • 41. • We have created a web form. • Submissions for the web form are now tracked through KaratEmail. We’re done!
  • 42. LAB Let’s try some of what we have learned.
  • 43. Instructions 1. Open a site you manage in the CMS and pull up the Assets. 2. Create the form on the next page that redirects to the following upon success. • https://www.montana.edu/web/adam/outc16/t hank-you.html
  • 46. Help! • Online form builder Help Center – More input types – Building address fieldsets • Online KaratEmail Help Center • Submit a Support Ticket • Attend an Open Support session for the CMS – Available only at the MSU-Bozeman Campus