WP Designer helps you to customize your WordPress site and retain your customizations regardless of the theme you use. Now SASSified!
WP Designer allows you to add extra functionality to your site in a standard compliant way using customization best-practices. It allows you to keep the site functionality outside the theme so that it is not dependent on the theme. This comes in handy in various scenarios like when you want to create Custom Post Types, Custom Taxonomies etc. This also allows you to have one single place where you keep all your edits.
WP Designer also gives you a development friendly environment. It provides you options to conveniently disable your customizations when you want to troubleshoot.
It supports SCSS, which means you can now quickly, easily and more flexibly author the styles for your website. Place all your customizations in style.scss and WP Designer will automatically compile it into CSS for your website. Using SASS can help you save a lot of time customizing the site design. A comprehensive guide to using SCSS can be found here: http://sass-lang.com/guide
Place all your php functions in functions.php and extra styles in style.scss.
Log in to your WordPress dashboard, navigate to the Plugins menu and click Add New. In the search field type WP Designer and click Search Plugins. Once you’ve found the plugin you can install it by simply clicking “Install Now”.
Or you can follow the steps given below:
wp-designer
folder to the /wp-content/plugins/
directory.wp-designer
folder.On activation, WP Designer automatically creates a wp-designer folder in the uploads directory which includes all the necessary files and folders required for designing the site. You can start by editing the functions.php for adding any custom functionality. If you need CSS customizations you can use the style.scss file SCSS/CSS customizations. The inbuilt compiler will automatically handle the SCSS to CSS generation for the front-end.
You just need to place all your design customizations in the style.scss file located in the wp-designer folder in the uploads directory and it will be automatically compiled to autogenerated.css and your customizations would reflect on the site front-end.
Rest assured, your existing customizations stay in the same style.css file and you can continue to use it to customize your design. With the support of SASS, WP Designer will create an additional style.scss file so that you can go ahead and SASSify your customization. The compile routine is automatically managed by the plugin so that your customizations appear on the front-end.
There are three ways to do this.
If you have made any specific customizations using WordPress in-built Customizer or your child theme, they may not work due to CSS priority or specificity. For instance, if you have set the background-color
for the site using the WordPress customizer, the plugin’s style.css may not be able to override the same CSS rule.