# Documentação Django 5.2.8

# Escrevendo sua primeira aplicação Django, parte 6

This tutorial begins where Tutorial 5 left off. We’ve built a tested web-poll application, and we’ll now add a stylesheet and an image.

Além do HTML gerado pelo servidor, aplicações web normalmente precisam servir outros arquivos – como imagens, JavaScript, ou CSS – necessário para renderizar a página web completa. No Django, nós chamamos estes arquivos de “arquivos estáticos”.

For small projects, this isn’t a big deal, because you can keep the static files somewhere your web server can find it. However, in bigger projects – especially those comprised of multiple apps – dealing with the multiple sets of static files provided by each application starts to get tricky.

É para isto que o `django.contrib.staticfiles` serve: ele coleciona os arquivos estáticos de cada uma de suas aplicações (e qualquer outro lugar que você especifique) em um único local que pode ser facilmente servido em produção.

Onde obter ajuda:

Se tiver problemas enquanto caminha por este tutorial, por favor consulte a seção Obtendo ajuda da FAQ.

## Personalize a aparência da sua aplicação

Primeiro, crie um diretório chamado `static` no seu diretório `polls`. O Django vai procurar os arquivos estáticos ali, de maneira similar a como o Django encontra os templates dentro de `polls/templates/`.

A configuração `STATICFILES_FINDERS` do Django contém uma lista de buscadores que sabem como descobrir os arquivos estáticos de diversas fontes. Um dos padrões é o `AppDirectoriesFinder` que procura por um subdiretório “static” em cada uma das `INSTALLED_APPS`, como a `polls` que nós acabamos de criar. O site de administração usa a mesma estrutura de diretórios para os arquivos estáticos.

Within the `static` directory you have just created, create another directory called `polls` and within that create a file called `style.css`. In other words, your stylesheet should be at `polls/static/polls/style.css`. Because of how the `AppDirectoriesFinder` staticfile finder works, you can refer to this static file in Django as `polls/style.css`, similar to how you reference the path for templates.

Arquivo estático namespace

Just like templates, we might be able to get away with putting our static files directly in `polls/static` (rather than creating another `polls` subdirectory), but it would actually be a bad idea. Django will choose the first static file it finds whose name matches, and if you had a static file with the same name in a different application, Django would be unable to distinguish between them. We need to be able to point Django at the right one, and the best way to ensure this is by namespacing them. That is, by putting those static files inside another directory named for the application itself.

Coloque o seguinte código na sua folha de estilo (`polls/static/polls/style.css`):

`polls/static/polls/style.css`

    li a {
        color: green;
    }

Em seguida, adicione o seguinte no topo de “polls//templates/polls/index.html”:

`polls/templates/polls/index.html`

    {% load static %}

    <link rel="stylesheet" href="{% static 'polls/style.css' %}">

O modelo tag `{% static %}` gera a URL absoluta para arquivos estáticos.

Isso é tudo que você precisa fazer para o desenvolvimento.

Inicie o servidor (ou reinicie se estiver em execução):

/ 

    $ python manage.py runserver

    ...\> py manage.py runserver

Reload `http://localhost:8000/polls/` and you should see that the question links are green (Django style!) which means that your stylesheet was properly loaded.

## Adicionar uma imagem de fundo

Next, we’ll create a subdirectory for images. Create an `images` subdirectory in the `polls/static/polls/` directory. Inside this directory, add any image file that you’d like to use as a background. For the purposes of this tutorial, we’re using a file named `background.png`, which will have the full path `polls/static/polls/images/background.png`.

Then, add a reference to your image in your stylesheet (`polls/static/polls/style.css`):

`polls/static/polls/style.css`

    body {
        background: white url("images/background.png") no-repeat;
    }

Recarregue “http://localhost:8000/polls/” e você deverá ver o fundo carregado no canto superior esquerdo da tela.

Aviso

The `{% static %}` template tag is not available for use in static files which aren’t generated by Django, like your stylesheet. You should always use relative paths to link your static files between each other, because then you can change `STATIC_URL` (used by the `static` template tag to generate its URLs) without having to modify a bunch of paths in your static files as well.

Estes são os básicos. Para mais detalhes nas configurações e outras coisas incluídas no framework veja o howto arquivos estáticos. Fazendo deploy de arquivos estáticos discute como usar arquivos estáticos em um servidor real.

Quando você estiver confortável com os arquivos estáticos, leia parte 7 deste tutorial para aprender como personalizar o site de administração gerado automaticamente pelo Django.