How To Use A Development Site Safely

Transcription

1 Developer Sandbox User Guide Show Your Results, Not Your Work Version 1.0 Overview Developer Sandbox lets you work on your Miva Merchant site without letting the world see the construction debris. Unlike using a Development site, you only need to do the work once. When finished, a simple click shows the world the results. Developer Sandbox not only saves time by not having to repeat coding when you transfer new work built on a development site you also ensure that you get the results you intended the first time. Using a development site to test and create new features or code changes to an existing site is a safe way to ensure your customers don t see a work in progress, or even worse, a coding error resulting in a fatal error or some other anomaly. The problem is, once you get it right on the development site, you have to copy the code changes over to the live site (or figure out how to copy over the database changes from the live site to the development site). And even when you do, there is still a chance that the copying the coding changes can lead to errors. You can allow multiple web site visitors to see sandboxed content, either by IP address (a unique code assigned to each visitor) or by customer id. Access can be turned on and off easily. You can have multiple projects that are individually assigned to visitors. Developer Sandbox has several additional features to speed your development efforts: Project Status Display: a small, semi-transparent window that appears whenever you view a page that has a project running of which you are a member. This window lists the projects and their current state. Find Projects: A one click way to locate every project. Shows the Template used, and the context of the sandbox to make it easy to find them. Bear With Us for a Moment Powerful technology can sometimes take a bit of pondering to grasp and this is definitely powerful. Developer Sandbox works by looking at each site visitor and determining if they are a member of a project group. If they are, then a special variable is made true, so a simple MVT:IF statement can be used to allow or deny access. For example, I can see this content and no one else can (unless they too are assigned to the My New Project sandbox). Stuff everyone else sees. With Developer Sandbox, you can define multiple areas in a live site whose changes can only be seen by you. For example, let s say you want to improve your product page. You d start your sandbox by copying the existing code from the Product Display Layout template.

2 Product Display Layout template Copy of existing Product Layout template code Existing Product Layout template code. If you are using related products, you do the same in the Related Products Layout template. Related Products Layout template. Copy of existing Related Product Layout template code Existing Related Product Layout template code. Now you can make any changes you want to the copies of the original (or even start from scratch if you want). And here s one of the key benefits of Developer Sandbox: when you are finished, you can demo your changes to a select group of co-workers, friends, customers etc. When you feel it s ready for prime time, you can make the sandbox content live - meaning EVERYONE can now see it. And if you miss something in your testing, you can quickly switch it back to active (sandbox) mode, reverting the change and using the old code instead. There is even a bypass mode so YOU - or anyone in the project - can see how it used to look. Once you are SURE the new code is golden, you can remove the sandbox at your leisure; even if your project had hundreds of sandboxes. (We ve even included a Find Projects feature in case you forgot where all of them were.) Setting Up Your First Project Setting up a project has four basic parts: Create a Project. A project can be used to create one or more sandboxes that can be controlled as a single entity. Create a User. You can use the person s IP address or Customer ID. Assign Users to a Project. Each project can have one or more more users who can see the sandboxed content. Create Sandboxes in your Templates. You can add a sandbox to any template in Merchant, including templates or third party module that use managed templates. Note: Sandboxes MAY also work in non template content, but we don t guarantee it. Open the Developer Sandbox admin 1. In the left nav, open the Utilities folder. 2. Click the Developer Sandbox tab. 3. In the main area of the admin, click the Open Developer Sandbox button. Creating a Project You can create as many projects as you like. They are mostly for organizing and managing tasks. For example, if you were redoing your checkout pages, one project would be sufficient. But, if you were also redoing your product pages at the same time, it s strongly recommend that you use a separate project. Once you create a project, you can create and assign users to it. You can also use the Manage Projects tab to control the state of the sandbox. There are three states: Active: The sandboxed content appears to ONLY those members assigned to a project. This is the Normal state for a sandbox project. Bypass: The sandboxed content is hidden from everyone. This is useful when you, as a project member, want to see how the original page looked.

3 Live: The sandboxed content appears to ALL viewers regardless of whether they are project members or not. This state is used to turn your updates live when you are satisfied with the results. Afterwards, at your leisure, you can remove the old code and content (and project sandboxes) from the template. (See Removing Sandboxes from Templates.) To create a sandbox project: 1. Open the module s admin. 2. Click Manage Projects tab. 3. Enter a code for the project. This is the code you will also use in when creating sandboxes in your templates, so it s helpful to make it somewhat descriptive. The code will automatically contain the prefix pmx. 4. Add a more descriptive explanation of the project under Description. 5. Click Add. To change the state of a project 1. Open the module s admin. 2. Click Manage Projects tab. 3. Select the state option, either Active, Bypass or Live, then click Update. To remove a project 1. Open the module s admin. 2. Click Manage Projects tab. 3. Under Current Projects, check Delete, then click Update next to the Delete checkbox. Adding a User You can create sandbox users using either the person s IP Address or their Merchant Customer ID. IP Address based users are probably the most effective since they don t require you to log in to your Merchant account in order to use. Additionally, some features in Merchant require that you NOT be logged in. For example, you can t really work on the Log In screen as a Customer ID User. However, Customer ID Users have the advantage of being able to be used from ANY device. (For example, if you access the site from a cell phone AND your computer, you ll probably need two different IP Address user accounts, instead of single Customer ID account.) If you create an IP Address user, you may need to change their IP address should if their IP changes. (Some Internet Service Providers will change your IP Address if you reset the connection.) Note: The IP Address user tab is shared by other Phosphor Media modules. If a user has been added through these modules, they will automatically appear in the IP Address tab of Developer Sandbox. Conversely, IPs entered here will appear in the other module s admin. Create IP user account 2. Click IP Address Users tab. 3. If this is for you (and you are not already a user) your IP address will be show under IP Address. Type a Nickname for this IP. Tip: Nicknames let you remember who s IP is being used. A single user might need different IPs. For example, if you are reviewing changes on your mobile phone or from different locations. So, you can have My Office, My Mobile Phone, etc nicknames. 4. Click Add My IP. 5. If you need to add someone else s IP, type their IP in the IP Address box and a nickname for them in the Nickname box and then click Add New IP. Updating an IP user s IP Address

4 2. Click IP Address Users tab. 3. In Allowed IP Address, change the IP listed in the IP Address box and click Update. Create Customer ID user account 2. Click Customer Users tab. 3. From the Customer drop down, select the Merchant Customer Account (indentified by Billing First Last name). 4. The Merchant Customer First and Last name appear in the Name box. You can leave this as is, or choose a different name for this user. Tip: If you have both a IP Address user and Customer ID user, you might indicate this in the Name. For example, My Name (CustID) and My Name (IP Add). Updating a Customer ID user name 2. Click Customer Users tab. 3. In Allowed Current Customers, change the name in the Name box and click the adjacent Update button. Assigning Users to a Project Once you have at least one project and one user created, you can assign a user to a project. You can assign a mix of IP Address users and Merchant Customer ID users to a single project. Users can also be assigned to multiple projects. Assign a user to a project 2. Click the Manage Members tab. 3. In Add Assignment, choose the project from the Project code list. 4. Next, choose the user you want to assign from the User name list. 5. Click Add. Note: You do not need to change user assignments if the user s IP or customer account has changed, you simple change the settings of their user account in the appropriate IP Address Users or Customer Users tab. To remove a user from a project 6. Open the Developer Sandbox admin. 7. Click the Manage Members tab. 8. In Current Manage Members, click the Delete button adjacent to the User you want to remove from the project. Creating Sandboxes in Templates The last task is to define the sandboxes you need in the Merchant templates. (In all fairness, this is the tricky part, so take your time if you don t get it right away.) You create a project sandbox by using the project s code in an SMT IF or IF/ELSE statement. For example, if you where ADDING something to a template, you d use just an SMT IF statement. For example: This is the new code or content for the template.

5 If you are revising existing content/code, you d use an IF/ELSE. For example: This is the NEW code or content for the template. This is the ORIGINAL code or content for the template. The expression for the SMT IF/ELSE statement is the project code expressed as a global variable (in other words, you and a g. to the project code. We strongly recommend that you use an SMT and HTML comment to identify the sandbox. This makes it easier to locate in the template and reminds you of the purpose of the code or content. Here s what we typically use to make it easier to work with sandboxes: <mvt:comment>new Project Content/Code Sandbox</mvt:comment> <!-- NewProject Sandbox Original Content/Code --> This is the NEW code or content for the template. <!-- // NewProject Sandbox Original Content/Code --> <mvt:comment>original Content/Code</mvt:comment> <!-- Original Content/Code --> This is the ORIGINAL code or content for the template. <!-- // Original Content/Code --> Removing Sandboxes from Templates When your project is completed, and you ve set it to Live, you can remove the project sandboxes. Note: We strongly recommend that you retain a projects sandbox for at least a week or so. This will allow you to revert (set the project back to active) should an issue arise with the new code or content. To remove a sandbox, you simply delete the remove the IF statement surrounding the sandboxed code or content, or in the case of an IF/ELSE sandbox, the remove the IF expression and the ELSE code and content. For example, in the aforementioned sandbox example, you d delete the X-ed out lines. <mvt:comment>new Project Content/Code Sandbox</mvt:comment> <!-- NewProject Sandbox Original Content/Code --> This is the NEW code or content for the template. <!-- // NewProject Sandbox Original Content/Code --> <mvt:comment>original Content/Code</mvt:comment> <!-- Original Content/Code --> This is the ORIGINAL code or content for the template. <!-- // Original Content/Code -->

6 Displaying the Developer Sandbox Status Window The display of the sandbox status window is generated from a single SMT tag placed anywhere within the <body></body> tags of your site. We recommend adding it to a global template such as the Global Header or Footer. To display the Developer Sandbox Status Window 1. Add the following SMT tag to a global template that appears between the <body> and </body> tag: 2. &mvt:global:pm_sandbox_status;