- Designer Launch
- Porting a Redesign
Porting a Redesign in Base 2
Your client has tasked you with developing a new website for them, so you have developed this new site on a redesign instance on the Vin65 platform. You have the client's approval, passed the Designer Launch Q/A, and have the go-ahead from Vin65 to transfer the new design over the existing website. Now what?
We have created a guide on the steps and precatutions to take during this transfer process. Read the following text/steps to learn how to port a redesign instance successfully:
Backup The Website Files: Learn about backing up the existing website files. Learn More >
Copy New Content: Learn about copying content from the development site. Learn More >
Upload Splash Page: Learn about creating a splash page while your site is in development. Learn More >
Copy Over Layouts and Assets: Learn about copying layouts and assets from the development site to the live site. Learn More >
Parse New Layouts: Learn about parsing the new layouts for the live site. Learn More >
Timestamp CSS and JS Files: Learn about timestamping CSS and JS files. Learn More >
Remove Splash Page: Learn about removing the splash page and launching your new site. Learn More >
This is no small task and you should give yourself at least six hours to complete the entire procedure.
Backup The Website Files
Step 1: It's always good to have a local copy of your client's content v65 folder files for their existing website. Murphy's law likes to keep things interesting, so having a backup copy is one extra precaution if you need to restore any files you removed accidentally.
Before you port the development site to the live site, download a local copy of the all the client's current site files via the FTP as you will be removing or overwriting them with your new .htm files.
We recommend to avoid using FileZilla as your FTP client if possible, as it has caused some issues for designers in the past that we cannot replicate in WinSCP, CyberDuck, or Transmit.
Copy New Content
We recommend enabling Google Recaptcha for your Forms Components. For more information, click here.
Step 2: To minimize down time, you will want to manually copy all of the new content you've created from the development site to the existing site before getting to step 3. This may include any photo galleries, forms, products, content blocks, pod locations, blog posts, events, or pages on the redesign site that are not already on the existing site. Note that this step needs to be done manually through the Content Editor tools since you're not able to copy this created content over via the file system.
If you are adding new pages and do not want them to appear until the site is ready, set the page to be inactive in the page settings as inactive pages are easier to identify than pages that is hidden.
Once the site is ready, you can activate your new pages, and deactivate any old ones that are no longer needed.
There are several system pages such as the checkout, store, club list, and member pages that can only be in the system once. If there are any new pages that are going to be added to these sections, add them as sub pages of the existing page.
Upload Splash Page
Step 3: As you will be modifying the design of the live site, you want to add a splash page to the live site so that visitors will not see the website until it is ready. In the www folder, create a file called index.html with your splash page layout and it will be used instead of the Vin65 system homepage. This should be pure HTML and not use any of the Vin65 Designer Launch tags.
If you want to access the site while the splash page is active, you can access any of the pages through a specific page url/marketing url, or using index.cfm to access the homepage. To limit downtime for the live site, you can hold off on uploading this page until you make changes to the content or layouts that affect the live site.
Copy Over Layouts and Assets
Step 4: We strongly recommend not to skip backing up the client's layout files in step 1 as you are now going to be deleting any unused layout files through the FTP from the v65html folder and adding the files from the development site. Do the same with any new files in the images, css, and js folders.
Old files make maintenance more difficult when changes need to be made, so removing any unused files makes everyones lives easier. Once you've cleared out the old, upload any other assets that are required by the new design through the FTP.
Some folders are required for the system to function properly. While copying your assets from the development site over to the live site, under /www/assets/images please make sure that the blog, email, photogallery, pods, and products folders are not removed. Rather, add images to these folders through the platform interface.
Parse New Layouts
Step 5: With the live site blocked by the splash page, all of the new layouts can be parsed and have the new design ready to view on the live site. This would be a good time to deactivate any old content, and activate the new content that you had copied over in step 2.
Timestamp CSS and JS Files
Step 6: To avoid caching, you will want to make sure your CSS and JS files are using our v65:css and v65:js designer launch tags which will enable you to easily timestamp these files by accessing /index.cfm?reload=1.
Remove Splash Page
Step 7: Once you have reviewed the website with the new design applied to it, remove your splash page, reveal the new website, grab a glass of wine and celebrate!