I am developing a new theme using Underscores. I am starting the process of migrating in the code from the already built site in html/css. I built it using .scss files and am not sure where to copy in my main styles. I see there is a Sass directory already in underscores, but do I then still need to enque the .scss file. Sorry, I'm obviously a bit confused how to handle sass and wordpress....any help is appreciated. Thanks

I'm building a etsy style site using WooCommerce and WC Vendors with the JointsWP framework (Foundation). On my front-page all the custom Sass is rendering fine. On the shop page it is not displaying. I'm adding the custom coding on content-product.php. It appears the custom css is being overridden by woocommerce, but I cannot figure out how. Any insight is appreciated.

I am using Undescores theme and it comes with the following default SASS folder structure I am thinking to implement SMACSS approach to handle CSS. Since SMACSS uses the following categories - Base, Layout, Modules, State, Theme, would changing Underscores default SASS folder structure into SMACSS one affect theme CSS in any negative way? I was not able to find any tutorial or guide specifically about implementation of the above with Undescores theme.

When building websites I use scss to write my stylesheet and gulp to put it together into style.css I know there is a way to dynamically populate the values in css using style.php instead.Is there a way to dynamically populate my stylesheet with user choices (let's say user can chose background of the section, text color etc) and pass these values to my stylesheet to avoid make my php template files messy with inline styles (which for now is my …

Forgive me, I'm very much a beginner. I'm looking into custom theme development and creating a theme options page. Using the options page, I want to set a primary color that will be used across all buttons, featured sections ect. To do this, I have created a color picker using acf in theme options. Can I use this color as a variable in SASS or do I need to call the color in PHP and display the scc internally?

I built a plugin that registers a Gutenberg block that prints a simple Mailchimp form. The plugin works with no issues. But, if I activate Jetpack and try to edit any page or post, I get a blank screen and multiple Uncaught TypeError: r is not a function console errors such as this one with little variations: editor.js?ver=9.1:6 Uncaught TypeError: r is not a function (https://domain.com/wp-content/plugins/jetpack/_inc/blocks/editor.js?ver=9.1) at editor.js?ver=9.1:6 at Array.forEach (<anonymous>) at e.exports (editor.js?ver=9.1:6) at f (editor.js?ver=9.1:6) at Module.<anonymous> (editor.js?ver=9.1:18) …

I am new to WordPress and webdev in general so my skills are moderate. I am using a plugin called WP Smart Preloader to build my sites preloader. It allows for the use of custom HTML and CSS. The HTML part of my preloader works but the styling does not show. My custom preloader is using SCSS which I think is causing the problem. Is there any way to allow the use of SCSS in this plugin? Here is my …

It's my understanding that Wordpress now processes SASS files but for some reason mine don't work. I'm trying to call it using wp_enqueue_style directly in header.php via the head tag: <?php wp_enqueue_style('stylesheet', get_template_directory_uri() . '/style.css', $ver = false, $media = 'screen') ?> Instead, the file gets called as a normal CSS doc. I attempted to rename style.css to style.scss but then the file doesn't load at all, so I guess the sass pre-processor just isn't firing.

i'm running a number of WP sites on my localhost WAMP on w8. I started to work on a new site, using Sass and Zurb Foundation using this template: http://jointswp.com/. the problem: During my work, suddenly every time I'm querying from the index page, the apache server takes up to 70% from my cpu and the page doesn't load. It happens only on this site, only on this specipic page. This is the code from the index.php: <?php get_header(); ?> …

I work in WordPress development and I've always been told by more seasoned WP devs to compile my theme SCSS into a separate style.css file, typically into a sub-directory like assets/css/style.css. Today however I read an interesting article on SitePoint where they talk about compiling their SCSS directly into the style.css file in the theme root directory (ensuring cssnano preserves the opening block comment meta), removing the need to enqueue a separate CSS file. Additionally, on the WordPress Codex page …

Trying my hand on building a theme with sass, having a bit of a problem with figuring out how to use my self hosted font in the project. This is probably dirt simple, and as usual I'm overcomplicating things in my mind. When using google fonts i enqueue them from functions.php and reference the enqueued font in my stylesheets, but with a self hosted font the suggestion i find is that i should import them through @import into my stylesheet. …

We use SASS when building custom themes, and sometimes clients need a quick change made which is easier to do on the server rather than locally and pushing new changes. To that end, we've installed SASS on our server to watch for file changes. The problem is, if we use the WordPress Appearance Editor to edit SASS files, it defaults to tabs instead of spaces and we use spaces in the office. So SASS compiler (transpiler?) throws an error. Is …

My current environment involving: Gulp (task automation) Sass Bitbucket (for version control) But for deployment, I always manually override the files through FTP. And re-import the database. The process is somehow not effective for me. Can anyone please share their continuous deployment that is more effective than mine? Thank you.

I am createing the footer.php for my costum theme. The whole footer is full with/356. In the middle of this container I another container which is 960/252. Inside I have some components(logo, social icons,navigation,copyright). I assume they also should be in separate containers. On a mobile this all should be responsive. Since I am doing my first steps with Bootstrap, I tried to add my custom style. I am changing the style, but than it is not responsive. COuld you …

I'm using SASS & Gulp for my development. Though I can’t properly setup workspace in Google Chrome. I add project folder (should be theme folder, right?) but what should I map to what to edit SASS directly? Gulp Task for styles is: gulp.task('styles', function () { gulp.src(styleSRC) .pipe(sourcemaps.init()) .pipe(sassPartialsImported('assets/css/')) .pipe(sass({ errLogToConsole: true, })) .on('error', console.error.bind(console)) .pipe(sourcemaps.write({includeContent: false})) .pipe(sourcemaps.init({loadMaps: true})) .pipe(autoprefixer(AUTOPREFIXER_BROWSERS)) .pipe(sourcemaps.write(styleDestination)) .pipe(gulp.dest(styleDestination)) .pipe(browserSync.stream()) // Reloads style.css if that is enqueued. .pipe(rename({suffix: '.min'})) .pipe(minifycss({ maxLineLen: 10 })) .pipe(gulp.dest(styleDestination)) .pipe(filter('**/*.css')) // Filtering …

Trying my hand on building a theme with sass, having a bit of a problem with figuring out how to use my self hosted font in the project. This is probably dirt simple, and as usual I'm overcomplicating things in my mind. When using google fonts i enqueue them from functions.php and reference the enqueued font in my stylesheets, but with a self hosted font the suggestion i find is that i should import them through @import into my stylesheet. …

I'm sure this is a question with a simple answer. I am working on a Storefront child theme. Storefront's stylesheet has been compiled using the Susy grid system - and I was hoping to inherit mixins etc. based on the parent's definitions, but all the Sass partials are present in the parent theme's Assets folder except for Susy (and Bourbon, which I'd like to use too). Do I need to re-import/re-declare these libraries if I want to use them?

My question is - what are other people's processes in most efficiently developing WordPress themes that utilize SASS and what tools are you using? I also develop from multiple locations/machines (both Windows/OSX) so I would like to have my dev environment stored centrally. A bit about my requirements - I work for a web development business and would like to start developing my own WP themes with SASS but I can't find a clear solution on what tools I should …

Every so often I get a request like this: "Build a site using WordPress as the CMS [easy...]. Oh and we'll have a standard looking blog thrown in. No need to worry about styling, the default look will do" Styling the site is easy - custom HTML and SASS written. The problem is the blog. Save for starter themes like Bones, Sage & _s (which are unstyled), I've yet to find any pre-styled themes that have the blog styling as …

I am trying to build a child theme that uses SCSS. However, every time I make changes and recompile my stylesheet, it gets overridden by the parent stylesheet. This is because, in the head of my site, the parent styles are loading after the child styles. I cannot for the life of me figure out how to get the child styles to load last. I've looked at similar questions here and elsewhere and I cannot get it to work. This …