0

I am having trouble with deployment of twitter bootstrap on my heroku client. My html code is not showing like it should (alignment, special table layouts, etc)

All is working locally, but i assume it has to do with the static files that don't get transferred correctly.

This is the static file structure, but have a look how it looks like when i open the "source chrome console" on my live heroku verson.

View of how the folder structure should be

enter image description here

Folder structure of deployed code on heroku

enter image description here

It looks like some folders are "stitched" one to another. what could be my issue? should i avoid "-" and "_" in my file names?

thanks for the help.

based on extra questions, I added more info on my settings.py file. I followed a tutorial to get all the stuff right. Also whitenoise was installed, added to wsgi.py.

wsgi.py

"""
WSGI config for xforward project.

It exposes the WSGI callable as a module-level variable named ``application``.

For more information on this file, see
https://docs.djangoproject.com/en/1.10/howto/deployment/wsgi/
"""

import os
from django.core.wsgi import get_wsgi_application
from whitenoise.django import DjangoWhiteNoise

os.environ.setdefault("DJANGO_SETTINGS_MODULE", "xforward.settings")

from django.core.wsgi import get_wsgi_application

application = get_wsgi_application()
application = DjangoWhiteNoise(application)

settings.py

--

"""
Django settings for xforward project on Heroku. For more info, see:
https://github.com/heroku/heroku-django-template

For more information on this file, see
https://docs.djangoproject.com/en/1.10/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/1.10/ref/settings/
"""

import os
import dj_database_url

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/1.10/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = "{{ secret_key }}"

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.admindocs', ### onbekend of deze nodig is
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    # Disable Django's own staticfiles handling in favour of WhiteNoise, for
    # greater consistency between gunicorn and `./manage.py runserver`. See:
    # http://whitenoise.evans.io/en/stable/django.html#using-whitenoise-in-development
    'whitenoise.runserver_nostatic',
    'django.contrib.staticfiles',
    'frontendapp',
]

LOGIN_REDIRECT_URL = 'forwardthis'

EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'whitenoise.middleware.WhiteNoiseMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'xforward.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
            'debug': DEBUG,
        },
    },
]

WSGI_APPLICATION = 'xforward.wsgi.application'


# Database
# https://docs.djangoproject.com/en/1.10/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql_psycopg2',
        'NAME': os.environ.get('postgresname'),
        'USER': os.environ.get('postgresuser'),
        'PASSWORD': os.environ.get('postgrespassword'),
        'HOST': os.environ.get('postgreshost'),
        'PORT': os.environ.get('postgresport'),
    }
}

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]

# Internationalization
# https://docs.djangoproject.com/en/1.10/topics/i18n/

LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_I18N = True
USE_L10N = True
USE_TZ = True

# Update database configuration with $DATABASE_URL.
db_from_env = dj_database_url.config(conn_max_age=500)
DATABASES['default'].update(db_from_env)

# Honor the 'X-Forwarded-Proto' header for request.is_secure()
SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO', 'https')

# Allow all host headers
ALLOWED_HOSTS = ['*']

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/

STATIC_ROOT = os.path.join(PROJECT_ROOT, 'staticfiles')
STATIC_URL = '/static/'

# Extra places for collectstatic to find static files.
STATICFILES_DIRS = [
    os.path.join(PROJECT_ROOT, 'static'),
]

# Simplified static file serving.
# https://warehouse.python.org/project/whitenoise/
STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'

--

8
  • so this is not the first post about static files on heroku as you might know. Beside of all the hundreds of questions regarding this topic there are also documentations. You should follow one of them. Where is your settings.py please post it. Django Whitenoise is installed? you run collectstatic and configured urls? You changed the static_url and all that is properly configured with git? No? Do so! Commented Jul 19, 2017 at 14:43
  • Hi hansTheFranz, thank you for your quick reply. I followed some tutorials, installed whitenoise and configured the settings.py (added this and wsgi.py in the question - sorry for not mentioning this, beginner talking). I ran collectstatic, also on the heroku end. I don't know what you mean by " configured urls? You changed the static_url and all that is properly configured with git? No? Do so! "; thanks for helping out! Commented Jul 19, 2017 at 18:36
  • that was my post when I had problems to run my app on heroku: stackoverflow.com/questions/44835979/… . Take it as a checklist all these settings should be in your app as well, but I see in your settings.py you have most of that. Configured urls means you need a url which points to your static files. You already changed static_url so thats good but your STATIC_ROOT is wrong. Heroku will not find anything! it needs to be just "static". All your files (including the static files in the right format) need to be uploaded with git. Commented Jul 19, 2017 at 18:46
  • what message do you get when you run collectstatic? Also initialize logging for your Project so you can go to Heroku logs and check what is wrong. Commented Jul 19, 2017 at 18:48
  • wait. You have debug = true and run that in production? Its not save at all! You can get hacked quite easily, don't do that later. But what is super strange is that your static files don't get loaded when you have debug= true because Django would take care of that also on heroku. Please post how you reference a file in template. <link rel="stylesheet" href="{% static 'css/bootstrap.min.css'%}" type="text/css"/> like this? Commented Jul 19, 2017 at 18:55

2 Answers 2

1

After having a thorough discussion with hansTheFranz, it became clear that the issues had to do with missing files.

A default gitnore used in my sourcetree application that i used for syncing with github, prevented several static folders to upload to my git. removing these folders from this gitnore file did the trick.

thanks for the help guys!

Sign up to request clarification or add additional context in comments.

1 Comment

glad I could help a bit. I think you learnt a lot on the way, that is important. We all go though that when we deploy for the first time, but in the end you learnt so much and know the issues so I hope I see you soon help somebody who has the same problems :)
0

Go to heroku static assets documentation for Django:

Heroku Documentation: Django and Static Assets

Everything is illustrated there in detail, make changes in settings.py and install whitenoise and it will work.

2 Comments

followed this guide completely. but no successful result.
@radzia2 Check that your STATIC_URL is correct as css, js and all these files are expected in static, and you have one more layer of directory- frontagenewagetheme

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.