Hi,
I found Pinegrow should print in screen a QR code as the preview in browser option, in order to do some quick test in mobile phone and tables.
It is very tedious to share, copy and paste long url to check on tables and phones.
1 Like
Do you mean the preview URL for a WP page, or… Can you give some more details?
Now, when Preview in browser buttom is clicked, browser opens with a long url.
Pinegrow could add a second option, showing a QR code that can be read with a phone camera wich would open the mobile browser.
Hmmm, I’m not sure how many people would find this feature useful. I guess you could serve up localhost using NGROK or squid, theoretically. I have used NGROK for sites running on MAMP, but haven’t actually tried it with Pinegrow. Doable, but I’m not sure how many people actually have their machine set-up to do this. The other thing is that each set-up might have a different address prepended to the file name depending on how they have their environment set-up.
How is your machine set-up? In my free time, I might try seeing how difficult this is to do.
I’d also like to know how many other people are interested in this feature - maybe more people have their development environment set-up to allow this than I think - or maybe I’m missing some Pinegow feature that I should be using!!!
Thanks!
I will try to make it clearer.
The preview in the browser works fine for me (it could allow me to choose another browser installed on my computer along with the default), I can copy this local url http://192.xxx:4400/qsdfasdfasdf/asdfasdfa/asdfasdf/asdf.html and paste in any browser on my LAN to verify how it behaves on Android, iOS …
It would be great to make fewer steps. A QR code looks good if I just shoot the screen and open my browser.
Yes, I get what you meant. I guess this feature would have to have a setting for what the machine IP and port was because this would be different on each machine. Not sure what OS you are running or how you got this set up.
It should not be difficult.
Simply translate the same url from Preview in browser to QR. That is all.
The QR reader of the tablet and the phone will do the rest of the work.
Yeah, mostly true. The end user would have to know to change the internal webserver hostname to the same as the computer’s IP address. At least I have to on a mac - not sure about Windows or Linux. Otherwise it defaults to localhost which isn’t accessible even on the same LAN. Having said that, I guess you could get a pop-up reminding the user to do this before generating the QR code.
Here is a first stab. I haven’t done extensive error/edge testing. You need to have your internal webserver hostname set to your computer IP address or the QRCode won’t be valid. Once you activate the plugin there will be a new menu item under the “Page” menu called “Generate QRCode preview”. It will generate a pop-up with the QRCode. Once you follow the link you will have to click the confirmation allowing the server to accept outside links.
Again, this is a first stab. I expect some errors might occur in real use and I will try to fix them if you let me know what they are. I’m a little swamped working on 3 other projects right now - an update to my UIKit plugin, a secret project 
, and a react Gutenberg plugin, but this kept poking at my brain. If anyone can get this tutorial to work it would be a great help and I can make a simple PG plugin for you!(https://bigbite.net/insights/creating-advanced-block-gutenberg/)
Anyway, here is the link. https://plugins.springhilldesign.net/qrcode-for-pinegrow/
3 Likes
You got it!! It works great. Thank you
Sweet jesus, your on fire @RobM…
If I send you the spec, could you knock me up a girlfriend?
Er well,second thoughts,don’t knock her up,might not be as much fun for me in the long run.
This is a faux passion, caused by us using the above and the following, Interchageably around these here parts.
1 Like
Hi @RobM , I saw some of your Youtube Videos and I wonder if you would like to help mentor me on a very simple, yet very effective Pinegrow Plugin I wish to make:
RevolverDS: Lock, Load & Ship your generative DS
It’s not a framework with language, It’s not Tailwind with choices made for you, It’s a tool to create generative design utilities JIT by layering and referencing “environment variables”.
It works by having theming associated to certain layers, all are “just” css-variables. The UI is straight-forward; swap --X with --Y since all “grounds” are grouped, connected & layered. Just like Tailwind does, it just adds a class in the mark-up.
If you have the time to help me out to bootstrap a basic “UI-template”, or could point me to any resources that would be great. But it’s quite a step for me to take, I’m a design founder that does code, but I’m not a developer’s replacement.
I just want to make an awesome dutch design system; anti-fragile & minimal so people can color their design and artwork by layering just like photoshop. All that you do is actually refer variables to each other in either the classes (dropdown), or overwriting them inline (toggle).
Hi @BonoBoos,
Of course! I would be delighted to help.
Just so you are aware of existing documentation, here is the documentation I wrote up on GitHub: GitHub - Pinegrow/PinegrowDevelopersDocumentation: Private site for creation of Pinegrow Web Editor API documentation
Here is a plugin boilerplate written by MatjaĹľ: GitHub - Pinegrow/PinegrowPluginQuickStartTemplate: Boilerplate code for a Pinegrow Web Editor plugin. Use it to create your custom Pinegrow plugin.
If we want to proceed in the Forum we should likely make a new topic. I would prefer to have this be public, if possible, to show others what is possible. Also, to help exchange code, we should make a GitHub repo.
Cheers,
Bob
Absolutely! I will make some effort into making something out of this opportunity in the weekend.
I will also make a public Figma file for the designs so this forum doesn’t get lost in translation.
Thanks @RobM , I’m looking forward to shipping my first developer tool as a design founder!
Also, if you’re into generative design systems; RevolverDS is a repository I’m currently creating to feed my own need for totally unopinionated CSS theming & styling, maximum control over generation, then you “lock, load & ship” your choices with the squeeze of a trigger: GitHub - alolalo/RevolverDS: Lock, Load & Ship your generative DS
I’m much more making things semantically & systematically accessible for people these days, minimal & anti-fragile with a true connection to the “roots of things”
1 Like