Download the PHP package comur/content-admin-bundle without Composer

Introduction

This bundles helps you to add a field in your backend and edit all template contents dynamically thanks to CKEditor inline editing

It lets you edit also images by using ComurImageBundle

If this bundle helps you reduce time to develop, you can pay me a cup of coffee ;)

Installation

Applications that use Symfony Flex

Open a command console, enter your project directory and execute:

Applications that don't use Symfony Flex

Step 1: Download the Bundle

Open a command console, enter your project directory and execute the following command to download the latest stable version of this bundle:

This command requires you to have Composer installed globally, as explained in the installation chapter of the Composer documentation.

Step 2: Enable the Bundle

Then, enable the bundle by adding it to the list of registered bundles in the app/AppKernel.php file of your project:

Configuration

You can configure following parameters by creating a comur_content_admin.yaml in your config directory:

Ex: screenshot of multilingual admin

Fullscreen mode:

You can even edit a button label:

Editable images

Edit images with ComurImageBundle

Select from your library (already uploaded images)

Upload image

Crop on the go with HTML attribute defined sizes (crop / resize)

Usage

Step 1: Add twig form template

NOT NEEDED ANYMORE, template is added automatically now !

Add form field template to your twig configuration (config/twig.yaml):

Step 2: Include routes

Include routes in your routes.yaml (config/routes.yaml):

Step 3: Implement abstract entity

ComurContentAdminBundle uses an property (orm column) to save dynamic content data in database using your related entity. To do so, you need to extend AbstractInlineContent class. This class will add a property called content in your entity (so be careful to not use this column in your entity !).

Step 4: Use it in your admin (ex for sonata admin but can be used in custom admins too)

Step 5: Post size limit

Be careful to your data size limit sent in POST request. You may have to change it to be able to get all from data (all dynamic content values).

For more info check https://www.php.net/manual/en/ini.core.php#ini.post-max-size

Do not forget to check your server's limit too (Nginx, Apache...)

Step 6: Add twig filter into the template

This bundle adds a new twig filter called "inlinecontent". You must use it for the bundle to determine and replace contents using data-content-id attribute on html tags needing content replacement.

Ex:

Step 7: Pass content to your template from your controller

Content is managed by this bundle but you need to pass your content data to template for the bundle to have it and replace content accordingly.

Ex:

Using ComurImageBundle to edit images

Step 1: Install Comur Image Bundle

Please follow instructions on ComurImageBundle to install it

Step 2: Activate comur_image_compatibility in config

:warning: NOT NEEDED ANYMORE, bundle checks if ComurImageBundle is installed or not and activates automatically if it finds it

Step 3: Add data attributes on images of your template

Ex:

This code will automatically replaced by twig filter and src will be automatically filled by database value

This limits usage to img tags (and cannot be used for background images) so if someone has an idea to edit background images, let me know ;)

Step 4: Use it in your form

Please refer to ComurImageBundle documentation for complete list of parameters

Development

Any help in improving this bundle is kindly appreciated ! Please do not hesitate to send PR !

TODO

• Tests (not realy good at that so if someone wants to help !)
• Add CKEditor parameters in config / form parameters
• Parameter to not include ckeditor script if not needed (if already included elsewhere)
• Find a way to pass parameters to templates (lot of time we have parameters to pass to templates and it's not possible for now)
• Add ComurImageBundle compatibility to edit images DONE
• Find a better way to replace content with data without using Dom Manipulation (can alter tags)

Troubleshooting

Content didn't replaced

One reason for that is if you put some extra spaces in your html tags. DomDocument fixes html and removes extra spaces or other things that it founds not respectful of HTML rules. Ex: