Add custom component to PostPage

Question

Hi, we would like to add a component to our postpage so we can add more custom content to our blog posts.

We have had this done before through Lithium in order to add an MPU module but we would like to add more and potentially do it ourselves as our page structure and design changes.

The module Lithium added was simply so an image could be added during posting of a new message. Checking this component out in Studio, it is just custom_content_22 which is being added to. Is there anyway of editing this in Studio or does this need to be done via Lithium?

Thanks,

Dom

claudius · Answer

Hi Dom,To edit custom content follow the instructions here: http://community.lithium.com/t5/Custom-Content/Edit-custom-content-on-a-page/ta-p/108545If you want to add an additional custom content module to the layout of your post page take a look at http://community.lithium.com/t5/Custom-Content/Add-custom-content-to-a-page/ta-p/108549

domladden · Answer

Hi Claudius, thanks for your reply.&nbsp;However, that's not what I want to do, I'm pretty comfortable with custom content in the usage you described but what I want to do is add a new module onto the page from which you write/publish posts, not the completed page.&nbsp;The process you described will fix the content across posts and pages in that category/community depending on where you put it in the Admin. I want to set the posting process up so that I can add and insert original content into each post.&nbsp;We currently have 2 already but I would like the ability to add more, if this is possible without direct Lithium development.&nbsp;Thanks

domladden · Answer

Hi, has anyone else had a similar issue?

phani · Answer

Hi&nbsp;domladden,&nbsp;As per my understanding following is my suggestion,1. In a post page, add a custom component.2. In customcomponet capture sumbmit(or Post) button action using jQuery3. Stop Lithium post activity by returning false.4. Read user entered subject and Body using jQuery,5. Add your data which you want to add into the body.6. Call Lithium post message API and pass subject and body.7. Capture new message ID and URL return from post API and redirect user to the new message page.&nbsp;Following is the code snippet:&nbsp;&nbsp;&nbsp;&nbsp; $('.lia-button-Submit-action').bind('click', function(e) {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url : '/restapi/vc/boards/id/${coreNode.id}/messages/post',
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type : "POST",
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data&amp;colon; {"message.author":"login/${user.login}","message.subject":subject goes here,"message.body":new body goes here,"restapi.response_style":"view","xslt":"json.xsl"},
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;async : true,
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error : function(data){
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success : function(data){
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; redirect to&nbsp;data.response.message.view_href;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }
return false;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
&nbsp; &nbsp;}&nbsp;Hope this helps!&nbsp;Regards,Phani

domladden · Answer

Hi Phani, thanks for your reply and suggestion.&nbsp;Correct me if I am wrong but is this is to bypass the traditional posting mechanism in order to insert something later?&nbsp;I'm not sure that would be practical for our uses, would the ultimate front end set up be similar to what we currently have:&nbsp;http://i.imgur.com/lpIXxe5.png&nbsp;&nbsp;Or would this be a different process?&nbsp;Thanks,&nbsp;Dom

Forum Discussion

Add custom component to PostPage

Related Content

Re: Atlas Sign-On & Registration for Marketing Customers

Custom Component - Latest post by Role

Custom Component Tiled navigation

Khoros Care Downtime & Impacts to Bot Customers

Custom Components

Recent Discussions

Will adding/changing a custom tag trigger a Community event?

How to convert Endpoints to GraphQL queries?

Error message when adding a query to handlebars component (Aurora)

API v1 docs gone since Atlas migration to Aurora

Does anyone know how to change the display title of Custom Fields in Aurora?