So, far we have seen how to make templete and how to use html templete.
We know that every website uses static files like css,js,image etc.
They more likely never change and remain static throughout website.
So in django style , all static files should be kept in a special directory named static ,
although this can be changed from setting.py file.
You will find this setting in main webproject’s settings.py file.
We want to make a template which will be like this
Html code to make this UI can be found here CODE
You can check it using online editor , just goto this link and copy past the above code in the editor and you will see our desired UI.
If you see the UI code then you will find that we have used some CDN for using bootstrap css,js files
But we dont want to use CDN that’s why we will use offline files.
As they are static file, according to django we will keep them inside a folder named static. Download them from the respective url.
Now goto personal/templates/personal/header.html and modify like below
Full code of header.html can be found here
We use the load staticfiles command to load in all available static files. Next, we specifiy the path to the one we want in this case to reference for our stylesheet. The static directories start with
/static/ and then we need to specify the rest of the way. For us, the rest of the way to the
bootstrap.min.css file is
personal/bootstrap.min.css. It is important to note here that we can use this identical reference from any other app, Django is going to look in all /static/ directories in any installed apps for this path.
Full code of home.html can be found here
Finally we will get the output.
So, we have used static file,templete and used it like django style.