Download the PHP package adigital/critical-css without Composer
On this page you can find all versions of the php package adigital/critical-css. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download adigital/critical-css
More information about adigital/critical-css
Files in adigital/critical-css
Package critical-css
Short Description Generate critical css without the need for ssh access
License MIT
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package critical-css
Critical CSS plugin for Craft CMS 3.x
Generates Critical CSS without the need for SSH access.
Requirements
This plugin requires Craft CMS 3.0.0-beta.23 or later.
Installation
To install the plugin, follow these instructions.
-
Open your terminal and go to your Craft project:
cd /path/to/project -
Then tell Composer to load the plugin:
composer require adigital/critical-css - In the Control Panel, go to Settings → Plugins and click the “Install” button for Critical CSS.
Critical CSS Overview
This plugin is designed for Craft 3 users who don't have SSH access, or those who can't install Gulp onto their server. We would still recommend using Gulp to generate Critical CSS if you can but this tool has been made so that nobody gets left out of the party.
Configuring Critical CSS
Use the plugin settings page to enter your urls and templates.
Using Critical CSS
Go to the CP section and generate your Critical CSS. You will then need to add the following to your templates:
This goes into the template
Please make you that you exchange folder/template for your template path used in the plugin settings. e.g. blog/entry would be: blog/entry_critical.min.css
This goes into your layout
This code sits within the head before your stylesheets are called. You can then also add {% if critical is not empty %}rel="preload" as="style"{% else %}rel="stylesheet"{% endif %} to your stylesheet tags and within your JS you will need to do the following:
Please note: this is just one example of how you can get critical css up and running. There are other ways of implementing this also which can be found in various blog posts. We are just providing you with the generation of the file, how you implement it is completely up to you!
Critical CSS Roadmap
Some things to do, and ideas for potential features:
- Fix generate all functionality and uncomment the button for this.
Brought to you by A Digital
