How to embed a website builder tool?

Hello, the title says a huge task but I have found this framework http://grapesjs.com which looks very good in terms of building website layout and I want to try it out. So if anyone had experience with it, please share and I also want to integrate this instead of the usual text editor for writing content. @admin please look and see if this can be done or help me find pieces to let this embed atleast in place of editor inside pages and blocks and I'll try to work it out and share if I could make it work. If anybody has already done/doing it please tell as I need this functionality and I'll be happy to help.

Thanks

Comments

  • edited October 2018

    Thanks @admin I was able to progress quite far to what I thought. I made a custom field and replaced it with div, added in my layout and now I have it inside create page component. One thing I want to know is how does the Body field gets all content from database for a cms page? I tried with lang('layout_field_body_description') which is in description key of layout array but that gets me nowhere, maybe I am not using the right api handle for grapesjs, need to see that, but please confirm if I am doing it right.

    Thanks again for the help, your cms is great (y)

    Edit: I also need to know how can I save the content present in current text editor in database

  • Layouts control what variables get saved to the database and in return what variables get presented to the layout when viewing a page. The variable $body is is used to hold the contents of the static view file which gets merged into the layout. Because of this, you'll often see fuel_set_var('body', '') in layout files.
    http://docs.getfuelcms.com/general/layouts

  • edited December 2018

    Hello, I was away ans was not able to reply back but I think that I was not clear what I want.

    Screenshot

    As you can see I have a body field and Page Builder field, I want same data coming in body field inside the Page Builder as I want to replace the editor. How and where can I get this HTML coming from database?

  • Hello @admin, I have not received any reply, please tell me how can I extract the final rendering HTML to my page builder, and also how can I save it back, is there any API that lets me do it? Or how can I extend from the Pages controller to get HTML, as I was debugging and found that Pages has an edit method which has $vars in it and it seems it has the final layout, but I don't know how can I call this to my page builder, please help.

  • To get the the final HTML for a page, you can do something like the following where you pass in the location value of the page (whether saved in the CMS or the path to the view file):

     // set additional variables
     $vars = array('page_title' => 'Contact : My Website');
    
    //... form code goes here
    $this->fuel->pages->render('contact', $vars);
    

    http://docs.getfuelcms.com/general/pages-variables

    For saving a page, you can create a $page object and assign variables on it and then save:

    $page = $this->fuel->pages->create();
    $page->assign_location('contact');
    $page->assign_variables($vars);
    $page->save();
    

    http://docs.getfuelcms.com/libraries/fuel_pages

  • Thanks, I think I can use these functions, but I need to call them when my custom field is being rendered so I can put the HTML content inside my custom field, I tried calling this in MY_custom_fields method but $this does not have pages object there, is there anyway I can access the location key of the page I am trying to edit, I can see the field being populated in Location field, where can I get it, from $params being passed into my function? If so which key as the object is too being to render. Thanks

  • I have loaded the CI and fuel global objects in my custom fields class, but I don't know how to get the key of page being edited, which is used to identify a cms page, and when I try to call $this->fuel->pages->render('saved page key', array(), array(), TRUE) it's returning empty

  • Okay after understanding how fields work, I replaced body's type to my custom field in My_fuel_layouts.php and it showed the content it was showing previously in ckeditor. I also changed the represents of my custom field to an array same as for ckeditor in custom_fields.php. And returned a textarea field from custom function and used js to hide and copy its content inside my Page Builder, since its an iframe, now the only thing is it doesn't render the dwoo templating but that's because we need to edit the content here. I will update this post as I work more on this page builder and create pages out of only HTML.

  • How can I have a list of all images that I can then bind with assets url to fetch them? like images shown in Assets of CMS

  • To get an array of all the assets in FUEL, you could leverage the Fuel_assets_model::list_items() method. Additionally, you could use the Fuel_assets::dir_files() method (that has a reference to the Fuel_assets_model class on it as well)
    http://docs.getfuelcms.com/libraries/fuel_assets
    http://docs.getfuelcms.com/libraries/fuel_assets_model

  • Right, actually I don't know why but I have the fuel instance in custom field method, but now if I call a method on it, it returns empty, like I tried to call pages->render() method which returned nothing, I had passed TRUE in it. I don't know if that will happen same but I am just asking what could be wrong in this? Also I tried saving the page with my custom field in place of ckeditor but it didn't save. I had the name same as other editors vars--body and it is inside form but it didn't save, so I wanted to know how are you saving the page i.e. is there anything extra except calling save in form or do I need any extra attributes for my custom field to be detected by save?

  • I used JS and upon submission, put the generated body inside vars--body textarea and it got saved.

Sign In or Register to comment.