HealthCARE Express

[joer80]

Oh cool!  Are you a full-time programmer?

On the detail page layouts, I didn't want to be required to select a page layout every time I add a child page so I made that drop down.  (For blog posts and services and products, etc.) . So if I set a detail page layout on a page, any children will use that even if they do not set one. 

My page.php template says "if the current page I am showing doesn't have a page layout selected, check its parent to see if there is a detail page layout I can use".

So if I add a blog post (blog_post.php), or a new service page, those do not even have to have a drop down for selecting the page layout as part of their template fields.

I can also set the blog template only to allow blog post children, so it saves the whole step of selecting a page template or layout at all.  If I want, I can allow content children also, but its not really necessary since you can add items to the page layout.  

blog and blog_post or services and service would still use the page.php template though.  They are just templates to get the unique fields.

After I clean it up some, I will see about making a site profile.

 

[gmclelland]

Yep, web dev is one of things I do.  I work for a municipality in a small IT department.

Quote

On the detail page layouts, I didn't want to be required to select a page layout every time I add a child page so I made that drop down.  (For blog posts and services and products, etc.) . So if I set a detail page layout on a page, any children will use that even if they do not set one. 

makes sense now.

I'm a bit tired now, but I'll probably need to re-read this thread and re-watch the video a few times to fully understand everything.

Glad monosnap worked for you.  I like how you can snap a screenshot, instantly add annotations, and drag it into a post to upload.

Thanks for sharing your technique.  That's what I love about the Processwire community.  Everyone is so helpful.

[bernhard]

Thanks for the monosnap hint. I compared it to http://getgreenshot.org/ (I've been happily using it for years now) and just realized that it's even possible to upload screenshots directly to imgur (just tried it with the screenshot above). This will save me & ryan from several MB of diskspace ? 

For longer and more professional screen recordings I use https://screencast-o-matic.com/refer/cXhu2n69l. It is free for up to 15min but I have the paid version with better editing and upload features. If you use my referral link you get 20% off. It get's even cheaper if you take the 36-month-subscription (then without referral): https://screencast-o-matic.com/subscribe?plan=pr1

[AndZyk]

Nice website and really unique approach for building it. ?

Just my opinion, but you should consider that in the case you ever want to switch the framework or build the website with a different structure, that I think great parts of your setup will become obsolete. Not that it is likely, because with the UIkit framework you have made a excellent choice as framework, but this approach is maybe not really future proof because it heavily depends on one framework.

Also, if you haven't already, it would be best to use unique titles for everything (fe. sections, slideshow etc.), because otherwise using the page search will be difficult. I had a similar setup years ago with Page Tables (nowadays I prefer Repeater Matrix) and it was hard to find the right element, because I had named everything similar. ?

Regards, Andreas

[bernhard]

Watched your screencast now and have to say wow! It looks really impressive and it seems you put a lot of work in it. It reminds me a little of my very first processwire project: 

The problem is that this approach is hard to reuse on other projects. You'd basically need to build everything new from scratch. If you copy everything you end up with two different versions whenever you add a feature or fix a bug. Or you need to fix it on all your projects.

I'm thinking a lot of some kind of FrontendThemeUikit Module that would bring in some reusable standards and make such a setup plug&play. Your site seems to be a good example what could be achieved!

 

[joer80]

8 hours ago, bernhard said:

The problem is that this approach is hard to reuse on other projects. You'd basically need to build everything new from scratch. If you copy everything you end up with two different versions whenever you add a feature or fix a bug. Or you need to fix it on all your projects.

 

 

I think I am going to add a lazy cron style auto update module for important security updates, and maybe hit a manual update when you are backed up for feature ones.  I can launch this as version 1.0 and check an endpoint for the most recent version from time to time to let the user know if there is an update with new features.

If I add a new drop-down/option list to the section.php template in 1.01, it would make the database changes and replace the section.php file to read them. 

Ryan is also doing a great job with page import and export, so you could go to a website and export the home page and all of its children, and import it into a new website.

You can already drag a row from one page to another and carry all of the children items with it.

Since the code snippet template has fields for its own css, js, images, php code and html code, you should be about to export whole features by importing one page into your sitewide folder or a page layout folder that target your head, bottom, and page at the same time.

I probably need to put a row gallery up somewhere also so I can upload row designs and not just mark them as inactive.  Keep the websites clean but browse for ideas and pull them in.  Just have to standardize things like the hanna tags so the address info and such comes in right for a map row.

 

 

 

[joer80]

Here is how the map row looks.  Its a regular grid item with the collapse gutter option set and the first child cell set to 1/3 on large screens.

I could do the map side as a map.php template though instead of a php snippet even though its just 5-10 lines of code.  

I did a contact_form.php for the basic form I used on the contact page.   It's easy to use checkboxes to know what fields to make with you add it to the page.  Address, phone and such is still pulled from hanna codes so if you don't want fax you just leave it blank.

My goal is to be able to import the whole row from an external library of some sort and not have to build them.

 

 

[joer80]

I have decided to clean this up a bit.  It seems adding a content page under a page just to separate it from the detail pages is not optimal or necessary.  I have decided on another way to flag what the child items are.

I now use the "Page" template for pages that have content rows as children, and every other page type that can be added under Admin Home is made to have detail pages as children. ie. Services, Products, Basic Pages, etc.  I show this with the page template using the globe, and the other master types using a dark circle. 

I also added a "Basic Pages" master/detail set that allowed me to trim up my root page list and move things like Terms and conditions and Privacy Policy under there as detail pages.  This also keeps me from building a section just to add a text item to it.  I just add new and type content.  The basic page template has the inner page heading, and a section and text row built in so it saves time adding these info pages.

So you can add a "Page",  and still build it out, and also select a page layout of "Inner Page" to give you the automatic page heading, or blank gives you a clean slate, or you can work with an existing page type like "Basic Page" or "Service", or add a new template with custom fields and work with the same master and detail format.  Just tell it to use page.php as the template, give it some fields, and make sure it selects a page layout.

 

[gmclelland]

I really like how you used the MarkInPageTree module on your other case study to show which page templates are being used.  That might help others here understand your setup better?

[joer80]

6 minutes ago, gmclelland said:

I really like how you used the MarkInPageTree module on your other case study to show which page templates are being used.  That might help others here understand your setup better?

 

I just noticed that feature earlier today and enabled it! 

Whats cool also is I can insert a grid inside my accordion so I can do columns inside my accordions!  Just tested it out.

[grimezy]

Nice work @joer80!

It's great to see how others approach their own page builders.  Hopefully we can all learn better ways of building out our own page builders.

I've taken a slightly different route and have used repeater matrix fields to build out the page layout/sections, whereas you have used pages.  I like how yours integrates the structure and content into the flow of the page tree.

I originally thought about this, but had concerns of content & layouts that I wanted to repurpose for some/all pages.  I know it would be easy to copy a page and it's children to another parent, but I thought it would be easier to use a selector field to select where I wanted to place these.  How do you approach this? Do you have any difficulty with this? 

The other reason I went this approach was I could easily lock down the template section and users could still change the current content and all of the widget options that I make available.

The downside with my approach was it got a bit messy once the site started to grow.  I recently had to change mine up a bit due to this.  I originally had just a parent page 'templates' and 'widgets' but soon got out of control.  I now have the same parents pages, but now seperate child pages into groups.  I'm still looking to improve on this which I hope I can refine it the more I use it.

I also changed the widgets parent page to store all widgets that are on multiple pages and singular widgets page to sit under the pages or parent pages which they are used for, which sit at the top of the page tree. Thank you @tpr for implementing the sticky page feature in AdminOnSteroids! ? 

I also improved the way I could target classes, buy separating my css files.  Ones that target the page ID, the page name and the widget name as a class.  I think I will try and extend this as you have done through a backend-end editor for these files.

One thing I would love to find out is a way to automatically update all the uikit classes from an external source.  So that whenever anything is changed and updated, new classes would be added.  Or have a development section in the page template to test new classes with... etc, so not to break anything.

But great stuff, well done! ? 

Just shows you what can be built using this awesome CMS. ? 

[joer80]

My next step is to see how hard it will be to make a module that will allow me to keep them all up to date as I make changes and add templates.  I will have 5 installs within a week!

[dragan]

12 hours ago, gmclelland said:

MarkInPageTree module

I searched for this module, but found nothing. Do you have a link?

[grimezy]

https://modules.processwire.com/modules/mark-in-page-tree/ 

 

[joer80]

12 hours ago, grimezy said:

I originally thought about this, but had concerns of content & layouts that I wanted to repurpose for some/all pages.  I know it would be easy to copy a page and it's children to another parent, but I thought it would be easier to use a selector field to select where I wanted to place these.  How do you approach this? Do you have any difficulty with this? 

Give me a hypothetical situation and I can see if the page layout group method would be enough.

By assigning a page layout to each page to form groups of pages.  A page can have its own items and the items attached to its page group at the same time. 

As an additional layer, you can use hanna codes to share code between page groups even.

[gmclelland]

@grimezy - Care to share some screen shots of how your setup works?

[grimezy]

Yeah sure, I'll try put something together this week to post if I don't get to busy. ? 

[bernhard]

On 8/24/2018 at 4:14 AM, grimezy said:

One thing I would love to find out is a way to automatically update all the uikit classes from an external source.  So that whenever anything is changed and updated, new classes would be added.  Or have a development section in the page template to test new classes with... etc, so not to break anything.

I don't understand this part. What do you mean?

[grimezy]

2 minutes ago, bernhard said:

I don't understand this part. What do you mean?

I currently just create all the uikit classes as pages. It would be good to have a way to sync new classes that become available from uikit. 

Im not sure if there is anything that can be used from uikit which just lists all the classes somewhere?

[bernhard]

you mean uikit components? like slideshow, accordion, alert etc.? not classes like uk-text-center and so on?

[grimezy]

More the classes, but I group the pages under a page named as the corresponding component.  So for example I have a parent page called uikit components, then under that, different component parents, such as alert, then its classes under that, such as default, primary.

I guess it all depends on how often they will change / add classes once its out of beta, and then it wouldn't change all that often.  I guess something like this would more benefit anyone that was first implementing something like this, as I transitioned from uikit 2, to uikit 3.

I might see if I can make it a bit more neater, and user friendly, and then just export the parent page and all it's siblings and export it using PW's export pages tools for others to use?  I'm not sure if others have have gone about it this way? or if there is a better way to go about it?

[grimezy]

On 8/25/2018 at 1:02 AM, joer80 said:

Give me a hypothetical situation and I can see if the page layout group method would be enough.

By assigning a page layout to each page to form groups of pages.  A page can have its own items and the items attached to its page group at the same time. 

As an additional layer, you can use hanna codes to share code between page groups even.

 

On 8/25/2018 at 3:04 AM, gmclelland said:

@grimezy - Care to share some screen shots of how your setup works?

 

Sorry I took a while to respond... some appliances in the house broke that needed fixing and got a new Roland electronic drum kit, which I told the wife was more for my boys, but I have been hogging it... ? 

Site still isn't finished, but almost...

I tried to put together a video which shows:

• Creating a new test page
• Using repeater matrix field to add different content to the main body of the test page
• Creating a new page widgets group and a slideshow widget
• Creating a new test template page using the UIKit framework as the container for the widget
• Targeting specific / all pages to show the container
• Adding some classes to the container

So I hope this shines some light on how I use this... kinda the best of both worlds... I can add main page content via repeater fields, but if I need content anywhere else, I can build out the template and target where I want the widget to go for any pages outside the main page content, or use the same widget in different locations on selected pages.

I think I will try using fieldsetgroup or fieldsetpage, (I think) to try to combine the repeater matrix fields used for the main content and the widgets, so I really only have to maintain one template section and a single bit of code, if it needs expanding or more features are requested by a client.

 

[joer80]

How would you nest more than one deep?   

For example, with my approach, I can insert a section, then a grid, then a cell, and then put an accordion into one cell, and then put another grid into that accordion.

So I can do text in the left part of an accordion and an image in the right. 

Here is another screencast.  Also shows I got rid of the content layer.  I don't find it necessary.

This is a one pager I did for our imaging clinic.  It had an accordion example. https://www.hceimaging.com/

 

 

[grimezy]

Great stuff.

I haven't really had the need to place any grids inside any of my widgets, so have never thought of doing anything like that, but if I were to approach it with my configuration, I would probably just add some of the templating elements into the repeater matrix section.

[Knubbi]

A dev consultant implemented the Repeater-based PageBuilder for us (similar to "grizmey"'s approach).

The challenge we now have with Repeaters is, that we cannot move/copy contents hold by repeater between different pages of the website.

So, it seems, that the page-approach seem to better or is there a benefit of the repeater-approach we missed to realize?