Forum: Radiant CMS Adding parts the easy way (KISS-GUI)

Announcement (2017-05-07): is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see and for other Rails- und Ruby-related community platforms.
F0547b8511d079a7ef9cfc974322254b?d=identicon&s=25 Florian Woegerer (nexflo)
on 2007-02-22 14:09
Hey guys,

I just got into Radiant, and I'm loving the simplicity of it.

But I can already hear my end clients nagging, coz they cant remember
part names and whatelse....

well I just solved that by making a stupid simple image map popup.

thought i'd share it, as it can trastically improve end-user experience(
and maybe even yours)

only file you need to edit is /app/views/admin/page/new.rhtml

just add these 2 JS functions at the top of the page.

function toggle_help_part_popup() {
        var popup = $('help-part-popup');
        var partNameField = $('part-name-field');

function put_part(frmtxt){
    var partNameField = $('part-name-field');
    partNameField.value = frmtxt;

then create the imagemap pop-up (its a div layer within the popups id)

<!-- Helper Pop-up -->
<div class="popup" id="help-part-popup" style="display:none;">
  <img src="/images/content/layout_helper.png" width="600" height="555"
border="0" usemap="#Map" />
  <map name="Map" id="Map"><area shape="rect" coords="116,35,537,99"
href="javascript: put_part('header');" />
  <area shape="rect" coords="23,124,152,541" href="javascript:
alert('this element must be changed in the snipplets section!');"
/><area shape="rect" coords="180,276,283,504" href="javascript:
put_part('left_col');" />
    <area shape="rect" coords="338,276,440,504" href="javascript:
put_part('right_col');" /><area shape="rect" coords="180,149,442,247"
href="javascript: put_part('body');" />
  <area shape="rect" coords="484,124,588,540" href="javascript:
put_part('right_bar');" />
    <%= link_to_function 'Close', "Element.hide('help-part-popup')",
:class => 'close-link' %>
<!-- // Helper Pop-up -->

last but not least add a link to the "add_part" popup, I placed it next
to the close tag, so it would result in the following:

 <p><%= link_to_function 'Close', "Element.hide('add-part-popup')",
:class => 'close-link' %> <%= link_to "help?", 'javascript:
toggle_help_part_popup()', :title => 'help?' %></p>

this is totally simple, but I believe some people mind find some use for

if you wanna test it out i placed the image map at

its all pretty self explanatory I guess, but it still saves time

Dc893f8ae12045dc71048a0c6a56fc01?d=identicon&s=25 Jacob Burkhart (igotimac)
on 2007-02-22 15:42
Nifty Idea,

I wonder how we could make this more "automated" to provide some layout
information about what page parts of being used for a given arbitrary
page. (Not one using your specific layout)

Perhaps a temporary override <r:content part.. could render a border
around it's contents, and ignore content that's not an <r:tag... and
render the name of the part with a giant H1.  There could always be
cases where it gets messed up but I think it could work.  Perhaps use
the facets PagePreview extension as a base.
This topic is locked and can not be replied to.