Video Corso Django 1.11 - Programmare in Python

Crea il Tuo Blog con Django 1.11 e Bootstrap 3.3.7

15: Footer e Immagini

Poco prima della parte relativa ai link per le CDN JavaScript, aggiungiamo questo codice, relativo al Footer. Da notare che abbiamo scelto un "container-fluid" per fare in modo che il footer vada ad estendersi per tutta la larghezza della pagina in maniera automatica.

<footer>
    <div class="container-fluid">
        <p style="color:white;  font-weight:bold">Canali Social:</p>
        <a style="color:white" href="Link al Vostro Canale YouTube"><span class="glyphicon glyphicon-thumbs-up"></span>YouTube</a><br>
        <a style="color:white" href="Link al Vostro Account Twitter"><span class="glyphicon glyphicon-thumbs-up"></span>Twitter</a><br>
        <a style="color:white" href="Link al Vostro Profilo Facebook"><span class="glyphicon glyphicon-thumbs-up"></span>Facebook</a><br>
        <br>
        <a style="color:white" href="#">Torna Su</a><br>
    </div>
</footer>

Dobbiamo quindi apportare le modifiche adeguate allo stile del footer, mediante CSS:

footer {
    padding: 40px;
    background-color: #092E20;
    text-align: center;
}

Aggiungiamo quindi una piccola modifica al CSS anche per quanto riguarda le immagini che vengono utilizzate nel sito(quindi richiamate mediante STATIC o semplicemente link di riferimento ad immagini esterne al blog):

img{
    max-width: 100%;
    height: auto;
    display:block;
}

Anche se Bootstrap ci fornisce una classe (img-responsive) che ci permette di avere immagini responsive senza dover toccare il foglio di stile, abbiamo optato per questa opzione in modo da facilitare l'inserimento di immagini nei post del nostro blog.

Menu della Serie