Simplify Your CSS/SCSS Workflow with Script Organizer’s New Import Feature

Marko Krstić

May 16, 2023 – Read time: 3 minutes

In the world of web development, managing CSS and SCSS files efficiently is crucial for maintaining organized and streamlined code. With the latest update to Script Organizer, we introduce an exciting new feature that allows you to easily import your CSS/SCSS partials into our plugin. This feature comes in handy, especially when working with older projects or custom functionality plugins. By leveraging Script Organizer’s existing capabilities to compile SCSS, you can simplify your workflow and eliminate the need for manual editing and uploading via FTP. Let’s explore how this feature works and the benefits it offers.

Importing CSS/SCSS Partials

To begin importing your CSS/SCSS partials, navigate to Script Organizer and access the import functionality. Once there, you will find the “Upload Partials” option. Simply select the desired partial files from your local environment and drag them into the designated area. Script Organizer will handle the rest, effortlessly importing your partials into the plugin.

Improved Organization and Compilation

After importing, the partials can be accessed within the “Partials” section of Script Organizer. Each partial will be listed individually, ready for your modifications. For example, if you open the “Layout” partial, you’ll find it exactly as it was in your original project. This seamless transition ensures that the structure and styling of your layout remain intact.

Effortless Customization

To demonstrate the simplicity and power of this feature, let’s create a new block called “Team Header.” By utilizing the SCSS syntax, we can quickly define the desired styles and include the necessary partials from the partials manager. Remember to add at least a comment within the file to ensure proper compilation. Once the file is created, publish it, and witness the magic.

Enhanced Compilation and Order Control

Upon inspecting the generated code, you’ll notice that the imported partials are compiled in the order they were imported. However, if you prefer a different order, you can easily rearrange them within the partials manager. For instance, by moving the “Reset” partial to the top, you ensure that it takes precedence over the other styles.

Seamless Migration and Time Savings

With Script Organizer’s import feature, you can seamlessly transfer your existing projects into the plugin with just a few clicks. No more manual editing, compiling, or uploading via FTP. This streamlined workflow not only saves you valuable time but also reduces the chances of human error during the migration process.