Frontend editing of modules documentation

[iojens]

Hello,

I'm wondering if there is any kind of documentation what is needed in a template to support the frontend editing of modules (make the mouse-over edit icons appear). The protostar template supports it and it is a nice feature. I could start modifying that template, however I very much prefer creating my own template from scatch.

I modified the frontediting.js and frontediting.css files (media/system) slightly and it would show up as well on the beez3 template (even without these modification the <a class="btn jmodedit"...> element gets created).

Is there a certain naming convention needed? I created a very simple template and I got some strange behaviour - e.g. in one module position that would work for a specific module type other modules types wouldn't work. The module typ that would work in one position wouldn't work in other module positions.

Any clues would be highly appreciated (The javascript console didn't show any errors and I load bootstrap framework - I'm running J 3.4).

Thank you very much

[jcms]

not clear.... you want to edit one template or one module?

[iojens]

I found the solution - but if someone else might run into the same problem I'll try to rephrase it.

In J 3.4 it's possible to directly edit modules in the front end. If the user has the required permissions a nice little 'edit icon' appears if you hover over the module positions (+ you need to have it enabled in the backend). It encapsulates each module with something similar to

'<div class=".. jmoddiv" data-jmodediturl....>..</div>'

This is a very convinient feature. However I had problems to make this feature work in my templates.

My problem was that I loaded every module like this (since I usually want to avoid any dom elements I don't need for my styling)

<jdoc:include type="modules" name="slideshow" style="none" />

But as a result the needed markup will be missing. However if you load your modules with a module chrome style such as 'xhtml' it works fine and the needed markup gets generated.

<jdoc:include type="modules" name="slideshow" style="xhtml" />

[nwl]

Hi iojens,

I have similar problem in frontend module editing page (Joomla 3.4) , accordion not working and no btn-groups ...

A documentation could help

[Radix__]

I'm at a loss still why I don't have the module Edit buttons appear.

I have

Code: Select all

<div class=".. jmoddiv" data-jmodediturl....>..</div>

appear in my code as well, but how does that turn into an editbutton?

One of my modules is generated as

Code: Select all

style="xhtml"

, yet no front-end editing options appear, even for a Super User.

Protostar is a very complex template, and some simple tips would help.

[Radix__]

Correction, I now have a clickable text "Edit" appear, so it is doing something.

If only I could figure out how Protostar does it's CSS magic, making it into a menu... It's some higher level CSS, that I haven't figured out yet... very fancy.

[nwl]

I had added template.js from Protostar and I can see all things working, excepts for the css that must be improved in my custom template

[Radix__]

I've figured out my problem..... I still had a template output override active, based on a previous Joomla version....