Can I render all zones to an HTML string in a controller method - orchardcms

I'm trying to render the HTML for a content item to a string from within a controller action. Technically I just want to get the "body" part of it without any header/footer stuff. I want to do this so I can get a content item rendering the way I want once, and then display it as a normal orchard page OR by requesting the HTML for the content item via ajax to display it in a div in a JavaScript app. I don't want to have to manually render everything in the JavaScript as that would be duplicating the layout logic I already did. I want to re-use the bulk of the server side rendering so any changes are reflected in my normal orchard page and my JavaScript page. I've been digging into the code and searching everywhere and have gotten close but not all the way there.
I found these:
How to render shape to string?
Using FindView in Orchard
In my controller I have:
var shape = _contentManager.BuildDisplay(contentItem);
Using either of the two methods above, I can render that shape to an HTML string in my controller. All was golden. I was getting the body of that page and using it in JS. Then, I changed a placement file:
<Place Parts_Common_Body="Content:1" />
was changed to:
<Place Parts_Common_Body="/AsideFirst:1" />
The body moved where I wanted it (AsideFirst) in my normal Orchard page but disappeared from the HTML retrieved using the two methods above.
If I look at shape.Content.Items after the BuildDisplay call, I can see the item for the body is no longer there... why is it not rendering all the zones? Or, I guess a more specific question is why is the BuildDisplay method not building the complete shape? Is there a way I can make this work?

I tried a million different things and eventually got this working. Not sure I totally get it yet, but I think the problem had to do with the fact that I was using shape.Content and I'd moved stuff out of the Content zone. And maybe when I was looking at what the BuildDisplay method was returning I was just not looking at some newly created zone that actually did had the stuff I thought was missing. Clearly I need to learn more about zones and shapes... Anyway, I have a new zone called "MainInfo" now that I created in a placement file. I get a MainInfo property on the main shape returned form BuildDisplay and pass shape.MainInfo to the view rendering code and all seems to be working well now.

Related

How to only get the "title" and "main content" of a page using puppeteer?

I'm trying to create a clone of getpocket.com for learning. On that app, every saved link gets converted into a markdown; and it seems like the it's a filtered content with only the page title and body without headers, footers, etc.
I could get the page's title using puppeteer api thru different means:
using page.title()
or get the page's opengraph "og:title"
But how do i get like the summarized version containing only the main content of the page.
Note that i don't know beforehand the "css class" of the main content since i'm planning on just entering a url in a textbox and scrape that site from there.
I have found what i've needed for this scenario.
I used the Readability.js library for making webpages readable by removing some certain html tags. Here's the library.
This library is what mozilla uses behind the scenes when rendering their reader view

CKEditor inline with Node.js

I'm trying to create minimalistic content management system with ckeditor using node and express as a server. I would definitely want to implement the inline editing capabilities of ckeditor, but I'm having no success in sending the data to server and finally to nosql (mongodb) database.
I would like to have multiple inline editors within a page and to save to my database them simultaneously upon a POST event. I have my editor instances in invividual divs with an attribute contenteditable="true". Editor instances launch just fine, but when I'm trying to grab the data in my controller, all I have is an empty object. I can get the data from input fields, but then I lose the inline editing features. I've tried tinkering with bodyparser, but no success. All my divs containing the editable content lay under a HTML form element.
I would be more than happy is someone could at least point me to a general direction of how to accomplish this. Sorry if I was unable to make my self clear posting this question :)
tldr; How can I parse data from HTML elements, other than input-fields and text areas, in node/express with bodyparser?
Content of non-input fields won't be posted in a form, so you can't do that. A couple options come to mind:
Use JavaScript to update hidden inputs on the page as those divs change. Updated content will be posted.
Use JavaScript to make the POST, on save grab the contents, post them to the server, and then after that make the redirect from client side.

Custom Zone on Alternative Content View in Orchard 1.7

I have the requirement to create a different structure for the homepage of my Orchard site.
I learnt that if you use layer 'TheHomepage', when you are rendering the homepage the widgets get run and the relevant Model.[ZoneName] property is set with the Zone (or shape or whatever it is, not got that far) that gets passed to Layout.cshtml.
So far so good, now what I want is that I want to only have these custom zones on my homepage. So I have added the following zones for testing:
HomeMagazine_1 and HomeMagazine_2
When I attach a widget to these zones, and I am on the homepage the widgets get run, and I can see the Model.HomeMagazine_1 and Model.HomeMagazine_2 on the Model passed to the Layout.cshtml.
My issue is that I want a custom page to render these zones. So I have added a new view:
Content-url-homepage.cshtml
Where I am rendering the zones:
<div class="container">
#if (Model.HomeMagazine_1 != null)
{
#Zone(Model.HomeMagazine_1)
}
However the issue is that the Model that gets passed into Content-url-homepage.cshtml is a ZoneHolding that has no HomeMagazine_1 property.
I understand the reason for this, what I am asking is how to acheive what I have illustrated, is there any way to get to the Layout.cshtml ZoneHolding. I'm unsure because the Layout.cshtml is executed after Content-url-homepage.cshtml.
Enjoying working with Orchard but it does throw some interesting blockades up sometimes!
I have found that I can use:
Layout.HomeMagazine_1
Which has the intended effect. I shall mark this as the answer when I can unless anyone has a better suggestion on how to achieve this.

Orchard - access a content type through different URLs so they use different views

I'm trying to create a CSS documentation library in Orchard. I want to save a description, CSS snippet and HTML snippet against each content type. The first view would show the description and CSS and HTML code written out. The second view would show a preview of what the CSS and HTML look like rendered.
cssdocumentation.com/content/item1
cssdocumentation.com/content/item1/live-preview
I've created the content type and the first view. But I'm not sure how to create the second view. I can see if I can create the alternative URL I can use the Url Alternates module to create an overriding .cshtml
To create an alternative URL I've looked at the autoroute module but this only allows you to adapt a single URL (unless I'm missing something?) and I've looked at Alias UI but this forces me to manually create an alternative URL everytime I create a content item.
Is this possible in Orchard without writting too much C#? (I'm a frontend developer so I only dabble in the behind the scenes stuff)
Thanks for any help
Best solution is to do this within your own module. But as a secondary option instead of having a second page, combine this content with your first page and hide it with CSS. When the user clicks a button to navigate to the next step render the CSS/HTML result on the same page. You can do this in many ways, here are a few ideas:
Render the CSS/HTML result out straight away on the same page but hide it. Show it when the user clicks a button
using jQuery to render the result on the client side. More dynamic if you allow editing of the HTML and CSS.
Redirecting the user to the same page with specific url parameters which you can pick up in your alternate to modify the output.

web part title in xsl

I'm investigating a possible solution where all web parts on my page should be rendered without a chrome, meaning that the default title portion of the web part will be hidden, but the title supplied in the web part properties should be used elsewhere in the web part.
I have found several solutions on how to get the page title but none around how I can crab the web part title and display it using Xsl, would like to return this within the ItemStyle.xsl
I used a method of return the raw xml data for the web part, but by default is the title of the web part not return, and I found no reference other than OuterTemplate.GetTitle() which points to the Title column of a list, to support my solution.
Is this possible?
It is probably not accessible through the xsl itself, as the title of the webpart is not part of the xml data coming through. If you really need it, you could show it on the page and use JQuery/Javascript to scrape it off. Otherwise, I might find a different way to provide the name, maybe with a query parameter.

Resources