Field Type > separator

11 posts by 3 authors in: Forums > CMS Builder
Last Post: July 28, 2009   (RSS)

By Djulia - May 9, 2008 - edited: May 9, 2008

Dave,

The new presentation (Tab option) is formidable in CMS Builder v1.15 !
Section Editors > Admin Tab: | General | Viewer Urls | Searching | Sorting | Advanced |

It would be possible to use an identical separator (Field Type > separator) for the sections ?

Or perhaps an option like Accordion v2.0 ?
http://www.stickmanlabs.com/accordion/

The sections are sometimes very large...

Thanks for the feedback ?

Djulia
Attachments:

option.gif 7K

Re: [Djulia] Field Type > separator

By Dave - May 9, 2008

Hi Djulia,

Do you mean the section menu at the top of every page? Or the section editors themselves so you could choose with "tab" fields would display on in the editor itself? Or something else?
Dave Edis - Senior Developer
interactivetools.com

Re: [Dave] Field Type > separator

By Djulia - May 9, 2008 - edited: May 9, 2008

Hi Dave,

It would be for the separators which are used to separate the fields in the editor of page.
Thus, it would be easier to work with the page where there are several fields.

In the example (separator.gif), the separators Content, Gallery and Advanced Options.

Thanks,

Djulia
Attachments:

separator.gif 22K

Re: [Djulia] Field Type > separator

By Dave - May 10, 2008

Hi Djulia,

Ok, I understand. I think that might be possible if you used a separator field with "Separator Type" of "HTML" and put the right code on there.

If you saved a copy of the editor page and figured out how to do it in plain html first it would be easier. The edit fields are in a table and you'd probably need to end and start the table and put divs around it. With separator html something like this:

</table>
</div>

<div class="accordian">
<table border="0" cellspacing="1" cellpadding="1" width="100%">


And you'd need a few of them so certain fields groups were surrounded by a div.

I've never done it myself but I've seen others do it so I know it's possible. If you can figure it out in a plain html file first (save a copy of the edit form and work with that as plain html) then you can figure out what to add to make it work through separator html fields.

Hope that helps!
Dave Edis - Senior Developer
interactivetools.com

Re: [Dave] Field Type > separator

By Djulia - May 11, 2008 - edited: May 11, 2008

Hi Dave,

Thank you for your answer.

Finally, I used another accordion compatible with jquery.js :
http://www.webdesignerwall.com/tutorials/jquery-tutorials-for-designers/

That functions correctly (accordion.gif). [:)]

There are just minor problems with Firefox (iframe.gif).
(I think that it is with the iframe and that it would be possible to correct with the css).

Thanks,

Djulia


P.s. : I do not know if one is authorized to communicate the code of the admin files on the forum. Also, if somebody wants the code, it can ask me.
Attachments:

accordion.gif 10K

iframe.gif 16K

Re: [Dave] Field Type > separator

By Djulia - May 12, 2008 - edited: May 12, 2008

1) To add in "/CMS/lib/menus/header.php"

<link rel="stylesheet" href="css/accordion.css" type="text/css" media="screen" />

2) To download "arrow-square.gif" and "accordion.css" in "css/"

3) To add in "/CMS/lib/menus/default/edit.php"

line 23:

<script language="JavaScript" type="text/javascript">


$(document).ready(function(){

$(".accordion h3:first").addClass("active");
$(".accordion blockquote:not(:first)").hide();

$(".accordion h3").click(function(){
$(this).next("blockquote").slideToggle("slow")
.siblings("blockquote:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h3").removeClass("active");
});

});


</script>

line 61:
<div class="accordion">

line 70:
</blockquote>

line 83:
</div> :

4) Add Separator Type HTML

separator 1:

</table>
<h3>Element for metadata</h3>
<blockquote>
<table border="0" cellspacing="1" cellpadding="1" width="100%">

separator 2:

</table>
</blockquote>
<h3>Content and Gallery</h3>
<blockquote>
<table border="0" cellspacing="1" cellpadding="1" width="100%">

separator 3:

</table>
</blockquote>
<h3>Other data</h3>
<blockquote>
<table border="0" cellspacing="1" cellpadding="1" width="100%">

(...)

Re: [Djulia] Field Type > separator

By Dave - May 12, 2008

Great, thanks for sharing your code! :)
Dave Edis - Senior Developer
interactivetools.com

Re: [InHouse] Field Type > separator

By Djulia - July 28, 2009

Hi J,

[font "Verdana"]> Were you able to sort out the FF+CSS issues you mentioned ?
Yes, you must give a value to iframe (height: 200px;).

Here my file css ( [font "Verdana"]accordion.css ).

I also modified my approach in the file edit.php ( after <div class="divider_line"></div> ) :

<div class="accordion">
<table border="0" cellspacing="0" cellpadding="5" width="100%" id="editForm"><tr><td>
<h3>Element for metadata</h3>
<blockquote>
<table border="0" cellspacing="1" cellpadding="1" width="100%">

<?php showFields() ?>

</table>
</blockquote>
</td></tr></table>
</div>

...and separator :

</table>
</blockquote>
<h3>Content and Gallery</h3>
<blockquote>
<table border="0" cellspacing="1" cellpadding="1" width="100%">

Thanks to share your experiment !

Djulia

Attachments:

accordion_001.css 1K

Re: [Djulia] Field Type > separator

By InHouse - July 28, 2009

Great! Thanks kindly for sharing your findings!

J.