Multiple editable blocks per page

Thijs · Post by **Thijs** » Wed Sep 22, 2004 8:12 pm

The feature that I would most like to see in CMS is the ability to edit multiple HTML blocks per page. I have written down some idea's about this and I would very much like to hear what you think about it.

Currently only one block per page is possible:

Code: Select all

<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body>
		<layout>
		{content}
		<layout>
	<__body>
</__html>

To really separate content from layout it would be preferable to restrict editing to the pure content parts of the webpage:

Code: Select all

<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body>
		<layout>
		{content name="section 1"}
		<layout>
		{content name="section 2"}
		<layout>
	<__body>
</__html>

I think that on the "content management" page each page would link to a list of content blocks coupled to that page.

The names of these blocks could be defined in the templates, together with a description:

Code: Select all

<linkedcontent name="Section 1" desc="This is section 1">
<linkedcontent name="Section 2" desc="This is section 2">
<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body>
		<layout>
		{content name="section 1"}
		<layout>
		{content name="section 2"}
		<layout>
	<__body>
</__html>

Besides a description, also more properties could be added, such as content type (which would define the invoked editor) like "richtext", "Single line", "Color". Furthermore, some properties could be added. For "richtext" this could be a set of styles styles that is selectable from the editor.

Now the story becomes a little more complex: An lot of flexibility would be gained if it would be possible to, from one page, access content blocks assigned to other pages

Imagine a template "Main template" on which a page "Frontpage" is based:

Code: Select all

<linkedcontent name="site bckcol" desc="Background color of the whole website" type="color">
<linkedcontent name="Section 1" desc="This is section 1" type="richtext">
<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body bgcolor="{content name="site bckcol" page="Frontpage"}">
		{content name="section 1" page="this"}
	<__body>
</__html>

And imagine a template "Second template" on which a page "Contentpage" is based:

Code: Select all

<linkedcontent name="Section 1" desc="This is section 1" type="richtext" styles=['Normal ','Big']>
<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body bgcolor="{content name="site bckcol" page="Frontpage"}">		
		{content name="section 1" page="this"}
	<__body>
</__html>

Where page="this" points to the current page. If this is the default value for the page property it could be optionally left out

There is one ugly aspect to this setup. A reference to a page (page="Frontpage") is hardcoded in the template. A page with this name, based on template "Main template" should always exist in order to access this data.

The advantage is, though, that in this manner editing a value on one page will propagate through the whole website. This would be nice for page titles, meta tags and all kinds of other content.

Another feature that I think would be really very cool, is an edit marker (for lack of a better word) to mark editable content regions in preview mode. Clicking on these markers (for example:

) will transport you to the respective content editor. The markers should be placed at a logical place in the page, usually just in front or after the editable block but not in a tag, as that would break the HTML

Code: Select all

<linkedcontent name="bckcol" desc="Background color of page" type="color">
<linkedcontent name="Section 1" desc="This is section 1" type="richtext">
<__html>

	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body bgcolor="{content name="bckcol" page="Frontpage"}">
		{marker name="bckcol" page="Frontpage"}
		{marker name="section 1"}
		{content name="section 1"}
	<__body>
</__html>

An demonstration of this kind of markers can be found here http://testsite.contemplated.net/cgi-bi ... ltered.cgi

1. press demo page.cnt
2. choose Edit page
3. press one of the edit markers

4. edit block

I realise that might make CMS made easy a bit more complex, but mainly for the programmers, so no problem there

. For site builders the complexity could slightly increase, but that is also a matter of choice. The simplest page you could build is not much complexer than it is now:

Code: Select all

<linkedcontent name="Section 1" desc="This is section 1" type="richtext">
<__html>
	<HEAD>
		<TITLE>Example</TITLE>
	</HEAD>
	</__body>
		<layout>
		{content name="section 1"}
		<layout>
	<__body>
</__html>

For content managers it might even be simpeler than it is now, with click-and-edit tags included in the preview. So, just some thoughts, that I hope are interesting.

Thijs · Post by **Thijs** » Thu Oct 14, 2004 9:51 am

Well, I like it

Something that hit me this morning, is the following:

If multiple little html blocks are implemented (here I go again) the flexibility could be even further extended by using the Smarty Variable Modifiers, which are already present:

http://smarty.php.net/manual/en/language.modifiers.php

For example:

Code: Select all

{* Uppercase a paragraph title *}
<h2>{content name="paragraph title"|upper}</h2>

Here's a more useful example. Suppose you would like the first 100 characters of an article from the page "WhyEverybodyShouldUseCMS" followed by " continued...". You could put the following tag on the frontpage:

Code: Select all

{content name="Article text" page="WhyEverybodyShouldUseCMS" |truncate:100:" continued..."}

All this would become even more usable with different editor types for different content blocks

calguy1000 · Post by **calguy1000** » Wed Oct 20, 2004 4:29 am

could we not emulate such a thing.... multiple editable code segments by:
1. Creating a code segment ala "somecontent" in the content editor and ensuring it doesn't appear on the menu
2. Creating a plugin that simply retrieves the code of the segment....
3. putting something like {content page="somecontent"} into the appropriate part of the template...

I'll let you know in a day or two if this works...

Brit · Post by **Brit** » Tue Nov 09, 2004 12:22 am

This is a wonderful idea. Most CSS sites these days keep the HTML markup quite simple, as all of the work is done by CSS tags. If CMS Made Simple could give access to the text within divs, and make it editable, the end-user could maintain his or her own site without knowing any web programming. And then you'd really have something.

It seems to me that you could create a table of editable sections and link them to pages with the "page_id" field. Then you could have an unlimited number of editable sections by page, and could select them from a list derived from a simple query of the sections table. If you wanted to copy a div from one page to the next, you could simply duplicate a row and assign it a different page id. (That way you could modify a div on one page without altering all of them, which, in my experience, is generally desireable.) Only allowing the user to edit one div at a time probably isn't ideal, but it would be easier in the short term.

Another feature that I think would be really very cool, is an edit marker (for lack of a better word) to mark editable content regions in preview mode. Clicking on these markers (for example: ) will transport you to the respective content editor. The markers should be placed at a logical place in the page, usually just in front or after the editable block but not in a tag, as that would break the HTML

This is a great idea. Gunther PHP does something like this already:
http://www.smallroomsoftware.com/view.php/page/gunther From what I've gleaned of the structure of CMS Made Simple, it would be a bit of work, but it would certainly be doable eventually.

Have any of you worked on this at all? Anyone have any code to share?

Thanks,

Brit

Ted · Post by **Ted** » Tue Nov 09, 2004 5:51 pm

Well, I was seroiusly planning to do modules stuff as the next big project, but instead I'm considering doing this. At least implementing the very basics of Thijs' ideas, though, there will be some nice code changes in order to make this work. I'm expecting 0.8 to take at a minimum a few weeks to do.

I'll post later after 0.7.2 is released with more concrete ideas.

calguy1000 · Post by **calguy1000** » Sat Nov 13, 2004 6:04 pm

couldn't this be done with an adaptation or extension to the news module.......

something that allows us to specify articles by date, and number, and something that allows us to find a specific entry....

then you could do a "{cms_module module=news article=some_article_name}", etc, etc, etc.

Brit · Post by **Brit** » Tue Nov 23, 2004 2:56 pm

Here's an interesting discussion on CMS design that you might want to look at, wishy:

http://www.veen.com/jeff/archives/000622.html

IMO CMS Made Simple is close to what they're looking for. A version that allowed multiple content blocks, and allowed a user to add content to templates without knowing any HTML (face it, that would mean an editor with nothing more complicated than and tags, as tables & such are always buggy.) How would it work? Simple.

{Template}

Example
....

[CONTENT1]

[CONTENT2]

[CONTENT3]

{Interface}
Page Name: Example

There are three content blocks on this page.

Block One: left

// User editable text here

Block Two: middle

// User editable text here

Block Three: right

// User editable text here

The designer would set up the templates for the page, and the user could change content without help. This I think one huge market that hasn't been tapped, and requires a simple CMS system.... or a CMS system made simple

Thanks again for all of your hard work, wishy.

-Brit

Gomes · Post by **Gomes** » Mon Dec 06, 2004 11:57 am

Yes, and single image block (maybe with optional text-sign under image).

I.e : {image} =

CMS Made Simple Forums