Hello ,
I will explain what I am trying with my poor english ability.(sorry for this)
Main concept:
To make a solution like Concrete5, Gutenberg in Wordpress with CouchCMS with "reuse-able section blocks" using snippets by easy operation for users and developers.
Benefit:
* once you made "reuse-able section blocks" snippets,
you can use any time.
* you don't need define fields in your template, it is done by dynamic.
* you can easily change "reuse-able section blocks" without loosing your input by using global fields definition for "reuse-able section blocks".
* you can easily move "reuse-able section blocks" in page with mosaic function.
"Way to approach"
Elements:
a. MainTemplate
(ex. top-page.php)
b. global fields definition for "reuse-able section blocks"
c. "reuse-able section blocks"
(ex. calltoaction_a.html,calltoaction_b.html,etc)
(b,c are in snippets folder)
note : normal couch way is Template-oriented but this is "reuse-able section blocks" oriented.
a. MainTemplate
This contains
1. dummy field for conditional fields.
mosaic definitions and display this mosaic and also dummy field for conditional fields.(ex. dummy_type)
Definitions need at least two fields.
1. Section name : Unique name of this section in this page.(ex. section_id)
2. Block name : Name of "reuse-able section blocks"
To display mosaic
just embedding "reuse-able section blocks" in snippets using "block name".
b. global fields definition for "reuse-able section blocks"
To difine global basic common fields for all "reuse-able section blocks".
ex. title, sub_title , description, button_text , link, image, background_image
Put editable-tag with type='group' first.
Then put field definitions inside just like normal couch-way.
But there are a few different points.
ex. Definition of a "title" fields
(Point A) How to define "name"
name="<cms:concat section_id '_title' />"
"section_id" comes from "Section name" of "MainTemplate".
so you can have a unique field name.
(Point B) How to control show/hide of unuse field
not_active = onoff_title
Use "not_active". I will explain how to use later.
c. "reuse-able section blocks"
Example using bootstarp jumbotron
elements.html(global fields definition)
Like this
(note) I use "inline-edit", so you need prepare for "MainTemplate" to use this.
This is main idea for my "reuse-able section blocks" solution.
I will explain what I am trying with my poor english ability.(sorry for this)
Main concept:
To make a solution like Concrete5, Gutenberg in Wordpress with CouchCMS with "reuse-able section blocks" using snippets by easy operation for users and developers.
Benefit:
* once you made "reuse-able section blocks" snippets,
you can use any time.
* you don't need define fields in your template, it is done by dynamic.
* you can easily change "reuse-able section blocks" without loosing your input by using global fields definition for "reuse-able section blocks".
* you can easily move "reuse-able section blocks" in page with mosaic function.
"Way to approach"
Elements:
a. MainTemplate
(ex. top-page.php)
b. global fields definition for "reuse-able section blocks"
c. "reuse-able section blocks"
(ex. calltoaction_a.html,calltoaction_b.html,etc)
(b,c are in snippets folder)
note : normal couch way is Template-oriented but this is "reuse-able section blocks" oriented.
a. MainTemplate
This contains
1. dummy field for conditional fields.
mosaic definitions and display this mosaic and also dummy field for conditional fields.(ex. dummy_type)
Definitions need at least two fields.
1. Section name : Unique name of this section in this page.(ex. section_id)
2. Block name : Name of "reuse-able section blocks"
To display mosaic
just embedding "reuse-able section blocks" in snippets using "block name".
b. global fields definition for "reuse-able section blocks"
To difine global basic common fields for all "reuse-able section blocks".
ex. title, sub_title , description, button_text , link, image, background_image
Put editable-tag with type='group' first.
Then put field definitions inside just like normal couch-way.
But there are a few different points.
ex. Definition of a "title" fields
(Point A) How to define "name"
name="<cms:concat section_id '_title' />"
"section_id" comes from "Section name" of "MainTemplate".
so you can have a unique field name.
(Point B) How to control show/hide of unuse field
not_active = onoff_title
Use "not_active". I will explain how to use later.
c. "reuse-able section blocks"
Example using bootstarp jumbotron
elements.html(global fields definition)
- Code: Select all
<div class="jumbotron">
<h1 class="display-4">Hello, world!</h1>
<p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
<hr class="my-4">
<p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
<a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
</div>
Like this
- Code: Select all
<cms:func _into='onoff_title' dummy_type=''>show</cms:func>
<cms:func _into='onoff_sub_title' dummy_type=''>hide</cms:func>
<cms:func _into='onoff_description' dummy_type=''>show</cms:func>
<cms:func _into='onoff_button_text' dummy_type=''>show</cms:func>
<cms:func _into='onoff_link' dummy_type=''>show</cms:func>
<cms:func _into='onoff_image' dummy_type=''>hide</cms:func>
<cms:func _into='onoff_background_image' dummy_type=''>hide</cms:func>
<cms:embed "elements.html" />
<div class="jumbotron">
<h1 class="display-4"><cms:get "<cms:show section_id />_title" /></h1>
<p class="lead"><cms:get "<cms:show section_id />_lead" /></p>
<hr class="my-4">
<p><cms:get "<cms:show section_id />_description" /></p>
<a class="btn btn-primary btn-lg" href="<cms:get "<cms:show section_id />_link" />" role="button">
<cms:get "<cms:show section_id />_button_text" />
</a>
<cms:pages masterpage="<cms:show k_template__parent_tpl />" >
<cms:popup_edit "<cms:concat section_id '_title' />|<cms:concat section_id '_lead' />|<cms:concat section_id '_description' />|<cms:concat section_id '_button_text' />|<cms:concat section_id '_link' />" link_text="Edit" />
</cms:pages>
</div>
(note) I use "inline-edit", so you need prepare for "MainTemplate" to use this.
This is main idea for my "reuse-able section blocks" solution.