sql catalyst

tech2023-10-28  99

sql catalyst

In the first part of the this series, we started to explore Adobe Business Catalyst, a full-service platform that you can use to enable your clients’ online businesses. In that installment, I showed you was how easy it is to take your design and build a website around it using content management tools and templates that you design and manage. We added interactive forms to collect data that could be used in marketing campaigns, and we created products and catalogs in your online store without having to do any back-end development. For each new capability, we saw how you could exert very fine-grained control over the user experience you’d created in order to help your client’s online business grow.

在本系列的第一部分中 ,我们开始探索Adobe Business Catalyst ,这是一个全方位服务的平台,您可以使用它来启用客户的在线业务。 在这期文章中,我向您展示了使用设计和管理的内容管理工具以及模板围绕您的设计并在其周围建立网站是多么容易。 我们添加了交互式表格来收集可用于市场营销活动的数据,并且我们在您的在线商店中创建了产品和目录,而无需进行任何后端开发。 对于每种新功能,我们看到了如何对创建的用户体验进行非常精细的控制,以帮助客户的在线业务发展。

That’s really the strength of Business Catalyst: the platform is designed to give you the tools to extend your business, so that you can deliver a solution for your clients to grow their business.

这确实是Business Catalyst的优势:该平台旨在为您提供扩展业务的工具,以便您可以为客户提供解决方案以发展他们的业务。

Additional reading includes;

其他阅读内容包括;

Introduction to Adobe Business Catalyst – Part 1

Adobe Business Catalyst简介–第1部分

Introduction to Adobe Business Catalyst – Part 2

Adobe Business Catalyst简介–第2部分

Introduction to Adobe Business Catalyst – Part 3

Adobe Business Catalyst简介–第3部分

How to Set Up an Online Store with Adobe Business Catalyst

如何使用Adobe Business Catalyst设置在线商店

In this installment, we’ll delve a little deeper into those core capabilities to finish building out the online store, look at the rich analytics tools that are built into the system, and show you how to provide your client with their own access login—with reduced permissions.

在本期中,我们将对这些核心功能进行更深入的研究,以完成在线商店的建设,研究系统内置的丰富分析工具,并向您展示如何为客户提供他们自己的访问登录名-减少权限。

First, though, let’s have a quick recap of the work environment: you can use Business Catalyst online as a web-based set of tools to manage the structure, content and functionality of your site, or you can work locally and FTP your files up to your site for further integration. If you use Dreamweaver to develop your sites, that product offers a Business Catalyst extension that integrates your site template and module capabilities, so you can work locally and sync to the remote site as you go. For this walkthrough, I’ll be working online.

不过,首先让我们快速回顾一下工作环境:您可以在线使用Business Catalyst作为基于Web的工具集来管理站点的结构,内容和功能,或者可以在本地工作并通过FTP上传文件到您的站点进行进一步集成。 如果使用Dreamweaver开发站点,则该产品将提供Business Catalyst扩展,该扩展集成了站点模板和模块功能,因此您可以在本地工作并随行同步到远程站点。 对于本演练,我将在线工作。

电子商务配置 (Ecommerce Configuration)

In part one of this series, we set up a simple online store and populated it with Catalogs and Products. Business Catalyst lets you dig down within the templates to customize the way your products are presented—from the pages’ look and feel, to the data elements. There’s also a fully integrated shopping cart solution lurking under the hood. So let’s customize the different workflow components of the shopping cart, checkout, and fulfillment to round out our online store.

在本系列的第一部分中,我们建立了一个简单的在线商店,并在其中填充了目录和产品。 Business Catalyst允许您在模板中进行深入挖掘,以自定义产品的展示方式-从页面的外观和数据元素。 引擎盖下还隐藏着一个完全集成的购物车解决方案。 因此,让我们自定义购物车,结帐和履行的不同工作流程组件,以完善我们的在线商店。

购物车 (The Shopping Cart)

This is probably obvious for you, but just to be sure we’re on the same page, the purpose of a shopping cart is to allow customers to select multiple items to purchase over the course of a visit to an online store, and to complete purchasing all of those items in one checkout process when they’re finished. The Business Catalyst shopping cart follows strong conventions in that it’s session-based—meaning the data in the cart only exists through the current session—and it uses Ajax to let the customer add items to the cart while staying on the current page to continue shopping. The products were added to pages, and the shopping cart contents module was added to the template, so that it’s persistent through the site (see part one for more information).

这可能对您来说很明显,但是为了确保我们在同一页面上, 购物车的目的是允许客户在访问在线商店的过程中选择多个要购买的商品,并完成完成所有商品后,只需一次结帐即可购买所有这些商品。 Business Catalyst购物车遵循严格的约定,因为它基于会话-意味着购物车中的数据仅在当前会话中存在-并且它使用Ajax让客户在停留在当前页面上继续购物时将商品添加到购物车中。 将产品添加到页面,并将购物车内容模块添加到模板,以便它在整个网站中都具有持久性(有关更多信息,请参见第1部分 )。

On the shopping page, the items are listed with a name, price, quantity, and an Add to Cart button. When the customer clicks on the button, the product is added to the cart and they are prompted with an alert, as Figure 1, “Adding an item to the shopping cart” shows. (If you’re feeling adventurous, use a little bit of Ajax to capture that event and display the message inline!)

在购物页面上,列出了带有名称,价格,数量和“ 添加到购物车”按钮的商品。 当客户单击该按钮时,该产品即被添加到购物车中,并带有警告提示, 如图1所示,“向购物车中添加商品” 。 (如果您喜欢冒险,请使用一点Ajax捕获该事件并内嵌显示消息!)

Figure 1. Adding an item to the shopping cart

图1.将项目添加到购物车

As soon as the item is added, the View Cart module is updated to reflect the total number of items in the cart, and their total cost. When you click on the View Cart link, you can see the detailed contents of the cart. Like most of the Business Catalyst tools, the default design is simple and completely functional—but it may not gel with your site’s design. As you work through your design, you can determine which elements need to be modified and you can choose which functional and data elements fit into your client’s online store. Let’s look at the default design, which is shown in Figure 2, “Viewing the cart”.

添加项目后,“查看购物车”模块将更新,以反映购物车中的项目总数及其总成本。 当您单击查看购物车链接时,您可以看到购物车的详细内容。 像大多数Business Catalyst工具一样,默认设计既简单又完整,但可能与您网站的设计不符。 在设计过程中,您可以确定哪些元素需要修改,还可以选择适合客户在线商店的功能和数据元素。 让我们看一下默认设计, 如图2“查看购物车”所示 。

Figure 2. Viewing the cart

图2.查看购物车

For starters, I want to remove the breadcrumb navigation and update the styles used for the headers. I’ll log in to the Admin section of the site in Business Catalyst and click on eCommerce to bring up the tools I use to manage the online store. I want to edit the templates that are used for the shopping cart, so I clicked on the View Customization Options link in the right-hand navigation. As you’ll remember from Part 1, this the same area where we accessed the templates to customize the Product and Catalog pages. You’ll find the shopping cart templates in the lower section. Click on Shopping Cart to bring up the editing screen shown in Figure 3, “Customizing online shop layouts”.

对于初学者,我想删除面包屑导航并更新用于标题的样式。 我将在Business Catalyst中登录网站的“管理员”部分,然后单击“ 电子商务”以调出我用来管理在线商店的工具。 我想编辑用于购物车的模板,所以我单击了右侧导航栏中的“ 查看定制选项”链接。 您将在第1部分中还记得,在同一区域中,我们访问了模板以自定义“产品”和“目录”页面。 您将在下部找到购物车模板。 单击购物车以显示如图3“自定义网上商店布局”所示的编辑屏幕。

Figure 3. Customizing online shop layouts

图3.自定义在线商店布局

Once again, the default mode is Design view, which lets you see the elements of the page. Also, Business Catalyst gives you access to all of the data elements available for the layout, as Figure 4, “Editing the shopping cart page” shows. If you wanted to add more data elements, you could insert them using the Tag insert drop-down menu.

同样,默认模式是“设计”视图,它使您可以查看页面的元素。 而且,通过Business Catalyst,您可以访问该布局可用的所有数据元素, 如图4“编辑购物车页面”所示。 如果要添加更多数据元素,可以使用“ 标签插入”下拉菜单插入它们。

Figure 4. Editing the shopping cart page

图4.编辑购物车页面

In this case, I’m going to be updating some styles and trimming the contents of this page. I’ll want detailed control over this process, so I toggle over to HTML mode, which Figure 5, “Editing the shopping cart in HTML mode” shows.

在这种情况下,我将更新一些样式并修剪此页面的内容。 我需要对该过程进行详细控制,因此我切换到HTML模式, 如图5“以HTML模式编辑购物车”所示。

Figure 5. Editing the shopping cart in HTML mode

图5.以HTML模式编辑购物车

I remove the div that contains the breadcrumb navigation, and change the style attribute and the title of the page. Also, there are some elements that don’t fit with our current design, but which are important for the future growth of the site: Gift Vouchers and Discounts are great ways to encourage repeat business and are easy to include as part of product set up. For the moment, since we don’t have those programs in place, let’s remove them from the Shopping Cart screen. In addition, our client doesn’t want to allow customers to request a quote, so I removed that HTML and toggle back over to Design view; the result is shown in Figure 6, “The modified shopping cart layout”. That’s pretty simple—there are no requirements to write up, and there’s no haggling with a developer. You’re all set.

我删除包含面包屑导航的div ,然后更改style属性和页面title 。 此外,有些元素与我们当前的设计不符,但对网站的未来发展很重要:礼品券和折扣是鼓励重复业务的好方法,并且很容易包含在产品设置中。 目前,由于我们没有这些程序,因此从“购物车”屏幕中将其删除。 另外,我们的客户不想让客户要求报价,因此我删除了HTML并切换回“设计”视图; 结果如图6“修改后的购物车布局”所示 。 这很简单-无需编写,也无需与开发人员讨价还价。 你们都准备好了

Figure 6. The modified shopping cart layout

图6.修改后的购物车布局

After saving my changes, I can refresh the shopping cart page. Once again, my design—shown in Figure 7, “The updated shopping cart page”—won’t win any awards, but I hope it shows you the level of control that you have available to customize your store.

保存更改后,我可以刷新购物车页面。 再次,我的设计(如图7所示,“更新的购物车页面”)不会获得任何奖励,但我希望它能向您显示可用于自定义商店的控制级别。

Figure 7. The updated shopping cart page

图7.更新的购物车页面

Let’s keep moving through the templates. Business Catalyst makes it easy to ensure you’ve customized everything in the checkout workflow. Take a closer look at the online shop layouts page—the templates are arranged in order, so you can step through each one to make sure it fits your client’s needs. The first thing a customer will do is add an item to cart, and once they’re finished shopping, they will need to view the contents of the cart. Next, they’ll need to enter their billing information, and finally, they’ll see a confirmation screen. In Business Catalyst, everything’s all set up and ready for you to apply your touch to the checkout experience, as Figure 8, “Customizing each step of the checkout process” shows.

让我们继续浏览模板。 通过Business Catalyst,可以轻松确保自定义了结帐工作流中的所有内容。 仔细看一下在线商店的布局页面-模板是按顺序排列的,因此您可以逐步检查每个模板以确保其满足客户的需求。 客户要做的第一件事是将商品添加到购物车,完成购物后,他们将需要查看购物车的内容。 接下来,他们需要输入帐单信息,最后,他们将看到确认屏幕。 在Business Catalyst中,一切都已设置好,可以将您的触摸效果应用于结帐体验, 如图8所示,“自定义结帐流程的每个步骤” 。

Figure 8. Customizing each step of the checkout process

图8.定制结帐流程的每个步骤

Once we make our changes to the Shopping Cart details page, we have two more steps in the checkout process to customize: payment and confirmation. Let’s see what the payment page looks like right now by clicking Check Out on the shopping cart page. The payment page—shown in Figure 9, “The default checkout page”—is really the main data entry step in completing the purchase: the customer enters their name, address, billing, and credit card information, and submits the form for processing.

在对购物车详细信息页面进行更改后,我们将在结帐流程中自定义两个步骤:付款和确认。 通过单击购物车页面上的签出 ,现在可以看到付款页面的外观。 支付页面(如图9所示,“默认结帐页面”)实际上是完成购买过程中的主要数据输入步骤:客户输入其姓名,地址,账单和信用卡信息,然后提交表格进行处理。

Figure 9. The default checkout page

图9.默认的检出页面

Again, the default layout is completely functional and quite simple but it needs some updating and customization to meet our business and design goals. In this case, we’re not just going to change the page’s look and feel: we’re going to customize some of the options in the drop-down menus and payment options. That template is called Registration – Buy. Click on it to edit it.

同样,默认布局完全可以使用并且非常简单,但是需要进行一些更新和定制才能满足我们的业务和设计目标。 在这种情况下,我们不仅要更改页面的外观,还需要自定义下拉菜单和付款选项中的一些选项。 该模板称为注册-购买 。 单击它进行编辑。

In the HTML view, I scroll down and modify the country list to remove countries in which we won’t be doing business, update the list of accepted credit cards and expiration dates, and modify the payment methods we’re going to accept. The updated page is shown in Figure 10, “The modified checkout page”.

在HTML视图中,我向下滚动并修改国家/地区列表,以删除我们将不开展业务的国家/地区,更新接受的信用卡和到期日的列表,以及修改我们将接受的付款方式。 更新后的页面如图10“修改后的结帐页面”所示 。

Figure 10. The modified checkout page

图10.修改后的结帐页面

As an alternative (and to get much more control at the field level), I could go to the Modules section, click on Webforms, and select the Online Shop Purchase Form. In the form editor you can add and remove fields that you want to have on, or leave off, your Purchase form, as Figure 11, “Editing the Online Shop Purchase Form Module” shows.

作为一种替代方法(并且要在现场级别获得更多控制),我可以转到“ 模块”部分,单击“ Webforms” ,然后选择“ Online Shop Purchase Form” 。 在表单编辑器中,您可以添加和删除想要在“购买”表单上保留或保留的字段, 如图11“编辑在线商店购买表单模块”所示。

Figure 11. Editing the Online Shop Purchase Form Module

图11.编辑在线商店购买表单模块

important: Changing the Module? 重要:更换模块?

If you make changes to the module itself, remember that you must reinsert it into the page or template that uses it.

如果对模块本身进行更改,请记住必须将其重新插入使用该模块的页面或模板中。

With a minor edit in the CSS, the form block is now left-aligned, and after making some minor text edits, we have something that’s a little closer to our design. As with all elements in the store, you can continue to fine-tune and hone the user experience to create a design that’s right for your client. The payment processing will be handled in the back-end—we’ll take a look at that next—but the validation of data entered into the mandatory fields is handled in JavaScript. You could add some Ajax to the page to perform some inline validation and improve the user experience even more. If you want to edit the wording in the messages, you can do that right in the JavaScript file called ValidationFunctions_EN.js—it’s all accessible and under your control.

在CSS中进行较小的编辑后,表单块现在将左对齐,并且在进行了一些较小的文本编辑之后,我们得到的内容与我们的设计更加接近。 与商店中的所有元素一样,您可以继续微调和磨练用户体验,以创建适合客户的设计。 支付处理将在后端进行,我们将在后面进行介绍,但是输入到必填字段中的数据的验证是使用JavaScript处理的。 您可以在页面上添加一些Ajax来执行一些内联​​验证并进一步改善用户体验。 如果要编辑消息中的措词,则可以在名为ValidationFunctions_EN.jsJavaScript文件中直接进行操作-都可以访问并且在您的控制之下。

The last step is to customize the payment confirmation page. Back on the Online Shop Layouts page, click on Receipt – Buy to edit the template. If you want to add any customer service messages or contact information, you can add it here.

最后一步是自定义付款确认页面。 返回“在线商店布局”页面,单击“ 收据–购买”以编辑模板。 如果要添加任何客户服务消息或联系信息,可以在此处添加。

Before you can accept credit card payments, you’ll need to configure your Payment Gateways. Go to eCommerce > Payment Gateways and select the proper gateways for your client, as shown in Figure 12, “Configuring Payment Gateways”. Note that credit card processing does require an upgraded, paid account.

在接受信用卡付款之前,您需要配置您的付款网关。 转到eCommerce > 支付网关,然后为您的客户选择适当的网关, 如图12,“配置支付网关”所示 。 请注意,信用卡处理确实需要升级的付费帐户。

Figure 12. Configuring Payment Gateways

图12.配置支付网关

You’ll need to get the appropriate merchant information from your client to set up the gateway, as well as PayPal information if they want to receive payments through PayPal as well, as shown in Figure 13, “PayPal”.

如果客户也希望通过PayPal接收付款,则需要从客户那里获取适当的商家信息来设置网关,以及PayPal信息, 如图13中的“ PayPal”所示 。

Figure 13. PayPal

图13.贝宝

You’ll want to work with your client to configure this part of the site, but as you can see, making updates to it is just as easy as any other part of the online store. Other details in the ecommerce section are just as straightforward to customize—shipping options, tax codes, and even QuickBooks integration are all pre-built and ready to use.

您将希望与客户一起配置网站的这一部分,但是正如您所看到的,对其进行更新与在线商店的任何其他部分一样容易。 电子商务部分中的其他详细信息也很容易自定义-发货选项,税码,甚至QuickBooks集成都已预先构建并可以使用。

翻译自: https://www.sitepoint.com/business-catalyst-part-2/

sql catalyst

相关资源:jdk-8u281-windows-x64.exe
最新回复(0)