A grab-bag of Craft CMS tips, tweets, and plugins
Hello Craft friends. Welcome to a "classic" CLL issue: a bunch of links that will hopefully interest a Craft developer. I hope you find something to pique your interest.
The top story is about an in-development rich-text field from the Craft team based on Editor.js. The most intriguing part of this news is the discussion that it generated on Discord, which included a hint that in the future, Matrix might be a standalone plugin.
Thank you to the sponsors of this issue.
Webperf monitors your Craft site's performance based on its actual users and their devices. It shows you the results and offers suggestions on improving on the issues it finds.
Freeform is the feature-filled form plugin for Craft CMS that includes ready-to-use templates to get you up and running quickly. Learn about the power of Freeform.
If you have a link to share, head over to the submit a link page. It helps with putting each issue together.
Let's hit the links.
Editor.js to be used in a future Craft CMS rich-text editor plugin from Craft team.
Note: To view the Discord links require a free membership in the Craft Discord group.
In Discord recently, Brandon mentioned that there would be a new field type based on the Editor.js library (linked above), with extensible “tool types”. Later, Brandon said the general direction for the future of Craft is to move features out of core and into separate plugins.
That means we can expect this new rich-text editor fieldtype as well as other Craft features, like Matrix, to be plugins in the future versions of Craft.
Why extract Matrix into a plugin? Brandon said, "Part of the benefit of moving more stuff into plugins is that it frees us to start making more isolated breaking changes in plugin-specific major releases, rather than holding off and having to lump all that stuff into one big major Craft release so major Craft releases would just focus on framework level improvements, which can happen less frequently, and the plugins can get more regular improvements."
Craft CMS 3.4.20 released
As of 3.4.19, the web-based Craft installer now defaults the database server to
127.0.0.1 instead of
3.4.20 removed the random delay for successful login attempts. The randomized delay now only applies to failed login attempts. What going on there? A randomized delay is a deterrent to brute force attacks on the control panel, but it's not needed for successful logins.
London Craft CMS Meetup #8 | Virtual Meetup ⭐️
Ben Croker will be holding a talk on Templating for Performance in Craft. Since the meet up is virtual, you don't have to be in London to join. Sign up and I’ll see you there.
Commerce now has a “Duplicate” action to the Products index page. Edit Order pages now link to the customer’s edit page. See the full changelog for more details.
Webperf: Turnkey Web Performance Auditing
Webperf helps you build & maintain high quality websites through Real User Measurement of your website's performance.
Tools, tips, and fundamentals
Using 'template_from_string' in Twig templates 🧙♂️
Andrew tweeted a tip on using dynamic variables in your rich content using Twig's
We all aspire to fast sites. This Tweet from Ben Croker lays out the numbers on why a CDN is a part of that equation.
Problem with a plugin? There's help.
If you run into an issue with a Craft plugin and need to reach Craft HQ for help, scroll down to the Information area on the plugin's page in the store. You'll find a Report an issue link on every Craft plugin page.
SuperGeekery: Adding Date Validation Logic when Creating an Event in Craft CMS 3
I wrote a quick post on adding date validation and tweaking the AX in Craft CMS 3 when using the built-in Date/Time fields.
Perfecting your technique
Podcast: ProPublica - Cache It!
Mitchell Kimbrough from Solspace talks with Mike Tigas and Frank Sharpe from ProPublica about their Craft CMS powered site, hosted on AWS, and cached on Cloudflare. The podcast cast continues in a second episode.
Placing a Craft CMS application behind AWS CloudFront
Justyna Jurkowska from 8th Light discusses setting up a Craft site on AWS and using CloudFront.
(Editorial gripe: I wish CloudFront and Cloudflare didn’t have such similar names. I expect Cloud Flant to launch soon.)
Craft CMS 3 local development with Lando Docker - EaglePeak Consulting
Alex Aguilar has updated his post, mentioned previously in issue 99, on developing Craft using Lando Docker, which provides an abstraction layer on top of Docker.
I see references to the new
DB_DSN key, which is replacing the older
DB_PORT keys Craft used to use. There's also a video walk-through with chapter stops.
Styling Redactor Output with Retcon (and Tailwind)
In this 5-minute video, Jake Dohm shows how to use the Retcon plugin in Craft to style your Redactor text fields.
Effortlessly build beautiful forms in minutes with Freeform!
Freeform is the most reliable, intuitive and powerful form building plugin for Craft. Everything is at your fingertips in our elegant form builder. It gives you full control to create simple or complex multi-page forms, as well as connect your forms to many popular API integrations. Templating is easy and highly customizable. Our ready-to-go templates and features like built-in AJAX and Conditional Rules Logic will have you ready in minutes! No other form plugin even comes close to comparing! You can trust Freeform (and the team behind it) to deliver the quality and support you expect and deserve.
SS User Import Export
This plugin lets you import new users via CSV and offers a variety of export options.
Sentry Log Target
Sentry Log Target catches exceptions natively with Yii2's log component and sends them to Sentry.
This plugins enables user to utilize Zoom video conferencing to their website. It provides facilities to embed zoom meeting into website.
Money Fieldtype for CraftCMS v3
Money is a custom fieldtype and formatter by Levi Graham from Newism that uses the
Craft DB Extract
This plugin makes a web controller action available to pull the database export.
Craft Elements Panel ⭐️
Adds an elements panel to the debug toolbar.
Check out 👀 this feature:
Warns you if opportunities for eager-loading elements are detected. Displays how many queries were executed (that could be eager-loaded) and how many are duplicates, grouped by field name.
The plugin will probably be discussed during Ben Croker's presentation at the London Meetup mentioned in the news sections.
This plugin provides to switch language easily via Weglot. Weglot translates automatically instead of you.
Use the Image Hotspots fieldtype to add multiple hotspots to images from a Matrix or Super Table in Craft CMS.
Engage website visitors and customers on a social level with social login or sign-up. Extend to social sharing, user profiles, friends lists, activities streams, status updates, and more.
It’s not Craft, but it’s interesting.
devMode.fm // Using Stitches CCS in JS to Improve on Tailwind CSS ⭐️
Christian Alfoni & Fabrice Weinberg join the devMode crew to discuss their brand new Tailwind CSS inspired CSS in JS baby, Stitches.
You may also enjoy this video introduction to Stitches.
A 17-minute video series on Alpine JS
Let's Take a Deep Dive Into the CSS Contain Property
Everything you wanted to know about the
contain property but we’re afraid to ask.
Web Vitals is an initiative by Google to provide unified guidance for quality signals essential to delivering a great user experience on the web.
Using CSS to Control Text Selection
CSS lets you control how text selection behaves and appears on your pages. This can help you improve usability in certain situations and add a little bit of visual flair.
A Complete Guide to CSS Functions
Like any other programming language, CSS has functions. They can be inserted where you’d place a value, or in some cases, accompanying another value declaration.
Free & Open Source SQL editor and database manager for MySQL, Postgres, SQLite, SQL Server, and more. Available for Windows, Mac, and Linux.
The download attribute on an anchor tag
What!?! How did I go this long not knowing this?
This project aims to be a drop-in solution for sites to prefetch links based on what is in the user's viewport.