Adobe® Muse: Advanced Techniques

Lesson 6/7 - How to Sell Anything from your Site

 

Adobe® Muse: Advanced Techniques

 

Lesson Info

How to Sell Anything from your Site

So something else that I wanted to talk to you about as far as Muse and, kind of, in a more advanced topic, if you will, is selling content. Now when I say selling content, that content can be anything. It could be an event. It could be a book. It could be something like a widget, you know. It doesn't really matter. It's selling something that you need sold. But Muse can't really do that. Muse doesn't have shopping carts built in. It doesn't have this connection, this system that allows you to do that right out of the program. There are, however, a few simpler options we can use like a PayPal button. You can use PayPal as a service to sell something. And to be perfectly honest, when we do this, when I build sites, that's a lot of times what we do. Back in the day, I'm not gonna tell you how long ago, I started developing. But we would actually, like, build shopping carts. We would integrate them, we would skin them. We would have the whole system set up. We would have payment processor...

s, and it would just be crazy hard. Nowadays, we've got things like Shopify, Square, PayPal, all these different services to utilize. And we can even integrate them into our sites, make it really easy and look the way we want it to. But function and have them do the heavy lifting as far as payment processing and keeping track of all that data. And we just, we get the money, all right? We also have to fulfill, right? So the event, the widget, the object, et cetera, you send off. So let me show you how we can do something like that. On this page, this is, kind of, a final version of a site I have in Muse. I have a PayPal "Buy Now" button. And I just wanna show you how this works. So I'm gonna go preview it. Once again, we're in Muse. If I put something on your widget out here, I'm not gonna preview it definitely in the application. So I'm gonna go under "File" and choose "Preview Page and Browser". I'll take it out to the browser. And what we'll do, I'll just show you how this works. If I drag in or add this button, this is something that's actually included in Muse as part of the widgets in the program, if I click on this, we can incorporate our own imagery if we want to, it's essentially just gonna take us out to a gateway, essentially. To a pay page. So right now it's taking us out to PayPal. If, you know, those gateways require a password or a login or something like that, that's something your customers are gonna have to figure out. And this is one of the things you're gonna use to determine which one of these you're gonna use, right? Like I said, there's a lot. Some of them require logins, some of them can do guest checkouts, things like that. But these are all things you need to, kind of, think about. I wanna show you this one. This is the simplest method. So let me go back over to Muse. And what I wanna do is open up a site that has, kind of, a start, if you will. So let me go out to the start. I'll open up a page where we're gonna put this button to sell a simple event, okay? If I come in the right over here, you're gonna see the widgets library panel. I scroll down. Let me make it taller. We'll see all the social content in there. Now I can see that I actually have a PayPal button built in here. It's really simple. Now for a lot of these types of things, to have a third party service you're using, you have to set up an account with them, right? Just like most of these types of services. You have to have an account. You've gotta have a login. You've gotta have some things in the back end going. And for some of these, you actually have to have checking accounts hooked up to the system, et cetera. They'll tell you what you need to have happen, okay? But to start with, just to get the visual on the page before we do this, just drag it out. All we need to do is take the PayPal button, drag it on the page, and it's gonna ask you some questions. Now, what's gonna happen with this is you're gonna say, "But can I? But can I?" This is what I do. Most of the time, the answer's gonna be, "No." It's exactly what you see here. This is what we can do. I will show you how we can take it a little bit further, though, okay? But for right now, we've got a button. If you think it looks good, you're like, "Buy Now", great. You don't wanna change the appearance? You don't have to do much. You just set up some things. Like I come in here and say, okay, well, how much is this product? Our event is $99. So I'll say something like, 99. You can put the zero and all that if you want. You can choose currencies. You can set, you know, an item number. If you guys are selling one object, a lot of this you probably don't have to worry about. But honestly, it might help for tracking later on if you put some kind of descriptive something in here. That way you'll know, hey, we were selling this at some point. What was it? Two years down the road, okay? So we can say that this was an event on 9/12, you know, it's not 12, 18 or something like that. Tax, shipping, if you need any of that stuff, we can set this the way we want it. Shipping, all that kind of thing. Now if we want, if I look at that button, and I say, "I don't like it. I want something better. I want to make my own." Here's what we can do. If you come under type here, you're gonna see it says, "Buy Now". First of all, you can change it. You can say, well, instead of saying "Buy Now", I want you to "Donate". It's just gonna change the default button to say "Donate". If you wanna have your own button out here, I can say "Custom Buy". If I do that, you can then add an image. This can be something typical like a .png or a .jpg, okay? So if I go to "Add Image", I'll go to "Add File". I'm gonna go into my button .png. You'll notice that in this case, it won't allow me to bring in a Photoshop file or a .psd. You gotta just check it out, and if it's the wrong format, it doesn't like it, you can always format or choose a different format. I'll click "Open". This is my button. And it's just gonna put it out there. It's gonna scale it and size it. Let me click off just so you can see the whole thing here. Scale it and size it to the size of the button there. Once we set everything up, we're pretty much done. The only thing we really have to do here is we have to make sure that we have everything set up. So if you see right here, you're gonna see the e-mail to pay. I know I skipped over that, but this is probably one of the more important things here. We wanna make sure that we actually have our e-mail address or whatever it happens to be. And mine is... (muttering) There we go. At gmail. So whoever is doing the sewing, you wanna put that e-mail address in there. That way it knows where to send the information once somebody purchases, okay? And it's also gonna associate it with the PayPal account. So you probably wanna have that set up with the PayPal account. Now what we can do is if I save the page, if we publish the site, make it live to the world. Let me go preview it just so we can see it. What's gonna happen is they're gonna follow the same procedure. They're gonna go out and be able to click on that button. So if I come to the page here, if I click on the button, it's gonna ask me for PayPal. In this case, right now, it's gonna ask me to log in 'cause I actually have a thing here. So... You can also, if you wanna do a debit or credit card, you're gonna see PayPal offers that option. That's pretty awesome. I'll click on "Log In" here. And it's gonna just take me through the payment process. Now like I said, I already have a PayPal account. That's why it's letting me do that. But once we go through and we say, okay, let's set some of this up, enter our information, whatever we have here, we can buy. Person that's selling this, that e-mail address that we put in Muse is going to be notified, and it's gonna be associated with that PayPal account, okay? So this is all done for us. Now if we decide that we wanna go out here and maybe we wanna create a more customized button, we have some different things we wanna do. We wanna set it up where, if they click on a button, they can, you know, select from a series of options or things like that. We could go directly to PayPal. Let me actually go to PayPal. I'll just open this up. And if you set up an account once again, do all that kind of stuff. You go in here and you set everything up, what we can do is we can actually start to set up a series of tools. You can set up your own button instead of using the Muse widget that comes with. A lot of these types of services will allow you to do this. You can go to that service like a PayPal, et cetera. You can set up a button or an option to pay or buy, and you can take that code and incorporate it right into Adobe Muse. So what I'll do is I'll go to "All Tools" here, and I'm gonna come down here. It's gonna say "PayPal Buttons". This is PayPal. Like I said, there's a lot of other services we could use. I'll go to "PayPal Buttons". And I could say, let's make a "Buy Now" button. I'm not gonna go through this whole process just because it can take a while. You'll see in a second here. But this is the best thing. This is the reason why I love this. The Muse widget is great. Drag it out. You wanna sell something simple? Put a fixed price on it, you're done essentially. Just set up the account at the service, get it all hooked up, you're done. But if you wanna take it further, this is where you can go. This, at least, is an example with PayPal. So I can go in and say, let me set up an option here. We can do drop shadows. If you wanna make a custom appearance, you can do that. We can set up our own image. You're gonna see that in this case, for PayPal, there's actually three different options here. We can track inventory if we want to, which is kind of crazy. You can say, hey, I've got 10 widgets left, and when I get to five, I want you to notify me. So tell me that I only have five left. You can also go in and do things like "Advanced Features". There's a lot of stuff we can do in here. But like I said, this is taking it further. It's not a shopping cart. That's not what we're about. This is about selling things. Selling anything you want but using a third party service. Okay? We can take this also another direction. If you can get into a service, like maybe Stripe or others and they require maybe a little bit more heavy lifting on your end, you need to set some more things. Deal with code or stuff like that, okay? What you can do is you can use a third party widget to use some of these payment concepts. Some of these payment processors. So I'm gonna go back over to Muse and show you where you can find that. So back in Muse. If you come to the library panel, with nothing selected in there, you're gonna see that we can see a whole bunch of these online. I'm gonna click on that, and I'm gonna be taken back out to the browser. And what we're gonna do is, we're gonna go to the Adobe Muse widget's directory. Now in here, we can go in and say, "Let's filter based on e-commerce for instance." This directory is a place where you can go to find both free and paid widget by third party as well as Adobe, and you can incorporate these really, in most cases, really simply by downloading this file, most of the time. Double clicking or importing it into Adobe Muse to get it to work. Then drag it out into your pages where you wanna use it. If you look in here, I'm not suggesting any particular one of these. A lot of these are great. But you're gonna see that if you decide that maybe you wanna work with, like, Sellfy or, you know, different types of, you know, online services like Shopify for instance, you're gonna find that somebody has probably created a widget for you that you can download in Muse. That way you're gonna treat it, in most cases, like a widget. You're gonna drag it out. You're gonna set settings. Associate with an account that you set up. Maybe with Shopify for instance and be done. And there you go. So if you have a particular payment service, so if you have a particular payment service that you like to use, you can just find the one up here. You can download it. Matter of fact, if I click on this one, this one's actually free. You can see right here. You can preview it. And that's what I would suggest for all of these. Make sure you look at it. Make sure it does what you need it to do. That's gonna be the key. You can also, then, just download the widget. Soon as you double click on it, or if you go back to Muse, I'll show you where you can incorporate it. I go back over to Muse. If I look in the library panel and come down here, you're actually gonna see, "Import Muse Library". That content that filed, it's probably zipped or something else. Once you unzip it, once you have it on your desktop or your hard drive, you can import it down there at the bottom of the library panel. That's gonna allow you, once again, drag it out, work with that third party widget as a way to collect payments. As a way to sell things or just about anything you need. The sky's the limit. So I wanted to give you a quick overview of some of the ways that we can sell content. From the dead simplest, using the PayPal button, to going a little bit further, adding some more options or content. And just to give you an idea, that PayPal button we were looking at, when I went in to start setting the settings, this is actually that button that I copy, pasted from PayPal. They just say, here, here it is. Copy and paste it into Muse. That's what most of these services are gonna give you. It just has more options for us to work with. So if I go out to my browser just to take a quick look at it, you'll see, instead of just saying "Buy Now", what I can have them do is actually choose, this is an event, I can save one or two days. What do you wanna buy? That simple edit, that simple option, is gonna make it for me. That's gonna have it work and do what I need it to do. So these are pretty amazing. There's a lot of great things you can do with them. And if you need to sell anything, you can get it done using what's built into Muse or third party widgets.

Class Description

Adobe Muse gives us an easy way to create and publish beautiful responsive websites, with no coding required.

In this Adobe® Muse intermediate project course, author, speaker, and web developer, Brian Wood will take you further into Muse, by showing  you how to emulate the responsive features of some of the coolest sites on the internet. Learn to add background video, scrolling effects, animated transitions, selling content, and more.

In this class, he’ll share the trade secrets for achieving some of the latest website trends. You’ll learn about:

  • Adding background images and video to a site
  • Working with scrolling effects (similar to parallax scrolling)
  • Adding animated transitions
  • Selling content using Paypal and others
  • Working with third party widgets and code
  • Incorporate content from other Adobe apps

Using an existing responsive website as a launching point, you’ll explore best practices for replicating some of the latest website trends using Adobe Muse CC version 18.0. 

Reviews