jploch

@ryangorley Thats a really nice website! I also like the 3D assets. I am not sure if/how 3D will fit with our current design approach. But I will keep it in mind and discuss with the others.

Hey folks, sorry for not responding earlier; I was swamped with work and then got sick afterward. Thanks for all the feedback so far! And thanks again, @ryan, for asking and trusting us to help with the redesign. The discussion seems a bit heated, but that only shows how passionate the community is about PW. I will leave it to @diogo (he is on vacation for a week) and @ryan to answer some of the technical concerns, as they are the ones doing the implementation. Just know that we are reading and discussing them and take them seriously. I want to add a bit of context to our general design approach and goals with the redesign of the theme and PW website. You might not agree with everything I am saying here, and that's fine. I don't claim to be right in all of it; this is just our current approach. We started out by asking questions to Ryan, reading the forum, and identifying problems with PW's current marketing and brand strategy. As well as doing research and comparing other CMS offerings to PW. here is what we found out: PW user numbers seem to be stagnating (not a lot of new users on the forum). PW's marketing mostly seems to speak to developers (= making clients, agencies, content creators, marketers, editors, and designers look for other options). Lately, more and more of our own clients had been choosing other CMS options over PW because they said it looks too "technical" or "dated" (they looked at the PW website). The design of the PW homepage is too "crowded" to identify the most compelling features of PW (= clients couldn't understand at a glance how PW can solve their problems). The PW website lacks recognition (basic UIKIT look) and doesn't look very approachable/friendly for newcomers. The way the admin backend is shown on the website is not very attractive, and the theme itself looks dated compared to other CMS solutions. The look of the website doesn't reflect most of PW's brand values (Flexible, Powerful, Simple, Easy, Friendly, Open, Secure, Stable, Free). And here are some of our goals with the new website and theme design: Attract new users to PW (developers are still the main target audience, but we want to target a more diverse group of users, see above). Make PW more approachable for new users. Keep existing users happy. Make the PW brand more recognizable. Better highlight PW's strengths and key features. Communicate PW's brand values through the design. Improve the docs. Make it easier to find modules. We realized that it would not be enough to just redesign the website, as the admin theme is the "main product." If people check out the new website and we can make them interested in PW, the second thing they do is install the CMS. So it's important to have good-looking defaults for the new theme that are coherent with the new website, as new users won't do a lot of customization. The reason we decided to include a dark mode in the admin theme is also mainly to appeal to new users. I personally don't care much about a dark mode, but for some it's a selling point. This trend can also be seen in other CMSs that now support it. I hope once the website is launched, it will be a bit more clear where we are going with this. Also be aware that we are not getting paid to do this, we did it because Ryan asked us and we love PW. But our time is limited and we have to make the most out of it. We will probably not achive all of these goals immediately, but we hope to set a good direction for things to come.

@joe_g Glad to hear it! I would like to feature the website on the showcase. If you are ok with it send me the URL as DM or post it here and I will add the site. THX!

This issue is solved with the latest update (>= 2.2.70).

The group block has a link option now, which wraps it's content inside an <a> element. (Marked as Solved)

Thanks for sharing the video and the PM. I will have a look and get back to you soon. I am aware that sometimes the grid overlay is not updating immediately. I might fix this in the next update, but this is not related to your issue.

I don't see any problems with your code. Can you try to replicate the issue on a fresh install using only the premade blocks? If you can't replicate it, you can add one block at a time and see if/when it happens? Can you install and enable Tracy Debugger and check if you get any errors there? I can also take a look at your setup if you don't mind. E.g. You can send me a PM with a link to an installable site profile or create a user for me so I can login and try to replicate the issue on your install.

I don't think so but can you post the code you have in your custom block template.

When you edit a page with PAGEGRID, it's loading your frontend inside an iframe, thats why I am asking about your JS code. The JS notice you posted is not related. I also see that notice and it has no affect (it's not an error and happens sometmes when opening the style panel and some inputs don't accept the default placeholders).

Sorry again for the inconvenience, and thank you for your patience! If this is the case, it's not the browser then. Are you loading any custom javascript code, if so can you remove it and see if it changes something? Can you check if there are any javascript errors in the console? There is clearly something wrong here, because I build a lot of PAGEGRID websites with a lot more items then 20 and did not experience these performance issues. I think thats a good idea. You can also test with the premade blocks to make sure it's not your code that is causing it. I will also test a bit on my end, but so far I could not replicate the issue.

You have two options if you don't want your client to resize items: Don't give the permision "pagegrid-resize" and "pagegrid-style-panel" to your use role Force the item size with CSS like this: /* overwriting the default size of grid items */ .pg .pg-item { grid-column-end: span 3; }

Lets try to fix this. Which browser (Chrome version) does your client use? How is the performance when your client is not using screen sharing? Can you login with the user of your client and try to replicate the issue on your computer? About performance. Screen sharing is not a very reliable way to measure performance. A low FPS rate could be due to the network. Also keep in mind that screen sharing usually affects the performance of the client. So if your client is running on an older machine, this could also be an explanation for the low FPS.

Ok then it makes sense to use the default. It could also be a user error from your client side. Since I can't reproduce it, I am not considering this to be a bug in PAGEGRID for now. If you can provide a way to reproduce the error I will try to fix it. PAGEGRID has cache busting enabled by default, so you just need to call the function. I was talking about adding cache busting to your own custom CSS files. But since you loaded the styles inside the PAGEGRID settings it should just work. This also makes sure the order is correct und your custom code will be loaded after PAGEGRID's default styles automatically. I don't think the probelm is related to caching anyway. Then it should just work. The order is correct if you do it like this. You don't have to use important. Is there any other CSS code that could affect the blocks? No need to use important. PAGEGRID styles have low specificity. You can use 1 level classes. Just for overwriting the grid-row-start of the items you have to use two classes (like you did): .pg .pg-item{}

I don't think it's an issue with the cache, so the hard refresh should not be needed (I never had any cache issues for the sites I created with PAGEGRID). How are you loading your custom css? Make sure you load your custom CSS after you load the styles from pagegrid (e.g. after: $pagegrid->styles($page);) Also make sure you use the right class when setting the items to auto row, this will do it for all exiting/new items: .pg .pg-item { grid-row-start: auto; } If you are not using the grid and only want your client to sort vertically it might make sense to set the main wrapper to display block: .pg-main { display: block; } See this for more information.

Sorry for the trouble. This has not happened to any of my PG sites, so it would be good to find out what is going on. First I recomend to install the ProcessDatabaseBackups module and the CronjobDatabaseBackup module. These can be setup to trigger a backup when a user logges into the backend, so you always have a backup you can restore if your client changed something. Also consider giving you client only the permissions needed to maintain the site (eg. using the default pagegrid-editor role). With the information provided it's a bit hard to guess, so let's break down the potential causes and how we can address them. Possible Causes: Cache: ProcessWire's Cache should not be enabled when you are logged in, so I don't think thats the issue. Are you using any external caching features like template cache or ProCache? If so try to disable them temporarely and see if it changes things (also delete the site/cache folder). Another thing could be that the browser cache is holding onto an older version of your site's CSS file. You can load the css file with a cache busting parameter like appending a version (e.g. mycssfile.css?v=2) and see if that changes things. Perform a hard refresh of the browser (usually Ctrl + Shift + R or Cmd + Shift + R). CSS Specificity or Conflicts: Double-check the code for your 'vertical spacer' custom block. Ensure it doesn't contain any CSS or JavaScript that might inadvertently affect the positioning or order of other elements on the page. What is the CSS display value of the main wrapper (e.g. display: grid; display: block;)? If you are using vertical ordering it might make sense to use "block" instead of "grid" (.pg-main {display: block;}). User error: What kind of permissions does the client have (eg. can the client use the item list to reorder)? Could it be that the client reordered the blocks by accident? What was the last thing the client did before it happened? Two users working on the same page: If two users work on the same page it could cause some unexpected behavior, e.g. if both are reordering. Make sure that there is only one person working on the design of a page. Consider Creating a Minimal Test Case: If you can consistently reproduce the issue on a simpler page with just a few rich text blocks and vertical spacers, please provide me with the steps to reproduce it. This will greatly help me in identifying the root cause. Also can you please share the markup and CSS code for the vertical-spacer block and any CSS/JS that is loaded on that page.

You can put it in the CSS code field on the module settings like you did or load it inside a CSS file, both is fine. See this example and comments for clarification: /* this overwrites the default for all items */ .pg .pg-item { grid-row-start: auto; } /* this is only affecting new items, e.g. size can still be changed later by resizing items, if you want to set a default size it's better to use this class */ .pg .pg-item-added { grid-column-end: span 3; /* let new grid items span 3 columns */ grid-row-start: auto; /* you can also change the placement here */ }

You can force this globally by adding custom CSS. See the docs here.

Upgrades don't mess with data. The data model has not changed for two years and there have been no breaking changes since then. If this would change in the future it would be a major version change like 3.0. that indicates this. Still good to make a database backup just in case. The easiest way to update is going to the PAGEGRID module settings (Setup > PAGEGRID), open the module info und click on "Check for updates". Same can be done with the PageGridBlocks module. But you can also replace the files like you sad.

@joe_g I just pushed an update that should make the scrolling perform much better. Can you try the latest version and report back if it fixes the issue for you.

@elabx just to make sure. You are not talking about a PAGEGRID site here right?

Hi @joe_g you can send me PM with your link and I will have a look. Please make sure that you are running the latest version, because I made some performance improvements a while ago. I have sites that have more than 150 items and they run fine. But it's true that the performance can take a hit (in the backend) when you have lot's of items on a page. It also depends on the kind of items, e.g. having lots of autoplaying videos or sliders is not good for performance. I also found out that the chrome browser has the best performance and of cause it depends on the computer you are using. Good performance is very important to me and I will continue to improve PAGEGRID as much as possible, so it's always helpful to see how it works in different contexts..

@CeMcc Sorry for the trouble and thanks for reporting it. This is not something that happend to me before with any PAGEGRID site, it could be something with the server or with your setup, but it's hard to know. Can you send me a DM with the email that you used for your cloud account? Like this I can check the logs and maybe find the cause of it.

@CeMcc Thanks for using PAGEGRID. Like @elabx sad this could be an issue with your server. But it's a bit strange that it's only happening on the homepage. If I understand correctly this is only happening in the backend and not in the frontend? Are there any redirects happening in the home template? Are you using markup regions with the option to auto append the main.php file? Are there any custom blocks that are only on the homepage? If possible can you share the code you have in your home template?

Hey everyone! Finally I have time to post a detailed developer walkthrough for PAGEGRID. I have the feeling that many people don't know how flexible PAGEGRID actually is as a developer tool. I think this is mainly due to the fact that most videos are showing the no-code features of PAGEGRID. But since these features are completely optional and PAGEGRID has a lot more to offer, I've put together a video walkthrough to show you exactly what I mean. My hope is that it'll give you a clearer picture of how PAGEGRID can fit into your projects and help you decide if it's the right tool for you. Please take a look at the video below! I think you'll be surprised at what PAGEGRID can do. PAGEGRID's core concepts (video summary): Your markup: Unlike many other site builders PAGEGRID gives you complete control over the markup and structure of your frontend. You can use PAGEGRID to build specific sections or parts of your custom coded website or you can use it as a full-blown site Builder that can work without any coding. Everything is a page: PAGEGRID items are ProcessWire pages that are defined through native ProcessWire templates and fields. Control what clients can edit: PAGEGRID offers an intuitive editor experience that's easy to learn for clients. Editing and design features can be controlled through ProcessWire’s native roles and permission system. Your CSS: You can use your code editor to write CSS or you can bring your own CSS framework. PAGEGRID makes no assumptions about your CSS code. And it’s not just for Grids, display properties like Flexbox, Block or Inline-Block are also supported. Nesting: A powerful feature of PAGEGRID is nesting and while this feature is completely optional it's quite useful for a lot of cases. You can define a block as a container and can define what kind of templates are accepted for the children. This can be used for layout purposes or to group items together, another example might be a slider or gallery block that the user can add items to or basically any repeatable content that you might want to put inside a block. Developer walkthrough: Developer Documentation: https://page-grid.com/docs/developer/ How to create a custom block: Documentation for creating blocks: https://page-grid.com/docs/developer/blocks/ Try PAGEGRID for free PAGEGRID is not free. However, you can try PAGEGRID on your local machine or on a test server as long as you need to make sure it is the right tool for your next project. … and when you’re convinced, buy your license. Installation PAGEGRID (FieldtypePageGrid) is listed in the modules directory, you can install it like any other module. See the install guide for more information. Recent Updates (2025) Group Blocks Now Linkable (april) Performance improvements (markup cache integration) (march) Quick add feature (february) Symbols and Patterns (january)

The hidden field that saves the page id is called "pg_group_link_page" (int), which is present on your screenshot. So it should work as expected without any additional setup. The autocomplete feature is added with a hook from the group module. What happens when you leave the field empty and just click and focus the field? It should suggest all the pages that are viewable and published (Make sure you have created some pages). When you start typing a letter. E.g. If you have a page with the title "Test" and you type "Te" the page should be suggested. If this is not working maybe try a fresh install with the latest FieldtypePageGrid and PageGridBlocks modules and see if it works there. It's working for me (tested in Chrome Browser) so maybe it's something wrong with your setup.