# documentação Django 2.0.8

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

Este tutorial começa onde o Tutorial 5 parou. Nós construímos uma aplicação web de enquete testada, e agora nós vamos adicionar uma folha de estilos e uma imagem.

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”.

Para projetos pequenos, isto não é um grande problema, porque você pode simplesmente manter os arquivos estáticos em algum lugar que o seu servidor web consegue encontrar. Entretanto, em grandes projetos – especialmente aqueles comprometidos com múltiplas apps – lidar com múltiplos conjuntos de arquivos estáticos provindos de cada aplicação começa a se tornar complicado.

É 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.

## Personalize a aparência do seu app

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 admin usa a mesma estrutura de diretórios para os arquivos estáticos.

Com o diretório `static` que você acabou de criar, crie outro diretório chamado `polls` e com ele crie um arquivo chamado `style.css`. Em outras palavras, o seu stylesheet deve ficar em `polls/static/polls/style.css`. Por conta da forma que o buscador de arquivos estáticos `AppDirectoriesFinder` funciona, você pode referênciar este arquivo estático no Django simplesmente como `polls/style.css`, similarmente como você referência o caminho para templates.

Arquivo estático namespace

Assim como templates, nós podemos nos safar somente colocando os arquivos estáticos diretamente em `polls/static` (ao invés de criar outro subdiretório `polls`), mas na verdade isso seria uma má idéia. O Django vai escolher o primeiro o arquivo estático que encontrar com aquele nome, e se você tem um arquivo estático com aquele mesmo nome em uma aplicação diferente, o Django não conseguiria distinguir entre elas. Nós precisamos poder apontar o Django para o arquivo correto, e a forma mais fácil de garantir isso é por usar um namespacing com eles. Isto é, colocando aqueles arquivos estáticos dentro de outro diretório com o mesmo nome da aplicação.

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" type="text/css" 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. Recarregue http://localhost:8000/polls/` e você deve ver que os links das questões estão verdes (Django style!) isso significa que seu stylesheet foi corretamente carregado.

## Adicionar uma imagem de fundo

Após, nós vamos criar o subdiretório para imagens. Crie um subdiretório `images` no diretório `polls/static/polls`. Dentro deste diretório, coloque uma imagem chamada `background.gif`. Em outras palavras, coloque sua imagem em `polls/static/polls/images//background.gif`.

Então, adicione em seu stylesheet (`polls/static/polls/style.css`):

polls/static/polls/style.css

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

Reload `http://localhost:8000/polls/` and you should see the background loaded in the top left of the screen.

Aviso

Claro que o `{% static %}` template tag não está disponível para uso em arquivos estáticos como o seu stylesheet que não são gerados pelo Django. Você deve sempre usar caminhos relativos para conectar seus arquivos estáticos entre cada um, porque assim, você pode mudar `STATIC_URL` (usado pelo `static` template tag para gerar as URLs) sem ter que modificar um monte de caminhos em seus arquivos estáticos também.

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 customizar o site do admin auto-gerado do Django.