Best Practices for Complete Website Redesign

[badita]

 Did anyone went through a complete site redesign?

This is a more complex topic as right now we have:

• about 20 css (some are default on every page, some are used only in particular blog posts)
• 10 scripts
• 10 blog templates (listing + article)
• 5 email templates
• 20 landing templates
• tens of modules

and everything needs to be recreated from scratch without interfering with the old components.

Nice would be to

• work on a new hubspot account after migrating the content
• redesign everything
• delete old resources
• migrate the new resources back into the original account

But this won't work as we have specific content linked with template modules.

Do you have any ideas?

Right now we're working on the original website trying to keep everything separated.

[Jsum]

@badita, 

The content staging areas (content settings -> content staging (left sidebar bottom)) are not limited, they are in fact exactly the same as if you were to use the website pages section of your portal only with more control. 

What you are wanting to do is pretty simple. to build off of what @stefen mentioned, You will want to create a new folder in your design manager. In this folder re-create your site as needed. once you have all of your templates, css, js, and modules recreated in a different folder, go to the content staging area and start creating pages using these templates. You can stage your entire new site here while your old one stay up on the live domain. 

after you have your site staged and how you want it, you can delete your old site pages or archive them I think. Then push the staged site live. With the new site live you will just need to go through your design manager and find and delete any old files you want to get rid of. 

[badita]

---

@Jsum wrote:

@badita, 

The content staging areas (content settings -> content staging (left sidebar bottom)) are not limited, they are in fact exactly the same as if you were to use the website pages section of your portal only with more control. 

What you are wanting to do is pretty simple. to build off of what @stefen mentioned, You will want to create a new folder in your design manager. In this folder re-create your site as needed. once you have all of your templates, css, js, and modules recreated in a different folder, go to the content staging area and start creating pages using these templates. You can stage your entire new site here while your old one stay up on the live domain. 

after you have your site staged and how you want it, you can delete your old site pages or archive them I think. Then push the staged site live. With the new site live you will just need to go through your design manager and find and delete any old files you want to get rid of. 

---

Maybe I don't get it but I'm not creating any new pages. I want to change the templates for the old pages at once. I need something like "template staging" and not "content staging"

[Jsum]

@badita I see.

I would clone your current templates to a new folder then, attach a new style sheet, and change the structure of the templates as needed but try not to replace any modules. I have ran into instances where we replace a rich text module, for instance, and the content doesn't transfer over when switch or the templates. 

Once you have the new version of your templates the way you want them, you can clone your current pages (maybe even to the staging area?) and switch the templates in the settings area of the page editor. all of your content should transfer over seamlessly. 

The only difficult part is going to be figuring out how to create the new versions of the pages in an organized way that doesn't interfere with your current site, and then pulling down the current site to launch the new version when finished. I haven't ever tried to clone a website page to the staging area but it that works it would be very good for you. Another option is to just build all of the templates then go to each website page and switch the templates on the live site, but if any issues arise you will have to fix them on the fly as your site is live and users might hit those issues. 

As far as "template staging" goes, you can preview a template that you are working on in the design manager. This should be sufficiant for making sure the template looks right. 

[dcronk]

I'm dealing with redesigning a site and blog as well and the lack of dev or testing enviroment is absolutely one of the most frustrating things about HubSpot and the reason I will definitley not recommend the COS for website building.  Not to mention that the "staging" environment for landing/web pages is a highly manual process (dealing with individual files and settings) and content drops very easily when swapping out templates/modules, especially if you go from a template builder template to a coded template.   Would be nice to have the ability to map data from one module to another.

As far as the blog and lack of staging, I've found that the only way to deal with it is to create a new blog, use the current templates and duplicate UI config settings to get it as close as possible to the live blog, then go from there and hope it's smooth.  I'm only in the beginning stages, so I'll be happy to update later.

[kylenumann]

@dcronk Agreed. I am currently looking into dev/staging workflow as our agency has moved our blog onto Hubspot. All the replies to @badita in this thread seem to say "It's easy, just convert every single page, template & resource one at a time". That is not a managable workflow at any kind of scale. I'll keep looking & learning, hoping that I find a better method, but it is not looking good...

[badita]

Yes, but it seems very limited.

Again I have hundreds of resources (css, js, modules, blog templates, landing templates).

For example we have about 15 blogs and there is no blog staging.

[stefen]

@badita the blog is easy because they all use the same template. You can create a new blog to test the template on before switching to the new template.

Once you stage a page you can swap the template on that page so you can test each one individually with your new design. Once you've got all your pages staged and ready to go you just flip the switch and change the blog template to the new design and you're done.

[badita]

@stefen Our blogs use different templates. Let's say about 5.  We have resources added on the blog settings(default css) that may be different. 

So, you're saying it's working for everything besides blog. However please note that we need a Template & Resources Staging not a Content Staging. I am not going to create new pages, but just change the layouts.

[stefen]

@badita have you checked out the Content Staging tools? - http://designers.hubspot.com/docs/tools/content-staging

Makes the process a whole lot easier.