发表新帖
发表新帖

How do I include image files in Django templates?

前端 未结
关注
11 1520
时光说笑
时光说笑 2020-11-27 10:35

I\'m new to Django and I\'m trying to learn it through a simple project I\'m developing called \'dubliners\' and an app called \'book\'. The directory structure is like this

相关标签:
11条回答
  • 被撕碎了的回忆
    2020-11-27 10:51

    In development
    In your app folder create folder name 'static' and save your picture in that folder.
    To use picture use:

    <html>
    <head>
       {% load staticfiles %} <!-- Prepare django to load static files -->
    </head>
    <body>
        <img src={% static "image.jpg" %}>
    </body>
</html>

    In production:
    Everything same like in development, just add couple more parameters for Django:

    1. add in settings.py
      STATIC_ROOT = os.path.join(BASE_DIR, "static/")(this will prepare folder where static files from all apps will be stored)

    2. be sure your app is in INSTALLED_APPS = ['myapp',]

    3. in terminall run command python manage.py collectstatic (this will make copy of static files from all apps included in INSTALLED_APPS to global static folder - STATIC_ROOT folder )

      Thats all what Django need, after this you need to make some web server side setup to make premissions for use static folder. E.g. in apache2 in configuration file httpd.conf (for windows) or sites-enabled/000-default.conf. (under site virtual host part for linux) add:

      Alias \static "path_to_your_project\static"

      Require all granted

      And that's all

    0 讨论(0)
  • 执念已碎
    2020-11-27 10:51

    I tried various method it didn't work.But this worked.Hope it will work for you as well. The file/directory must be at this locations:

    projec/your_app/templates project/your_app/static

    settings.py

    import os    
PROJECT_DIR = os.path.realpath(os.path.dirname(_____file_____))
STATIC_ROOT = '/your_path/static/'

    example:

    STATIC_ROOT = '/home/project_name/your_app/static/'    
STATIC_URL = '/static/'    
STATICFILES_DIRS =(     
PROJECT_DIR+'/static',    
##//don.t forget comma    
)
TEMPLATE_DIRS = (    
 PROJECT_DIR+'/templates/',    
)

    proj/app/templates/filename.html

    inside body

    {% load staticfiles %}

//for image

img src="{% static "fb.png" %}" alt="image here"

//note that fb.png is at /home/project/app/static/fb.png

    If fb.png was inside /home/project/app/static/image/fb.png then 

    img src="{% static "images/fb.png" %}" alt="image here"
    0 讨论(0)
  • 遇见更好的自我
    2020-11-27 10:52

    In production, you'll just have the HTML generated from your template pointing to wherever the host has media files stored. So your template will just have for example

    <img src="../media/foo.png">

    And then you'll just make sure that directory is there with the relevant file(s).

    during development is a different issue. The django docs explain it succinctly and clearly enough that it's more effective to link there and type it up here, but basically you'll define a view for site media with a hardcoded path to location on disk.

    Right here.

    0 讨论(0)
  • 难免孤独
    2020-11-27 10:54

    /media directory under project root

    Settings.py

    BASE_DIR = os.path.dirname(os.path.dirname(__file__))
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

    urls.py

        urlpatterns += patterns('django.views.static',(r'^media/(?P<path>.*)','serve',{'document_root':settings.MEDIA_ROOT}), )

    template

    <img src="{{MEDIA_URL}}/image.png" >
    0 讨论(0)
  • 后悔当初
    2020-11-27 10:55

    Try this,

    settings.py

    # typically, os.path.join(os.path.dirname(__file__), 'media')
MEDIA_ROOT = '<your_path>/media'
MEDIA_URL = '/media/'

    urls.py

    urlpatterns = patterns('',
               (r'^media/(?P<path>.*)$', 'django.views.static.serve',
                 {'document_root': settings.MEDIA_ROOT}),
              )

    .html

    <img src="{{ MEDIA_URL }}<sub-dir-under-media-if-any>/<image-name.ext>" />

    Caveat

    Beware! using Context() will yield you an empty value for {{MEDIA_URL}}. You must use RequestContext(), instead.

    I hope, this will help.

    0 讨论(0)
  • 误落风尘
    2020-11-27 11:05

    Another way to do it:

    MEDIA_ROOT = '/home/USER/Projects/REPO/src/PROJECT/APP/static/media/'
MEDIA_URL = '/static/media/'

    This would require you to move your media folder to a sub directory of a static folder.

    Then in your template you can use:

    <img class="scale-with-grid" src="{{object.photo.url}}"/>
    0 讨论(0)
 看不清?
提交回复
热议问题