Overview
If you have an Emma newsletter signup form, you can add that form to your WordPress website. This is a two-step process:
- Step 1: In Emma, copy the embed code
- Step 2: In WordPress, add the My Emma Form Embed component and paste the code
Step 1: Obtaining the embed code from Emma
Quick guide
- Go to https://home.e2ma.net.
- If prompted, log in with the following credentials:
- Username: Your @usc.edu email address
- Password: The password you created during setup, which may not be the same as your USC NetID passphrase
- You may be asked to enter a verification code, which Emma sends to your email.
- Click the Audience tab.
- In the left menu, click Forms.
- Next to the form name, click the Expand
icon. Select Add to your site.
- Click the Iframe tab.
- Select and copy the code. You will paste this into WordPress.
Detailed guide (with screenshots)
- Go to https://home.e2ma.net.
- If prompted, log in with the following credentials:
- Username: Your @usc.edu email address
- Password: The password you created during setup, which may not be the same as your USC NetID passphrase
- You may be asked to enter a verification code, which Emma sends to your email.
- Click the Audience tab.
- In the left menu, click Forms.
- Next to the form name, click the Expand icon. Select Add to your site.
- Click the Iframe tab.
- Select and copy the code. You will paste this into WordPress.
Step 2: Adding the signup form to WordPress
For this section, you will need to have some familiarity with adding components in WordPress. For assistance, you can email webproject@dornsife.usc.edu.
Use the My Emma Form Embed component
The My Emma Form Embed component is available for the Default and Content Detail templates. Other templates such as News Listing and Video Listing do not have this component.
Quick guide
- Log into WordPress and navigate to your website dashboard.
- In the left menu, click Pages.
- Create a new page or select an existing page to add the newsletter signup form to.
- Add the My Emma Form Embed component.
- (Optional) Fill out the Title and Description.
- In the Form Embed field, paste the embed code that you copied from Emma.
- To ensure that this form is accessible to visitors with screen readers, you will need to add a descriptive title to the embed code. For example, if you pasted the following embed code:
<iframe src="https://app.e2ma.net/app2/audience/signup/uniqueformlink/" width="510" height="500" frameborder="0"></iframe>
Then you can add the title like this:
<iframe src="https://app.e2ma.net/app2/audience/signup/uniqueformlink/" width="510" height="500" frameborder="0" title="Sign up for the DTS newsletter"></iframe>
- To preview the form, click the Desktop Preview
icon and select Preview in new tab.
- Once you're ready, you can publish the page.
Detailed guide (with screenshots)
- Log into WordPress and navigate to your website dashboard.
- In the left menu, click Pages.
- Create a new page or select an existing page to add the newsletter signup form to.
- Add the My Emma Form Embed component.
- (Optional) Fill out the Title and Description.
- In the Form Embed field, paste the embed code that you copied from Emma.
- To ensure that this form is accessible to visitors with screen readers, you will need to add a descriptive title to the embed code.
For example, if you pasted the following embed code:
<iframe src="https://app.e2ma.net/app2/audience/signup/uniqueformlink/" width="510" height="500" frameborder="0"></iframe>
Then you can add the title like this:
<iframe src="https://app.e2ma.net/app2/audience/signup/uniqueformlink/" width="510" height="500" frameborder="0" title="Sign up for the DTS newsletter"></iframe>
- To preview the form, click the Desktop Preview icon and select Preview in new tab.
- Once you're ready, you can publish the page.
Other component options
If you are comfortable with HTML, you can add the Emma signup form to any HTML editing-enabled component. A component has HTML editing enabled if it contains a field with the Visual and Text tabs. To add the sign up form to this type of component, you would paste the embed code into the Text tab.
For example, this is how the embed code looks when pasted in the Rich Text component. Note that a descriptive title has been added to aid visitors using a screen reader:
