Pascal CSS Editor (BETA)

Follow the instructions below to install and configure your new product

A. Description
B. major Features
C. Using Pascal

PLUGIN REQUIREMENTS

✓ Self-Hosted WordPress Installation
✓ Divi Theme by Elegant Themes
✓ PHP version 7 or greater
✓ memory_limit 256M
✓ post_max_size 128M
✓ max_execution_time 180
✓ upload_max_filesize 256M
✓ max_input_time 600
✓ max_input_vars 5000
✓ MySQL version 5.6 or greater OR MariaDB version 10.0 or greater.
✓ HTTPS support
✓ Nginx or Apache with mod_rewrite module

Remember: In order for the Pascal Plugin to work, you must have Divi from Elegant Themes. If you do not have it you can purchase it here. Once you have it, please install it on your self-hosted WordPress website.

A. DESCRIPTION

Pascal is a front-end CSS editor built right into the WordPress Customizer. It's in beta right now and improving all the time!

Edit CSS on the front-end of your WordPress website with Pascal: The smart CSS Editor that takes care of media queries and browser-specific CSS for you.

** Visit the Pascal CSS Editor Plugin Page Here **

meetpascal

Pascal is a series of CSS editing panels that make organizing your code quicker and easier. Everything is added to your site in real-time and you can see the changes happening as you make them without refreshing, visiting the back-end or anything that takes you out of your coding groove.

B. FEATURES

Here’s a list of the features that make Pascal the perfect companion for writing CSS. Green is live. Red is coming very soon.

FRONT-END EDITING.

Stay out of FTP or the WordPress backend. Pascal is customizer based, meaning it’s right there on the business end of your site when you need it and hidden when you don’t.

DEVICE PREVIEWS

Preview your CSS on a variety of viewport sizes, including those used by the latest Apple & Samsung devices.

EXPORT YOUR CODE

All of the code you write in Pascal is formatted and ready to go, whenever you want it.

BE RESPONSIVE

Add your CSS and let Pascal take care of making it responsive to desktops, tablets and mobiles.

BROWSER SPECIFIC CSS

Cure headache-inducing cross-browser issues with browser specific CSS. Support for Firefox & Internet Explorer. Edge, Chrome & Safari coming soon.

SET YOUR OWN BREAKPOINTS

Choose the pixel-point where responsive changes happen.

HOVER TO GET IDS AND CLASSES

Hover over the browser preview window to see what classes and IDs you need to target.

pascal devices

See your site on all of your favourite devices! Pascal is one cool Chicken…

EXPORTING YOUR CODE

Exporting CSS written in Pascal is easy. Just head to your new page under Appearances > Export Pascal and take your code wherever you want.

C. HOW TO USE

Install the heypascal.zip as a plugin ( plugins > new > upload new )
Either head to the Theme Customizer and open up Pascal or use the quick-use link in the mobile menu bar.

dropdownmenu

Open up any panel and start writing CSS. It’ll save in real-time and work immediately.

pascal 3

If you need to export your CSS just head to Appearance > Export Pascal.