Pixrael

In BS4 (in BS3 too) you can on/off the inclusion of any component (javascripts or styles) in your project, it's not mandatory to download and use the whole framework http://getbootstrap.com/docs/4.0/getting-started/webpack/ https://getbootstrap.com/docs/3.3/customize/ if you know how to work with SASS you can create your own grid system in your stylesheet using the SASS mixins without include the BS library http://getbootstrap.com/docs/4.0/layout/grid/#sass-mixins

https://modules.processwire.com/modules/process-google-analytics/

You can use this: https://github.com/miguel-perez/smoothState.js Demos: https://rawgit.com/miguel-perez/smoothState.js/master/demos/sidebar/index.html https://rawgit.com/miguel-perez/smoothState.js/master/demos/csstricks/index.html you don't need to do anything complex on your PW website

maybe using hooks and url segments you can throw a 404 if someone visit /admin (trying to guess) but show the login form if they visit /admin/123PIN with a secret PIN for editors..

Check this website, maybe it can help in your ideas https://processwire.com/about/sites/list/ohm-speakers/

you can use https://processwire.com/docs/tutorials/how-to-use-url-segments/ you will get page/a-z instead of page/?sort=az ..using this segments you can search, filter, sort the pages results and update too the "sort box" (select, radio buttons, tabs, any) by this value

.InputfieldHeader { padding: 10px 10px 10px 20px; } .InputfieldStateCollapsed > .InputfieldHeader { padding-bottom: 10px; } remember that the minimum size for an element in a touch device should be 44 pixels, these padding values are the minimum values that you must use in the processwire header to comply with that rule..

try this https://modules.processwire.com/modules/process-data-import/ ..although it's old and still in alpha version, I use it this week in PW 3.0.84 importing products from amazon feeds and it works perfect. Very simple to use, it has a built-in cron job, accepts xml, json and csv and allows easy mappings between the source data and the template fields.. or maybe you can fork the module and customize it for you.. check

..but in case you fork the module, you might want to consider this code editor: https://microsoft.github.io/monaco-editor/index.html https://zengenti.com/en-gb/blog/authors/richard-saunders/from-code-mirror-to-monaco.aspx is the code editor that powers VS Code

for that situations I have used https://icecoder.net/ it installs very easily on the website and works perfect.

if the size in bytes of the images is not a problem, you can resize it with css. It seems to be a situation with the php image library when generate the new image, perhaps use a color space, a gamma correction or a color depth different

https://auth0.com/blog/converting-your-web-app-to-mobile/

I can't disable that in my chrome console because I use it in my own css during development, maybe the pw styles should be compiled without the option of source map files enabled if it's the case that those files are not going to be included in the distribution

yes, all the time.. the installation did not include the source map for less/css files.. It's not a big problem, but the constant notifications bother

Take a look at this, maybe can be adapted to build the form configuration with a graphical UI: https://formbuilder.online/ here a test page for different actions and get the config in different formats (use the Save button): https://kevinchappell.github.io/formBuilder/

https://github.com/apeisa/PaymentStripe https://github.com/apeisa/PaymentPaypal https://github.com/apeisa/PaymentModule https://github.com/apeisa/PaymentInvoice

This was tested and works... _func.php function toc( $heading, $content ) { $heading = str_replace( ',', ' ', $heading ); $heading = explode( ' ', $heading ); foreach ( $heading as $k => $v )$heading[ $k ] = trim( $v ); $heading = implode( '|', $heading ); $anchors = array(); if ( preg_match_all( '{<(' . $heading . ')[^>]*>(.+?)</\1>}i', $content, $matches ) ) { foreach ( $matches[ 1 ] as $key => $tag ) { $text = $matches[ 2 ][ $key ]; $anchor = wire('sanitizer')->pageName($text, true); $anchors[ $anchor ] = $text; $full = $matches[ 0 ][ $key ]; $content = str_replace( $full, "<a name='$anchor' href='#'></a>$full", $content ); } } if ( count( $anchors ) ) { $toc = "<ul class='article-toc'>"; $url= wire('page')->url; foreach ( $anchors as $anchor => $text ) { $toc .= "<li><a href='$url#$anchor'>$text</a></li>"; } $toc .= "</ul>"; return array( $toc, $content ); } else { return null; } } article.php (example template file) <?php $out = toc("h2 h3 h4",$page->body); ?> <div class="page"> <div class="main"> <?=$out[1]?> </div> <div class="sidebar"> <h3>Table of Contents</h3> <?=$out[0]?> </div> </div> the previous published function was updated because we need to use wire() in _func.php

my comment was ironic about avoid 3rd party dependencies

I'm in the web design since 1998, and I remember when the war against inline styles began, you put a little style="margin-bottom:10px" in a unique element in the project and you are a renegade man from the old days, you need to create a new css class for it ... after decades learning to avoid them at all cost.. now in 2017 the new trend that coder influencers propose as good modern practices (because of React, etc) is using it! you get this and is OK.. Whaaat? !! ..hahaha.. the previous was a joke.. but seriously.. the best practice is to be practical, logic and simple always as @BitPoet said

For me, the reality is that when I use "vanilla" scripts, each one coming from different developers with its own code for dom traversal and manipulation, yes they are in plain js without dependencies ... but with a tons of redundant code for the same tasks ... so when I finally managed to finish a complex website with sliders, accordions, calendar, date selectors, drop-down menus, parallax, forms and looong, etc. each has its own code to select nodes, add/remove classes and looong, etc. I have a lot of repetitive code, for what? For a trend? yes it's true jQuery 1x is obsolete and fat due to the support of old browsers, but jQuery 3x is as slim as you need. The reality is that we need a library for common tasks (give it the name you want). For today jQuery allows me to do simple tasks on a regular website without additional efforts (ie a website like processwire.com, not a web application, or a project for Córdoba).. well.. if someone create that library, pleeeease use an API similar to PW/JQUERY.. it's so easy to use and learn for us, the non pro developers!!

So, we should build the next PW admin without uikit framework too? Because we will no longer depend on jQuery but will depend on UIKit or any other library that we need to function properly. Really I don't understand which is the trending goal of eliminating jQuery like a disease?

You can adapt the following Hanna Code example to a function for output anywhere... without dependencies ---------------- Jumplinks Hanna Code This Hanna code is meant to be used in your body copy. It collects all the headline tags in the text and turns them into anchor jump links while outputting a linked table of contents. It will put the table of contents wherever you type the Hanna code. $for = str_replace(',', ' ', $for); $for = explode(' ', $for); foreach($for as $k => $v) $for[$k] = trim($v); $for = implode('|', $for); $anchors = array(); $value = $hanna->value; if(preg_match_all('{<(' . $for . ')[^>]*>(.+?)</\1>}i', $value, $matches)) { foreach($matches[1] as $key => $tag) { $text = $matches[2][$key]; $anchor = $sanitizer->pageName($text, true); $anchors[$anchor] = $text; $full = $matches[0][$key]; $value = str_replace($full, "<a name='$anchor' href='#'></a>$full", $value); } $hanna->value = $value; } if(isset($topic)) { $topic = $topic; } else { $topic = 'Page'; } if(count($anchors)) { echo "<div class='toc'>"; echo "<p>On this $topic:</p>"; echo "<ol class='article-toc'>"; foreach($anchors as $anchor => $text) { echo "<li><a href='$page->url#$anchor'>$text</a></li>"; } echo "</ol>"; echo "</div>"; } else { echo ''; } Usage Examples: [[jumplinks]] Locates all h2 and h3 headlines, turns them into anchors, and generates a table of contents. This is the default behavior with no attributes. [[jumplinks for=h2]] Here we specify a 'for' attribute. It produces the same behavior as above except only anchors h2 headlines. [[jumplinks for="h2 h4"]] Same as above except only anchors h2 and h4 headlines. ---------------- $for is the heading tags that you want to link in the TOC $hanna->value is the string with the html content you want to process and update This script modify the original HTML content to include the new anchors, and create the markup for the TOC. Instead of direct echo the markup, you need to return the output... maybe something like the following code (you need to check if I'm using the PHP best practices because I'm not a coder) function toc( $heading, $content ) { $heading = str_replace( ',', ' ', $heading ); $heading = explode( ' ', $heading ); foreach ( $heading as $k => $v )$heading[ $k ] = trim( $v ); $heading = implode( '|', $heading ); $anchors = array(); if ( preg_match_all( '{<(' . $heading . ')[^>]*>(.+?)</\1>}i', $content, $matches ) ) { foreach ( $matches[ 1 ] as $key => $tag ) { $text = $matches[ 2 ][ $key ]; $anchor = $sanitizer->pageName( $text, true ); $anchors[ $anchor ] = $text; $full = $matches[ 0 ][ $key ]; $content = str_replace( $full, "<a name='$anchor' href='#'></a>$full", $content ); } } if ( count( $anchors ) ) { $toc = "<ul class='article-toc'>"; foreach ( $anchors as $anchor => $text ) { $toc .= "<li><a href='$page->url#$anchor'>$text</a></li>"; } $toc .= "</ul>"; return array( $toc, $content ); } else { return null; } } ..or maybe output only the $anchors array and customize the markup in your template according to your page design

Good point about usability, maybe something like a outlined button could work. I would not like to replace the current link with a dropdown menu because it would be better to preserve the function of the current link and add the new function. The theme is the regular Reno that comes with PW installation, you can access it in the admin profile.

yes, off course you are right about the ids.. I only change the div for the pw-region tags

Don't use div element in the document head, it's incorrect.. instead use this Processwire markup region option <pw-region id="title-region"> <title id="title-region"><?php echo $page->title; ?> | <?php echo $page->template->name; ?> | schildpad | Chrysemys</title> </pw-region> ... <pw-region id="google_map"></pw-region>