Forum Discussion

domladden's avatar
10 years ago

Add custom component to PostPage

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

6 Replies

  • domladden's avatar
    domladden
    Ace
    10 years ago

    Hi Claudius, thanks for your reply.

     

    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.

     

    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.

     

    We currently have 2 already but I would like the ability to add more, if this is possible without direct Lithium development.

     

    Thanks

  • phani's avatar
    phani
    Advisor
    10 years ago

    Hi domladden,

     

    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 jQuery

    3. 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.

     

    Following is the code snippet: 

     

       $('.lia-button-Submit-action').bind('click', function(e) {
              
                            $.ajax({
                                url : '/restapi/vc/boards/id/${coreNode.id}/messages/post',
                                type : "POST",
                                data: {"message.author":"login/${user.login}","message.subject":subject goes here,"message.body":new body goes here,"restapi.response_style":"view","xslt":"json.xsl"},
                                async : true,
                                error : function(data){
                                    
                                },
                                success : function(data){
                                    redirect to data.response.message.view_href;
                                }
    return false;
                
       }

     

    Hope this helps!

     

    Regards,

    Phani

  • Hi Phani, thanks for your reply and suggestion.

     

    Correct me if I am wrong but is this is to bypass the traditional posting mechanism in order to insert something later?

     

    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: http://i.imgur.com/lpIXxe5.png

     

     

    Or would this be a different process?

     

    Thanks,

     

    Dom

  • phani's avatar
    phani
    Advisor
    10 years ago

    Hi domladden,

     

    Yes you are right, in my previous reply i have suggested to override traditional posting mechanism.

     

    Other way is only override submit button action without overriding entire posting mechanism. 

    i.e. 

    $('.lia-button-Submit-action').bind('click', function(e) {
              
                  /* Add content to existing body text box */
    return true;
                
       }

     

    Lithium will fetch the body from body editor to create post.

     

    Hope this helps,

    Phani