creating a new page (several) for live studio and adding different components to it

[Rachie1986]

creating a new page (several) for live studio and adding different components to it. I am doing a complete community restructure and I was to create several different page that I can style in studio but are in the live environment. Can anyone help me do this as I have tried creating a page in studio but it's not showing in the live environment and I realise this is not the right way so from scratch how do I do this?

[nehaSharma]

Hi @Rachie1986 We don't create the custom pages directly over the Production. We create them over the Studio and then push them to Production.

Each custom page has a unique Page ID.

Below is the URL structure:

<YourCommunityURL>/t5/custom/page/page-id/<PageID>

[Rachie1986]

OKay so lets say I have a page in studio created. I the push that live in production and it say success. Then what? where is the page, how do I find it in my structure?

On a side note. If I just want to update the components of a specific page/category like a KB how do I do that without changing any other KB? Surely I should be able to select that KB in studio, make cahnges and push live? how come I can't find it in studio but it's a live page 

[sdodds]

Hi @Rachie1986,

Creating a new page and applying it in Studio has a few steps – but useful ones from a change management perspective.

The first question is are you attempting to create a completely custom page, or are you creating a new design for an existing page type (like a category or forum or similar)? It is possible to create a custom page that lives outside the normal hierarchy and has basically whatever you want on it. We've used those to create a custom ROI tool for customers, a case portal integrated with Zendesk, and some other things, but I find that this is mostly the exception rather than the rule.

So I'm assuming you want to do the latter, creating a new design for an existing page type. To do this we use the following steps in our environment:

1. In Studio, create the new page using the exact same name as the existing page and then append ".<unique title>", such as "CategoryPage.Resources". This ensures the page name will appear in the option within the Admin Console in the steps below.
2. In the Admin Console on your staging site, go to the node in the hierarchy where you want to use this new custom page design (it will be inherited, so you can affect whole sections of your structure this way).
3. Navigate to Content > Custom Pages and find the drop-down option for the page type you want to change (in my example "Category Page". If you named the custom page correctly, it should now appear in the drop-down list for that page type. Select it and chose Save.
4. Then go to the page you just changed on your stage site and confirm the design has been updated. Test and update on the Staging site until the design is as desired.
5. Once you've thoroughly vetted the changes, within Studio you will need to push the changes to your production via the Versions tab. Click Add to queue and follow the multiple prompts to complete the process. I recommend doing this in a period of low activity but within Khoros support hours so you can connect with them if anything happens. It should have very little to no downtime for users, and you can revert changes, but there is some risk in any push.
6. Once the changes have been pushed to production, you then have to go to the Admin Console and navigate again to Content > Custom Pages to update the page type you want to change for it to appear. Select it and chose Save.

If you are just starting out, I'd recommend making some small changes at first to get familiar with the process and to limit the scope of what you need to test and QA. And be careful to keep your Stage environment clean and remove any test or other changes you don't want to keep, so you can still use the site for troubleshooting and other testing.

Hope that helps!

[Rachie1986]

thanks for all of that. The only thing/issue I have is that I don't have "forum page" as such. I want to create a forum page and this page will be available by clicking on the forum in the new nav. So when you click on forum from the nav it brings you to the boards component and latest posts, accepted solutions and top users. Altogether whihc is better in terms of the navigation and flow for customers. Currently (I inherited this community) the only way to get to the forums is to click on the individual boards from the homepage. Essentially I think this means I have to create a brand new page (forum) which houses the existing components I have.  I also want to do the same in terms of the "knowledgebase" We will have Knowledgebase in the nav so when  that is clicked on I want it to open on a page that has our blogs, help and support(created by me) and a TKB.

The homepage will have a few components that explain gamification as well as other benefits to joining the community like comps ect... It is essentially going to be a brand new layout.  Big Bg task but If I can do one I can do another but with your description, it sounds like the pages are already there and you're replacing them but I don't have pages as such.  Is there anyone that can help step by step on this that you know of, support calls of some sort?

[Rachie1986]

@sdodds also when in studio how exactly do I view the page I'm on natively. Theres nothing to say go to this page or open this page natively so how do I look at the changes I've made on the pre site? Homepage is fine as I can open that but is there a way I have to type the URL to see the other pages?

[sdodds]

Hi @Rachie1986,

Thanks for the additional detail!

I'll admit it's a bit confusing to me that you don't have a "forum page" or that you you "want to create a forum page ... So when you click on forum from the nav it brings you to the boards component and latest posts, accepted solutions and top users" because that all sounds like native functionality to me.

I'm a little concerned you are trying to recreate the wheel by building custom things that already exist natively – or that your site was so customized previously that I have no context for how the pages and structure are currently defined to help.

I'd recommend reaching out to your Khoros CSM and/or professional services to validate what you want to do and see what they recommend. Alternatively, you can reach out to a 3rd party developer like Grazitti who can help you implement your design the way you want it. While all that you are doing may be technically possible, there may be an easier and better way to do it that will leverage the existing Khoros components and structure, cost less in the long run, and give you more flexibility to take advantage of future features and updates.

Apologies for not being more help here!

-Scott

[sdodds]

---

@Rachie1986 wrote:

@sdodds also when in studio how exactly do I view the page I'm on natively. Theres nothing to say go to this page or open this page natively so how do I look at the changes I've made on the pre site?

---

Important to distinguish between Studio which is where you build your design, vs the Admin console where you build your structure. So you can create a page design in Studio, but if you want to see it in action you will need to create the category/board in the Admin Console > Community Structure, and then apply the page design to the category or board using the steps I noted above. Then to see the new design applied to the category or board you created, you can either navigate to it on the site normally, or you can use the Admin > Community Structure tree to locate the item you want to view, hover over it to see the additional options to the right and then click View to see the page as your visitors and members would see it.

Of course, if you are creating custom pages that exist outside your structure (not recommended) you can see them only by typing in the URL directly, in the following format: https://YOUR.COMMUNITY.DOMAIN/t5/custom/page/page-id/YOURPAGENAME. For example, here's a custom page containing an ROI tool for Box: https://community.box.com/t5/custom/page/page-id/ROI-Tool. This page does not normally appear in any of the structure of the rest of our community, and may as well live on another site.