I am trying out Roots.io start-up theme Sage. I've just installed and configured everything locally and everything seemed to install correctly. However I am having issues with the SASS and JS files loading. I have followed the docs and installed everything correctly but the stylesheets and JS files aren't loading correctly. https://roots.io/sage/docs/.
If I check my source, I see the files are being compiled into one stylesheet and js file under:
/wp-content/themes/themename/dist/styles/main.css
/wp-content/themes/themename/dist/js/main.js
However, these files aren't being picked up when the pages are loaded. These links are leading to 404 pages.
Do I need to install anything else? Am I doing something wrong?
Thanks in advance.
The files under the Assets folder are used instead, and dist folder is used to actually when releasing your product.
Related
I'm using Django 3.1.7 on a MacBook Pro after transferring the Django project off of a Windows 10 machine. However, upon re-setting up the database and superuser and running the command pipenv sync to install all necessary modules, the server does run; but it doesn't serve any of my URLs or the CSS styles for the Admin page. I can reach the admin page at '/admin' but no other page that I've set up will display. All it gives me is my custom 404 page whenever I try to serve a page. Is there any way to fix this? Is something wrong? Where are the Admin CSS files?
python manage.py runserver --insecure
Use the --insecure option to force serving of static files with the staticfiles app even if the DEBUG setting is False.
djangoproject
I think we'd need more information... maybe the files itself.
There could be tons of things that could go wrong. Is your settings.py still pointing to the correct file paths? In views.py, did you make sure you are setting the html files in the same path? Are the html files in the right folder? Are all the Django and module versions the same? There's too much to name.
I have the same problem.
By what you are describing it happens because your file path uses either / or
One machine uses forward slash and the other backwards slash
I dont know to so use a method that work on both
I have been searching all over for information on where django-cms is storing the CSS and SCSS data for my site, which I am working on localhost. When I go to edit the CSS file directly, it has no effect, so I'm wondering what needs to be done to edit those CSS files. Obviously they have been loaded somewhere. How can they be reloaded, or in general what is the best practice for editing the CSS files?
Apparently I had to do this with both the style.scss and style.css files, which seem to have the same css classes. But even after editing both files, I had to refresh the site on my localhost a few times before I could see the changes. Frustrating, but it does work to edit the files directly in the static folder.
#Lawrence DeSouza At first you should mention which plugins and style frameworks you use.
If you are using some sort of a frontend framework like Bootstrap 4 your should compile its css from scss separately. You can do it right on the dev server in a separate directory outside your project dir and cloned from the official repository. Normally you would only need to change variables in "/bootstrap-4.x.y/scss/_variables.scss" file. On the next step you would compile your *.css files with "npm run dist" command and then copy compiled files from "/bootstrap-4.x.y/dist" directory to your "/projectname/appname/static/css" directory. The process is well-documented here. After copying changed files to your "static" folder you should run "python manage.py collectstatic" and refresh the page. If it's not working after refreshing the page in a browser (normally it should work) - restart the server. I am a bit biased towards Bootstrap, but the logic should be the same in your case.
I am using the uploadr plugin for grails 2.4.
Following the documentation I did the following
BuildConfig.groovy
compile "org.grails.plugins:uploadr:1.2.11"
Then in my gsp
<asset:javascript src="uploadr.manifest.js"/>
<asset:stylesheet href="uploadr.manifest.css"/>
Yet it does not display in my gsp.
After some research I realized that my asset piplein folder had only the default application.js and application.css. It did not contain the plugins js or stylesheets?
Is there some way of pointing them towards the assets folder of the plugin?
I then created my own folder in assets called flipcountdown->global_>uploadr and pasted all the files in there but the follwoing still doesnt work.
<asset:javascript src="global/uploadr/uploadr.manifest.js"/>
<asset:stylesheet href="global/uploadr/uploadr.manifest.css"/>
What do I need to do to get this plugin working?
*** This is what I am using for the uplaodr
<uploadr:add name="myUploadrName" path="/my/upload/path" direction="up" maxVisible="8" unsupported="/my/controller/action" rating="true" voting="true" colorPicker="true" maxSize="204800" />
The plugins assets should be pulled in automatically. You don't need to copy them to the project assets. The asset tags resolve to urls such as,
http://localhost:8080/uploadr/assets/uploadr.manifest.css?compile=false
http://localhost:8080/uploadr/assets/uploadr.manifest.js?compile=false
See if you can access the above urls directly.
Furthermore, check your browser dev console and see the network tab for any 404s for any resources. That may give you a clue to any problems with the assets.
So I compiled my SASS into one CSS file using codekit 2 on their own localhost and the website looks perfectly fine.
However when I upload my website onto a webserver (including all my SASS and CSS) it will not show some of my images. Then when I remove the SASS from my server leaving the compiles CSS it looses my fonts as well.
Does anyone know why is this?
Here is the website: http://bubbacue.nathanpatton.co.uk/
And the GitHub Repo for all the files: https://github.com/NathanPatton/Bubbacue
Your web host is generating a bunch of 403 Forbidden and 404 Not Found errors on the assets.
In Chrome, go to View, Developer, JavaScript Console and you'll see a list of the problem files and directories. Here is how to fix it.
I have two different css files... style.css and style_main.css
both are used separately in different layouts for the same application. In development mode everything works fine, but when in production mode, caching happens and both css files are loaded as all.css?xxxxxxx but unfortunately all.css is made from style.css and does not update with the change in layout. how do i prevent this???
When you deploy the code to the production server, you are probably also deploying the all.css file. Have you tried excluding this file from your version control system? When you update style.css etc on your development machine, commit the changes and then redeploy, rails will re-generate all.css if it finds that it isn't already in the public folder.