Jump to content


  • Content Count

  • Joined

  • Last visited

  • Days Won


jploch last won the day on January 26

jploch had the most liked content!

Community Reputation

162 Excellent

About jploch

  • Rank
    Distinguished Member
  • Birthday 05/02/1985

Contact Methods

  • Website URL

Profile Information

  • Gender
  • Location
    Hamburg, Germany
  • Interests
    Graphic Design, Web Design, HTML/CSS, Javascript

Recent Profile Visitors

4,009 profile views
  1. thx! it's working now calling the function like this. Cool! $CssClasses = $modules->get('InputfieldPageGrid')->getCssClasses();
  2. One more question to finally understand php classes a little bit better: If I have this simple class: class PageGridCSS { public $cssClasses = 'test classes'; public function getCssClasses() { return $this->cssClasses; } } How can I call the function getCssClasses from outside the file it is declared in? So far I was able to call it from within the same file only by doing this: $PageGridCSS = new PageGridCSS(); $PageGridCSS->getCssClasses();
  3. @MoritzLost Thanks again! This seems to be the best way to handle it. I will further investigate if it complicates my current setup too much. But I get the benefits now. Hopefully this will help others too. I'm generally ok with making some assumptions in my case, because you can change the CSS stuff inside the backend for each item (and the breakpoints you want) anyway, also its easy enough to overwrite some css rules with plane css/scss. Maybe I provide some api options and helper functions along the way, so this is definitely helpful. Here is a preview of the module I'm developing to give you a little more context:
  4. I'm still a little lost on how to implement my JSON decode method and use WireArray as a representation of my data. My module builds a dynamic stylesheet, based on the JSON file. This dynamic stylesheet is just a php file that the user can include in his/her main template file. The JSON is saved in one field, that live on the page holding all the PageTable items. Since I need the CSS to be rendered in the backend and frontend and I wanted to give the user more freedom on where to include the CSS I thought this is a good approach. Not sure if it's really clever to have this in a separate file instead of my module file. This is my working code I have in the dynamic stylesheet file: <style> <?php namespace ProcessWire; $backend = 0; $p = $this->page; if($isAdmin = $this->page->rootParent->id == 2) { $p = $this->pages->get((int) wire('input')->get('id')); $backend = 1; } $css=''; $settingsArrayPage=json_decode($p->pgrid_settings); if( !(empty($settingsArrayPage))) { foreach($settingsArrayPage->items as $item) { foreach($item->breakpoints as $breakpoint) { if ($backend) { $css.='.breakpoint-'. $breakpoint->name . ' '; } else { $css .= $breakpoint->size . '{ '; } $css .= '.' . $item->cssClass. '{ '; foreach($breakpoint->css as $style=> $val) { $css .= $style . ': ' . $val . '; '; } $css .= ' } '; if (!$backend) { $css .= ' } '; } } } echo $css; } ?> </style> First of all where would you put the WireArray code? Is it better to have this in my module file or in the dynamic stylesheet file? Here is my code so far. class PageGridData extends WireArray { public function getItemKey($item) { // here I would place the JSON decode method from above and return the items? return $item->id; } } Sorry this is a bit outside of my comfortzone 🙂
  5. @MoritzLost Thank you for the detailed answer! I'm still at a very beginner level with php, all I know about it, I basically learned from using PW and it's api. Doing mainly frontend development, this is the first bigger module I'm building. So I'm still new to how classes work. Now that I have another look at it, what you sad makes a lot of sense. I will try to implement the class approach with my own utility methods. I will also have a look at WireArray, this seems like a nice solution. Thanks again for your help. I might come back at you if I hit another roadblock.
  6. @bernhard Thanks for your examples. It does look simple to create a migration. It would be nice if a non technical person could then easily paste that code into the backend, click a button and everything is imported. Is that possible with your module? I don't want that person to open an editor, that person might not even have access to FTP. With adrians migrator module it's possible to import the code/JSON in the backend and create all the pages, templates and fields in one import. I'm not saying that this is somehow better than how your module works, it just might be better suited for my usecase. Your module clearly has a lot of benefits compared to migrator.
  7. I saw this a while ago, but just had a brief look at it. I will play around with this some more, but this might be even too complicated for my needs. The target group for my module are not only web developers, but also non technical people like designers, experienced editors, or marketers. I need a way for these people to import new blocks as well.
  8. here is another possible structure { "items": [{ "id": "3252", "cssClass": "pgrid-main", "breakpoints": { "base": { "css": { "grid-column-end": "auto", "grid-row-end": "auto", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "60px", "padding-right": "60px", "padding-top": "60px", "padding-bottom": "60px", "background-color": "rgb(255, 255, 255)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, { "id": "3686", "cssClass": "test_global", "breakpoints": { "base": { "css": { "grid-column-end": "-1", "grid-row-end": "span 1", "grid-column-start": "1", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, { "id": "3687", "cssClass": "block_editor-3687", "breakpoints": { "base": { "css": { "grid-column-end": "span 5", "grid-row-end": "span 2", "grid-column-start": "2", "grid-row-start": "2", "align-self": "auto", "z-index": "98", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgb(255, 204, 204)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, { "id": "3696", "cssClass": "block_editor-3696", "breakpoints": { "base": { "css": { "grid-column-end": "span 2", "grid-row-end": "span 1", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }], "breakpointActive": "base", "breakpointActiveSize": "@media (min-width: 576px)" }
  9. @MoritzLost Thanks for your explanation! Helps me to understand this a little bit better. Iam not sure the data will ever be relevant to the user, for now I just use the JSON internally (creating JSON with js and decoding it with PHP). What I meant with "using objects instead of arrays" here is just how I decode the JSON in php: json_decode($jsonString) instead of (json_decode($jsonString, true). This gives me easy access to the items (which are just pages, so I thought it would be nice to be able to access them by page id like the pw api works). To be able to do this I also need to create the JSON structure like in the example above (with JS). Hope that makes sense. Not sure if the cons you listed matter that much in this case. I will think about it. This sounds interesting. Maybe you can provide an example how to extend WireArray?
  10. I just added some new features. – All blocks can be cloned now. Which makes adding content very fast – More options to control access of blocks individually. You can lock editing of blocks completely or disable features such as cloning, styling or content editing for certain roles I was also thinking about the best approach to copy blocks between PW installations or to share them with others. The easiest way I found was to export/import a page, with all the blocks you want added, using adrians migrator module. The export code together with the block template files could be shared with others or imported into existing installations. So this would be an option until we hopefully have something in the core to make migrations work better. An alternative would be to store everything as JSON (including the content) and using something similar to the Mystique Module to let the developer add fields based on config files. That also has the benefit of being able to have the files version controlled. The downside of using the JSON only approach would be inferior searchability of fields. Also making it work with every fieldtype would be a challenge. I'm interested how others feel about this.
  11. cool! but still can someone look at my code and tell me if the JSON structure is fine?
  12. @ukyo Thanks! Your module looks great! However I already have a way to build my JSON based on inputfields, wich is just needed to save some internal css of my module. All the real content is saved in the database with regular pw fields. I would like to keep it that way, but was looking to get some feedback on my JSON structure. Specially I'm not sure if it's valid to have numerical keys (page id)? Everything is working fine, so if it's not bad practise for some reason, I will just keep it that way. Doing it all in JSON (including the content) with your module would have the benefit of being able to transfer the templates to other installations without importing the database and also have it version controlled, right? But the downside is that it's not searchable as well as native fields and also that not all fields are supported?
  13. Hey folks, for a module (a pagebuilder based on PageTable) I need to save some settings as JSON. The values are saved for each page table item (a pw page). It's working well, but I am looking for ways to improve the structure I have. As I'm not that experienced with JSON, maybe someone more experienced can take a look and tell me if my approach is good practice. My goal is to make all the items accessible by page id, without looping over them (using objects instead of arrays): // access from template with pw page var $jsonObject->items->{$page}->cssClass; Her is an example of my JSON structure: { "items": { "3252": { "id": "3252", "cssClass": "pgrid-main", "breakpoints": { "base": { "css": { "grid-column-end": "auto", "grid-row-end": "auto", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "60px", "padding-right": "60px", "padding-top": "60px", "padding-bottom": "60px", "background-color": "rgb(255, 255, 255)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3686": { "id": "3686", "cssClass": "test_global", "breakpoints": { "base": { "css": { "grid-column-end": "-1", "grid-row-end": "span 1", "grid-column-start": "1", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3687": { "id": "3687", "cssClass": "block_editor-3687", "breakpoints": { "base": { "css": { "grid-column-end": "span 2", "grid-row-end": "span 1", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } }, "3696": { "id": "3696", "cssClass": "block_editor-3696", "breakpoints": { "base": { "css": { "grid-column-end": "span 2", "grid-row-end": "span 1", "grid-column-start": "auto", "grid-row-start": "auto", "align-self": "auto", "z-index": "auto", "padding-left": "0px", "padding-right": "0px", "padding-top": "0px", "padding-bottom": "0px", "background-color": "rgba(0, 0, 0, 0)", "color": "rgb(0, 0, 0)" }, "size": "@media (min-width: 576px)", "name": "base" } } } }, "breakpointActive": "base", "breakpointActiveSize": "@media (min-width: 576px)" }
  14. It's just the regular page editor. You can also combine my fieldtype with other fields on the same page. In my example I was using AdminThemeCanvas, maybe that was a little confusing, it will look more like the regular page edit screen with the default theme.
  15. Hey folks! Iam exited to finally show you a preview of my pagebuilder fieldtype I'm working on for quite some time now. It's based on PageTable and takes a lot of inspiration from PageTableExtended. @MadeMyDay Thanks for your work on PageTableExtended, it helped me a lot in figuring this out! Let me know what you think
  • Create New...