samuell1 / contenteditor-plugin Goto Github PK
View Code? Open in Web Editor NEWEdit your content in page - plugin for OctoberCMS
Home Page: http://octobercms.com/plugin/samuell-contenteditor
License: MIT License
Edit your content in page - plugin for OctoberCMS
Home Page: http://octobercms.com/plugin/samuell-contenteditor
License: MIT License
Hello
I' trying to use this plugin but I do not see the pencil in the front end and cannot edit the content block (although the content do show). I double checked the tags (scripts, framework extras and styles) and are all on place plus I added the component to the page.
And I see that for each content to be editable I have to add a component? I have approximately 10 content blocks on a single page and would like all to be editable... is that possible?
many thanks!
I can see an option to define custom style palettes. I don't understand though what do to make them correctly enable/disable the options available in the editable content areas.
It would be nice to be able to define multiple upload locations so that when users upload assets to certain content areas or pages things will be automatically organised into different paths as opposed to having a global setting where everything is placed.
For example maybe something like this..
{% component 'contenteditor' file="welcome.htm" image_folder="/examplefolder/" %}
it doesn't seem to create a new file for a translation. I switch the locale, then save. But nothing is created. The original file is rewritten instead. Am I doing something wrong?
This is an issue with safari not working nicely with FormData.. Not sure what the solution is here, was unable to get it working in safari.
When uploading an image, this error message is generated (even though it returns the status code of 200):
[Log] response (contenteditor.js, line 185)
"October\\Rain\\Exception\\ApplicationException: File missing from request in /.../plugins/samuell/contenteditor/routes.php:14
Stack trace:
#0 /.../vendor/laravel/framework/src/Illuminate/Routing/Route.php(198): System\\Classes\\PluginManager->{closure}()
#1 /.../vendor/laravel/framework/src/Illuminate/Routing/Route.php(172): Illuminate\\Routing\\Route->runCallable()
#2 /.../vendor/laravel/framework/src/Illuminate/Routing/Router.php(658): Illuminate\\Routing\\Route->run()
#3 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(30): Illuminate\\Routing\\Router->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#4 /.../vendor/laravel/framework/src/Illuminate/Routing/Middleware/SubstituteBindings.php(41): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#5 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\Routing\\Middleware\\SubstituteBindings->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#6 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#7 /.../vendor/laravel/framework/src/Illuminate/View/Middleware/ShareErrorsFromSession.php(49): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#8 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\View\\Middleware\\ShareErrorsFromSession->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#9 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#10 /.../vendor/laravel/framework/src/Illuminate/Session/Middleware/StartSession.php(63): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#11 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\Session\\Middleware\\StartSession->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#12 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#13 /.../vendor/laravel/framework/src/Illuminate/Cookie/Middleware/AddQueuedCookiesToResponse.php(37): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#14 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\Cookie\\Middleware\\AddQueuedCookiesToResponse->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#15 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#16 /.../vendor/laravel/framework/src/Illuminate/Cookie/Middleware/EncryptCookies.php(59): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#17 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\Cookie\\Middleware\\EncryptCookies->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#18 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#19 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(102): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#20 /.../vendor/laravel/framework/src/Illuminate/Routing/Router.php(660): Illuminate\\Pipeline\\Pipeline->then(Object(Closure))
#21 /.../vendor/laravel/framework/src/Illuminate/Routing/Router.php(635): Illuminate\\Routing\\Router->runRouteWithinStack(Object(Illuminate\\Routing\\Route), Object(Illuminate\\Http\\Request))
#22 /.../vendor/laravel/framework/src/Illuminate/Routing/Router.php(601): Illuminate\\Routing\\Router->runRoute(Object(Illuminate\\Http\\Request), Object(Illuminate\\Routing\\Route))
#23 /.../vendor/october/rain/src/Router/CoreRouter.php(20): Illuminate\\Routing\\Router->dispatchToRoute(Object(Illuminate\\Http\\Request))
#24 /.../vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php(176): October\\Rain\\Router\\CoreRouter->dispatch(Object(Illuminate\\Http\\Request))
#25 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(30): Illuminate\\Foundation\\Http\\Kernel->Illuminate\\Foundation\\Http\\{closure}(Object(Illuminate\\Http\\Request))
#26 /.../vendor/laravel/framework/src/Illuminate/Foundation/Http/Middleware/CheckForMaintenanceMode.php(46): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#27 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(149): Illuminate\\Foundation\\Http\\Middleware\\CheckForMaintenanceMode->handle(Object(Illuminate\\Http\\Request), Object(Closure))
#28 /.../vendor/laravel/framework/src/Illuminate/Routing/Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#29 /.../vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(102): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#30 /.../vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php(151): Illuminate\\Pipeline\\Pipeline->then(Object(Closure))
#31 /.../vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php(116): Illuminate\\Foundation\\Http\\Kernel->sendRequestThroughRouter(Object(Illuminate\\Http\\Request))
#32 /.../index.php(43): Illuminate\\Foundation\\Http\\Kernel->handle(Object(Illuminate\\Http\\Request))
#33 {main}"
I found that even though image is successfully captured in the file variable, the problem is in this line in contenteditor.js:
FormData.append('image', file);
Doing so, does not add the image to formdata in safari.
Hi,
I have a suggestion for a future enhancement:
i would like to use this plugin, without giving my client access to the CMS section.
I fear, he might messup the code. Thats why i installed this plugin.
Maybe it is possible, to integrate this plugin in the administrator-permission:
Settings > Administrators > Permissions
Thanks for this plugin! Its a great addition to October CMS!
is it possible to add custom actions like, add colum ?
I just want to report some minor bugs but it shouldn't be ignored.
So, I have OctoberCMS installed inside my directory and excited to use your plugin.
I've encountered that I'm not able to upload media. So, I checked your JS code then noticed that you are using relative path when doing AJAX call.
Line 200: xhr.open('POST', '/samuell/contenteditor/image/upload', true);
Line 261: xhr.open('POST', '/samuell/contenteditor/image/save', true);
It would be better if you are able to get the base url installation path of the site.
I tried to edit the code and add it myself, but I think it's in the min file.
Is there anyway to get an hr button added to the tool panel?
Thanks!
Hey man, great job with this plugin!
Currently I have a copy of the dev branch running on a site we are working on. Do you have a list of items you are currently working on for this next release? Anything you could use some help with?
I don't understand how this is supposed to work for inline fields, are we supposed to make a new content page for each inline field? From the documentation, it seems that fixtures are supposed to support this, so we can set a fixture id for each inline field and, presumably, it would read from the same file. This does not seem to be the case at all. Without support for making many different fields on the page editable I am failing to see the usefulness of a plugin like this. Am I misunderstanding how to use this?
BackendAuth::getUser() return null in route.php even the user is logged.
I gues due to something similar than here octobercms/october#3052
PHP 7.1 - last october version
My pages look like that:
title = "great page"
url = "/myurl"
[contenteditor]
==
<section>
{% component 'contenteditor' file='00-content.htm' fixture='p' %}
</section>
<footer>
{% component 'contenteditor' file='05-footer.htm' %}
</footer>
An annoying thing happens: on the second contenteditor instance, the component reads $this->property('fixture') = 'p'
, and not undefined (as it should)
This is probably because of the component re-use, in theory there should be N component instances on page top (using aliases) for each component invocation inside the page.
In theory everything is fine, but in practice it's very repetitive.
Could we devise a workaround?
Hello,
I downloaded the test dev version. When I go to settings > Content Editor Settings > Style palette and I click on "Add new item", I get an error in a popup :
"array_merge(): Argument #1 is not an array" on line 2 of /modules/backend/formwidgets/taglist/partials/_taglist.htm
Any ideas to fix that ?
Thanks
Alex
I get the editor working and everything seems to be working smoothly, but when I go to save, the gear icon just spins indefinitely.
Any help would be greatly appreciated!
Thanks!
Love the plugin!
Any way to insert HTML5 videos instead of videos in an iframe?
I did the following and it does not seem to work for me:
Still does not work for me :( I checked the html and content-tools.min.js is not loaded
Can you please provide install and setup tutorial video for beginners of this plug-in ?
Hi,
I don't know why but fixtures and tags are not rendered when I visit page as visitor not logged in. Do you have any idea?
Thank you
Is it possible to have a setting so we can edit text-only block on the page? So you can't choose styles etc. This will be useful when you just want to edit a heading which already has a predefined style
Hello,
I am trying to create a button. When i add the class to the a tag i cant seem to choose it when i select the button/link. Is there a way how i can do this?
Hi,
Great plugin. Although I have an issue with using (bigger) images.
If I let them fill the container (so they are displayed smaller than then are) and I go to editing mode, the images come out of their flow and overlap other content, ...
They do go back to their regular flow after saving though.
This happens because of the images displaying as background-images, and using the dimensions of the image itself, how can I fix this (I located the code to the minified JS file, but I'm kinda hesitant to change anything in there).
Thank you in advance
Hi (again), I found your plugin very useful for my project, before posting the issue I would thank you again for that.
I have noticed that using the component inside a partial page like
partials/navbar.htm
[contenteditor]
==
<nav>
{% component 'contenteditor' file='partial-navbar/content.htm' %}'
</nav>
After editing the content and trying to save, the page answers with a 500 telling that contenteditor::onSave
is not defined.
A workaround to that is to add [contenteditor]
also on the page including the partial.
Can this be fixed? I don't have such an extensive knowledge of php/october
Here is my result https://pasteboard.co/GGHGNmT.png
In the image bellow editor, you can see how it was parsed.
Is there a way how to fix it?
It's confusing how table editing works. I was looking how to add a table if my content already got one. Found that I need first create a P element and then add table from it. Then if I add another row in that new table I don't have a way to remove this table.
You can check this on my test site: http://gek.dp.ua/custom/stockist
Admin access to enable content editor on front: http://gek.dp.ua/custom/backend test / 111111
Hi,
thanks for great plugin.
Could you please allow to add multiple css class names in a user defined style palette.
Right now If I add 2 classes like 'heading heading-outlined', and then try to apply this style in the frontend, I get the error saying
Uncaught DOMException: Failed to execute 'add' on 'DOMTokenList': The token provided ('heading heading-outlined') contains HTML space characters, which are not valid in tokens.
If you could please fix this issue it would be great, thanks.
Fixture tag is just not applied in render.htm. It should look like
{% if SELF.fixture %}<{{ SELF.fixture }}>{% endif %}
{{ content|raw }}
{% if SELF.fixture %}</{{ SELF.fixture }}>{% endif %}
{% if SELF.renderCount == 1 %}
{% put styles %}
<style title="contenteditor" type="text/css">
{{ SELF.additional_styles }}
</style>
{% endput %}
{% endif %}
Would it be possible to add classes to a fixture?
Hello there!
Love what you've done so far. I'm trying to setup a section where I have text embedded within multiple div's, but I want to be able to use the entire chunk of code within the content file to avoid making a ton of content files. For example:
<div class="row faq-show"> <button type="button" class="btn btn-info btn-faq" data-toggle="collapse" data-target="#demo10">Here's some text</button> <div id="demo10" class="collapse faq"> I am text</div> </div>
Is it possible to somehow still change the text values within the "demo10" ID with the editor?
Awesome plugin & great work.
I'm having a little trouble with uploading the image. I won't upload. I checked the network request & its giving the error "The requested URL /samuell/contenteditor/image/upload was not found on this server."
Can you please advise on this? I'm using the latest version of the plugin cloned from the git.
Thanks.
In the documents, I can't determine if a blank file name is acceptable.
But when trying to save a page with no file name listed, I get an error saying ".en is not a valid extension." The plugin injects the .en automatically and causes it to fail.
When declaring a file name, this error doesn't appear.
Wanted to clarify this issue and ensure it's not a bug, and if it is that it can be fixed.
Thanks! And I really appreciate all of your hard work!
Hello Samuell,
The plugin looks very promising, but I can't get it to show up in the front-end. Here's my
Troubleshoot
Other checks
[EDIT]
I see things are loaded inside the page:
<div data-editable="" data-component="contenteditor::onSave" data-file="mycontent.htm" data-tools="image">
...
</div>
Your stylesheets are loaded into the page:
<link rel="stylesheet" href="../plugins/samuell/contenteditor/assets/content-tools.min.css">
<link rel="stylesheet" href="../plugins/samuell/contenteditor/assets/contenteditor.css">
Just like the scripts:
<script src="../plugins/samuell/contenteditor/assets/content-tools.min.js"></script>
<script src="../plugins/samuell/contenteditor/assets/contenteditor.js"></script>
<script type="text/javascript">
/* CONTENT EDITOR SCRIPT START */
ContentTools.StylePalette.add([
]);
editor.toolbox().tools([
[
'bold',
'italic',
'link',
'align-left',
'align-center',
'align-right',
'heading',
'subheading',
'subheading3',
'subheading4',
'subheading5',
'paragraph',
'unordered-list',
'ordered-list',
'table',
'indent',
'unindent',
'line-break',
'image',
'video',
'preformatted',
],
[
'undo',
'redo',
'remove'
]
]);
/* CONTENT EDITOR SCRIPT END */
</script>
But the editor still doesn't show up.
Hope You can help out.
Cheers,
John
If I call
{% component 'contenteditor' file="home-title.htm" fixture="h2" %}
and after that I want to paste another instance without fixture I need to specify empty fixture, otherwise the fixture from the previous call will be used.
{% component 'contenteditor' file="home-subtitle.htm" fixture="" %}
I would like to make the feature request to be able to lock down what can be edited in a certain space via the attributes.
For example say I have the following
{% component 'contenteditor' file="welcome.htm" %}
I want to be able to lock it down to only allow p or img tags like so..
{% component 'contenteditor' file="welcome.htm" allow_only="p,img" %}
When a user clicks to edit the content only the p and img tags.
At first I thought this is what Style Palettes were for. So perhaps it's better done in such a way in which you make a list similar to the where you add Style Palettes and then you just give it a name like so...
{% component 'contenteditor' file="welcome.htm" allow_only="example_name" %}
I have selected h3, h4, h5 tags in the backend configuration, but elements are not visible in the frontend? It was working fine in previous version
Hello,
Really nice plugin.
However, I discovered that it use absolute url to create image path. It would be better to use the october syntax
<img src="{{ '/folderpath/dummy.png'|media }} alt="Dummy image" />
do you think it's possible ? Can it be planned ?
Regards,
Alex
Hi,
I have craeted a statioc page.
When I now add (drag) the component to a cms page i can select the static page from the dropdown of the component.
My layout contains:
{% framework extras %}
{% scripts %}
But when I navigate to my homepage I dont get the editor Icon displayed?
What else is missing please?
Hello... I'm using your awesome plugin to make frontend content editable. Congrats for such great work! :)
I'm having a problem, I'm trying to make a menu editable (a "ul" tag with "li" tags all with css classes) here is the code:
<ul class="nav flex-column lfm-border pt-3 fixedsticky text-uppercase">
<li class="nav-item">
<a class="nav-link smooth-scroll" href="#inicial">BCD Educación Inicial</a>
</li>
<li class="nav-item">
<a class="nav-link smooth-scroll" href="#primaria">BCD Primaria</a>
</li>
<li class="nav-item">
<a class="nav-link smooth-scroll" href="#secundaria">CDI Secundaria</a>
</li>
</ul>
I see the menu rendered but if I try to edit by clicking the green tick I only get three dots and the whole "ul" structure remains untouched.
I see that when the content is between "p" tags or "h" tags I can edit and access the code by clicking the tag down below to the left on the page (in what appears to be a tag selector).
Any ideas how can I use your plugin to make a menu editable on the front end?
Thanx!
heading
=> Heading (h1)subheading
=> Subheading (h2)subheading3
=> Subheading3 (h3)subheading4
=> Subheading4 (h4)subheading5
=> Subheading5 (h5)I only get to see Heading one en subheading 2.
What i need to have is the h3,h4,h5,h6.
I see the headings but when i select the content text the h3,h4,h5,h6 disappear.
If you need more information let me know.
Is it possible to edit blog posts as well ?
Hello (again),
Another issue for another request. It would be great to be possible to open the media manager to get an image that is already present on the server, instead of being obliged to upload it.
In fact, as the media manager have a button to upload image, open it could completly replace the upload feature, in addition, you could choose where you want to upload the image, which would resolve another issue about image path upload choice.
Regards,
Alex
Where do it place the content Files in the Oktober-file structure?
Do i put them in the Plugin-Folder or somewhere in in the Them Folder?!?!?
The Plugin also doesn't autocreate a File ?!?
the effect ... i can't save content - the plugin is running, but after a refresh, the edit is gone.
I run ...
October Build 424 (latest Version)
Contenteditor: 1.0.7
I'm having some difficulty getting the image inserting to work with the editor. When I click the upload button on the modal that pops up, I get the file picker and choose an image. After this however, nothing happens. I don't see any request going to the server or anything else going on. No errors showing up either. Am I missing something or is this currently not implemented yet?
Hi Samuell,
I've installed the plugin and I've put {% component 'contenteditor' file="info.htm" %} tag in my home page. Then I've created info.htm in contents. I've also added {% framework extras %}, {% scripts %} and {% styles %} (last one in the head section), but nothing happens when I'm in the front end.
I'm logged as developer and I'm using a local installation with XAMPP.
What am I doing wrong? Thanks in advance!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.