This week's version of ProcessWire on the dev branch includes some useful updates to the included AdminThemeUikit module. It also adds a new config setting for disabling HTTPS requirements in dev/staging environments, as well as some other updates. This post covers most of what's new this week.
This week the following was added to AdminThemeUikit (in no specific order):
- New styling for
- Ability to adjust input sizes globally or per-field (uk-form-small and uk-form-large).
- Ability to specify input width per-field (for cases were you might not want full-width).
- Ability to minimize the styling of input elements per-field.
- New option to use percentage-based widths globally, rather than Uikit uk-width based widths.
- New live preview of column width (when AdminThemeUikit fieldset is open).
- Improved AdminThemeUikit module configuration options.
- Other code-level improvements to our AdminTheme base class and AdminThemeUIkit.
Much of the above involves customization of input and select styling, and supporting additional options available in Uikit, such as input sizes, widths, and appearance. Now you can take advantage of more of these options native to Uikit 3. Since these options are specific to the Uikit framework, they aren't available in the other admin themes at present.
The size of input/select/textarea elements can be specified globally in the AdminThemeUikit module configuration. Use this option if you want to affect the appearance of ALL input/select/textarea elements used through the admin. (Though I would probably avoid the "large" option globally). These settings, among others, can also be specified per-field when editing any field.
If you are already using AdminThemeUikit, then you may have also seen the "Admin theme settings (Uikit)" fieldset that appears on the "Input" tab when editing a field. This is where you can manipulate the appearance that a field has in the page editor. These settings can be applied for the field, wherever it appears; or they can be applied for a field within the context of any template. Below is a short video that demonstrates these field customizations (including both existing and newly added ones):
If you want to specify input sizes globally, this screenshot shows this new configuration option in the AdminThemeUikit module settings (in the "Form + input" fieldset):
In the AdminThemeUikit module settings, you can also now specify whether it should use Uikit grid/width classes (up to 6 columns), or use percentage-based column widths. We added this because a few people were having difficulty with the Uikit width-class columns, when using more than 6 columns, or when using unusual column combinations. Using percentage-based widths seems to offer more flexibility in that area. This setting can be found in the AdminThemeUikit module setting under the "Layout + interface" fieldset:
New noHTTPS configuration setting
Have you ever migrated a production site using HTTPS to your development/staging environment, only to find out that you can't login to the admin (or access some other part of the site) because it requires HTTPS? This has become kind of a common scenario.
ProcessWire lets you specify that certain pages are only accessible via HTTPS, with a template setting (Setup > Templates > some-template > URLs > Scheme/protocol > HTTPS only). When that setting is active, if a page is accessed without HTTPS, ProcessWire will redirect to the same URL but with HTTPS as the scheme.
If you happen to copy the site anywhere else that doesn't have HTTPS (like a local dev environment) then you are essentially locked out of those pages, since they require HTTPS. And it can be rather difficult to identify that as the issue, because most web browsers really provide no indication that it's a scheme issue. Chrome for instance just reports that the site is offline, making you think there is some other error going on.
Then, once you discover that it is a scheme error, how do you fix it so that you can use the site? There is no easy way. You have to either use the API to modify the template setting, or you have to edit the template settings directly in the database (via PhpMyAdmin or the like). That's kind of a pain, and most are unlikely to even know how to find and fix that.
Given the above, this week I added a new $config setting that lets you disable all HTTPS requirements that may be present in a site:
$config->noHTTPS = true;
When specified in your /site/config.php file, ProcessWire will ignore any HTTPS requirements and run everything on HTTP. Now obviously this isn't something you would want to enable on a production server where you already have HTTPS. But for your development and/or staging servers that probably don't have SSL certificates, this option is ideal. But lets say that you are sharing the same config.php file between your dev and production servers, and you don't want to have to remember to adjust that $config setting. Rather than specifying boolean true, you can specify a hostname (string) or hostnames (array) where HTTPS requirements should be ignored:
// ignore HTTPS for this hostname only: $config->noHTTPS = 'dev.processwire.com'; // ignore HTTPS for these hostnames: $config->noHTTPS = [ 'dev.processwire.com', 'stage.processwire.com', 'localhost:8888', ];
Hope that you all have a great weekend and enjoy reading the ProcessWire Weekly. If you haven't visited our sites directory recently, be sure to stop by and add your sites, or check out the new additions (there are several this week).
Your e-mail is kept confidential and not included with your comment. Website is optional.