0:01
okay hey everybody i am a little tardy today i just uh
0:06
yeah had an errand that i thought was gonna take me a half hour and ended up taking like an hour and a half so sorry about that
0:14
how's everyone doing today um let me go ahead and uh
0:19
i literally just walked in the door went straight to the office and now i'm here right so cool
0:28
sweet okay so um yeah i see from the chat that
0:36
everyone is kind of uh watching and hearing me let me get uh let me just get some things set up as i
0:41
said i just walked in and immediately started
0:51
sweet sound video is tip top i like it that's how we like it okay cool so today i thought it would be fun to um
0:58
you know let me back up as i said in my email uh i was helping my dad actually create some paypal buttons some donate buttons
1:04
on a charity site and uh so you know i i haven't i hear a lot of
1:10
people complaining about paypal buttons but you know i i've never really implemented them before so i thought
1:16
i thought it'd be fun today um i was hoping i'd be back to actually do maybe a little bit of prep work but as of right now i have zero prep work
1:23
done and uh i'm gonna be learning paypal buttons the same time i'm teaching it to you so
1:29
um yeah so let's go ahead and i need to increase my lights a little bit so you guys can see me
1:35
okay cool um let me go and uh let's go ahead and let me share
1:41
my screen here okay and uh let's get safari open
1:51
and uh let's go to paypal okay
1:59
let's do paypal buttons is there like a direct url i'd
2:07
have to go to oh amazon has payment buttons too okay great payment buttons
2:14
boom so we have um smart buttons buy now buttons add to
2:20
cart buttons oh interesting donate button subscribe automatic billing okay well uh what i'm
2:27
gonna do today since uh i know this is what uh i was helping my father with um with a donate button
2:32
we're gonna do a donate button i have to log in hold on i'm not sure what's going to display when i log in
2:38
and this is my active paypal account so one second i'm going to move this to my other display
2:45
all right one second let's log in here
3:04
password is incorrect what
3:13
there we go
3:18
all right so here we go um i have a so um i just logged in and took me to
3:24
this little wizard right so um here we can make a donate button right so you can
3:29
you can choose your country your language your style of button and i'm assuming
3:34
you can preview it over here right so you have large and small and obviously these buttons are
3:40
completely hideous and then you can show or hide the card logos
3:46
um and then lastly you can use your own uh button right so you can i'm assuming you can
3:51
like drag in your own button image right um so you can put in your button image url
3:57
so um i haven't created a button but uh here let's go ahead and create a button really really quick let's just uh
4:08
gonna open up affinity designer
4:17
okay oops that's not what i wanted i wanted this app okay we're gonna do new
4:28
let's just uh say create okay um and i'm just gonna create like an
4:33
oval here actually hold on that's absolutely hideous that's not what i wanted
4:40
i wanted this rounded rec tool boom and um
4:47
let's just set the fill to like uh we'll do blue i guess right that's
4:53
pretty do something like that okay
4:58
and then we need a text tool and we're going to say oop donate
5:06
okay i'm not going to spend a lot of time making this pretty i'm just going to do a run-of-the-mill easy peasy
5:13
button and we're going to make this white boom okay and then i'm going to
5:20
[Music] group those and then i'm going to say file
5:26
export and i want to export the selection without a background i want to
5:32
be a png um let's do it like you know uh
5:38
i will just leave it at that 700 by 22. let's export that boom
5:44
um i'm going to call this button we'll do donate button
5:50
okay save
6:00
all right so um here i have my button it's on my desktop here it is cool
6:07
i created a button let's go ahead and uh oh i have to give that a url so i actually have to
6:12
upload this to my site right so um let's open up transmit
6:20
we're going to log into my sandbox server
6:26
and i'm going to drag and drop this button into my server
6:31
and there it is right there and we're going to say copy url thank you transmit and i'm going to paste that url again
6:38
this is just the url to the button let's do https
6:43
and it's a ginormous button but i don't know let's let's see what happens let's uh make your donate button enter url for
6:51
a logo optional not sure where that is i'm not going to even i'm not going to i'll leave that blank
6:57
all right what happens if i do that
7:02
okay uh organization name uh let's change this to weavers oops what's going on
7:12
oh interesting i can't change my organization name okay that's my that's my company that's my llc your purpose
7:19
optional um to test donate buttons no clue where that's
7:25
gonna go let's fill that out um let your donors choose to specify programs with their
7:32
donations how come i can't scroll this page yes except cookies okay
7:38
oh crazy i couldn't scroll the page without accepting that that's like horrible paypal fix it paypal that's
7:43
horrible all right um let your donors choose specific programs for their donations
7:50
you can list programs program name i have no idea um live stream
8:00
okay then you can like add multiple things all right let's keep this simple i'm going to say no programs let's just do a simple
8:06
donate button say continue uh what do we want to receive it we want to receive in us
8:12
dollars what can donors uh any amount an exact amount set three amount options okay
8:20
um let's choose any amount we'll keep that and then this you can
8:26
choose other three options okay interesting uh let donor make monthly recurring
8:32
donations yes no sure all right let's click continue and i'm assuming this is make your
8:38
donate button get info from donors oh man you can get all kinds of stuff
8:43
here set account identifier merchant account okay that's fine extra
8:48
html button variables advanced view add extra html button
8:54
variables let's see what that is
8:59
so if i click on this oh you can add extra like little
9:05
attributes to the buttons it looks like
9:10
host button id en
9:16
individual item variables amount discount amount um
9:24
use the html image tag to display buttons on your webpage yes okay
9:41
wow there's a lot of stuff in here all right we're going to keep it simple
9:47
i'm not going to add any advanced button variables all right we're going to say finished and get code boom okay there we go look at that
9:55
um so here is the button html a shareable url and a qr code
10:03
kind of cool right that's kind of interesting see someone could just do a qr code and uh you know get you know from their
10:09
phone if you have you know printed something out there online you can print that out that's
10:16
interesting um okay shareable url this is if you
10:22
wanted to like have a you know donate to us link um you know when you wanted to share this maybe on
10:27
social or something like that right but right now we want to integrate something on our website so this is the code that we have
10:33
we're going to copy that we're going to launch rapidweaver
10:40
okay we're going to open up my sandbox site
10:49
let's paste this bad boy in there
10:54
probably for fun what i'm going to do is i'm going to dissect this html and see how we can make it better
11:05
okay so here we go uh i'm going to hold on i'm just going
11:10
to trash all of this because we don't need any of that i'm just going to
11:16
chuck that on the page extract that all right and then we need an html stack
11:23
html gonna put that we'll put it below the all right now i'm gonna paste in um this
11:30
code that i got there it is boom wow a
11:36
big donate button huge button you want to donate to me there we go
11:43
like a donate it does it's not even responsive jesus
11:48
christ wow okay so we're gonna have to make this better right because oh well it i clicked on it by accident
11:55
and it took us to a decent donate page okay um but
12:01
let's make this better okay so let's let's look at this what let's look at what this thing is
12:11
um let's open up some code here we're going to analyze this
12:18
uh don't necessarily want that just do a new window
12:26
okay let's just set this to be html boom okay so here we'll make this a
12:33
little bit bigger um
12:43
all right there we go so here we have a form and then we have
12:50
a few inputs and then an image
12:57
interesting so we have a um we have a a hidden value that has
13:04
cmd which is underscore x click i guess in that documentation
13:09
actually i think i close that window
13:15
okay let me go back to that that uh this window right here just interested
13:22
to see what these are right so this is s-x-click i think i remember i recall seeing that
13:27
on this documentation page there it is um the button that the
13:32
person clicked was protected from tampering by using encryption or the button was saved by the mert
13:38
merchant's paypal account okay um okay uh
13:44
and we have a another hidden input that has the name of hosted button id and it has a value of
13:50
this okay so that that is probably important because that tells us um paypal um this is like essentially
13:58
the id of my uh button okay cool and then we have this input type
14:05
image interesting input type image
14:12
and it also has the name of submit so it just submits the form jesus christ that is that's horrible
14:21
okay i can't believe paypal in 2020 would do something like that jesus
14:28
okay we're gonna we're gonna make this great okay this is gonna be okay so i'm gonna
14:34
do right now is i'm going to i'm gonna recreate this in a foundation six form
14:40
okay um and then probably eventually what i'll do is uh i'll probably make this into a stack or
14:45
something like that i don't know maybe maybe not we'll see five what time i have um
14:51
so i'm not sure this little bad boy is so first off let's let's uh let's
14:57
recreate this html into a foundation six form that could be fun okay so i'm gonna go ahead and i'm gonna
15:03
do this i'm gonna delete this from the page and uh guess how do we start doing that
15:09
well guess what we need a form right so we're going to drag a form onto the page and here's our form okay because we have
15:16
a form okay if you look we have an action and we have a method of post
15:22
okay so whoops so um well look form actions okay well what form actions do i have oh
15:30
i have a post url action oh wow magic i wonder what that does well guess what you give it a url
15:36
and guess what here's our url
15:42
and we're gonna go wham bam thank you ma'am boom okay so that's done right in theory well
15:49
hopefully that should work we'll see um i think in the form stack we can we can leave all of these
15:55
uh the same okay now um there's a couple things uh we
16:01
have a couple of hidden inputs now i don't think that this is required i don't know maybe i'll add it just for
16:07
fun but i i'm actually going to build it without it because i'm i'm i don't i'm not sure that's actually
16:12
required okay um i'm going to do is um
16:17
but this is definitely required right okay so here this one's definitely required because we definitely need a hosted button id
16:24
and then we need um this value okay but it's a hidden field right so we have a hidden input um so
16:31
let's do this so we add over here in the stacks hidden data we're going to add a hidden
16:37
data okay and uh we have a field name and a value okay well we know both of those are so we have a hidden
16:43
name the name is hosted underscore button underscore id i'm going to go there and paste that in
16:49
there and then we have a value and here is our special value
16:57
cool there we go there's our value um okay then oops let's go back to
17:07
all right whoops that's not what i wanted oh yeah um and then we have this image but i i'd
17:13
prefer to have a button right i'd prefer having a button instead of an image right
17:19
um and then it has this image tag that that's a one pixel
17:25
gif i think that's like some sort of tracking i don't think we really need that at all
17:30
okay so really all we need to do is now submit this form so um while submitting a form is easy we
17:35
just get a submit button so we go to our button stacks oops i passed them right
17:41
here we have a submit button so we're just going to submit this right and um we're going to say
17:48
uh donate okay um let's just make it a radius
17:56
because radiuses are nicer okay and yeah we'll just leave it at that
18:01
all right let's preview this so now instead of that ugly donate button
18:06
i actually have a proper button okay and when i click this it should take me to that same paypal
18:12
donate page let's let's hope
18:19
oh it didn't okay so um okay it might be that that field that i
18:25
told it to ignore right so let's let's try this i'm gonna let's add another hidden data field
18:30
okay i i wasn't sure if that was again i've never done this before right so i i wasn't sure that was gonna be required
18:37
i thought it was just a fluff thing but obviously it's not okay so we need hidden data
18:42
it's uh the name is cmd and the value is this
18:47
okay so let's try this hidden data um about the name is cmd
18:54
the value is that
19:01
let's see fingers crossed
19:09
oh check that out boom
19:18
there we go i just created a form um it you i guess we needed these two these
19:23
two hidden values right from um from here right um so i didn't need this
19:30
input type image and then this other image tracking pixel this is definitely a tracker
19:35
right so that means paypal's tracking your your people right even if they load the page
19:40
paypal's tracking you just by loading this one pixel gif um
19:47
yeah okay but but i didn't load that pixel gif so paypal is no longer isn't tracking this form page right
19:53
pretty cool right so i mean visible on the page this is just um a button right um so that's kind of
20:02
cool um it's obviously you know not
20:08
um maybe for for someone that that obviously doesn't
20:13
know how to read this code um you know a parent that hey this is just a form and i can regenerate this
20:19
inside foundation six right um so yeah i think that's that's nice
20:26
right um pretty cool now obviously there's there's some other things that we could do right if you notice some of those other options in the button
20:33
right um all right let's go back to
20:39
let's go back to that button wizard let's go back to this page
20:46
oh log in hold on
20:53
okay so let's choose some of those other options that i think would be interesting right um we'll just keep with their
21:00
their their button for now um okay show it continue um i don't want a logo url
21:10
um because we can design this on our own we can we can add whatever thing we want in there right um what's your purpose let's list some
21:16
programs let's figure out what this is we'll do like program one
21:22
add um program two add and
21:30
program 10 add okay and then we'll go
21:37
continue um let's let's ch let's change it some of these options let's do set three amounts we're gonna
21:44
do um oh interesting zero zero five dollars um
21:52
twenty dollars and a hundred dollars okay give them three options um
22:00
do we want to make uh make monthly recurring donations um yes oh i'm wondering that oh you can
22:08
you can that's a check box okay so we'll just leave that that's a check box on paypal side okay get info from donors oh yeah you
22:15
can get that information that's going to be getting it on the that's not going to affect our form at all take the donor to a url after they
22:22
completed okay that's something that isn't going to affect our stack at all
22:27
um but for fun actually here let's do this https i wonder if that's something that we could pass into our form
22:38
sandbox.joeworkman.net.net once they've completed donation i'm just
22:44
gonna do uh slash um thank you okay oh it's just for fun i'm gonna say
22:51
cancel these urls don't work but i just want to see where they go
22:56
just so i i know okay so that's that we'll use that um i'm not sure what these extra button
23:02
variables are yet not sure we need to dive into that yet we just give you the the basics get info oh
23:10
let's see what this does let's get the info um let's see what that what that does
23:15
all right let's finish and get code all right so here's our new code
23:22
all right let's paste this over here
23:29
interesting it's all the same i i thought it was going to give us like a cool like little drop down or something
23:34
like that but okay we we have a new button so this is a button id here so we're just going to get that and
23:41
we're going to update this to have the new button id okay and then that that command that command
23:48
s x click was the same so that doesn't need to change so we're going to do it like this and if
23:55
now if i hit this donate button
24:02
test there we go okay so now we have all this interface i i thought this a lot of this interface was going to be baked into the form
24:09
but i guess not um i guess you just have to it's just a button right so on the on the paypal side
24:15
it's just going to be a button and uh so there we go
24:23
you put in another amount optional so all these are all the options that we you know we put inside of that
24:29
in the thing um donate with a credit card or debit card interesting um okay cool
24:39
so all those options are pretty much moot so essentially all you need to do is uh yeah we just need that little that
24:45
little the the big thing here is that little field the button id essentially um and that's this hidden data right so
24:52
we can do um button id and this one we'll call this
25:00
title uh cmd i guess okay cool well that was a little easier than
25:05
i expected it to be to be honest with you that's kind of cool um any questions on
25:10
that let's see cool can you even add font awesome brand icon into the paypal information
25:16
donator add font awesome brand icon for paypal to information donator
25:25
okay font dawson brandei for paypal to inform the person donating
25:31
uh yes so in this i think i think what brett's saying is inside this donate button you can have you know um here let's find a uh
25:40
a icon we can use let's go ahead and add right here we'll add um font awesome
25:48
uh we'll add css fonts just because it's a little easier and then we'll add um
25:55
there just go to fontawesome.com [Music]
26:08
help oh that kind of works right here let's do let's do hands
26:14
hands helping or actually i kind of like the i kind of like this one just this one it's the solid okay so um there we go
26:22
we're going to copy that html and then inside my button
26:28
[Music] we're going to probably put it before the donate right something like that boom
26:37
so now we have a nice donate button with you know shaking hands cool i like it i was saying you can add
26:43
the icon there so the user knows the paypal oh you could oh got it got it that's
26:48
actually a great idea okay so um so what you do here is you'd add the brand icons
26:55
um and then we go back to or was that here and let's search for
27:04
paypal there we go so we can add the paypal logo
27:10
copy that and then you in our button you can do uh
27:20
donate via paypal
27:27
donate with maybe something like that right so you
27:33
do donate with paypal right something like that
27:38
boom nice um for those of you that haven't seen the font awesome stuff um i have videos on
27:45
font awesome five um inside foundation six you can check those out but yeah pretty cool i'm glad i'm glad i
27:51
figured out how we could just use a button because uh yeah that that kind of blows that
27:57
they weren't allowing you to do that so i'm wondering okay if i were to turn this like into a into a stack
28:02
right to make it a little easier um essentially what i need is i need this i need this id right i wonder during the
28:09
um during that process what's the easiest way to get that id
28:15
it's right there interesting okay i got an idea
28:26
interesting cool uh another thing i want i would love to learn more about those those little um
28:34
i wonder what all those values are but let's try a different button let's try um where can we get more
28:42
buttons why do i have to log in every time jesus
28:49
christ that's annoying
28:55
all right uh make a donate button i want to make a new button no i don't want a donate button though
29:01
okay uh paypal.com buttons boom okay
29:09
let's see what a sell on social uh smart buttons subscribe donate
29:17
add to cart actually i'm curious on what this add to cart does instead of a buy now like i was i didn't
29:23
know paypal had like a cart thing let's uh let's see what that does
29:30
no problem irwin thanks for coming in okay so wow this is like you could tell this
29:36
is old school because man look at this paypal page man they are just stylish aren't they
29:44
jesus stylish like it's 2 000 again okay um so we can have shopping cart by
29:51
now oh man this must be like an old style wizard let's do a shopping cart um item name
29:58
let's do um we'll just do live stream
30:04
item id i guess we have to give this an id one two three four five okay this is
30:11
probably gonna be you know your sku or something like that it says optional you probably want to add that i would think price
30:17
um let's say 20 usd interesting if you need you need to do
30:22
like i don't know can i do a dot in there oh it's just a text input you need
30:30
multiple prices what does that do you multiple prices t-shirt different sizes add drop down
30:37
menu okay so here you okay if it was multiple prices you could do this add drop down
30:43
thing and that okay look that gives you a little option list for fun last year let's let's do
30:49
that okay um for fun let's do that actually we'll yeah we'll do it
30:54
okay um
31:00
add drop down menu example drop down oh you can have options option
31:07
one two three interesting okay add text fields
31:12
enter the name of the text field okay um test field
31:20
done oh you can add like okay got it oh you give it a label
31:26
you can only have one extra oh oh you can add as many text fields as you want and give it another name field two
31:34
done customize text and appearance we want a paypal button
31:39
use your own button image we'll just leave it at the paypal button because they're that okay so here's a here's a little
31:45
form that we have add to cart use shipping specified amount um
31:51
[Music] that's 10 shipping we'll try that um use tax rate oh man see this this is where
32:00
is where paypal you know definitely has some issues because you know you can't just use a tax rate depending on where you are the
32:06
tax rates could be different that's why you know sometimes using a service is uh is better but
32:11
you know depending on your local area um you know figure out what what what or if you need to start charge
32:16
tax i'm gonna leave that as blank use my merchant id okay step two uh track inventory profit and loss um
32:25
track inventory oh you can like keep track of inventory with paypal what didn't know that uh get an email alert
32:32
when inventory is low track profit and losses okay so here you can be the item id
32:39
the quantity you have in stock um alert quantity so when we get down to three send me an alert
32:45
that's interesting okay and i'm assuming this um this will only work though like
32:52
if you only use paypal to buy because like if you're using if you're buying if you're selling stuff
32:57
locally and online this is going to cause issues because you know in terms of your stock account
33:03
um paypal doesn't know if you sell something locally or via different um you know method okay
33:11
um can customers buy this item as you as usual customers can buy the item as
33:18
usual oh oh if the item is sold out i guess i
33:23
should have read the heading above it so if it's sold out what do you want them to do okay you can buy it or not buy it
33:30
interesting and then you can you can send them to a url i guess yeah all right step three customize and
33:36
advance features can your customer add special
33:42
instructions and messages to you um sure we'll say yes um do you need customer shipping address
33:48
um let's say yes just for fun advance oh this is more of those advanced
33:53
uh you know parameters advanced variables
33:59
i'm not sure what those are yet uh we can learn more again i think that's going to take us to that same page oh that's even a 404 good job paypal
34:07
good job let's see if that one's a 404 it's probably it's the same page that we
34:13
had before that one doesn't work either oh well all right let's let's create our
34:18
button
34:24
and here is our oh wait sold out redirect url is required
34:29
oh sold out oh uh all right we'll just say yes they can
34:34
buy it as usual all right and then what else drop down menu name is required
34:42
drop down menu name edit oh i didn't give it a name um
34:49
options done i didn't i didn't edit i didn't do this one either
34:55
uh give it a name um prices oh yeah so i don't know something like
35:00
that done let's create the button
35:10
there he goes look at that all right so look this is just a form okay so um
35:17
we're going to copy that code of course their stuff looks hideous right or for fun let's let's chuck it on
35:23
this page have a look um
35:28
html stack
35:36
boom okay boom oh well foundation six actually
35:43
makes it look a lot prettier right um
35:48
but it's still like you know eh in this add to cart button obviously man that is hideous
35:54
okay what happens with uh okay so if we do this let's just do test
36:02
test we say add to cart what happens
36:09
see that that adds it to like a adds it to cart and you can check out
36:14
but where's the oh continue shopping and that goes okay then that goes back
36:20
but the but the the cart is like a dedicated page unto itself
36:25
not sure i love that to be honest with you i wonder if there's is there ability
36:31
like like how do i go back to my cart right like
36:36
how do i do that create a similar button create a new button oh create a view cart button here
36:42
we go create a view cart button there we go so let's let's create this view cart button
36:52
richard hilson says but it but it but does it uh but it does mean it's secure and pci compliant
36:58
fair enough fair point but what i was thinking was like it could be nicer like if we were iframe
37:04
it or something like that that could be interesting um so here's the view cart button so we just uh create
37:13
oh man that was easy okay boom uh uh add another one
37:28
well that one's crazy
37:34
alright so now if we preview this i have an add to cart and a view cart button so if i click view cart
37:40
and then well that didn't work oh there it goes you're just thinking it takes me back to
37:46
the cart okay hey at least you could view cart that's kind of cool
37:54
interesting it would be it would be interesting to see if we could inject all that into some sort of
38:03
light box somehow you know like like view cart would open up the view cart in a light box right or something
38:09
like that that could be that could be pretty interesting um hmm
38:19
would it be possible to open the cart view in a mo that's that's what i was just thinking irwin is like how would that be possible right so i
38:25
have like the view cart open the cart within an iframe that's in a light box but
38:32
the trick is you have to refresh we have to reload that iframe right that's that's that is the tricky bit right
38:38
there
38:44
interesting but i like this i mean i think this this even like in a modal like if this were
38:50
oh man look at that look at paypal come on dude make your buttons responsive jesus christ look at how horrible that
38:57
is maybe they're sniffing like if i were to visit this on an iphone instead like i
39:03
would hope that it the layout would be a little bit better right
39:09
um interesting okay
39:14
but for fun um obviously let's let's see if we can foundation sixtify these bad
39:19
boys okay so um let's go ahead and let's copy let's do the the add to cart
39:26
thing first we're going to go here we're going to set this to be html
39:32
okay so if you notice our form is the same we
39:38
still need this command here's our button id so we need a button id we're just going to use the same exact
39:44
form down here okay um i'm going to let's trash that we're going to use the
39:50
same one here so instead of donate we're going to say add to cart
39:58
[Music] um okay so we have add to cart uh our
40:06
button id is that okay
40:12
so here this is where things get a little bit more complicated right
40:17
because um a we we have an input um or it says oh this is a hidden type
40:24
right so if we look here this is on let's uh
40:30
beautify file all right so we have a input hidden type that has
40:37
zero on zero oh it looks like uh like form input zero the va the name is
40:43
prices and then the name is os0 oh jesus christ
40:48
why do they do that my god
40:55
this is going to be a little bit of work all right but we'll do it for fun okay so if you see this input this is a
41:01
type of hidden um name is on zero the value is prices
41:06
so let's go ahead and do that all right so i'm going to do a hidden
41:12
hidden data okay the name was on zero the value was
41:20
prices okay um then if you notice here we then we have
41:27
a select where the name is os 0 and then we have option the value is option 1 the label
41:34
is this option two option three okay
41:44
hold on one second
41:50
okay um so we need a select box so we're gonna go and add a
41:57
select box here and the name of what was the name the name was
42:03
os0 all right so a field name os0 you can
42:09
add all kinds of labels i'm just going to hide all that stuff for now okay and we'll leave it in there whatever
42:15
and then this is where we add all of our options so here we have um select something and we'll just add
42:21
another option okay and let's just do option one
42:29
so we had the label was we'll just do option one value option one okay and then we'll just copy paste that
42:36
a couple times and we have option two
42:41
and option three
42:47
all right let's preview this right now just have a look here we have our uh our label with our
42:53
option right um and then we have our add to cart button all right so essentially then what we
42:59
need to do is we need to go through down here and we have this hidden field which is the test field and then we have this field which
43:06
has you know some other options that we could set i'm not going to go through and painstakingly go through all this oh
43:11
look here's another one the currency code is usd that's probably a important one actually let's go ahead
43:18
and add that and do currency code
43:28
and the value is usd let's print that let's show that we can
43:34
do option two if i click add to cart
43:40
it works look at that
43:46
sweet shipping oh shipping was 20 because it was 10 per item i guess interesting okay
43:55
again all that was set up inside paypal that's not stuff that you can set inside the buttons
44:00
so interesting there and again they have their pixel trackers
44:05
which i don't necessarily want on my page okay um and i don't want to use
44:11
their ugly submit buttons because we already have a nicer one cool i like it
44:19
um and now let's do that view cart button last one uh so here let's look at this view cart
44:24
button i think this one's going to be pretty
44:31
simple um type hidden encrypted value oh interesting look at that
44:45
interesting all right so this one's definitely trickier i thought this was going to be something a little bit more comp
44:50
simple um i mean it is simple it's just two things but let's go ahead and do that again okay so
44:56
um let's we're going to trash that view cart button oh no oh no rap we were just crashed
45:05
rats
45:12
didn't lose everything
45:30
yep i did okay all right let's just let's just quickly
45:35
recreate that and i'll do new content i'll just extract that we're gonna go down here we're gonna put in a
45:42
form field and we need a form we need a post url action
45:47
in the url i need that to be tape paypal
45:55
that right there okay then okay let's just build out this form okay so we need a hidden hidden uh field
46:02
called command and this x click thing again so we're gonna do a hidden data um
46:10
field name is cmd and it's
46:17
that okay and then we need another hidden input so these input
46:23
image and this other image we can ignore those we don't need those but these other ones we need so this one
46:29
is name encrypted so we need another hidden data and the
46:35
name is called encrypted and then the value
46:40
um is this big huge long hairy string we're gonna copy that
46:48
paste that which is interesting all right and then we need a button to
46:53
be able to submit the form right so let's go ahead and get a submit button
47:00
to submit our form and this is going to be a view cart button right so view cart i'm not going to worry about
47:07
fun awesome 5 icons i think you guys saw how i did that all right so now we have a v cart button
47:13
if i do that i say view cart
47:22
voila there we go that's cool works
47:29
sweet let's look through the comments here let's see um you could easily create a paypal uh buy now button in the stack all you
47:35
need is paypal email address um yeah so i saw there's other buttons we could do a buy now button as well
47:42
i think if you edit the html uh the form action do we have access to that
47:49
i i think if you edit in html the form action do we have access to that yeah
47:55
the form action is this right here um i already did that right so we have a form action you can put in the url
48:02
um it's not it's not that what that code outputs is a little bit different than what this is
48:07
but as you see it still works okay so yeah so you'll do
48:14
um post url action um and then you'll put in the url that would go in the
48:19
action which for paypal it's all the same it's this web scr right um
48:25
cool so i i think i could i could probably bang out a pretty
48:30
simple like paypal buttons set right um i don't know is that
48:36
is that even remotely um interesting to anybody um there is also i should be fair and i
48:42
should say do i even have it installed i've actually never used it
48:50
uh oh i guess i don't have it i thought i had paste that
48:57
all right there is pay snap from uh from yab dab right um i have
49:04
again i've never used it uh well i guess we need to do dab dab no clue what features it has
49:13
um does he still have it form snap corners filters form loom
49:20
uh form snap oh pay snap yeah yeah because he added stripe to it yeah
49:26
i remember this now the stripe actually has done a really nice job um you know he actually has a shopping
49:32
cart in here automatically baked in um so yeah this is actually really really nice
49:40
um i i think you should you should check out paysnap um if i ever did something i wouldn't do
49:46
something as complex that has you know that has all this entire checkout thing and this is really really nice um
49:54
see i check out paysnap um you know uh if if i were to ever do something it would probably be something very basic
49:59
that just you know was a quick buy now or a quick donate button um but uh yeah pay snap is
50:06
is looks really nice just looking at this at this uh thing right here uh is there a demo where's the demo page i know there is a
50:12
demo page somewhere check out the demo foundry 2 demo foundation of course we
50:18
want to do the foundation 6 demo um beautiful look at this actually remember i give this project file to him
50:24
so we can test it out so you see he has the ability to create all these forms and and it automatically just kind of
50:30
works he's you know this they put a lot of work in it that's really good so you can add to cart and you can pay
50:36
with paypal or pay with stripe you have two options like wow that's really good and i've
50:42
never used the stack i thought i had a copy of it but um i guess i know so you need paper
50:48
type you can do all kinds of stuff look at this this is really good is fantastic
50:55
or how much how much is it i don't even know go back face that 50 bucks i think that's
51:02
i think that's fair face snaps really good really nice has full blown shopping cart with stripe
51:08
and paypal checkout wow um that's a that's a good deal
51:14
i would i would definitely look at this um if you want to do that but hopefully you guys had fun looking
51:20
through um how i took just the paypal code and created a found you know did it with a foundation form you know
51:26
um if i were to create a simple like just super simple like donate buttons and stuff like that like
51:32
so you can easily do that i don't know is that interesting to you guys um i'm not sure if you have to do that
51:37
um with paypal uh or with formsnap does he have donate stuff or is
51:42
it only e-commerce uh enable price okay there you go name your own price
51:48
interesting he looks like he's got it all guys so yeah if you want if you want easy integration with uh
51:53
with that with that creates things that look really really pretty that could be good uh pay snap but um but yeah if you just
52:01
need a simple form as you saw how easy it was just to do it with a foundation six form it's pretty cool uh hopefully that was helpful um let's
52:08
see uh paypal uses target in the form
52:14
oh yes it does use the target in the form you're correct
52:19
it's incredibly nice oh i guess chris uses pay snap so there we go um but anyway hope this was um hope this
52:27
was you know eye opening i'm just kind of show you how you can take something you know from paypal and i turned it
52:32
into i wasn't really planning on you know showing more foundation six forms it's just kind of you know what i
52:38
know and what i know how to use so um i'm sure there's a lot more ways to skin that cat but pretty cool to
52:44
do it straight with the foundation form if it's a really quick dirty simple solution so hopefully that helps out and um yeah
52:51
take care everybody hopefully we'll see you on friday uh at our normal hangouts friday at 1 30 pm pacific
52:59
um on friday this time same place same channel actually no it's not the same channel
53:04
because i don't stream those to youtube you gotta attend those just go to go on the homepage on weaverspace click on the link in there
53:11
it's weaver space hangout and um yeah hopefully we'll see you then take everybody i hope you have a
53:17
wonderful week go out there and make your websites great bye