使用 Orchard CMS 的单页设计 [英] Single page design using Orchard CMS

问题描述

我有一个客户想要为他的网站设计一个单页设计，其中每个页面"的内容在用户浏览网站时使用 javascript 显示/隐藏.

I have a client who want's a single page design for his site where the content for each "page" is shown/hidden using javascript as the user navigates the site.

我不确定使用 Orchard 解决此问题的最佳方法.一种选择是将所有内容都放在一个页面内容项上，但随后您将无法使用 Orchard 的导航功能，并且无法让客户考虑页面方面的管理.

I'm not sure on the best way to approach this using Orchard. One option would be to have the content all on a single page content item but then you lose the ability to use the navigation features of Orchard and can't let the client think about administration in terms of pages.

有人对如何最好地在 Orchard CMS 中进行设置有想法或经验吗?

Does anyone have ideas or experiences on how best to set this up in Orchard CMS?

这是我根据 Bertrand 的建议使用的解决方案:

Here's the solution I used based on Bertrand's advice:

public ActionResult Display(int id)
{
     var contentItem = _contentManager.Get(id, VersionOptions.Published);
     dynamic model = _contentManager.BuildDisplay(contentItem);
     var ctx = _workContextAccessor.GetContext();
     ctx.Layout.Metadata.Alternates.Add("Layout_Null");
     return new ShapeResult(this, model);
}

我创建了一个带有控制器的新模块，其中包含上述操作方法.action 方法采用内容部分 id 的参数._contentManager 和 _workContextAccessor 对象被注入到控制器中.Layout.Null.cshtml 视图的创建与 Bertrand 建议的完全相同.

I created a new module with a controller containing the action method above. The action method takes a parameter for the content part id. The _contentManager and _workContextAccessor objects are being injected into the controller. The Layout.Null.cshtml view was created exactly like Bertrand suggested.

推荐答案

为了在不牺牲 SEO、客户端性能和可维护性的情况下实现那种非常精致的体验，我将做以下事情:仍然经典地"创建网站作为一组页面、博客文章等，具有自己的 URL.主页布局应该有所不同，并使用 Ajax 调用引入其他页面的内容.我一直用来显示与常规内容项相同的内容的一种方法，但是来自 Ajax 调用(因此在内容周围没有镶边，没有引入样式表，因为它已经存在等)是有一个单独的控制器操作，以空布局"返回内容:

Here's what I would do to achieve that sort of very polished experience without sacrificing SEO, client performance and maintainability: still create the site "classically" as a set of pages, blog posts, etc., with their own URLs. It's the home page layout that should then be different and bring the contents of those other pages using Ajax calls. One method that I've been using to display the same contents as a regular content item, but from an Ajax call (so without the chrome around the content, without bringing the stylesheet in, as it's already there, etc.) is to have a separate controller action that returns the contents in a "null layout":

var ctx = _workContextAccessor.GetContext();
ctx.Layout.Metadata.Alternates.Add("Layout_Null");
return new ShapeResult(this, shape);

然后，我的视图中有一个 Layout.Null.cshtml 文件，如下所示:

Then, I have a Layout.Null.cshtml file in my views that looks like this:

@{
    Model.Metadata.Wrappers.Clear();
}
@Display(Model.Content)

清除包装器会从 document.cshtml 中移除渲染，并且模板本身仅渲染一个区域，即内容.所以被渲染的只是内容，没有别的.非常适合从 ajax 调用注入.

Clearing the wrappers removes the rendering from document.cshtml, and the template itself is only rendering one zone, Content. So what gets rendered is just the contents and nothing else. Ideal to inject from an ajax call.

这有帮助吗?

这篇关于使用 Orchard CMS 的单页设计的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！