Uploaded site does not match live edit view or page preview

General Questions
1

Using tailwind to further develop my site. I have a simple site up, and want to improve it by using grids and flex to get larger screens to put text and photos side-by-side. The code I’ve written in pinegrow works great on its live visualization and when I hit the page preview button, but when I upload to the site, none of that coding seems to be applied. Beating my head against the wall.

2

Hi @TLCBoudoir
The first thing that comes to mind is a purge issue Tailwind might be stripping out the classes when building for production. It could also be a caching problem, a missing or incorrectly linked CSS file, JIT mode behaving differently on your server, or even dynamic class generation that Tailwind isn’t detecting, hard to figure it out without a link. I’d start by checking the purge settings first!
The easiest way to check if it’s a purge issue is to temporarily disable it in your tailwind.config.js file. Just set:

module.exports = {

purge: false,

};

Then rebuild your CSS and upload it again. If everything starts working as expected, it means Tailwind was removing the classes because it didn’t detect them properly. From there, you’d need to make sure all your files are correctly listed in the content section of your config.

5

When logged in to your website’s server via FileZilla etc., compare the last modified dates of files (e.g. css files) in the more obscure folders like bootstrap or bootstrap theme, because if they have changed (been updated) on your computer to achieve your new look, you will need to update them on the web server.

6

Blep, Thanks a million for your answer. I continue to struggle with this but your answer went right over my head. Still, I’m trying to work through it, but I can’t even find a tailwind.config.js file. I presume that is the name of the file? And it should be in the directory of my website? But I don’t find it. Any ideas?

7

Hi,
If the tailwind.config.js file is not in the directory of your website, it likely means it hasn’t been created. This file is usually generated during a manual installation of Tailwind CSS using Node.js. Without it, the issue might be related to another configuration or setup problem. Unfortunately, I don’t have any other ideas; I was thinking of a manual installation as a potential solution. Sorry.

8

Thanks. Appreciate the help.

1 Like
9

Thanks. Tried this, but it’s not the problem. Problem seems to be that I don’t have a tailwind.config.js file. Working on that now. In any case, just wanted to let you know I appreciated your help.

1 Like