1
00:00:01,050 --> 00:00:06,180
In this video you'll finish your customisations of the woo commerce web store by adding a marketing

2
00:00:06,210 --> 00:00:12,840
email list synchronization and you'll customize the look and feel of the transactional emails that newcomers

3
00:00:12,870 --> 00:00:18,600
and wordpress will send to subscribers and customers who buy products and sign up for the free download

4
00:00:19,110 --> 00:00:23,790
by the end of this video you'll have made the changes necessary to make your e-commerce store the best

5
00:00:23,790 --> 00:00:29,070
it can be and you can use any of these customisations for client sites or your own web.

6
00:00:30,150 --> 00:00:31,690
So back in our web store.

7
00:00:31,830 --> 00:00:34,950
Let's make sure we have the Wordpress dashboard open.

8
00:00:34,950 --> 00:00:41,310
And if you use the same web site that we were customizing in the last chapter you'll have the MailChimp

9
00:00:41,310 --> 00:00:50,070
for Wordpress plugin activated and set up for using a Sign-Up form for your MailChimp lists.

10
00:00:50,070 --> 00:00:57,240
If not get that plug in activated and connected via the API to your MailChimp account as we did in the

11
00:00:57,240 --> 00:00:58,590
last chapter.

12
00:00:58,710 --> 00:01:06,000
For me I'm still connected with the same web site and so my MailChimp API settings are still here and

13
00:01:06,000 --> 00:01:09,630
I have my three lists listed here from MailChimp account.

14
00:01:10,080 --> 00:01:16,650
All we have to do is under MailChimp for W.P. go down and click integrations in their menu item on the

15
00:01:16,650 --> 00:01:17,640
left hand side.

16
00:01:17,860 --> 00:01:24,690
And now that we have a Wu comer's web store activated the newcomers check out link is now activated

17
00:01:24,840 --> 00:01:27,550
under the available integration section.

18
00:01:27,870 --> 00:01:36,060
So just click with comer's check out and up at the top under enabled just click yes and then you have

19
00:01:36,060 --> 00:01:39,900
to go down and let's leave implicit as No.

20
00:01:39,990 --> 00:01:46,230
That gives the user the option to check or uncheck the box when they become a newcomer's customer on

21
00:01:46,230 --> 00:01:52,350
your Web site whether they want to be signed up for the list on MailChimp or not and then choose the

22
00:01:52,350 --> 00:01:54,540
list that is appropriate.

23
00:01:54,540 --> 00:01:55,980
If you have more than one.

24
00:01:56,200 --> 00:01:58,770
And then we could just leave the default here.

25
00:01:58,800 --> 00:02:03,430
You can have that checkbox pre-selected which is a great idea.

26
00:02:03,450 --> 00:02:06,930
We don't need to load any CSSA restyling for now.

27
00:02:07,170 --> 00:02:12,900
And yes it's a good idea as we had discussed it in the last chapter to use male chimps double opt in

28
00:02:12,900 --> 00:02:18,960
system and then we can come to the bottom here and click save changes.

29
00:02:19,160 --> 00:02:22,630
Now really that is all there is to it.

30
00:02:22,660 --> 00:02:30,650
Now if you make a test here if you go and say you wanted to go down and let's go where we had been before

31
00:02:30,770 --> 00:02:36,480
that free product let's go down to that free product let's add it to the cart.

32
00:02:36,710 --> 00:02:39,050
Great my system is still working.

33
00:02:39,080 --> 00:02:41,370
Sends me directly to the checkout page.

34
00:02:41,510 --> 00:02:46,850
And then maybe I'll use one of my testing email addresses right here.

35
00:02:46,850 --> 00:02:53,060
Sign me up for the newsletter is our new functionality here the checkbox is automatically checked and

36
00:02:53,090 --> 00:02:59,120
you can choose whether to do that or not but now if I place order it's got order received.

37
00:02:59,120 --> 00:03:00,530
That sounds great.

38
00:03:00,650 --> 00:03:07,370
And here's my download if I need it and I should also receive an e-mail about this order and we'll be

39
00:03:07,370 --> 00:03:09,710
customizing that e-mail here in a little bit.

40
00:03:09,710 --> 00:03:17,630
And this video as well but now I'm going to go up to my MailChimp account and let's just go to MailChimp

41
00:03:17,630 --> 00:03:23,510
dot com and sign in I hitting the log in button at the top right.

42
00:03:23,750 --> 00:03:28,730
And you should be following along and doing the same thing within your MailChimp and your Wordpress

43
00:03:28,760 --> 00:03:29,990
accounts.

44
00:03:29,990 --> 00:03:37,970
So let's see let's put the e-mail address and there is my log in as MailChimp opens opens right into

45
00:03:37,970 --> 00:03:39,520
my dashboard there.

46
00:03:39,540 --> 00:03:48,140
I'm going to look at my particular lists and I'll choose this list and I know that I had erased all

47
00:03:48,140 --> 00:03:55,370
the old testing subscribers before and it looks like I'm not subscribe yet with my testing at Greg Davis

48
00:03:55,370 --> 00:03:56,870
dot com email address.

49
00:03:56,960 --> 00:03:58,140
And can you guess why.

50
00:03:58,460 --> 00:04:00,870
Well it's because I haven't opted in yet.

51
00:04:01,010 --> 00:04:06,410
Nobody will join your list if you're using the double opt in system until they confirm their e-mail

52
00:04:06,410 --> 00:04:08,710
address inside of their email program.

53
00:04:10,000 --> 00:04:15,680
So I've gone into my email program and I received an e-mail at that e-mail address from MailChimp.

54
00:04:15,820 --> 00:04:22,390
Here's my standard confirm subscription email and if I click yes subscribe me to this list that will

55
00:04:22,390 --> 00:04:30,370
send me to the thank you page that I had defined which in this list now is just a regular MailChimp

56
00:04:30,370 --> 00:04:35,730
thank you page and it's got my little free download right there from our old mailing system.

57
00:04:35,950 --> 00:04:43,410
But now if I go back to my MailChimp list and refresh the page I should have two subscribers now.

58
00:04:44,170 --> 00:04:48,640
And there they are this number still says one but if you look down here in the list there is the e-mail

59
00:04:48,640 --> 00:04:54,000
that I just used to subscribe using the commerce storefront.

60
00:04:54,130 --> 00:04:54,880
So that's great.

61
00:04:54,880 --> 00:05:03,010
I've just tested and a customer who buys a product or signs up and downloads a free download who enters

62
00:05:03,010 --> 00:05:08,350
their email address will go straight to the MailChimp list get a double opt in and when they confirm

63
00:05:08,620 --> 00:05:11,110
they'll join the MailChimp list.

64
00:05:11,110 --> 00:05:19,030
Secondly I went into my e-mail and I also got an email from the newcomers store itself and this is the

65
00:05:19,030 --> 00:05:21,430
e-mail that we're going to customize.

66
00:05:21,490 --> 00:05:27,820
This is a customer e-mail and this is the standard layout that will comer's uses in the plugin to send

67
00:05:27,820 --> 00:05:36,460
out a order email or any other emails that they send out to your Wordpress and your web or customers.

68
00:05:36,640 --> 00:05:42,940
What we'll do is change the color to match whatever the brand coloring might be for your client or your

69
00:05:42,940 --> 00:05:49,480
own web store and we'll place some other wording up here and potentially a logo too.

70
00:05:49,500 --> 00:05:50,390
Let's get into it.

71
00:05:51,470 --> 00:05:58,400
Back in the Wordpress dashboard I'm going to go back into newcomer's and then the settings page go ahead

72
00:05:58,400 --> 00:06:03,070
and follow along on your own site and get to the same places I I'm going here.

73
00:06:03,170 --> 00:06:08,540
And we'll check out how to customize those outgoing e-mails that the web store will send to customers

74
00:06:08,780 --> 00:06:11,360
over on the right hand side of all of the settings tabs.

75
00:06:11,360 --> 00:06:18,690
There's one called e-mails go out and open that emails tab and the first thing you see are under e-mail

76
00:06:18,690 --> 00:06:25,860
notifications all the different types of notifications that might get sent to a customer.

77
00:06:26,250 --> 00:06:35,040
And now these are actually THP templates that will go out to customers or even out to owners of the

78
00:06:35,040 --> 00:06:38,950
web store like this new order cancelled order and failed order.

79
00:06:39,210 --> 00:06:44,170
And these e-mail templates are determined through a PH file.

80
00:06:44,220 --> 00:06:52,040
This is housed within newcomer's and you can see right down here the H.T. mail template is AICC a template

81
00:06:52,050 --> 00:06:55,580
that's APHC file within the newcomers plug in.

82
00:06:55,920 --> 00:07:03,210
But just like we did before with our will comer's overriding code as well as when we worked with child

83
00:07:03,210 --> 00:07:03,890
themes.

84
00:07:04,020 --> 00:07:11,810
You can override and replace this e-mail template by making a new file called Whatever It Is dot ph

85
00:07:11,810 --> 00:07:17,490
P and putting it inside of your theme folder.

86
00:07:17,490 --> 00:07:19,250
So here is a copy of it.

87
00:07:19,290 --> 00:07:25,490
I I just clicked view template right here and you can see that the instructions are here.

88
00:07:25,500 --> 00:07:32,580
Copy this to this folder right here your theme and then the newcomers folder and then an emails folder

89
00:07:32,820 --> 00:07:33,840
and admin.

90
00:07:33,840 --> 00:07:34,610
New Order.

91
00:07:34,630 --> 00:07:35,820
Drop DHP.

92
00:07:35,880 --> 00:07:43,620
In this case that's how you change the wording on any of these customer e-mails that will go out and

93
00:07:43,620 --> 00:07:46,320
this one's the new order one.

94
00:07:46,350 --> 00:07:52,470
And if you notice there's actually a button that can automatically copy the file to the appropriate

95
00:07:52,470 --> 00:07:54,400
theme folder location.

96
00:07:54,630 --> 00:08:01,650
So if you just hit copy file to theme it gives you a message says that this template has now been overridden

97
00:08:01,650 --> 00:08:04,580
by your theme and can be found right here.

98
00:08:04,770 --> 00:08:12,180
So you can use FCP or the file manager to go into your server find that BHP file and open it in a text

99
00:08:12,180 --> 00:08:19,410
editor and make the changes to the text that you want for each and every one of those emails that are

100
00:08:19,410 --> 00:08:20,900
these e-mail notifications.

101
00:08:20,900 --> 00:08:22,260
Right here.

102
00:08:22,260 --> 00:08:25,510
Any of these e-mails go out to the customer.

103
00:08:25,530 --> 00:08:31,320
Now if I go back to my e-mail program Here's my e-mail that came to me as a customer when I ordered

104
00:08:31,320 --> 00:08:36,310
my free download your order is complete and download your files here.

105
00:08:36,510 --> 00:08:43,350
If I wanted to edit things that are said right here or add some other marketing copy or anything else

106
00:08:43,350 --> 00:08:47,290
down here I'd have to edit that ph file.

107
00:08:47,310 --> 00:08:56,280
So back in the Wordpress dashboard Let's see I believe this is the completed order e-mail template and

108
00:08:56,320 --> 00:09:03,440
it is your order is complete is the e-mail so your blank order from this date is complete.

109
00:09:03,520 --> 00:09:06,710
Let's see if that's the proper e-mail that we're looking for.

110
00:09:07,030 --> 00:09:07,370
Yeah.

111
00:09:07,370 --> 00:09:13,750
You would come restore order from the date is complete and then if it is if it contains a downloadable

112
00:09:13,750 --> 00:09:16,850
file you'll see it says download your files.

113
00:09:17,020 --> 00:09:23,610
So this template should say hi there your recent order on name of store has been completed.

114
00:09:23,770 --> 00:09:29,510
So let's go back into here and let's view this template here.

115
00:09:29,790 --> 00:09:32,240
As we look you go down here.

116
00:09:32,370 --> 00:09:33,690
Here it is here's the text.

117
00:09:33,690 --> 00:09:34,540
Hi there.

118
00:09:34,590 --> 00:09:40,020
Your recent order on this is the web store has been completed and all that stuff.

119
00:09:40,020 --> 00:09:40,280
Great.

120
00:09:40,290 --> 00:09:47,760
Let's go back up and let's look at the second section under e-mails tab.

121
00:09:47,790 --> 00:09:50,030
It says e-mail sender options.

122
00:09:50,040 --> 00:09:51,620
This is where it's coming from.

123
00:09:51,720 --> 00:09:54,010
And then your e-mail template.

124
00:09:54,180 --> 00:09:59,940
Here's what we're going to edit in this video to make that email look just a little bit better but still

125
00:09:59,940 --> 00:10:02,620
use the same default text within the email.

126
00:10:02,790 --> 00:10:08,490
If you just click click here to preview your email template it will open another tab and it'll just

127
00:10:08,490 --> 00:10:09,690
show you a sample.

128
00:10:09,870 --> 00:10:11,820
Here's a slightly rounded corners.

129
00:10:11,850 --> 00:10:16,020
A certain muted blue color and that's what the copy looks like.

130
00:10:16,080 --> 00:10:20,190
And then there's some footer text down here at the bottom as well.

131
00:10:20,190 --> 00:10:25,860
If we go back into the wordpress site here's where we can edit all that stuff now right here.

132
00:10:25,860 --> 00:10:32,790
This would be a U or L for a logo image that you could put inside of the e-mail header so you could

133
00:10:32,790 --> 00:10:35,250
upload a picture to the media library.

134
00:10:35,250 --> 00:10:37,050
The logo for example.

135
00:10:37,050 --> 00:10:47,060
In fact I'm going to upload I'm just going to media add new and I'm going to look for a small image.

136
00:10:47,110 --> 00:10:48,970
Here's a logo image.

137
00:10:48,970 --> 00:10:50,240
Let's see here.

138
00:10:50,320 --> 00:10:57,130
It's just 240 by 120 a nice small image from my desktop in the brochure site that we had made before.

139
00:10:57,160 --> 00:11:00,780
So I'm going to upload that to the media library.

140
00:11:00,940 --> 00:11:03,020
And now how to get the URL for it.

141
00:11:03,100 --> 00:11:09,010
If I click that little edit button or I go back into the media library and find that image and click

142
00:11:09,010 --> 00:11:11,140
on it you'll see that over on the right side.

143
00:11:11,140 --> 00:11:14,370
Here's the file you are l for that image.

144
00:11:14,500 --> 00:11:18,880
So I'll just select all that text and hit Control C for copy.

145
00:11:19,330 --> 00:11:27,850
And now I'm just going to go back to my woo'd commerce settings page under the email tab right up here.

146
00:11:29,210 --> 00:11:35,180
And then of course back down here to my e-mail template now if I just click there and hit Control V

147
00:11:35,570 --> 00:11:40,010
I'm pasting that logo image directly into that e-mail file.

148
00:11:40,050 --> 00:11:41,520
Then here's the footer text.

149
00:11:41,660 --> 00:11:48,110
You know I could change the color just by putting a new Let's see just make it a little bit brighter

150
00:11:48,110 --> 00:11:49,080
blue.

151
00:11:49,210 --> 00:11:50,370
How about that.

152
00:11:50,530 --> 00:11:51,960
And the body text.

153
00:11:51,980 --> 00:11:56,530
Let's go ahead and let's make it just I don't know.

154
00:11:56,720 --> 00:11:59,980
This is just a great let's make it a little darker.

155
00:11:59,990 --> 00:12:07,030
How about straight black so it's really readable close to black anyway so save changes.

156
00:12:09,100 --> 00:12:15,440
And now the emails that I get from making a transaction with it in the store should have that logo a

157
00:12:15,440 --> 00:12:20,250
new color as well as whatever changes I made right there.

158
00:12:20,560 --> 00:12:25,770
So what if I go back to let's see let's go back home again.

159
00:12:26,270 --> 00:12:30,100
And I'm just going to go to let's see to the second page of the web store.

160
00:12:30,100 --> 00:12:33,650
I'm going to go ahead and order the free product again.

161
00:12:36,010 --> 00:12:37,220
It's time.

162
00:12:37,550 --> 00:12:43,120
Let's see if you know I'll just leave the same e-mail address there.

163
00:12:43,180 --> 00:12:48,440
This time I won't sign up for the newsletter but if I place this order in fact you know what I'll do

164
00:12:48,440 --> 00:12:53,000
is just use a second e-mail address so that it's not already in the web store.

165
00:12:53,120 --> 00:12:57,360
If I hit place order I should get an order received page.

166
00:12:57,360 --> 00:12:57,810
Great.

167
00:12:57,810 --> 00:12:58,610
There it is.

168
00:12:58,800 --> 00:13:01,200
And then up in my e-mail.

169
00:13:01,240 --> 00:13:01,700
All right.

170
00:13:01,710 --> 00:13:07,290
I went back to my e-mail and I checked that I received a new message from the newcomers store which

171
00:13:07,290 --> 00:13:08,010
I did.

172
00:13:08,010 --> 00:13:14,880
I opened it up here in a tab and you can see that here's the logo image that I had uploaded and referenced

173
00:13:14,880 --> 00:13:21,330
by using the u r l in the commerce email settings and you could see the blue colors a little bit brighter

174
00:13:21,690 --> 00:13:25,540
and the color here is a little bit darker.

175
00:13:25,560 --> 00:13:26,360
Great.

176
00:13:26,430 --> 00:13:31,500
I was able to edit that and it's an excellent e-mail.

177
00:13:31,500 --> 00:13:37,050
You know you can see I just used an image here but what if you had some lettering which was your logo

178
00:13:37,080 --> 00:13:40,050
or the lettering for the store the name of the web store.

179
00:13:40,130 --> 00:13:47,610
That would be a great way to brand these e-mails that go out to your customers in this lesson you customize

180
00:13:47,620 --> 00:13:50,740
to e-mail systems that your web store uses.

181
00:13:50,740 --> 00:13:56,170
First you made sure that all customers who purchase a product or create an account to get a free download

182
00:13:56,410 --> 00:13:59,500
get the option to join the MailChimp email list.

183
00:13:59,500 --> 00:14:05,880
Second you customized the transactional email that the newcomers store sends out to customers.

184
00:14:05,890 --> 00:14:13,120
Congratulations you've created an e-commerce store using open source software Wordpress and commerce

185
00:14:13,460 --> 00:14:14,520
in the next chapter.

186
00:14:14,590 --> 00:14:20,680
You'll be making modifications to your live site and learning best practices for web site security speed

187
00:14:20,890 --> 00:14:22,540
and ongoing management.

188
00:14:22,540 --> 00:14:24,730
This is where we start to bring everything together.

189
00:14:24,730 --> 00:14:29,210
Honing your ability to sell create and manage client web sites